/* =====================================================================
   Alessandro Maione · foglio di stile
   ===================================================================== */

@font-face{font-family:"Josefin Sans";src:url("../fonts/josefin-sans.woff") format("woff");font-weight:100 700;font-style:normal;font-display:swap}
@font-face{font-family:"Josefin Sans";src:url("../fonts/josefin-sans-italic.woff") format("woff");font-weight:100 700;font-style:italic;font-display:swap}
@font-face{font-family:"Figtree";src:url("../fonts/figtree.woff") format("woff");font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:"Figtree";src:url("../fonts/figtree-italic.woff") format("woff");font-weight:300 900;font-style:italic;font-display:swap}

:root{
  /* ---- Palette "Estate": colori freddi, chiari e polverosi ---- */
  --cloud:#F7F7F5;      /* bianco morbido: fondo */
  --polvere:#DCE5EC;    /* azzurro polvere */
  --salvia:#D6E2DA;     /* salvia fredda */
  --cipria:#EFD9DC;     /* rosa cipria */
  --perla:#E8E8EA;      /* grigio perla */
  --haze:#CBD3CE;       /* filetti */
  --ink:#2B2F35;        /* antracite */
  --accento:#3F6B5F;    /* salvia profonda: pulsanti e dettagli */
  --accento-2:#335A50;
  --display:"Josefin Sans","Futura","Century Gothic",sans-serif;
  --body:"Figtree","Helvetica Neue",Arial,sans-serif;

  /* ---- SCALA DI SPAZIATURA ----
     Griglia di 4px (0,25rem) con i passi principali su multipli di 8px.
     Ogni margine, padding e gap del sito usa SOLO questi valori. */
  --space-1:.25rem;   /*   4px */
  --space-2:.5rem;    /*   8px */
  --space-3:.75rem;   /*  12px */
  --space-4:1rem;     /*  16px */
  --space-5:1.5rem;   /*  24px */
  --space-6:2rem;     /*  32px */
  --space-7:3rem;     /*  48px */
  --space-8:4rem;     /*  64px */
  --space-9:6rem;     /*  96px */
  --space-10:8rem;    /* 128px */

  /* ---- Ruoli (cosa separano), fluidi tra telefono e schermo grande ---- */
  --gap-xs:var(--space-1);                                   /* etichetta → valore, titolo → riga sotto */
  --gap-sm:var(--space-2);                                   /* chip, pillole, elementi in linea */
  --gap-md:var(--space-4);                                   /* titolo → testo dentro una card, campi */
  --gap-lg:var(--space-5);                                   /* paragrafo → paragrafo, titolo pagina → sottotitolo */
  --flow:var(--gap-lg);                                      /* ritmo dei paragrafi */
  --block-sm:clamp(var(--space-5),3vw,var(--space-6));       /* 24→32: titolo di gruppo → contenuto, testo → pulsanti */
  --block:clamp(var(--space-6),4vw,var(--space-7));          /* 32→48: tra blocchi della stessa sezione (testo → immagini) */
  --block-lg:clamp(var(--space-7),6vw,var(--space-8));       /* 48→64: tra gruppi distinti della stessa sezione */
  --section:clamp(var(--space-8),9vw,var(--space-10));       /* 64→128: spazio verticale di ogni sezione */
  --section-sm:clamp(var(--space-6),4vw,var(--space-7));     /* 32→48: fasce compatte (citazione d'apertura) */
  --gutter:clamp(var(--space-4),2.5vw,var(--space-6));       /* 16→32: tra colonne e card */
  --gutter-lg:clamp(var(--space-6),6vw,var(--space-9));      /* 32→96: tra le due colonne di un layout diviso */
  --gap-media:clamp(var(--space-2),1.2vw,var(--space-4));    /*  8→16: tra le foto di una griglia */
  --card-pad:clamp(var(--space-5),3vw,var(--space-7));       /* 24→48: interno di card e riquadri */
  --pad:clamp(var(--space-5),5vw,4.5rem);                    /* 24→72: margini laterali della pagina */

  --radius-sm:12px; --radius:16px; --radius-lg:24px;
  --header-h:64px;
}

