/* =========================================================
   effeemmezeta — base + layout (tema classico)
   Token da theme.json; qui reset minimo, wrap, nav, hero,
   footer, card. Le utility di firma stanno sotto (theme.css).
   ========================================================= */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
	margin:0;
	background:var(--wp--preset--color--paper,#fff);
	color:var(--wp--preset--color--ink,#0B0B0B);
	font-family:var(--wp--preset--font-family--macchina,monospace);
	font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; height:auto; }
a{ color:inherit; }
/* link di testo (non bottoni): in hover giallo marker SOLO su sfondo scuro; su chiaro restano ink (theme.json) */
:is(.fmz-theme-dark, .has-ink-background-color) a:not(.wp-element-button):hover{ color:var(--wp--preset--color--marker); }

.fmz-main{ position:relative; }

/* =========================================================
   LARGHEZZA — UN SOLO sistema (tema classico, root-padding OFF).
   .fmz-wrap    = colonna vincolata: chrome (nav/footer/banda) + contenuti semplici.
   .fmz-content = flusso blocchi: vincola OGNI figlio, gestisce wide/full.
   Mai annidati fra loro. Gutter = --wp--custom--gut (unico token). Rail = --fmz-max.
   ========================================================= */
.fmz-wrap{ max-width:var(--fmz-max); margin-inline:auto; padding-inline:var(--wp--custom--gut); }

.fmz-content > *{ max-width:var(--fmz-max); margin-inline:auto; padding-inline:var(--wp--custom--gut); }
.fmz-content > .alignwide{ max-width:var(--fmz-max); }        /* wide == content: rail unico 1440 */
.fmz-content > .alignfull{ max-width:none; padding-inline:0; }
.fmz-content > .alignfull > :not(.alignfull){ max-width:var(--fmz-max); margin-inline:auto; padding-inline:var(--wp--custom--gut); }

/* layer di riferimento: prima area 100vh, la banda si ancora al suo bottom */
/* overlay di riferimento per la banda: altezza = fondo REALE dell'hero (misurato in JS,
   var --fmz-band-h su .fmz-main); fallback = prima area 100svh se non c'è .fmz-hero */
.fmz-first-ref{ position:absolute; top:0; left:0; right:0; height:var(--fmz-band-h, calc(100svh - var(--fmz-nav-h,64px))); pointer-events:none; z-index:5; }
.fmz-band{ position:absolute; left:0; right:0; bottom:0; pointer-events:auto; background:transparent; color:var(--wp--preset--color--grey-2); }
.fmz-band .fmz-wrap{ display:flex; justify-content:space-between; align-items:center; padding-block:12px; font-family:var(--wp--preset--font-family--macchina); font-size:11px; letter-spacing:.1em; color:inherit; }
.fmz-band .fmz-dark{ color:inherit; }
.fmz-dark{ background:none; border:0; font:inherit; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; color:var(--wp--preset--color--grey-2); display:inline-flex; align-items:center; gap:6px; }
.fmz-dark:hover{ color:var(--wp--preset--color--ink); }
.fmz-dark--icon{ display:none; width:34px; height:34px; padding:0; justify-content:center; }
.fmz-dark svg{ width:18px; height:18px; display:block; }
@media(max-width:820px){
	.fmz-first-ref{ display:none; }          /* banda + coord via su mobile */
	.fmz-dark--icon{ display:inline-flex; }  /* dark = icona in alto, accanto a lingua */
}
.fmz-section{ padding-block:clamp(48px,8vh,110px); }

/* titoli — la scala h1–h6 vive in theme.json (elementi).
   Qui restano SOLO i display speciali (non livelli di titolo semantici):
   .fmz-display = "giant" (404 / hero) agganciato al preset xx-large (scala unica)
   .fmz-tagline = voce Amatic (segno) */
.fmz-display{ font-family:var(--wp--preset--font-family--forma); font-weight:800; letter-spacing:-.05em; line-height:.9; font-size:var(--wp--preset--font-size--xx-large); margin:0; }
.fmz-tagline{ font-family:var(--wp--preset--font-family--segno); font-weight:700; font-size:clamp(2rem,5vw,3.4rem); line-height:.8; margin:.15em 0 0; }
.fmz-eyebrow{ font-family:var(--wp--preset--font-family--macchina); font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--wp--preset--color--grey-2); margin:0 0 .4em; }
.fmz-lead{ font-family:var(--wp--preset--font-family--macchina); font-size:clamp(14px,1.2vw,16px); line-height:1.75; max-width:60ch; margin:24px 0 0; }

/* nav — 3 zone: brand (sx) · menu principale (centro) · quick (dx) */
.fmz-nav{ position:sticky; top:0; z-index:60; background:var(--wp--preset--color--paper); }
.fmz-nav .fmz-wrap{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; min-height:64px; }

.fmz-brand{ display:flex; align-items:center; gap:12px; text-decoration:none; justify-self:start; }
.fmz-brand__avatar{ width:34px; height:34px; border-radius:50%; border:2px solid var(--wp--preset--color--ink); object-fit:cover; display:block; }
.fmz-brand__name{ font-family:var(--wp--preset--font-family--macchina); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }

