/*
Theme Name: Web42 Blog
Theme URI: https://blog.web42.it/
Author: Web42 s.r.l.
Author URI: https://www.web42.it/
Description: Tema a due colonne per il blog Web42. Replica l'aspetto del precedente tema zeeMagazine con codice minimale e nessuna dipendenza esterna (niente icon font, niente Google Fonts remoti).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: web42blog
Tags: blog, two-columns, right-sidebar, custom-menu, featured-images, translation-ready
*/

/* ---------- Font inclusi nel tema ----------
   Open Sans e Hind (SIL Open Font License 1.1), sottoinsiemi latin e latin-ext.
   Serviti dal sito e non da Google: nessuna richiesta a domini di terze parti. */

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url(fonts/opensans-latin-ext.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url(fonts/opensans-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 300 800;
	font-display: swap;
	src: url(fonts/opensans-italic-latin-ext.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 300 800;
	font-display: swap;
	src: url(fonts/opensans-italic-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Hind';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(fonts/hind-400-latin-ext.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Hind';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(fonts/hind-400-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Hind';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url(fonts/hind-700-latin-ext.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Hind';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url(fonts/hind-700-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Variabili ---------- */
:root {
	--accent:  #225588;
	--dark:    #151515;
	--text:    #404040;
	--box:     #fff;
	--border:  #e5e5e5;
	--shade:   #fbfbfb;
	--shade-2: #f5f5f5;
	--font:    'Open Sans', Tahoma, Arial, sans-serif;
	--font-title: 'Hind', Tahoma, Arial, sans-serif;
}

/* ---------- Reset essenziale ---------- */
*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd { margin: 0; }
img, video, iframe, embed, object { max-width: 100%; height: auto; }

/* ---------- Base ---------- */
body {
	margin: 0;
	background: var(--accent);
	color: var(--text);
	font-family: var(--font);
	font-size: 1.0625rem;
	line-height: 1.75;
	word-wrap: break-word;
}

a { color: var(--accent); text-decoration: none; }
a:hover, a:focus { color: var(--dark); text-decoration: underline; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-title);
	color: var(--dark);
	line-height: 1.3;
	margin: 1.5rem 0 0.5rem;
}
h1 { font-size: 2.25rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.375rem; }
h4 { font-size: 1.125rem; }

p, ul, ol, table, pre, blockquote, figure { margin-bottom: 1.5rem; }
ul, ol { padding-left: 1.5rem; }
li > ul, li > ol { margin-bottom: 0; }

blockquote {
	margin-left: 0;
	padding: 0.2rem 0 0.2rem 1.2rem;
	border-left: 4px solid var(--border);
	color: #666;
}

code, kbd, tt, var {
	font-family: Monaco, Consolas, 'DejaVu Sans Mono', monospace;
	font-size: 0.9375em;
	background: #eee;
	padding: 0.1em 0.35em;
}
pre {
	background: #eee;
	padding: 1em;
	overflow: auto;
	font-family: Monaco, Consolas, 'DejaVu Sans Mono', monospace;
	font-size: 0.9375rem;
	line-height: 1.5;
}
pre code { background: none; padding: 0; }

table { width: 100%; border-collapse: collapse; }
th, td { padding: 0.4em 0.6em; border: 1px solid var(--border); text-align: left; }
th { background: var(--shade); }

hr { height: 1px; border: 0; background: #ccc; margin-bottom: 1.5rem; }

/* ---------- Form ---------- */
button, input, select, textarea { font-family: inherit; font-size: 1rem; }

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	padding: 0.6em 1em;
	color: #fff;
	background: var(--accent);
	border: none;
	cursor: pointer;
}
button:hover, button:focus,
input[type="submit"]:hover, input[type="submit"]:focus { background: var(--dark); }

input[type="text"], input[type="email"], input[type="url"],
input[type="password"], input[type="search"], input[type="number"], textarea {
	max-width: 100%;
	padding: 0.3em 0.6em;
	color: #666;
	border: 1px solid #ddd;
}
input:focus, textarea:focus { color: #111; border-color: #ccc; }
textarea { width: 100%; }

/* ---------- Accessibilita' ---------- */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
}
.skip-link:focus {
	position: absolute; top: 0.5em; left: 0.5em;
	z-index: 1000;
	width: auto; height: auto;
	clip: auto; clip-path: none;
	padding: 0.6em 1em;
	background: #fff;
}

/* ---------- Allineamenti WordPress ---------- */
.alignleft  { float: left;  margin: 0.4em 1.5em 1em 0; }
.alignright { float: right; margin: 0.4em 0 1em 1.5em; }
.aligncenter { display: block; margin: 0 auto 1.5em; }
.wp-caption { max-width: 100%; }
.wp-caption-text, .wp-block-image figcaption {
	font-size: 0.875rem;
	color: #666;
	text-align: center;
}
.sticky { border-left: 5px solid var(--accent); }

/* ---------- Clearfix ---------- */
.entry-meta::after,
.entry-summary::after,
.entry-content::after,
.entry-footer::after {
	content: "";
	display: table;
	clear: both;
}

/* ---------- Struttura ---------- */
.site {
	max-width: 1290px;
	margin: 0 auto;
	padding: 0 2em;
	background: var(--shade-2);
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.site-content {
	display: flex;
	align-items: flex-start;
	gap: 2em;
	padding-top: 2em;
}
.content-area { flex: 1 1 auto; min-width: 0; }
.sidebar { flex: 0 0 29%; min-width: 0; }

/* ---------- Header ---------- */
.header-main {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	padding: 1.5em 2em;
	background: var(--box);
	border: 1px solid var(--border);
	border-top: none;
}
.site-branding {
	display: flex;
	align-items: center;
	gap: 1.2em;
	margin: 0.5em 0;
}
.site-branding a { text-decoration: none; }
.site-branding-text { min-width: 0; }

.custom-logo-link { flex: 0 0 auto; display: block; }
/* Logo caricato dal Customizer: non lo ingrandiamo, per non sgranarlo. */
.custom-logo {
	display: block;
	width: auto;
	height: auto;
	max-height: 78px;
}

/* L'SVG incluso nel tema invece scala senza perdere qualita'. */
.site-logo-default { height: 78px; max-height: none; }
.site-title {
	margin: 0;
	font-family: var(--font-title);
	font-size: 3rem;
	line-height: 1.1;
	color: var(--accent);
}
.site-branding a:hover .site-title { color: var(--dark); }
.site-description { margin: 0.3em 0 0; font-size: 0.9375rem; color: #666; }

/* ---------- Navigazione principale ---------- */
.primary-navigation {
	background: var(--shade);
	border: 1px solid var(--border);
	border-top: none;
}
.main-navigation-menu {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}
.main-navigation-menu li { position: relative; }
.main-navigation-menu a {
	display: block;
	padding: 0.9em 1.2em;
	color: var(--dark);
	font-weight: bold;
	text-decoration: none;
}
.main-navigation-menu a:hover,
.main-navigation-menu .current-menu-item > a { color: var(--accent); }

/* Sottomenu */
.main-navigation-menu ul {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 99;
	min-width: 16rem;
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--box);
	border: 1px solid var(--border);
}
.main-navigation-menu li:hover > ul,
.main-navigation-menu li:focus-within > ul { display: block; }
.main-navigation-menu ul a { font-size: 0.9375rem; font-weight: normal; }
.main-navigation-menu ul ul { top: 0; left: 100%; }

.menu-toggle { display: none; width: 100%; text-align: left; }

/* ---------- Articoli ---------- */
.type-post, .type-page, .type-attachment, .page-header, .no-results {
	margin: 0 0 2em;
	padding: 1em 1.5em;
	background: var(--box);
	border: 1px solid var(--border);
}

.entry-title {
	margin: 0;
	font-family: var(--font-title);
	font-size: 2.5rem;
	color: var(--accent);
}
.entry-title a { color: var(--accent); text-decoration: none; }
.entry-title a:hover { color: var(--dark); }

.entry-meta {
	margin: 0.2em 0 0.8em;
	background: var(--shade);
	border: 1px solid #eee;
	font-size: 0.9375rem;
}
.entry-meta .meta-date,
.entry-meta .meta-author,
.entry-meta .meta-comments {
	display: inline-block;
	padding: 0.5em 1em;
}
.entry-meta .meta-date {
	background: var(--shade-2);
	border-right: 1px solid #eee;
	color: #222;
}
.entry-meta .meta-comments { float: right; }

.entry-thumbnail img { margin: 1em 1.5em 1em 0; }
.entry-summary .entry-thumbnail img { float: left; max-width: 50%; }

.entry-content > *:last-child, .entry-summary > *:last-child { margin-bottom: 1rem; }

.more-link {
	display: inline-block;
	margin: 0 0 1em;
	padding: 0.6em 1em;
	font-size: 1rem;
	color: #fff;
	background: var(--accent);
}
.more-link:hover, .more-link:focus { color: #fff; background: var(--dark); text-decoration: none; }

.entry-footer { clear: both; }
.entry-footer .meta-category { display: block; margin: 0 0 1em; }
.entry-footer .meta-category a {
	display: inline-block;
	margin: 0 1px 3px 0;
	padding: 0.2em 0.7em;
	color: #fff;
	background: var(--accent);
}
.entry-footer .meta-category a:hover { background: var(--dark); text-decoration: none; }

.entry-footer .meta-tags { display: block; font-size: 0.875rem; }
.entry-footer .meta-tags a {
	display: inline-block;
	margin: 0 3px 3px 0;
	padding: 0.3em 0.6em;
	border: 1px solid #ddd;
	background: var(--shade);
}
.entry-footer .meta-tags a:hover { background: var(--shade-2); text-decoration: none; }

.page-links { font-weight: bold; word-spacing: 1em; }

/* Intestazione archivi / ricerca */
.page-header { padding: 1em 1.5em 1.2em; }
.page-header .archive-title {
	display: inline-block;
	margin: 0;
	padding-bottom: 0.1em;
	font-size: 1rem;
	font-weight: bold;
	font-family: var(--font);
	border-bottom: 3px solid var(--accent);
}
.page-header .archive-description { margin-top: 0.8em; }

/* ---------- Paginazione ---------- */
.post-pagination { margin: 0 0 2em; }
.post-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 3px; }
.post-pagination a,
.post-pagination .current {
	display: inline-block;
	padding: 0.3em 0.8em;
	text-align: center;
	background: var(--box);
	border: 1px solid var(--border);
	color: var(--accent);
}
.post-pagination a:hover,
.post-pagination .current {
	color: #fff;
	background: var(--accent);
	border-color: var(--accent);
	text-decoration: none;
}
.post-navigation { margin: 0 0 2em; }
.post-navigation .nav-links { display: flex; justify-content: space-between; gap: 1em; }

/* ---------- Widget ---------- */
.widget {
	margin: 0 0 2em;
	padding: 1em;
	background: var(--box);
	border: 1px solid var(--border);
}
.widget-header {
	margin: -1em -1em 1em;
	padding: 0.6em 1em;
	background: var(--shade);
	border-bottom: 1px solid var(--border);
}
.widget-title {
	margin: 0;
	font-family: var(--font);
	font-size: 1rem;
	font-weight: bold;
	color: var(--dark);
}
.widget ul {
	margin: 0;
	padding: 0 0.3em;
	list-style: square inside;
}
.widget ul ul { margin: 0.5em 0 0.5em 1em; padding: 0; }
.widget select { max-width: 100%; }
.widget > *:last-child { margin-bottom: 0; }

/* Modulo di ricerca */
.search-form { display: flex; }
.search-form .search-field { flex: 1 1 auto; min-width: 0; padding: 0.45em 0.7em; }
.search-form .search-submit {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	padding: 0.4em 0.7em;
}
.search-form .search-submit svg { fill: currentColor; }

/* ---------- Commenti ---------- */
.comments-area {
	margin: 0 0 2em;
	padding: 1em 1.5em;
	background: var(--box);
	border: 1px solid var(--border);
}
.comments-title, .comment-reply-title { font-size: 1.375rem; margin-top: 0.5em; }
.comment-list { margin: 0; padding: 0; list-style: none; }
.comment-list ol.children { margin: 0 0 0 2em; padding: 0; list-style: none; }
.comment-body { padding: 1em 0; border-top: 1px solid var(--border); }
.comment-meta { font-size: 0.9375rem; color: #666; margin-bottom: 0.5em; }
.comment-meta .avatar { float: left; margin-right: 0.8em; }
.comment-form label { display: block; font-weight: bold; }

/* ---------- Footer ---------- */
.site-footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.5em 2em;
	padding: 1em 1.5em;
	font-size: 0.9375rem;
	background: var(--box);
	border: 1px solid var(--border);
	border-bottom: none;
}
.footer-navigation-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 0 2em;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ---------- Responsive ---------- */
@media only screen and (max-width: 60em) {
	.site { padding: 0 1em; }
	.header-main { flex-direction: column; text-align: center; padding: 1.5em 1em; }
	.site-branding { flex-direction: column; gap: 0.6em; }
	.custom-logo { max-height: 66px; margin: 0 auto; }
	.site-logo-default { height: 66px; }
	.site-title { font-size: 2.25rem; }
	.entry-title { font-size: 2rem; }

	.site-content { flex-direction: column; }
	.sidebar { flex: 1 1 auto; width: 100%; }

	.menu-toggle { display: block; }
	.main-navigation-menu { display: none; flex-direction: column; }
	.main-navigation-menu.is-open { display: flex; }
	.main-navigation-menu a { border-top: 1px solid var(--border); }
	.main-navigation-menu ul {
		display: block;
		position: static;
		min-width: 0;
		border: none;
	}
	.main-navigation-menu ul a { padding-left: 2.4em; }
}

@media only screen and (max-width: 40em) {
	.site { padding: 0; border: none; }
	.type-post, .type-page, .page-header, .widget, .comments-area { padding-left: 1em; padding-right: 1em; }
	.site-title { font-size: 1.875rem; }
	.entry-title { font-size: 1.5rem; }
	.entry-summary .entry-thumbnail img { float: none; max-width: 100%; margin: 1em 0; }
	.entry-meta .meta-comments { float: none; }
}