/* ---------------------------------------------------------------------
   Base
   --------------------------------------------------------------------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--cloud);color:var(--ink);font-family:var(--body);font-size:clamp(17px,1vw + 12px,19px);line-height:1.65;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--accento);outline-offset:3px}
h1,h2,h3{font-family:var(--display);line-height:1;margin:0;letter-spacing:-.01em;font-weight:400}
h2{font-size:clamp(42px,6.4vw,96px);font-weight:300}
h3{font-size:clamp(22px,2vw,30px);font-weight:550;line-height:1.1}
/* Nessun margine "di default": le distanze le decidono i contenitori. */
p,figure,blockquote,dl,dd,ul,ol{margin:0}
p{max-width:64ch}
strong{font-weight:650}

/* ---------------------------------------------------------------------
   Sistema di impaginazione
   --------------------------------------------------------------------- */
.wrap{padding-inline:var(--pad);max-width:1440px;margin-inline:auto}

/* Sezioni: stesso respiro verticale ovunque */
section{padding-block:var(--section)}
/* Due sezioni senza colore di fondo una dopo l'altra non raddoppiano lo spazio */
section:not(.salvia,.polvere,.cipria,.perla,.quote,.closing-band,.hero)
  + section:not(.salvia,.polvere,.cipria,.perla,.quote,.closing-band,.hero){padding-top:0}

/* Pile verticali con gap (al posto dei margini sparsi) */
.stack,.stack-sm,.stack-lg,.head-text{display:flex;flex-direction:column}
.stack{gap:var(--block)}
.stack-sm{gap:var(--block-sm)}
.stack-lg{gap:var(--block-lg)}
.head-text{gap:var(--gap-lg)}
:is(.stack,.stack-sm,.stack-lg) > :is(.btn,.btns){align-self:flex-start}
:is(.stack,.stack-sm,.stack-lg) > :empty{display:none}

/* Testo continuo (Chi sono, informativa): ritmo costante tra paragrafi */
.prose > * + *{margin-top:var(--flow)}
.prose > h2{margin-top:var(--block)}
.prose > h2 + *{margin-top:var(--gap-md)}
.prose > .actions{margin-top:var(--block-sm)}

.salvia{background:var(--salvia)}
.polvere{background:var(--polvere)}
.cipria{background:var(--cipria)}
.perla{background:var(--perla)}

/* ---------------------------------------------------------------------
   Pulsanti
   --------------------------------------------------------------------- */