.fmz-nav__primary{ justify-self:center; }
.fmz-nav__primary ul{ list-style:none; display:flex; align-items:center; gap:.55em; margin:0; padding:0; font-family:var(--wp--preset--font-family--macchina); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.fmz-nav__primary li{ display:flex; align-items:center; }
.fmz-nav__primary li:not(:last-child)::after{ content:"."; margin-left:.55em; color:var(--wp--preset--color--grey-2); }
.fmz-nav__primary a{ text-decoration:none; }

.fmz-nav__quick{ justify-self:end; }
.fmz-nav__quick ul{ list-style:none; display:flex; align-items:center; gap:16px; margin:0; padding:0; font-family:var(--wp--preset--font-family--macchina); font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
/* voce Contatti come bottone: aggiungi la classe CSS "evi" alla voce di menu */
.fmz-nav__quick .evi a, .fmz-mobile__quick .evi a{ display:inline-block; border:0; background:var(--wp--preset--color--marker); color:var(--wp--preset--color--ink); font-size:13px; letter-spacing:.04em; padding:14px 22px; text-decoration:none; transition:background .2s, color .2s; }
.fmz-nav__quick .evi a:hover, .fmz-mobile__quick .evi a:hover{ background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); }

/* hamburger */
.fmz-nav__burger{ display:none; grid-column:3; justify-self:end; width:34px; height:34px; background:none; border:0; cursor:pointer; position:relative; }
.fmz-nav__burger span, .fmz-nav__burger::before, .fmz-nav__burger::after{ content:""; position:absolute; left:6px; right:6px; height:2px; background:var(--wp--preset--color--ink); transition:transform .3s, opacity .2s; }
.fmz-nav__burger::before{ top:11px; } .fmz-nav__burger span{ top:16px; } .fmz-nav__burger::after{ top:21px; }
body.menu-open .fmz-nav__burger::before{ transform:translateY(5px) rotate(45deg); }
body.menu-open .fmz-nav__burger span{ opacity:0; }
body.menu-open .fmz-nav__burger::after{ transform:translateY(-5px) rotate(-45deg); }

/* pannello mobile */
.fmz-mobile{ display:none; position:fixed; inset:64px 0 auto 0; z-index:55; background:var(--wp--preset--color--paper); border-bottom:2px solid var(--wp--preset--color--ink); transform:translateY(-120%); visibility:hidden; transition:transform .32s ease, visibility .32s; }
body.menu-open .fmz-mobile{ transform:none; visibility:visible; }
.fmz-mobile ul{ list-style:none; margin:0; padding:16px var(--wp--custom--gut); display:flex; flex-direction:column; gap:6px; font-family:var(--wp--preset--font-family--forma); font-weight:800; font-size:1.6rem; letter-spacing:-.02em; }
.fmz-mobile a{ text-decoration:none; }
.fmz-mobile__quick ul{ font-family:var(--wp--preset--font-family--macchina); font-weight:400; font-size:13px; letter-spacing:.1em; text-transform:uppercase; border-top:2px solid var(--wp--preset--color--ink); }
.fmz-mobile .lang-item{ display:none; }   /* la lingua resta in alto, non nel pannello */

@media(max-width:820px){
	.fmz-nav .fmz-wrap{ grid-template-columns:1fr auto auto; }
	.fmz-nav__primary{ display:none; }
	.fmz-nav__quick .menu-item:not(.lang-item){ display:none; }   /* solo lingua visibile */
	.fmz-nav__burger{ display:block; }
	.fmz-mobile{ display:block; }
}

/* dark mode manuale (bottone ◐): ribalta le variabili su TUTTO il sito */
:root[data-dark]{ --wp--preset--color--paper:#0B0B0B; --wp--preset--color--ink:#FFFFFF; --wp--preset--color--grey-1:#2a2a28; }

/* tema PER-SEZIONE, guidato dallo SCROLL (feeling locomotive): niente trigger binario.
   Il colore INTERPOLA con --p (0→1) man mano che la sezione entra — il JS (initScrollProgress)
   aggiorna --p in base alla posizione. Ribalta --ink/--paper/--grey-1 LOCALMENTE via color-mix,
   così tutto il contenuto della sezione si adatta da solo, in modo continuo. */
.fmz-theme-dark, .fmz-theme-light{ --p:0; background-color:var(--wp--preset--color--paper); color:var(--wp--preset--color--ink); }
/* sfondo + grey-1: interpolazione FLUIDA con --p. testo (--ink): commuta in una banda
   strettissima attorno a --p=0.5 (calc(...*2500%) = ~0.04 di progresso) → mai grigio-su-grigio,
   sempre leggibile, mentre lo sfondo resta liscio. */
.fmz-theme-dark{
	--wp--preset--color--paper:  color-mix(in srgb, #FFFFFF, #0B0B0B calc(var(--p) * 100%));
	--wp--preset--color--ink:    color-mix(in srgb, #0B0B0B, #FFFFFF calc((var(--p) - 0.44) * 2500%));
	--wp--preset--color--grey-1: color-mix(in srgb, #E4E3DF, #2A2A28 calc(var(--p) * 100%));
}
.fmz-theme-light{
	--wp--preset--color--paper:  color-mix(in srgb, #0B0B0B, #FFFFFF calc(var(--p) * 100%));
	--wp--preset--color--ink:    color-mix(in srgb, #FFFFFF, #0B0B0B calc((var(--p) - 0.44) * 2500%));
	--wp--preset--color--grey-1: color-mix(in srgb, #2A2A28, #E4E3DF calc(var(--p) * 100%));
}
@media (prefers-reduced-motion:reduce){ /* niente scroll: stato finale diretto */
	.fmz-theme-dark{ --wp--preset--color--paper:#0B0B0B; --wp--preset--color--ink:#FFFFFF; --wp--preset--color--grey-1:#2A2A28; }
	.fmz-theme-light{ --wp--preset--color--paper:#FFFFFF; --wp--preset--color--ink:#0B0B0B; --wp--preset--color--grey-1:#E4E3DF; }
}

/* hero: riempie la prima schermata (schermo − nav) → banda alla piega.
   Non mettere min-height inline sul blocco: ci pensa questa classe. */
.fmz-hero{ min-height: calc(100svh - var(--fmz-nav-h, 64px)); }
.fmz-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:40px; }

/* card / griglia (usa .fmz-grid + .fmz-media da theme.css) */
.fmz-card{ display:flex; flex-direction:column; }
.fmz-card__cap{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:10px; }
.fmz-card__title{ font-family:var(--wp--preset--font-family--forma); font-weight:700; letter-spacing:-.02em; font-size:clamp(1rem,1.3vw,1.25rem); text-decoration:none; }
.fmz-chip{ font-family:var(--wp--preset--font-family--macchina); font-size:10px; letter-spacing:.1em; text-transform:uppercase; padding:3px 8px; color:var(--wp--preset--color--ink); background:var(--fmz-accent); }

/* banda */

/* filtro archivio */
.fmz-filter{ display:flex; gap:10px; flex-wrap:wrap; margin:24px 0 40px; }
.fmz-filter__btn{ font-family:var(--wp--preset--font-family--macchina); font-size:12px; letter-spacing:.06em; text-transform:uppercase; border:2px solid var(--wp--preset--color--ink); background:transparent; color:var(--wp--preset--color--ink); padding:8px 14px; cursor:pointer; transition:.2s; }
.fmz-filter__btn{ text-decoration:none; }
.fmz-filter__btn.is-active,.fmz-filter__btn:hover{ background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); }
/* filtri per tipo: accento pieno (Munari: testo ink), hover/attivo = negativo */
.fmz-filter__btn[data-tipo]:not([data-tipo=""]){ background:var(--fmz-accent); border-color:var(--fmz-accent); color:var(--wp--preset--color--ink); }
.fmz-filter__btn[data-tipo]:not([data-tipo=""]):hover,
.fmz-filter__btn[data-tipo]:not([data-tipo=""]).is-active{ background:var(--wp--preset--color--ink); border-color:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); }

/* =========================================================
   fmz/list — archivio progetti (tabella + filtro AJAX in-place)
   ========================================================= */
.fmz-projects{ width:100%; border-collapse:collapse; }
.fmz-projects thead th{ font-family:var(--wp--preset--font-family--macchina); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--wp--preset--color--grey-2); font-weight:400; text-align:left; padding:0 16px 12px 0; border-bottom:2px solid var(--wp--preset--color--ink); }
.fmz-projects tbody th, .fmz-projects tbody td{ text-align:left; font-weight:400; vertical-align:middle; padding:14px 16px 14px 0; border-bottom:2px solid var(--wp--preset--color--ink); }
.fmz-projects tbody td{ font-family:var(--wp--preset--font-family--macchina); font-size:13px; }
.fmz-projects__title a{ display:flex; align-items:center; gap:16px; text-decoration:none; font-family:var(--wp--preset--font-family--forma); font-weight:700; letter-spacing:-.02em; font-size:clamp(1.1rem,1.5vw,1.5rem); line-height:1; }
.fmz-projects__title img{ width:54px; height:54px; object-fit:cover; filter:grayscale(1); transition:filter .4s ease; flex:none; }
.fmz-projects tbody tr:hover .fmz-projects__title img{ filter:grayscale(0); }
.fmz-projects tbody tr:hover .fmz-projects__title a{ color:var(--fmz-accent); }
.fmz-projects tbody[aria-busy="true"]{ opacity:.45; transition:opacity .2s ease; }
.fmz-projects__empty td{ font-family:var(--wp--preset--font-family--macchina); color:var(--wp--preset--color--grey-2); }
@media(max-width:700px){
	.fmz-projects, .fmz-projects tbody, .fmz-projects tr, .fmz-projects th, .fmz-projects td{ display:block; }
	.fmz-projects thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); } /* solo per screen reader */
	.fmz-projects tbody tr{ border-bottom:2px solid var(--wp--preset--color--ink); padding:16px 0; }
	.fmz-projects tbody th, .fmz-projects tbody td{ border:0; padding:2px 0; }
	.fmz-projects tbody td[data-label]::before{ content:attr(data-label) " — "; color:var(--wp--preset--color--grey-2); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
}

/* =========================================================
   Singolo progetto — testata (hero) + spec sheet + cover
   ========================================================= */
.fmz-project-head{ padding-block: clamp(40px,8vh,100px) clamp(60px,10vh,120px); }
.fmz-project-head__title{ margin:0; }
.fmz-project-head__subtitle{ font-family:var(--wp--preset--font-family--segno); font-weight:700; font-size:clamp(1.8rem,4vw,3rem); line-height:.9; margin:.1em 0 0; }
.fmz-project-head__cols{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,80px); align-items:start; margin-top:clamp(32px,5vw,64px); }
.fmz-project-head__riassunto{ font-family:var(--wp--preset--font-family--macchina); font-size:clamp(14px,1.1vw,16px); line-height:1.7; max-width:46ch; margin:0; }

/* pill: tipo = accento (testo ink) · tag = neutro ink (testo paper) · non cliccabili */
.fmz-project__pills{ display:flex; gap:12px; flex-wrap:wrap; margin-top:clamp(24px,4vw,48px); }
.fmz-pill{ font-family:var(--wp--preset--font-family--macchina); font-size:12px; letter-spacing:.06em; text-transform:uppercase; padding:12px 22px; }
.fmz-pill--tipo{ background:var(--fmz-accent); color:var(--wp--preset--color--ink); }
.fmz-pill--tag{ background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); }

/* spec sheet: nessuno sfondo, divisori 2px solid, solo token del design system */
.fmz-project__spec{ margin:0; font-family:var(--wp--preset--font-family--macchina); font-size:var(--wp--preset--font-size--small); border-top:2px solid var(--wp--preset--color--ink); }
.fmz-project__row{ display:flex; justify-content:space-between; gap:16px; padding:13px 0; border-bottom:2px solid var(--wp--preset--color--ink); }
.fmz-project__row .k{ color:var(--wp--preset--color--grey-2); }
.fmz-project__row .v{ margin:0; text-align:right; color:var(--wp--preset--color--ink); }
.fmz-project__row .v a{ color:inherit; text-decoration:none; }
.fmz-project__row .v a:hover{ color:var(--fmz-accent); }

/* cover in griglia (constrained via .fmz-wrap), poi the_content coi blocchi */
.fmz-project__cover{ margin-block:clamp(48px,8vh,110px); }
.fmz-project__cover img{ display:block; width:100%; height:auto; }

/* Navigazione progetto singolo: torna ai progetti + successivo (ciclo), in griglia. */
.fmz-project-nav{ margin-block:clamp(48px,8vh,96px); }
.fmz-project-nav__row{ display:grid; grid-template-columns:1fr 1fr; align-items:baseline; gap:var(--wp--preset--spacing--40); }
.fmz-project-nav__links{ justify-self:end; text-align:right; }

/* =========================================================
   .fmz-image-frame — cornice editoriale per le immagini dei case study.
   Applica la classe al blocco immagine (Avanzate → Classi CSS aggiuntive).
   Cornice 2px nel colore ACCENT del progetto (--fmz-accent, ereditato dall'<article>
   di single-progetto.php; fallback ink). Numera la label con .fig-01 … .fig-12
   (o aggiungi una riga per numeri superiori). Niente logica automatica.
   ========================================================= */
.fmz-image-frame{ position:relative; border:2px solid var(--fmz-accent, var(--wp--preset--color--ink)); padding:clamp(8px,1vw,12px); border-radius:0; box-shadow:none; }
.fmz-image-frame img{ display:block; width:100%; height:auto; }

/* label "FIG.xx": mono, discreta, sopra il bordo in alto a sinistra → mai sull'immagine */
.fmz-image-frame[class*="fig-"]::before{
	position:absolute; left:0; bottom:100%; margin-bottom:6px;
	font-family:var(--wp--preset--font-family--macchina); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
	color:var(--wp--preset--color--grey-2); line-height:1; pointer-events:none;
}
.fmz-image-frame.fig-01::before{ content:"FIG.01"; }
.fmz-image-frame.fig-02::before{ content:"FIG.02"; }
.fmz-image-frame.fig-03::before{ content:"FIG.03"; }
.fmz-image-frame.fig-04::before{ content:"FIG.04"; }
.fmz-image-frame.fig-05::before{ content:"FIG.05"; }
.fmz-image-frame.fig-06::before{ content:"FIG.06"; }
.fmz-image-frame.fig-07::before{ content:"FIG.07"; }
.fmz-image-frame.fig-08::before{ content:"FIG.08"; }
.fmz-image-frame.fig-09::before{ content:"FIG.09"; }
.fmz-image-frame.fig-10::before{ content:"FIG.10"; }
.fmz-image-frame.fig-11::before{ content:"FIG.11"; }
.fmz-image-frame.fig-12::before{ content:"FIG.12"; }

@media(max-width:820px){
	.fmz-project-head__cols{ grid-template-columns:1fr; gap:32px; align-items:start; }
}

/* =========================================================
   404 — numero grande centrale, messaggio, ritorno
   ========================================================= */
.fmz-404{ min-height:calc(100svh - var(--fmz-nav-h,64px)); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:clamp(24px,4vh,44px); padding:clamp(48px,10vh,120px) var(--wp--custom--gut); }
.fmz-404__num{ margin:0; }
.fmz-404__text{ font-family:var(--wp--preset--font-family--macchina); font-size:clamp(14px,1.2vw,17px); line-height:2; color:var(--wp--preset--color--ink); }
.fmz-404__text p{ margin:0; }

/* =========================================================
   Cursore "segno" — editoriale: UN elemento che cambia FORMA per stato.
   Stile qui, logica in fmz.js (initCursor). Solo mouse; caret nativo sui campi.
   Estendibile: nuovi stati testuali via data-cursor (mappa LABELS nel JS).
   default = punto · cliccabile = "+" tipografico · click = "×" · data-cursor = testo.
   ========================================================= */
@media (hover:hover) and (pointer:fine){
	html.fmz-cursor-on, html.fmz-cursor-on *{ cursor:none; }
	html.fmz-cursor-on input, html.fmz-cursor-on textarea, html.fmz-cursor-on select, html.fmz-cursor-on [contenteditable]{ cursor:auto; }

	.fmz-cursor{ position:fixed; top:0; left:0; z-index:9999; width:0; height:0; color:var(--wp--preset--color--ink); pointer-events:none; will-change:transform; transition:color .2s ease; }
	.fmz-cursor.is-invert{ color:var(--wp--preset--color--paper); }   /* su superfici scure */
	.fmz-cursor__dot, .fmz-cursor__plus, .fmz-cursor__label{ position:absolute; top:0; left:0; translate:-50% -50%; transition:opacity .15s ease, scale .15s ease; }

	/* default: punto */
	.fmz-cursor__dot{ width:4px; height:4px; background:currentColor; border-radius:50%; }

	/* cliccabile: "+" tipografico (due linee 2px, come i divisori del sistema) */
	.fmz-cursor__plus{ width:12px; height:12px; opacity:0; scale:.35; }
	.fmz-cursor__plus::before, .fmz-cursor__plus::after{ content:""; position:absolute; top:50%; left:50%; background:currentColor; translate:-50% -50%; }
	.fmz-cursor__plus::before{ width:12px; height:2px; }
	.fmz-cursor__plus::after{ width:2px; height:12px; }

	/* stati testuali (drag e futuri): solo testo mono, nessun badge */
	.fmz-cursor__label{ font-family:var(--wp--preset--font-family--macchina); font-size:10px; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap; opacity:0; scale:.8; }

	/* --- transizioni di stato --- */
	.fmz-cursor[data-state="link"] .fmz-cursor__dot{ opacity:0; scale:.3; }
	.fmz-cursor[data-state="link"] .fmz-cursor__plus{ opacity:1; scale:1; }
	.fmz-cursor.has-label .fmz-cursor__dot,
	.fmz-cursor.has-label .fmz-cursor__plus{ opacity:0; scale:.3; }
	.fmz-cursor.has-label .fmz-cursor__label{ opacity:1; scale:1; }
	.fmz-cursor[data-state="text"], .fmz-cursor[data-state="hidden"]{ opacity:0; }

	/* click: il "+" ruota di 45° → "×" */
	.fmz-cursor[data-state="link"].is-down .fmz-cursor__plus{ rotate:45deg; transition:rotate .12s ease, opacity .15s ease, scale .15s ease; }
}
/* accessibilità: cambio stato immediato, niente easing né rotazione */
@media (prefers-reduced-motion:reduce){
	.fmz-cursor__dot, .fmz-cursor__plus, .fmz-cursor__label{ transition:none; }
	.fmz-cursor[data-state="link"].is-down .fmz-cursor__plus{ rotate:0deg; transition:none; }
}
.fmz-project__nav{ display:flex; justify-content:space-between; gap:20px; font-family:var(--wp--preset--font-family--forma); font-weight:800; }
.fmz-back{ font-family:var(--wp--preset--font-family--macchina); font-size:12px; color:var(--wp--preset--color--grey-2); text-decoration:none; display:inline-block; margin-bottom:24px; }

/* footer */
.fmz-footer{ background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); padding-block:clamp(56px,10vh,130px); }
.fmz-footer__social ul{ list-style:none; display:flex; gap:18px; justify-content:center; padding:0; margin:28px 0 0; font-family:var(--wp--preset--font-family--macchina); font-size:12px; }
.fmz-footer__end{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:clamp(40px,7vh,80px); font-family:var(--wp--preset--font-family--macchina); font-size:11px; color:var(--wp--preset--color--grey-2); }

/* intro + transizione (frame-logo) */
/* =========================================================
   effeemmezeta — utilities di sistema (prefisso fmz)
   B/N pulito · accenti Munari (testo ink) · 2px solid
   La firma vive qui: marker, colore-evento, frame, reveal, segni.
   ========================================================= */

:root{
	/* accento attivo: cambia con data-color (colore = evento) */
	--fmz-accent: var(--wp--preset--color--illustrazione);
	--fmz-nav-h: 64px;
	--fmz-max: 1440px;   /* rail unico larghezza contenuto */
}
[data-color="illustrazione"]{ --fmz-accent: var(--wp--preset--color--illustrazione); }
[data-color="web"]{ --fmz-accent: var(--wp--preset--color--web); }
[data-color="grafica"]{ --fmz-accent: var(--wp--preset--color--grafica); }

html{ scroll-behavior:smooth; }
/* i target di ancora (es. #contatti del prefooter) non finiscono sotto la nav sticky */
:where([id]){ scroll-margin-top: calc(var(--fmz-nav-h, 64px) + 16px); }
body{ text-rendering:optimizeLegibility; }
::selection{ background:var(--wp--preset--color--marker); color:var(--wp--preset--color--ink); }

:where(a):focus-visible,
:where(button):focus-visible,
:where(.wp-block-button__link):focus-visible{
	outline:3px solid var(--fmz-accent);
	outline-offset:3px;
}

/* accessibilità: testo per screen reader + skip link rivelato al focus */
.screen-reader-text{
	border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%);
	width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; position:absolute; word-wrap:normal !important;
}
.screen-reader-text:focus{
	clip:auto; clip-path:none; width:auto; height:auto; margin:0; padding:12px 20px;
	position:fixed; left:8px; top:8px; z-index:100000;
	background:var(--wp--preset--color--paper); color:var(--wp--preset--color--ink);
	border:2px solid var(--wp--preset--color--ink);
	font-family:var(--wp--preset--font-family--macchina); font-size:13px; letter-spacing:.06em; text-transform:uppercase; text-decoration:none;
}

/* ---- marker: evidenzia UNA parola (testo ink). Colore via variante (--fmz-hl-c) ---- */
.fmz-hl,
.fmz-hl-blu,
.fmz-hl-verde,
.fmz-hl-rosso{
	--fmz-hl-c: var(--wp--preset--color--marker);   /* default: giallo firma */
	background-color:transparent;   /* azzera il giallo di default del <mark> */
	color:inherit;
	background-image:linear-gradient( var(--fmz-hl-c), var(--fmz-hl-c) );
	background-repeat:no-repeat;
	background-size:100% 0.4em;
	background-position:0 50%;
	padding:0 0.06em;
	box-decoration-break:clone;
	-webkit-box-decoration-break:clone;
}
.fmz-hl-blu{   --fmz-hl-c: var(--wp--preset--color--illustrazione); }
.fmz-hl-verde{ --fmz-hl-c: var(--wp--preset--color--web); }
.fmz-hl-rosso{ --fmz-hl-c: var(--wp--preset--color--grafica); }

/* ---- divisore di sistema: 2px SOLIDO (default su TUTTI i separatori) ---- */
.fmz-dash,
.wp-block-separator{
	border:0;
	border-top:2px solid var(--wp--preset--color--ink);
	opacity:1; background:none;
}
.wp-block-separator:not(.is-style-wide):not(.alignwide):not(.alignfull){ max-width:100%; }

/* ---- colore = evento: greyscale a riposo, colore in hover ---- */
.fmz-media{ display:block; overflow:hidden; }
.fmz-media img,
.fmz-media.wp-block-post-featured-image img{
	filter:grayscale(1) contrast(1.02);
	transition:filter .5s ease, transform .6s ease;
}
.fmz-media:hover img{ filter:grayscale(0); }

/* ---- browser frame per progetti web (barra = accento del tipo) ---- */
.fmz-frame{ border:2px solid var(--wp--preset--color--ink); overflow:hidden; }
.fmz-frame::before{
	content:""; display:block; height:30px;
	background:
		radial-gradient( circle 4px at 16px 15px, rgba(0,0,0,.5) 99%, transparent ),
		radial-gradient( circle 4px at 31px 15px, rgba(0,0,0,.5) 99%, transparent ),
		radial-gradient( circle 4px at 46px 15px, rgba(0,0,0,.5) 99%, transparent ),
		var(--fmz-accent);
}


/* =========================================================
   ANIMATION SYSTEM — utility riutilizzabili, un solo linguaggio.
   Si attivano dal pannello Gutenberg (Avanzate → Classi CSS aggiuntive).
   Nessuna utility conosce il contesto: la Hero è solo utility + delay.
   Solo opacity + translateY: "un'impaginazione che prende forma", non un'animazione.
   Niente blur, niente scale, niente rotazioni nei reveal.
   Lo stato nascosto è gated su .fmz-js → senza JS il sito è tutto visibile.
   L'observer (fmz.js: initReveal) aggiunge .is-in quando l'elemento entra,
   ma solo dopo il "ready gate" (intro/overlay che scopre la pagina).
   ========================================================= */
.fmz-js :is(.reveal, .reveal-up, .reveal-left, .reveal-right, .scale){
	opacity:0; transition:opacity .8s ease, transform .8s cubic-bezier(.22,.61,.36,1);
}
.fmz-js .reveal-up{ transform:translateY(22px); }
.fmz-js .reveal-left{ transform:translateX(28px); }   /* entra da destra, va verso sinistra */
.fmz-js .reveal-right{ transform:translateX(-28px); }  /* entra da sinistra, va verso destra */
.fmz-js .scale{ transform:scale(.96); }                /* opt-in: i reveal editoriali non scalano */
.fmz-js :is(.reveal, .reveal-up, .reveal-left, .reveal-right, .scale).is-in{ opacity:1; transform:none; }

/* stagger: applicala a un contenitore → OGNI figlio entra quando raggiunge la vista, con
   cascata tra quelli che entrano nello stesso momento (il ritardo lo mette il JS: initStagger).
   Vale sia per gruppi corti già in vista sia per griglie/liste lunghe: quelli sotto la piega
   si rivelano man mano che scorri, non tutti insieme. */
.fmz-js .stagger > *{ opacity:0; transform:translateY(20px); transition:opacity .75s ease, transform .75s cubic-bezier(.22,.61,.36,1); }
.fmz-js .stagger > *.is-in{ opacity:1; transform:none; }

/* delay progressivi — componibili con i reveal per costruire qualsiasi sequenza da Gutenberg */
.fmz-js .delay-01{ transition-delay:.09s; }
.fmz-js .delay-02{ transition-delay:.18s; }
.fmz-js .delay-03{ transition-delay:.27s; }
.fmz-js .delay-04{ transition-delay:.36s; }
.fmz-js .delay-05{ transition-delay:.45s; }
.fmz-js .delay-06{ transition-delay:.54s; }
.fmz-js .delay-07{ transition-delay:.63s; }
.fmz-js .delay-08{ transition-delay:.72s; }
.fmz-js .delay-09{ transition-delay:.81s; }
.fmz-js .delay-10{ transition-delay:.90s; }

@media (prefers-reduced-motion:reduce){
	.fmz-js :is(.reveal, .reveal-up, .reveal-left, .reveal-right, .scale),
	.fmz-js .stagger > *{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* split: il testo si compone lettera per lettera (utility, non hero-specific).
   Applicala a un titolo/parola; il JS (initSplit) avvolge i char e li sfalsa.
   Contenitore nascosto prima del paint (no flash del testo intero) → .is-split lo
   sblocca (vuoto) → .is-in fa entrare i char. Solo opacity + micro translateY, no blur.
   Componibile con delay-0x: sposta l'inizio dell'intera sequenza. */
.fmz-js .split{ opacity:0; }
.fmz-js .split.is-split{ opacity:1; }
.fmz-js .split .fmz-char{ display:inline-block; opacity:0; transform:translateY(.2em); transition:opacity .5s ease, transform .55s cubic-bezier(.22,.61,.36,1); }
.fmz-js .split.is-in .fmz-char{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
	.fmz-js .split{ opacity:1 !important; }
	.fmz-js .split .fmz-char{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* marker: un segno colorato che si costruisce da sinistra a destra (come un evidenziatore).
   Per divider, sottolineature, segni grafici, futuri "segni". Applicala a una barra/separatore/
   gruppo con sfondo colorato: scala da 0 a piena larghezza, ancorata a sinistra.
   transition in longhand → delay-0x resta componibile (non azzera transition-delay). */
.fmz-js .marker{ transform:scaleX(0); transform-origin:left center; transition-property:transform; transition-duration:.7s; transition-timing-function:cubic-bezier(.22,.61,.36,1); }
.fmz-js .marker.is-in{ transform:scaleX(1); }
@media (prefers-reduced-motion:reduce){ .fmz-js .marker{ transform:none !important; transition:none !important; } }

/* overlap: la sezione sale sopra ciò che la precede (Hero → prima sezione), ma il rialzo
   è legato allo SCROLL (feeling locomotive): parte un filo più bassa e sale in posizione
   mentre entra — il JS (initScrollProgress) guida --p (0 entrando → 1 a posto).
   --p:1 di default → senza JS è già a posto. Sfondo paper così copre; bg esplicito del blocco vince. */
.overlap{ --p:1; position:relative; z-index:1; margin-top:calc(-1 * clamp(2.5rem, 5.5vw, 6.5rem)); background:var(--wp--preset--color--paper); transform:translateY(calc((1 - var(--p)) * 44px)); will-change:transform; }
@media (prefers-reduced-motion:reduce){ .overlap{ transform:none; } }

/* =========================================================
   INTRO — solo prima visita della sessione (flag in sessionStorage, classe
   .fmz-intro-active dallo head prima del paint). Pannello nero → la cornice si
   disegna → il marchio (maschera del logo) entra con una brevissima instabilità
   tipografica → pausa → il pannello sale e scopre la Hero (fmz.js: initIntro →
   fireReady fa partire le utility della Hero). Reduced-motion la salta del tutto.
   ========================================================= */
.fmz-intro{ display:none; }
.fmz-intro-active .fmz-intro{
	display:flex; position:fixed; inset:0; z-index:100000;
	align-items:center; justify-content:center; background:#0B0B0B; transform:translateY(0);
}
.fmz-intro.is-leaving{ transform:translateY(-100%); transition:transform .7s cubic-bezier(.76,0,.24,1); }
.fmz-intro__stage{ width:clamp(240px, 42vh, 460px); aspect-ratio:1; }
.fmz-intro__mark{ width:100%; height:100%; overflow:visible; }
/* cornice = la linea esterna del LOGO, tracciata da stroke-dashoffset.
   Spessore in unità locali (il path è dentro un <g scale(0.1)>) → ~2px a video. */
.fmz-intro__frame{ fill:none; stroke:#fff; stroke-width:60; stroke-dasharray:1 1; stroke-dashoffset:1; }
.fmz-intro.is-drawing .fmz-intro__frame{ stroke-dashoffset:0; transition:stroke-dashoffset .9s ease; }
/* le 12 lettere: bianche, entrano UNA PER UNA con instabilità tipografica (delay dal JS) */
.fmz-intro__letters path{ fill:#fff; opacity:0; transform-box:fill-box; transform-origin:center; }
.fmz-intro.is-scramble .fmz-intro__letters path{ animation:fmz-letter-in .42s steps(3) forwards; }
@keyframes fmz-letter-in{
	0%{ opacity:0; transform:scaleY(1.12) scaleX(.96); }
	40%{ opacity:.35; transform:scaleY(.94) scaleX(1.03); }
	70%{ opacity:.8; transform:scaleY(1.03); }
	100%{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce){ .fmz-intro{ display:none !important; } }

/* Cambio pagina — wipe verticale continuo. Overlay nero fisso (non segue il tema).
   Solo con JS. Pagina in arrivo (.fmz-transitioning) coperta prima del paint → no flash. */
.fmz-transition{ position:fixed; inset:0; z-index:99999; background:#0B0B0B; transform:translateY(100%); pointer-events:none; }
.fmz-js .fmz-transition{ transition:transform .55s cubic-bezier(.76,0,.24,1); }
.fmz-transitioning .fmz-transition{ transform:translateY(0); }
@media (prefers-reduced-motion:reduce){ .fmz-transition{ display:none; } }

/* Parallax: solo desktop, hint GPU (il movimento lo mette il JS: initParallax) */
@media (min-width:992px) and (pointer:fine){
	.parallax{ will-change:transform; }
}

/* Header — build-in: logo → menu → CTA (fade + translateY, niente bounce) */
.fmz-js [data-fmz-anim="header"] [data-fmz-anim-item]{ opacity:0; transform:translateY(-6px); transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1); }
.fmz-js [data-fmz-anim="header"].is-in [data-fmz-anim-item]{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
	.fmz-js [data-fmz-anim="header"] [data-fmz-anim-item]{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ---- segni mono (SVG in currentColor: ereditano il colore del contesto) ---- */
.fmz-mark{ display:inline-block; width:1.1em; height:1.1em; vertical-align:-0.15em; color:currentColor; }
.fmz-mark--accent{ color:var(--fmz-accent); }

/* =========================================================
   BOTTONI — negativo all'hover (mai accento), freccia con micro
   ========================================================= */
.wp-block-button__link{
	box-sizing:border-box;
	display:inline-flex; align-items:center; justify-content:center; min-height:0; line-height:1.2;
	border-radius:0;
	border:2px solid var(--wp--preset--color--ink);
	background:var(--wp--preset--color--ink);
	color:var(--wp--preset--color--paper);
	font-family:var(--wp--preset--font-family--macchina);
	font-size:13px; letter-spacing:.04em; text-transform:uppercase;
	padding:14px 22px;
	transition:background .22s ease, color .22s ease;
}
.wp-block-buttons{ align-items:stretch; }
.wp-block-buttons .wp-block-button{ display:flex; }
.wp-block-buttons .wp-block-button .wp-block-button__link{ width:100%; }
.wp-block-button__link:hover,
.wp-block-button__link:focus{ background:var(--wp--preset--color--paper); color:var(--wp--preset--color--ink); }

.wp-block-button.is-style-outline .wp-block-button__link{ background:transparent; color:var(--wp--preset--color--ink); border:2px solid var(--wp--preset--color--ink); }
.wp-block-button.is-style-outline .wp-block-button__link:hover{ background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); border:2px solid var(--wp--preset--color--ink); }

/* freccia: stile-blocco "Freccia" (is-style-fmz-arrow) o classe .fmz-arrow.
   La freccia scorre via a destra e ne entra una da sinistra. */
.fmz-arrow .wp-block-button__link,
.is-style-fmz-arrow .wp-block-button__link{ position:relative; padding-right:44px; }
.fmz-arrow .wp-block-button__link::before,
.fmz-arrow .wp-block-button__link::after,
.is-style-fmz-arrow .wp-block-button__link::before,
.is-style-fmz-arrow .wp-block-button__link::after{
	content:"→"; position:absolute; right:20px; top:50%; transform:translateY(-50%);
	transition:transform .32s cubic-bezier(.6,0,.2,1), opacity .32s;
}
.fmz-arrow .wp-block-button__link::after,
.is-style-fmz-arrow .wp-block-button__link::after{ transform:translate(-160%,-50%); opacity:0; }
.fmz-arrow .wp-block-button__link:hover::before,
.is-style-fmz-arrow .wp-block-button__link:hover::before{ transform:translate(160%,-50%); opacity:0; }
.fmz-arrow .wp-block-button__link:hover::after,
.is-style-fmz-arrow .wp-block-button__link:hover::after{ transform:translateY(-50%); opacity:1; }

/* =========================================================
   STILI BLOCCO — design system (paragrafo, liste, quote, immagine)
   ========================================================= */
/* Eyebrow (stile paragrafo) — con trattino iniziale */
.is-style-fmz-eyebrow{
	font-family:var(--wp--preset--font-family--macchina);
	font-size:14px;
	letter-spacing:.26em; text-transform:uppercase;
	color:var(--wp--preset--color--grey-2);
	margin-bottom:.4em;
	display:flex; align-items:center; gap:16px;
}
.is-style-fmz-eyebrow::before{ content:""; width:40px; height:2px; background:currentColor; flex:none; }
/* Lead (paragrafo introduttivo) */
.is-style-fmz-corpo{
	font-family:var(--wp--preset--font-family--macchina);
	font-size:clamp(1rem, 0.9rem + .6vw, 1.35rem);
	line-height:1.6; max-width:60ch;
}
/* Immagine greyscale → colore (stile-blocco) */
.wp-block-image.is-style-fmz-media img{ filter:grayscale(1) contrast(1.02); transition:filter .5s ease; }
.wp-block-image.is-style-fmz-media:hover img{ filter:grayscale(0); }

/* Citazione — default */
.wp-block-quote{
	border-left:2px solid var(--wp--preset--color--ink);
	padding-left:clamp(16px,2vw,28px); margin-inline:0;
	font-family:var(--wp--preset--font-family--forma); font-weight:700; letter-spacing:-.02em;
	font-size:clamp(1.3rem,2.4vw,2rem); line-height:1.1;
}
.wp-block-quote cite{ display:block; margin-top:.6em; font-family:var(--wp--preset--font-family--macchina); font-weight:400; font-size:12px; letter-spacing:.06em; color:var(--wp--preset--color--grey-2); font-style:normal; }
/* Pull-quote (stile-blocco) — grande, righe 2px sopra/sotto, centrato */
.wp-block-quote.is-style-fmz-pull{
	border-left:0; text-align:center; padding:clamp(24px,4vw,48px) 0;
	border-top:2px solid var(--wp--preset--color--ink); border-bottom:2px solid var(--wp--preset--color--ink);
	font-size:clamp(1.8rem,4vw,3.2rem); line-height:1; letter-spacing:-.03em; max-width:none;
}

/* Liste — spaziatura mono */
.wp-block-list{ padding-left:1.1em; }
.wp-block-list li{ padding:2px 0; }

/* Pulsante disabilitato-ish e allineamento gap */
.wp-block-buttons{ gap:14px; }

/* =========================================================
   GRIGLIA — 12 col, dense, con sfalsamento controllato opzionale
   (il blocco fmz-work la usera; qui e pronta come utility)
   ========================================================= */
.fmz-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(12px,1.6vw,22px); grid-auto-flow:row dense; }
.fmz-grid > .span-4{ grid-column:span 4; }
.fmz-grid > .span-5{ grid-column:span 5; }
.fmz-grid > .span-7{ grid-column:span 7; }
.fmz-grid > .span-8{ grid-column:span 8; }
.fmz-grid > .span-12{ grid-column:span 12; }
/* sfalsamento: applicato solo se la griglia ha .is-mossa */
.fmz-grid.is-mossa > .offset-1{ margin-top:24px; }
.fmz-grid.is-mossa > .offset-2{ margin-top:56px; }
.fmz-grid.is-mossa > .offset-3{ margin-top:88px; }
@media(max-width:820px){
	.fmz-grid{ grid-template-columns:repeat(6,1fr); }
	.fmz-grid > [class*="span-"]{ grid-column:span 3; }
	.fmz-grid > .span-7,.fmz-grid > .span-8,.fmz-grid > .span-12{ grid-column:span 6; }
}
@media(max-width:520px){
	.fmz-grid{ grid-template-columns:1fr; }
	.fmz-grid > *{ grid-column:span 1 !important; margin-top:0 !important; }
}

/* =========================================================
   fmz/work — griglia progetti a MURO (masonry).
   Larghezza guidata dall'orientamento (ritratto stretto / landscape largo);
   l'altezza reale dell'immagine + le row-span (JS: initMasonry) danno l'incastro
   sfalsato. Senza JS resta una griglia semplice (progressive enhancement).
   ========================================================= */
.fmz-work-grid{
	list-style:none; margin:0; padding:0;
	display:grid; grid-template-columns:repeat(12,1fr);
	gap:clamp(20px,2.4vw,44px);
	grid-auto-flow:row dense; align-items:start;
}
.fmz-work-grid .fmz-card{ position:relative; grid-column:span 3; }   /* ritratto ~25% */
.fmz-work-grid .fmz-card--wide{ grid-column:span 6; }                /* landscape ~50% */
/* immagine al rapporto NATURALE (niente crop); width/height dell'<img> evitano il CLS */
.fmz-work-grid .fmz-media{ background:var(--wp--preset--color--grey-1); }
.fmz-work-grid .fmz-media img{ width:100%; height:auto; }
.fmz-work-grid .fmz-card:hover .fmz-media img{ filter:grayscale(0); }
/* stretched link: tutta la card cliccabile con un solo link (il titolo) */
.fmz-work-grid .fmz-card__title::after{ content:""; position:absolute; inset:0; }

/* masonry attiva (classe aggiunta dal JS): incastro stretto a muro */
.fmz-work-grid.is-masonry{ grid-auto-rows:8px; row-gap:0; }

@media(max-width:900px){
	.fmz-work-grid .fmz-card{ grid-column:span 6; }
	.fmz-work-grid .fmz-card--wide{ grid-column:span 12; }
}
@media(max-width:560px){
	.fmz-work-grid,
	.fmz-work-grid.is-masonry{ grid-template-columns:1fr; grid-auto-rows:auto; }
	.fmz-work-grid .fmz-card{ grid-column:1 / -1; }
}

@media (prefers-reduced-motion:reduce){
	html{ scroll-behavior:auto; }
	.fmz-reveal{ opacity:1; transform:none; transition:none; }
	.fmz-media img{ transition:none; }
	.fmz-grid.is-mossa > *{ transition:none; }
}

/* ---- topbar (opzionale, da Customizer) ---- */
.fmz-topbar{ background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); font-family:var(--wp--preset--font-family--macchina); font-size:12px; letter-spacing:.06em; }
.fmz-topbar .fmz-wrap{ padding-block:8px; text-align:center; }

/* ---- quick menu header ---- */

/* ---- area widget footer ---- */
.fmz-footer__widgets{ display:grid; gap:clamp(24px,4vw,56px); grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); border-bottom:2px solid var(--wp--preset--color--paper); padding-bottom:clamp(32px,5vh,64px); margin-bottom:clamp(32px,5vh,64px); }
.fmz-widget{ font-family:var(--wp--preset--font-family--macchina); font-size:13px; line-height:1.7; }
.fmz-widget__title{ font-family:var(--wp--preset--font-family--forma); font-weight:800; font-size:1rem; letter-spacing:-.02em; margin:0 0 12px; }
.fmz-widget a{ text-decoration:none; }
.fmz-widget ul{ list-style:none; margin:0; padding:0; }
.fmz-widget li{ padding:4px 0; }

/* =========================================================
   HERO — layout gestito da Gutenberg (gruppo full-width "constrained").
   Qui SOLO ritocchi minimi: label dei numeri + allineamento riga.
   Nessun flex/min-height custom che possa litigare col motore di WP.
   ========================================================= */
.fmz-stats{ align-items:flex-start; }
.fmz-stat__label{ font-family:var(--wp--preset--font-family--macchina); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--wp--preset--color--ink); margin:0; max-width:16ch; }
.fmz-stats h1,.fmz-stats h2,.fmz-stats h3,.fmz-stats h4{ margin:0; line-height:.9; }

/* =========================================================
   STILE GRUPPO "Sezione" — ritmo verticale automatico
   ========================================================= */
.wp-block-group.is-style-fmz-section{ padding-block:clamp(48px,8vh,110px); }
.wp-block-group.is-style-fmz-section-top{ padding-block:clamp(48px,8vh,110px); border-top:2px solid var(--wp--preset--color--ink); }
/* se full-width, aggiunge il padding orizzontale (gutter) */
.wp-block-group.is-style-fmz-section.alignfull,
.wp-block-group.is-style-fmz-section-top.alignfull{ padding-inline:var(--wp--custom--gut); }