.btn{font-family:var(--display);font-weight:600;letter-spacing:.01em;font-size:17px;display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-5);line-height:1.1;border-radius:999px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--ink);color:var(--cloud)}
.btn-solid{background:var(--accento);border-color:var(--accento);color:#fff}
.btn-solid:hover{background:var(--accento-2);border-color:var(--accento-2);color:#fff}
.btns{display:flex;flex-wrap:wrap;gap:var(--space-3)}

/* ---------------------------------------------------------------------
   Intestazione e menù
   --------------------------------------------------------------------- */
header.top{position:sticky;top:0;z-index:30;background:rgba(247,247,245,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(37,36,44,.08)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:var(--header-h);padding:var(--space-2) var(--pad);max-width:1440px;margin:auto}
.brand{flex:none;font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:.02em;text-decoration:none;color:var(--ink);white-space:nowrap}
.brand:hover,.brand[aria-current="page"]{color:var(--accento)}
nav.main{flex:1;min-width:0;display:flex;align-items:center;gap:clamp(var(--space-1),1vw,var(--space-3));overflow-x:auto;scrollbar-width:none;font-family:var(--display);font-size:17px}
nav.main::-webkit-scrollbar{display:none}
nav.main a{flex:none;text-decoration:none;font-weight:400;letter-spacing:.01em;padding:var(--space-2);color:var(--ink);transition:color .2s}
nav.main a:hover{color:var(--accento)}
nav.main a[aria-current="page"],nav.main a.cta{color:var(--accento);font-weight:600}
nav.main a.cta:hover{color:var(--accento-2)}
.lang{flex:none;display:flex;border:1.5px solid rgba(37,36,44,.35);border-radius:999px;overflow:hidden}
.lang button{font:600 14px var(--display);background:none;border:0;color:var(--ink);padding:var(--space-1) var(--space-3);cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--cloud)}
.menu-btn{display:none}

/* Menù a tendina su telefono e tablet */
@media (max-width:1100px){
  .bar{position:relative}
  .brand{order:1;margin-right:auto}
  .lang{order:2}
  .menu-btn{order:3;display:inline-flex;align-items:center;gap:var(--space-2);font:600 16px var(--display);background:none;border:0;color:var(--ink);padding:var(--space-2) 0 var(--space-2) var(--space-2);cursor:pointer}
  .mb-ico{position:relative;width:20px;height:2px;background:currentColor;transition:background .2s}
  .mb-ico::before,.mb-ico::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor;transition:transform .25s}
  .mb-ico::before{top:-6px}.mb-ico::after{top:6px}
  .menu-btn[aria-expanded="true"] .mb-ico{background:transparent}
  .menu-btn[aria-expanded="true"] .mb-ico::before{transform:translateY(6px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] .mb-ico::after{transform:translateY(-6px) rotate(-45deg)}
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;order:4;flex-direction:column;align-items:stretch;gap:0;
    background:var(--cloud);padding:var(--space-2) var(--pad) var(--space-5);border-bottom:1px solid rgba(37,36,44,.1);box-shadow:0 18px 30px -18px rgba(43,47,53,.25);max-height:calc(100svh - var(--header-h));overflow-y:auto}
  nav.main.open{display:flex}
  nav.main a{font-size:24px;font-weight:300;padding:var(--space-3) 0;border-bottom:1px solid rgba(37,36,44,.08)}
  nav.main a:last-child{border-bottom:0}
  nav.main a[aria-current="page"],nav.main a.cta{font-weight:600}
  body.menu-open{overflow:hidden}
}
@media (prefers-reduced-motion:reduce){.mb-ico::before,.mb-ico::after{transition:none}}

/* ---------------------------------------------------------------------
   Intestazione di pagina
   --------------------------------------------------------------------- */
.page-head{padding-block:var(--section) var(--block)}
.page-head h1,.contact-grid h1{font-size:clamp(56px,10vw,150px);font-weight:200;line-height:.92;letter-spacing:-.01em}
.contact-grid h1{font-size:clamp(56px,9vw,140px)}
.lede{font-size:clamp(21px,1.5vw + 10px,28px);line-height:1.4;font-weight:350;max-width:36ch}

/* ---------------------------------------------------------------------
   Home: prima schermata
   --------------------------------------------------------------------- */
.hero{padding:0;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);min-height:calc(100svh - var(--header-h));overflow:hidden;background:linear-gradient(160deg,var(--cloud) 0%,var(--salvia) 60%,var(--cipria) 100%)}
.hero-text{padding:clamp(var(--space-7),8vh,var(--space-9)) var(--pad);display:flex;flex-direction:column;justify-content:space-between;gap:var(--block-lg);position:relative;z-index:2}
.hero-epi{max-width:30ch}
.hero-epi blockquote{font-family:var(--display);font-weight:300;font-size:clamp(20px,1.8vw,28px);line-height:1.25}
.hero-epi blockquote p::before{content:"«"}.hero-epi blockquote p::after{content:"»"}
.hero-epi figcaption{margin-top:var(--space-2);font-size:15px;font-weight:600;opacity:.75}
.hero-main{display:flex;flex-direction:column;gap:var(--gap-lg)}
.hero-main .btns{margin-top:var(--space-2)}
.name{font-family:var(--display);font-weight:200;font-size:clamp(52px,8.2vw,138px);line-height:.95;letter-spacing:-.02em;margin:0;white-space:nowrap}
.name span{display:block}
.role{font-size:clamp(22px,2vw,30px);line-height:1.3;max-width:26ch;font-weight:350}
.hero-photo{position:relative}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.name-over{display:none}
@media (max-width:900px){
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero-photo{order:-1;height:calc(100svh - var(--header-h));min-height:460px}
  .hero-photo::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(to top,rgba(30,33,38,.78),rgba(30,33,38,0));z-index:1}
  .name-over{display:block;position:absolute;left:var(--pad);right:var(--pad);bottom:var(--space-5);z-index:2;margin:0;font-family:var(--display);font-weight:300;font-size:clamp(46px,14vw,84px);line-height:.95;letter-spacing:-.01em;color:#fff}
  .name-over span{display:block}
  .hero-text{padding-block:var(--block);gap:var(--block-sm)}
  .hero-text .name{display:none}
}

/* ---------------------------------------------------------------------
   Fasce con citazione
   --------------------------------------------------------------------- */
.quote{background:var(--salvia);padding-block:var(--section)}
.quote.cipria{background:var(--cipria)}
.quote.polvere{background:var(--polvere)}
.quote figure{margin:0 auto;max-width:1100px;padding-inline:var(--pad)}
.quote blockquote{font-family:var(--display);font-weight:300;font-size:clamp(30px,3.6vw,56px);line-height:1.18;letter-spacing:-.01em;max-width:24ch}
.quote blockquote::before{content:"«";display:block;font-weight:300;font-size:1.5em;line-height:.6;color:var(--accento);margin-bottom:var(--space-2)}
.quote blockquote p{max-width:none}
.quote figcaption{margin-top:var(--gap-lg);font-weight:600;font-size:17px}
.quote figcaption span{font-weight:400;font-style:italic;opacity:.75}
.quote.top{padding-block:var(--section-sm)}
.quote.top blockquote{font-size:clamp(22px,2.4vw,34px);max-width:40ch}
.quote.top blockquote::before{font-size:1.2em}
.quote.top figcaption{margin-top:var(--gap-md);font-size:15px}
html[lang="en"] .quote blockquote::before{content:"\201C"}
html[lang="en"] .hero-epi blockquote p::before{content:"\201C"}
html[lang="en"] .hero-epi blockquote p::after{content:"\201D"}

/* ---------------------------------------------------------------------
   Layout ricorrenti
   --------------------------------------------------------------------- */
.intro-split{display:grid;grid-template-columns:5fr 7fr;gap:var(--gutter-lg);align-items:end}
.intro-split.top{align-items:start}
@media (max-width:860px){.intro-split{grid-template-columns:1fr;gap:var(--gap-lg)}}
.split-photo{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter-lg);align-items:center}
.split-photo img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius)}
@media (max-width:860px){.split-photo{grid-template-columns:1fr}}
.cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gutter)}
@media (max-width:860px){.cols3{grid-template-columns:1fr}}

/* Card verticale: immagine/titolo/testo/link sempre alla stessa distanza */
.card-stack{display:flex;flex-direction:column;gap:var(--gap-md)}

/* ---------------------------------------------------------------------
   Home: percorsi
   --------------------------------------------------------------------- */
.paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--block-lg) var(--block)}
.path{text-decoration:none;display:flex;flex-direction:column;gap:var(--gap-sm)}
.path img{margin-bottom:var(--space-4)}
.path img{aspect-ratio:4/5;object-fit:cover;object-position:50% 25%;border-radius:var(--radius);width:100%;transition:filter .3s}
.path:hover img{filter:brightness(1.06)}
.path h3{font-size:clamp(28px,2.6vw,38px);font-weight:450}
.path p{font-size:18px}
.path .go{font-family:var(--display);font-weight:600;font-size:16px;color:var(--accento);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--haze)}
@media (max-width:860px){.paths{grid-template-columns:1fr;row-gap:var(--space-7)}.path img{aspect-ratio:16/11}}

/* ---------------------------------------------------------------------
   Chi sono
   --------------------------------------------------------------------- */
.about{display:grid;grid-template-columns:5fr 7fr;gap:var(--gutter-lg);align-items:start}
.about figure{position:sticky;top:calc(var(--header-h) + var(--space-6))}
.about figure img{aspect-ratio:4/5;object-fit:cover;width:100%;border-radius:var(--radius)}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-lg) var(--space-7);padding-top:var(--gap-lg);border-top:1.5px solid var(--haze)}
.prose > .facts{margin-top:var(--block-sm)}
.facts div{display:flex;flex-direction:column;gap:var(--gap-xs)}
.facts dt{font-family:var(--display);font-weight:600;font-size:15px;color:var(--accento)}
.facts dd{font-size:18px;line-height:1.4}
@media (max-width:820px){.about{grid-template-columns:1fr}.about figure{position:static;max-width:440px}}

/* ---------------------------------------------------------------------
   Laboratori
   --------------------------------------------------------------------- */
.pillars{display:flex;flex-direction:column;gap:var(--space-1);margin:0;padding:0;list-style:none}
.pillars li{font-family:var(--display);font-weight:300;font-size:clamp(40px,5.6vw,84px);line-height:1;letter-spacing:-.01em;color:var(--accento)}
.offer{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.offer li{display:grid;grid-template-columns:minmax(220px,4fr) 6fr minmax(160px,3fr);gap:var(--gutter);padding-block:var(--gap-lg);border-bottom:1.5px solid var(--haze);align-items:baseline}
.offer .with{font-size:16px;font-weight:600;color:var(--accento)}
@media (max-width:900px){.offer li{grid-template-columns:1fr;gap:var(--gap-sm)}}

.cta-card{display:grid;grid-template-columns:auto 1fr;gap:var(--card-pad);align-items:center;background:var(--salvia);border-radius:var(--radius-lg);overflow:hidden}
.cta-card img{width:clamp(160px,22vw,300px);height:100%;object-fit:cover;aspect-ratio:3/4}
.cta-card > div{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gap-md);padding:var(--card-pad) var(--card-pad) var(--card-pad) 0}
.cta-card > div .btn{margin-top:var(--gap-sm)}
.cta-card h3{font-size:clamp(28px,3.2vw,46px);font-weight:400}
@media (max-width:640px){.cta-card{grid-template-columns:1fr;gap:0}.cta-card img{width:100%;aspect-ratio:16/10;object-position:50% 25%}.cta-card > div{padding:var(--card-pad)}}

/* ---------------------------------------------------------------------
   Collaborazioni
   --------------------------------------------------------------------- */
.cols3 article{display:flex;flex-direction:column;gap:var(--gap-md);border-top:2px solid var(--accento);padding-top:var(--gap-lg)}
.cols3 p{font-size:18px}
.tiles article{background:var(--cloud);border-top:0;padding:var(--card-pad);border-radius:var(--radius)}
.when{font-family:var(--display);font-size:15px;color:var(--accento);font-weight:600;display:block}

/* ---------------------------------------------------------------------
   Foto: mosaici, strisce, gallerie
   --------------------------------------------------------------------- */
.mosaic{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap-media)}
.mosaic img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-sm)}
.mosaic .m1{grid-column:span 7;aspect-ratio:3/2}
.mosaic .m2{grid-column:span 5;aspect-ratio:auto}
.mosaic .m3,.mosaic .m4,.mosaic .m5{grid-column:span 4;aspect-ratio:4/5}
@media (max-width:760px){.mosaic .m1,.mosaic .m2{grid-column:span 12;aspect-ratio:3/2}.mosaic .m3,.mosaic .m4,.mosaic .m5{grid-column:span 6}.mosaic .m5{display:none}}
.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-media)}
.strip img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-sm)}
@media (max-width:700px){.strip{grid-template-columns:1fr 1fr}.strip img:last-child{display:none}}
.gal-h,.month h2{font-size:clamp(30px,3vw,46px);font-weight:400}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-media)}
.gallery button{padding:0;border:0;background:none;cursor:zoom-in;overflow:hidden;border-radius:var(--radius-sm);aspect-ratio:4/5}
.gallery img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;transition:transform .5s ease}
.gallery button:hover img{transform:scale(1.03)}
.gallery.work button{aspect-ratio:1/1}
.gallery.work img{object-position:50% 35%}
@media (prefers-reduced-motion:reduce){.gallery img{transition:none}}
@media (max-width:700px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery button:first-child{grid-column:span 2;aspect-ratio:5/4}}
.gal-credit{font-size:14px;opacity:.7}

.lightbox{position:fixed;inset:0;z-index:50;background:rgba(37,36,44,.94);display:none;align-items:center;justify-content:center;padding:var(--space-5)}
.lightbox.open{display:flex}
.lb-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:var(--space-3)}
.lb-fig img{max-height:86vh;max-width:92vw;border-radius:var(--radius-sm)}
.lb-fig figcaption{color:var(--cloud);font-size:14px;opacity:.8;min-height:1.2em}
.lightbox .close{position:absolute;top:var(--space-4);right:var(--space-5);font:600 17px var(--display);background:var(--cloud);color:var(--ink);border:0;border-radius:999px;padding:var(--space-3) var(--space-4);cursor:pointer}
.lightbox .nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(247,247,245,.18);color:#fff;border:0;border-radius:999px;width:52px;height:52px;font-size:24px;cursor:pointer}
.lightbox .prev{left:var(--space-4)}.lightbox .next{right:var(--space-4)}

/* ---------------------------------------------------------------------
   Video
   --------------------------------------------------------------------- */
.videos{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter);align-items:start}
@media (max-width:860px){.videos{grid-template-columns:1fr}}
.video-card{display:flex;flex-direction:column;gap:var(--gap-xs);text-decoration:none}
.video-card .vthumb{margin-bottom:var(--space-2)}
.video-card strong{font-family:var(--display);font-weight:550;font-size:19px}
.video-card span:not(.vthumb):not(.play):not(.yt-fallback){font-size:15px;color:var(--accento);font-weight:600}
.vthumb{position:relative;display:block;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:16/9;background:var(--ink)}
.vthumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.video-card:hover .vthumb img{transform:scale(1.03)}
.vthumb.yt{background:var(--polvere)}
.yt-fallback{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-size:clamp(28px,3vw,44px);font-weight:300;color:var(--ink);letter-spacing:-.01em}
.play{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;background:rgba(247,247,245,.92);color:var(--accento);display:grid;place-items:center;font-size:22px;padding-left:var(--space-1)}

/* ---------------------------------------------------------------------
   In scena (curriculum)
   --------------------------------------------------------------------- */
.cv{display:grid;grid-template-columns:3fr 9fr;gap:var(--gutter-lg);padding-block:var(--block-lg);border-top:1.5px solid var(--haze)}
.cv:first-child{border-top:0;padding-top:0}
.cv:last-child{padding-bottom:0}
.cv > h2{font-size:clamp(32px,3.4vw,52px);font-weight:400;position:sticky;top:calc(var(--header-h) + var(--space-6));align-self:start}
@media (max-width:820px){.cv{grid-template-columns:1fr;gap:var(--block-sm)}.cv > h2{position:static}}
.timeline,.plain{list-style:none;margin:0;padding:0}
.timeline li{display:grid;grid-template-columns:7.5ch 1fr;gap:var(--gap-lg);padding-block:var(--gap-md);border-bottom:1px solid rgba(37,36,44,.12)}
.timeline li:first-child,.plain li:first-child{padding-top:0}
.timeline .yr{font-family:var(--display);font-weight:600;color:var(--accento);font-size:17px;padding-top:var(--space-1)}
.timeline li > span + span{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gap-xs)}
.timeline .t{font-family:var(--display);font-weight:550;font-size:clamp(20px,1.5vw,24px);line-height:1.2;display:block}
.timeline .m{font-size:16.5px;opacity:.82;display:block;line-height:1.5}
.timeline .award{display:inline-block;font-size:15px;font-weight:600;color:var(--accento)}
.plain li{display:flex;flex-direction:column;gap:var(--gap-xs);padding-block:var(--gap-md);border-bottom:1px solid rgba(37,36,44,.12)}
.plain strong{font-family:var(--display);font-weight:550;font-size:clamp(19px,1.4vw,23px);display:block;line-height:1.25}
.plain span{font-size:16.5px;opacity:.82}
.chips{display:flex;flex-wrap:wrap;gap:var(--gap-sm);list-style:none;margin:0;padding:0}
.chips li{background:var(--polvere);border-radius:999px;padding:var(--space-2) var(--space-4);font-size:17px}

/* ---------------------------------------------------------------------
   Calendario
   --------------------------------------------------------------------- */
.filters{display:flex;flex-wrap:wrap;gap:var(--gap-sm)}
.filters button{font:600 16px var(--display);padding:var(--space-2) var(--space-4);border-radius:999px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--accento);border-color:var(--accento);color:#fff}
.month{display:flex;flex-direction:column;gap:var(--block-sm)}
.month h2{text-transform:capitalize}
.events{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.events li{display:grid;grid-template-columns:96px 1fr auto;gap:var(--gutter);align-items:center;padding-block:var(--gap-lg);border-bottom:1px solid var(--haze)}
.events li > div:nth-child(2){display:flex;flex-direction:column;align-items:flex-start;gap:var(--gap-xs)}
.ev-date{font-family:var(--display);line-height:1}
.ev-date .d{display:block;font-size:34px;font-weight:400;letter-spacing:-.02em}
.ev-date .w{display:block;font-size:14px;font-weight:600;color:var(--accento);margin-top:var(--gap-xs)}
.ev-title{font-family:var(--display);font-weight:550;font-size:clamp(20px,1.6vw,26px);line-height:1.15}
.ev-sub{font-size:16px;opacity:.8}
.ev-place{font-size:17px}
.ev-place strong{font-weight:700}
.ev-time{display:inline-block;font-family:var(--display);font-weight:600;font-size:15px;background:var(--perla);border-radius:999px;padding:var(--space-1) var(--space-3)}
.chip{display:inline-block;font:600 13px var(--display);padding:var(--space-1) var(--space-3);border-radius:999px;background:var(--cipria);color:var(--ink);margin-right:var(--space-2);vertical-align:middle}
.chip.school{background:var(--polvere)}
.chip.lab{background:var(--salvia)}
.chip.visit{background:var(--perla)}
.ev-link{font-family:var(--display);font-weight:600;font-size:15px;white-space:nowrap;color:var(--accento);text-decoration:underline;text-underline-offset:4px}
@media (max-width:700px){.events li{grid-template-columns:70px 1fr}.ev-link{grid-column:2}}
.empty{font-size:20px;opacity:.8}
a.ev-date{text-decoration:none;color:inherit}
a.ev-go{text-decoration:none;color:inherit;border-bottom:1.5px solid transparent;transition:border-color .2s}
a.ev-go:hover{border-bottom-color:var(--accento)}
.events li[id]{scroll-margin-top:calc(var(--header-h) + var(--space-7))}
.events li.flash{animation:flash 2.6s ease-out}
@keyframes flash{0%,35%{background:var(--salvia);box-shadow:0 0 0 var(--space-3) var(--salvia)}100%{background:transparent;box-shadow:0 0 0 var(--space-3) transparent}}
@media (prefers-reduced-motion:reduce){.events li.flash{animation:none;background:var(--salvia)}}

/* ---------------------------------------------------------------------
   Dicono di me (cartoline in stile Google)
   --------------------------------------------------------------------- */
.rev-summary{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-sm) var(--gap-lg)}
.rev-score{font-family:var(--display);font-size:56px;font-weight:300;line-height:1;letter-spacing:-.01em}
.rev-stars{color:#E3A008;font-size:24px;letter-spacing:2px}
.rev-count{font-size:17px;opacity:.8}
.reviews{columns:3 300px;column-gap:var(--gap-lg)}
.review{break-inside:avoid;margin:0 0 var(--gap-lg);background:#fff;border:1px solid #E3E5E8;border-radius:var(--radius);padding:var(--gap-lg);box-shadow:0 1px 2px rgba(43,47,53,.05);font-family:Roboto,Arial,var(--body);display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3)}
.review header{display:flex;align-items:center;gap:var(--space-3)}
.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:600;font-size:18px;color:#fff;flex:none}
.review .who{font-weight:600;font-size:15.5px;line-height:1.2}
.review .src{font-size:13px;color:#5f6368;display:flex;align-items:center;gap:var(--space-1)}
.review .g{font-weight:700;font-size:13px;background:linear-gradient(90deg,#4285F4 0 25%,#EA4335 25% 50%,#FBBC05 50% 75%,#34A853 75%);-webkit-background-clip:text;background-clip:text;color:transparent}
.review .stars{color:#E3A008;font-size:17px;letter-spacing:1px}
.review .when{font-size:13px;color:#5f6368;margin-left:var(--space-2);display:inline}
.review p{font-size:16px;line-height:1.55;color:#202124;white-space:pre-line}
.review .more{font-size:14px;font-weight:600;color:var(--accento)}
.reviews-cta{display:flex;flex-wrap:wrap;gap:var(--gap-md) var(--space-7);align-items:center;justify-content:space-between;background:var(--salvia);border-radius:var(--radius-lg);padding:var(--card-pad)}
.reviews-cta p{font-size:clamp(19px,1.3vw + 8px,23px);max-width:40ch}

/* ---------------------------------------------------------------------
   Contatti e modulo
   --------------------------------------------------------------------- */
.contact-grid{display:grid;grid-template-columns:5fr 7fr;gap:var(--gutter-lg);align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
.direct{display:grid;gap:var(--gap-lg)}
.direct > div{display:flex;flex-wrap:wrap;align-items:center;column-gap:var(--space-3);row-gap:var(--gap-xs)}
.direct .lbl{flex-basis:100%;font-family:var(--display);font-weight:600;font-size:15px;color:var(--accento)}
.direct .val{font-size:clamp(20px,1.6vw,26px);font-weight:500;word-break:break-word}
.copy{font:600 14px var(--display);background:none;border:1.5px solid var(--ink);border-radius:999px;padding:var(--space-1) var(--space-3);cursor:pointer;color:var(--ink)}
form{display:grid;gap:var(--gap-lg);background:var(--polvere);padding:var(--card-pad);border-radius:var(--radius-lg)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg)}
@media (max-width:600px){.row2{grid-template-columns:1fr}}
label{font-family:var(--display);font-weight:600;font-size:15px;display:block;margin-bottom:var(--space-2)}
input,textarea{width:100%;font:inherit;font-size:18px;color:var(--ink);background:#fff;border:1.5px solid var(--haze);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4)}
textarea{min-height:160px;resize:vertical}
input:focus,textarea:focus{outline:3px solid var(--accento);outline-offset:1px;border-color:var(--accento)}
.topics{display:flex;flex-wrap:wrap;gap:var(--gap-sm);border:0;margin:0;padding:0}
.topics legend{font-family:var(--display);font-weight:600;font-size:15px;margin-bottom:var(--space-2);padding:0}
.topics input{position:absolute;opacity:0;width:1px;height:1px}
.topics label{font-family:var(--body);font-weight:500;font-size:17px;margin:0;padding:var(--space-2) var(--space-4);border:1.5px solid var(--ink);border-radius:999px;cursor:pointer;background:#fff}
.topics input:checked + label{background:var(--accento);border-color:var(--accento);color:#fff}
.topics input:focus-visible + label{outline:3px solid var(--accento);outline-offset:2px}
.form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-md)}
.form-note{font-size:15px;opacity:.75}
.form-privacy a{color:inherit}
.form-msg{font-size:17px;color:var(--accento);font-weight:600;min-height:1.4em}
.form-msg.ok{display:flex;align-items:center;gap:var(--space-3);font-size:18px}
.ok-check{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#2E9E5B;color:#fff;animation:pop .35s ease-out}
@keyframes pop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){.ok-check{animation:none}}
.req{color:var(--accento)}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.human input{max-width:140px}
#checkQ{font-weight:700;white-space:nowrap}

/* ---------------------------------------------------------------------
   Fascia finale e piè di pagina
   --------------------------------------------------------------------- */
.closing-band{background:var(--cipria)}
.closing{display:flex;flex-wrap:wrap;gap:var(--gap-lg) var(--space-7);align-items:end;justify-content:space-between}
.closing h2{font-size:clamp(44px,6.4vw,96px);max-width:12ch;font-weight:300}

footer.site{background:var(--ink);color:var(--cloud)}
footer.site .wrap{padding-block:var(--block);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--gap-lg) var(--space-7);font-size:15px}
.foot-col{display:flex;flex-direction:column;gap:var(--space-2)}
.foot-col .foot-name{margin-bottom:var(--space-1)}
.foot-col p{max-width:none}
footer.site nav{display:flex;flex-wrap:wrap;align-content:flex-start;gap:var(--space-2) var(--space-5);font-family:var(--display)}
footer.site a{text-decoration:none;opacity:.85}
footer.site a:hover{opacity:1;text-decoration:underline}
.foot-name{font-family:var(--display);font-size:26px;font-weight:400}
.foot-sub{opacity:.75}
footer.site .credit{opacity:.6;font-size:13px}

/* ---------------------------------------------------------------------
   Informativa privacy
   --------------------------------------------------------------------- */
html[lang="it"] [data-lang-block="en"], html[lang="en"] [data-lang-block="it"]{display:none}
.legal{max-width:76ch;font-size:16.5px;line-height:1.65}
.legal h2{font-size:clamp(21px,2vw,26px);font-weight:400;letter-spacing:0}
.legal ul{padding-left:var(--space-5)}
.legal li + li{margin-top:var(--space-2)}
.legal a{color:var(--accento)}
.legal-meta{font-size:14.5px;opacity:.8;border-left:3px solid var(--salvia);padding-left:var(--space-4)}
.legal-table{width:100%;border-collapse:collapse;font-size:15px}
.legal-table th,.legal-table td{text-align:left;vertical-align:top;padding:var(--space-3);border-bottom:1px solid rgba(37,36,44,.12)}
.legal-table th{font-weight:600;background:var(--polvere)}
.legal code{font-size:.92em;background:var(--perla);padding:0 var(--space-2);border-radius:4px}
@media (max-width:640px){.legal-table th,.legal-table td{padding:var(--space-2);font-size:14px}}
/* lo spazio del messaggio di esito compare solo quando c'è un messaggio */
.form-msg:empty{min-height:0;margin-top:calc(var(--gap-lg) * -1)}