@font-face{font-family:"Outfit";src:url("assets/font/Outfit.woff2") format("woff2");
  font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --arancio:#E8901E; --arancio-s:#B96F12; --arancio-c:#F7C77E;
  --marrone:#3B2A22; --marrone-c:#5C4436; --inchiostro:#2A1F19;
  --verde:#6FA83C; --verde-s:#517F2A; --giallo:#F2C14E; --rosso:#DD5240; --blu:#4A90D9;
  --crema:#FFF8EC; --panna:rgba(255,255,255,.86); --linea:rgba(59,42,34,.14);
  --ombra-s:0 4px 14px rgba(59,42,34,.10);
  --ombra:0 14px 38px rgba(59,42,34,.16);
  --ombra-g:0 26px 64px rgba(59,42,34,.22);
  --r-s:14px; --r:20px; --r-g:28px; --r-xl:38px;
  --sel:rgba(232,144,30,.26);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{color:var(--inchiostro);font-family:"Outfit",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip;min-height:100vh;
  background:linear-gradient(180deg,#FBD9B4,#F6C89A);transition:background 1.1s linear}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--sel)}
:focus-visible{outline:3px solid var(--marrone);outline-offset:3px;border-radius:8px}
/* scorciatoia per chi naviga da tastiera: compare solo quando la si raggiunge */
.salta{position:absolute;left:-9999px;top:12px;z-index:200;background:var(--marrone);color:#fff;
  padding:12px 20px;border-radius:999px;text-decoration:none;font-weight:700}
.salta:focus{left:16px}
h1,h2,h3,h4{line-height:1.08;letter-spacing:-.03em;font-weight:700}
.wrap{width:min(1180px,100% - 44px);margin-inline:auto;position:relative;z-index:6}
.stretto{width:min(760px,100% - 44px)}
@media(max-width:600px){.wrap,.stretto{width:min(100% - 32px,100%)}}

/* ══════════ CIELO ══════════ */
.cielo{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
/* Il sole attraversa solo la metà libera dello schermo: i testi delle
   testate stanno a sinistra e il suo alone ne abbassava la leggibilità. */
.sole{--orizzonte:62;--salita:46;--parte:52;--corsa:38;--tramonta:1;--luce:.62;
  position:absolute;left:50%;width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle at 38% 34%,#FFF9E4,#FFD166 50%,#F5A93C);
  box-shadow:0 0 100px 40px rgba(255,200,90,.34);transform:translateX(-50%);
  opacity:calc(var(--tramonta) * var(--luce));
  transition:top .4s linear,left .4s linear,opacity .9s,background .9s}
/* su schermi stretti il sole resta alto nel cielo: se scende finisce
   sopra il titolo e i pulsanti, e in più dà fastidio alla lettura. */
@media(max-width:820px){.sole{--orizzonte:46;--salita:34;--parte:12;--corsa:74;--luce:.34;
  width:74px;height:74px;box-shadow:0 0 56px 20px rgba(255,200,90,.2)}}
.colline{position:fixed;left:0;right:0;bottom:0;height:220px;z-index:1;pointer-events:none;opacity:.42}
.foglia{position:fixed;top:-8%;z-index:2;pointer-events:none;opacity:.48;animation:cade linear infinite}
@keyframes cade{0%{transform:translateY(-10vh) rotate(0) translateX(0)}
  100%{transform:translateY(114vh) rotate(400deg) translateX(70px)}}
.lucciola{position:fixed;width:6px;height:6px;border-radius:50%;background:#FFE9A3;z-index:3;
  box-shadow:0 0 12px 4px rgba(255,225,140,.6);opacity:0;pointer-events:none;
  animation:brilla 4.6s ease-in-out infinite;animation-play-state:paused}
@keyframes brilla{0%,100%{opacity:0;transform:translateY(0)}50%{opacity:.9;transform:translateY(-26px)}}

/* ══════════ BARRA ══════════ */
.avanza{position:fixed;left:0;top:0;height:3px;width:100%;transform:scaleX(0);transform-origin:0 50%;
  z-index:95;background:var(--arancio);pointer-events:none;will-change:transform}
.topbar{position:fixed;top:0;left:0;right:0;z-index:80;backdrop-filter:blur(18px) saturate(1.4);
  background:rgba(255,255,255,.5);border-bottom:1px solid rgba(59,42,34,.09);
  transition:background .3s,box-shadow .3s}
.topbar.giu{background:rgba(255,255,255,.82);box-shadow:0 6px 24px rgba(59,42,34,.1)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;
  width:min(1180px,100% - 44px);margin-inline:auto;padding:11px 0}
.marchio{display:flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0}
.marchio img{height:44px;width:auto}
.marchio b{font-size:18px;font-weight:700;letter-spacing:-.02em}
.voci{display:flex;gap:4px;list-style:none}
.voci a{display:block;text-decoration:none;font-weight:600;font-size:15px;padding:9px 16px;
  border-radius:999px;color:var(--marrone);opacity:.8;transition:opacity .2s,background .2s,color .2s}
.voci a:hover{opacity:1;background:rgba(255,255,255,.7)}
.voci a[aria-current]{background:var(--marrone);color:#fff;opacity:1}
.ora{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--marrone);
  opacity:.55;font-weight:700;min-width:88px;text-align:right}
.hamb{display:none;background:rgba(255,255,255,.75);border:0;width:44px;height:44px;
  border-radius:14px;cursor:pointer;place-items:center;color:var(--marrone)}
.hamb svg{width:22px;height:22px}
@media(max-width:1000px){
  .hamb{display:grid}.ora{display:none}
  .voci{position:fixed;inset:66px 14px auto 14px;flex-direction:column;gap:4px;z-index:90;
    background:#fff;border-radius:var(--r-g);padding:12px;display:none;box-shadow:var(--ombra-g)}
  .voci.aperto{display:flex}
  .voci a{font-size:16.5px;padding:14px 16px}
}

/* ══════════ TIPI DI SEZIONE ══════════ */
/* ognuno ha un trattamento diverso: non sono tutte "card bianche" */

/* 1 · fascia trasparente sul cielo */
.s-cielo{padding:78px 0;position:relative;z-index:6}

/* 2 · foglio bianco pieno */
.s-foglio{background:#fff;padding:82px 0;position:relative;z-index:6;
  border-radius:var(--r-xl);width:min(1240px,100% - 32px);margin:0 auto;box-shadow:var(--ombra)}

/* 3 · fascia crema a tutta larghezza */
.s-crema{background:var(--crema);padding:82px 0;position:relative;z-index:6}

/* 4 · fascia scura */
.s-scura{background:var(--marrone);color:#FFF3E2;padding:88px 0;position:relative;z-index:6}
.s-scura h2,.s-scura h3{color:#fff}
.s-scura .occhio{color:var(--arancio-c)}

/* 5 · fascia colorata */
.s-arancio{background:linear-gradient(160deg,#F0A03A,#D9791A);color:#fff;padding:88px 0;position:relative;z-index:6}
.s-arancio h2,.s-arancio h3{color:#fff}
.s-arancio .occhio{color:rgba(255,255,255,.85)}

/* 6 · fotografia a tutta pagina */
.s-foto{position:relative;min-height:62vh;display:grid;place-items:center;text-align:center;
  overflow:hidden;z-index:6;padding:96px 0}
.s-foto>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.s-foto::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(42,31,25,.66),rgba(42,31,25,.82))}
.s-foto .wrap{z-index:3;color:#fff}
.s-foto h2{color:#fff;margin-inline:auto}
.s-foto p{color:rgba(255,255,255,.9)}

/* intestazioni di sezione */
.occhio{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;
  letter-spacing:.18em;text-transform:uppercase;color:var(--arancio-s);margin-bottom:14px}
.occhio::before{content:"";width:22px;height:2px;background:currentColor;border-radius:2px}
h2{font-size:clamp(30px,4.6vw,50px);max-width:18ch;text-wrap:balance}
h1{text-wrap:balance}
h2.centro{margin-inline:auto;text-align:center}
h3,.scheda h2{font-size:21px}
.guida{font-size:19px;color:rgba(42,31,25,.74);max-width:56ch;margin-top:14px;text-wrap:pretty}
/* le scorciatoie della pagina di errore: link veri, presi bene anche col dito */
.scorciatoie{list-style:none;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:32px 0 30px}
.scorciatoie a{display:block;padding:12px 20px;border-radius:999px;text-decoration:none;
  font-weight:700;font-size:16px;color:var(--marrone);background:rgba(255,255,255,.6);
  border:1px solid rgba(59,42,34,.1);transition:background .2s,transform .2s}
.scorciatoie a:hover{background:#fff;transform:translateY(-2px)}
.s-scura .guida,.s-arancio .guida{color:rgba(255,255,255,.82)}
.intest{margin-bottom:44px}
.intest.centro{text-align:center}
.intest.centro .occhio{justify-content:center}
.intest.centro .guida{margin-inline:auto}

/* ══════════ COPERTINA ══════════ */
.cop{min-height:100vh;display:grid;align-content:center;padding:130px 0 90px;position:relative;z-index:6}
.cop-griglia{display:grid;gap:44px;align-items:center}
@media(min-width:960px){.cop-griglia{grid-template-columns:1.05fr .95fr;gap:56px}}
.cop img.marchio-g{height:104px;width:auto;margin-bottom:26px;filter:drop-shadow(0 14px 30px rgba(59,42,34,.24))}
.cop h1{font-size:clamp(40px,6.6vw,76px);letter-spacing:-.04em}
.cop .sotto{font-size:clamp(18px,2.2vw,23px);margin-top:16px;color:rgba(42,31,25,.76);font-weight:500}
.pastiglie{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.pastiglia{background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.9);
  padding:8px 16px;border-radius:999px;font-size:14.5px;font-weight:600;box-shadow:var(--ombra-s)}
.cop-azioni{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.cop-foto{position:relative}
.cop-foto img{width:100%;aspect-ratio:4/3.4;object-fit:cover;border-radius:var(--r-xl);
  box-shadow:var(--ombra-g)}
.cop-foto .etich{position:absolute;left:-14px;bottom:26px;background:#fff;border-radius:var(--r);
  padding:14px 18px;box-shadow:var(--ombra);display:flex;align-items:center;gap:12px;max-width:80%}
.cop-foto .etich b{font-size:15px;display:block;line-height:1.25}
.cop-foto .etich span{font-size:13.5px;color:rgba(42,31,25,.66)}
.cop-foto .etich .tondo{width:38px;height:38px;border-radius:50%;background:var(--verde);
  display:grid;place-items:center;color:#fff;flex-shrink:0}
.cop-foto .etich .tondo svg{width:20px;height:20px}
@media(max-width:600px){.cop-foto .etich{left:8px;right:8px;max-width:none}}

/* testata delle pagine interne */
.testata{padding:132px 0 20px;position:relative;z-index:6}
.testata h1{font-size:clamp(34px,5.4vw,60px);letter-spacing:-.035em;max-width:16ch}
.testata .sotto{font-size:clamp(17px,2vw,21px);color:rgba(42,31,25,.74);margin-top:14px;max-width:54ch}
.briciole{display:flex;gap:8px;align-items:center;font-size:13.5px;color:rgba(42,31,25,.6);
  margin-bottom:18px;font-weight:600}
.briciole a{text-decoration:none}
/* col dito servono almeno 44px: da riga di testo diventano bersagli veri */
@media(max-width:760px){.briciole a{display:inline-block;padding:11px 2px;margin:-11px 0}
  /* anche i collegamenti dentro al testo vanno presi col dito */
  p a:not(.bottone){padding-block:10px;margin-block:-10px;display:inline-block}}
.briciole a:hover{color:var(--arancio-s)}
.testata-foto{margin-top:38px;border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--ombra-g)}
.testata-foto img{width:100%;height:clamp(200px,30vw,380px);object-fit:cover}

/* ══════════ TRE FRASI (non un paragrafo) ══════════ */
.frasi{display:grid;gap:2px;background:var(--linea);border-radius:var(--r-g);overflow:hidden;
  border:1px solid var(--linea)}
@media(min-width:820px){.frasi{grid-template-columns:repeat(3,1fr)}}
.frase{background:#fff;padding:32px 28px}
.frase b{display:block;font-size:15px;font-weight:800;color:var(--arancio-s);
  text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px}
.frase p{font-size:17.5px;line-height:1.55}

/* ══════════ NUMERI ══════════ */
.numeri{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.numero{background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.9);border-radius:var(--r-g);
  padding:28px 22px;text-align:center;box-shadow:var(--ombra-s)}
.numero b{display:block;font-size:clamp(34px,4.6vw,46px);font-weight:800;letter-spacing:-.05em;
  color:var(--arancio-s);line-height:1}
.numero i{display:block;font-style:normal;font-weight:700;font-size:15px;margin:6px 0 4px}
.numero span{font-size:13.5px;color:rgba(42,31,25,.64);line-height:1.4;display:block}

/* ══════════ CARTE PROGETTO ══════════ */
.progetti{display:grid;gap:26px}
@media(min-width:900px){.progetti{grid-template-columns:1fr 1fr}}
.progetto{position:relative;border-radius:var(--r-xl);overflow:hidden;background:#fff;
  box-shadow:var(--ombra);text-decoration:none;display:flex;flex-direction:column;
  transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s}
.progetto:hover{transform:translateY(-6px);box-shadow:var(--ombra-g)}
.progetto .ph{position:relative;aspect-ratio:16/10;overflow:hidden}
.progetto .ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.progetto:hover .ph img{transform:scale(1.06)}
.progetto .ph::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 34%,rgba(42,31,25,.34) 58%,rgba(30,21,16,.82))}
.progetto .marca{position:absolute;left:20px;top:20px;z-index:3;background:#fff;border-radius:14px;
  padding:8px;box-shadow:var(--ombra-s)}
.progetto .marca img{width:44px;height:44px;object-fit:contain;border-radius:8px}
.progetto .tag{position:absolute;right:20px;top:20px;z-index:3;color:#fff;font-weight:800;font-size:12.5px;
  letter-spacing:.08em;text-transform:uppercase;padding:7px 14px;border-radius:999px}
.progetto.verde .tag{background:var(--verde-s)}
.progetto.arancio .tag{background:var(--arancio-s)}
.progetto .sopra{position:absolute;left:22px;right:22px;bottom:18px;z-index:3;color:#fff;
  text-shadow:0 1px 14px rgba(20,13,9,.5)}
.progetto .sopra :is(h2,h3){font-size:clamp(24px,3vw,32px);color:#fff}
.progetto .sopra span{font-size:15px;opacity:.94}
.progetto .corpo{padding:26px;display:flex;flex-direction:column;flex:1;gap:14px}
.progetto .corpo>p{font-size:17px;color:rgba(42,31,25,.78)}
@media(min-width:820px){.progetto .corpo>p{min-height:calc(2 * 1.55em)}}
.punti{list-style:none;display:grid;gap:9px}
.punti li{display:grid;grid-template-columns:20px 1fr;gap:11px;align-items:start;font-size:15.5px}
.punti li::before{content:"";width:8px;height:8px;border-radius:50%;margin-top:7px;background:var(--arancio)}
.s-arancio .punti li::before{background:#fff}
.progetto.verde .punti li::before{background:var(--verde)}
.progetto.arancio .punti li::before{background:var(--arancio)}
.progetto .vai{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:800;
  color:var(--arancio-s);font-size:15.5px}
.progetto .vai svg{width:17px;height:17px;transition:transform .25s}
.progetto:hover .vai svg{transform:translateX(5px)}

/* ══════════ PRINCIPI a scacchiera ══════════ */
.principi{display:grid;gap:18px}
@media(min-width:760px){.principi{grid-template-columns:repeat(6,1fr)}}
.principio{background:#fff;border-radius:var(--r-g);padding:30px 26px;box-shadow:var(--ombra-s);
  transition:transform .28s,box-shadow .28s;position:relative;overflow:hidden}
.principio:hover{transform:translateY(-5px);box-shadow:var(--ombra)}
@media(min-width:760px){
  .principio:nth-child(1),.principio:nth-child(2){grid-column:span 3}
  .principio:nth-child(3),.principio:nth-child(4),.principio:nth-child(5){grid-column:span 2}
}
.principio .tondo{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;margin-bottom:16px}
.principio:nth-child(1) .tondo{background:#EAF3E0;color:var(--verde-s)}
.principio:nth-child(2) .tondo{background:#FDF0DA;color:var(--arancio-s)}
.principio:nth-child(3) .tondo{background:#E6F0FA;color:#2C6CAE}
.principio:nth-child(4) .tondo{background:#FBE6E2;color:#B4442F}
.principio:nth-child(5) .tondo{background:#F5EDE0;color:var(--marrone-c)}
.principio .tondo svg{width:26px;height:26px}
.principio :is(h2,h3){font-size:22px;margin-bottom:7px}
.principio p{font-size:16px;color:rgba(42,31,25,.72);line-height:1.5}

/* ══════════ CITAZIONE ══════════ */
.citazione{text-align:center;max-width:min(700px,90%);margin-inline:auto}
.citazione p{font-size:clamp(28px,4.6vw,48px);line-height:1.14;font-weight:700;letter-spacing:-.03em;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.citazione>span{display:block;margin-top:22px;font-size:14px;letter-spacing:.12em;text-transform:uppercase;
  opacity:.7;font-weight:700;max-width:none}
.virgolette{width:52px;height:52px;margin:0 auto 22px;opacity:.5}

/* ══════════ SPLIT foto/testo ══════════ */
.split{display:grid;gap:36px;align-items:center}
@media(min-width:900px){.split{grid-template-columns:1fr 1fr;gap:56px}
  .split.inverso .split-foto{order:2}}
.split-foto{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--ombra)}
.split-foto img{width:100%;aspect-ratio:4/3;object-fit:cover}
.split-testo :is(h2,h3){font-size:clamp(24px,3.2vw,34px);margin-bottom:12px}
.split-testo p{font-size:17.5px;color:rgba(42,31,25,.76)}

/* elenco a scacchiera per il metodo */
.metodo{display:grid;gap:20px}
@media(min-width:900px){.metodo{grid-template-columns:1fr 1fr}}
.passo{background:#fff;border-radius:var(--r-g);overflow:hidden;box-shadow:var(--ombra-s);
  display:grid;grid-template-columns:auto 1fr;align-items:stretch}
.passo .ph{width:120px;overflow:hidden}
.passo .ph img{width:100%;height:100%;object-fit:cover}
.passo .txt{padding:24px 26px}
.passo :is(h2,h3){font-size:20px;margin-bottom:6px}
.passo p{font-size:16px;color:rgba(42,31,25,.72);line-height:1.5}
@media(max-width:520px){.passo{grid-template-columns:1fr}.passo .ph{width:100%;height:150px}}

/* ══════════ TABELLA SETTIMANA ══════════ */
.settimana{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.giorno{background:#fff;border-radius:var(--r);padding:24px 18px;text-align:center;
  box-shadow:var(--ombra-s);border:2px solid transparent;transition:transform .25s,border-color .25s}
.giorno:hover{transform:translateY(-4px)}
.giorno b{display:block;font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(42,31,25,.5);margin-bottom:10px;font-weight:800}
.giorno .att{font-size:17.5px;font-weight:700}
.giorno .ora-l{margin-top:8px;font-size:14.5px;font-weight:700;color:var(--arancio-s)}
.giorno.speciale{background:var(--giallo);border-color:var(--arancio)}
.giorno.speciale b{color:rgba(59,42,34,.62)}
.giorno.speciale .ora-l{color:var(--marrone)}

/* ══════════ SCHEDE PER CHI ══════════ */
.schede{display:grid;gap:20px}
@media(min-width:860px){.schede{grid-template-columns:repeat(3,1fr)}}
.scheda{background:#fff;border-radius:var(--r-g);padding:32px 28px;box-shadow:var(--ombra-s);
  border-top:5px solid var(--arancio);transition:transform .28s,box-shadow .28s}
.scheda:nth-child(2){border-top-color:var(--verde)}
.scheda:nth-child(3){border-top-color:var(--blu)}
.scheda:hover{transform:translateY(-5px);box-shadow:var(--ombra)}
.scheda .tondo{width:52px;height:52px;border-radius:16px;background:#FBF3E6;display:grid;place-items:center;
  margin-bottom:16px;color:var(--arancio-s)}
.scheda .tondo svg{width:26px;height:26px}
.scheda .eta-g{font-size:24px;font-weight:800;letter-spacing:-.03em;display:block}
.scheda .ruolo{font-size:14px;font-weight:700;color:var(--arancio-s);text-transform:uppercase;
  letter-spacing:.1em;margin:4px 0 10px;display:block}
.scheda p{font-size:16px;color:rgba(42,31,25,.74);line-height:1.55}

/* ══════════ PERCORSO GIORNATA ══════════ */
.giornata{position:relative;display:grid;gap:0}
.giornata::before{content:"";position:absolute;left:27px;top:26px;bottom:26px;width:2px;
  background:repeating-linear-gradient(180deg,var(--arancio) 0 7px,transparent 7px 15px);opacity:.5}
.momento{display:grid;grid-template-columns:56px 1fr;gap:20px;padding:15px 0;align-items:start}
.momento .bolla{width:56px;height:56px;border-radius:50%;background:#fff;display:grid;place-items:center;
  box-shadow:var(--ombra-s);position:relative;z-index:2;color:var(--arancio-s)}
.momento .bolla svg{width:25px;height:25px}
.momento .txt{padding-top:8px}
.momento b{font-size:19px;display:block}
.momento span{font-size:16px;color:rgba(42,31,25,.7)}
.s-scura .momento .bolla{background:rgba(255,255,255,.12);color:var(--arancio-c)}
.s-scura .momento span{color:rgba(255,243,226,.72)}
.s-scura .giornata::before{opacity:.3}

/* ══════════ STAGIONI ══════════ */
.stagioni{display:grid;gap:18px}
@media(min-width:760px){.stagioni{grid-template-columns:repeat(4,1fr)}}
.stagione{background:#fff;border-radius:var(--r-g);padding:28px 24px;box-shadow:var(--ombra-s);
  transition:transform .28s}
.stagione:hover{transform:translateY(-5px)}
.stagione .ill{width:56px;height:56px;margin-bottom:14px}
.stagione b{display:block;font-size:21px;margin-bottom:12px}
.stagione ul{list-style:none;display:grid;gap:7px}
.stagione li{font-size:15.5px;color:rgba(42,31,25,.72);padding-left:16px;position:relative}
.stagione li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:2px;
  background:var(--arancio);border-radius:2px}

/* ══════════ REGOLE ══════════ */
.regole{display:grid;gap:14px}
@media(min-width:780px){.regole{grid-template-columns:repeat(2,1fr)}}
.regola{display:grid;grid-template-columns:46px 1fr;gap:16px;align-items:start;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r);padding:20px 22px}
.regola .tondo{width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.14);
  display:grid;place-items:center;color:var(--arancio-c)}
.regola .tondo svg{width:23px;height:23px}
.regola b{font-size:18px;display:block;color:#fff}
.regola span{font-size:15.5px;color:rgba(255,243,226,.74)}

/* ══════════ PERSONE ══════════ */
.persone{display:grid;gap:18px}
@media(min-width:700px){.persone{grid-template-columns:repeat(3,1fr)}}
.persona{background:#fff;border-radius:var(--r-g);padding:30px 26px;text-align:center;box-shadow:var(--ombra-s)}
.persona .sigla{width:64px;height:64px;border-radius:50%;margin:0 auto 15px;display:grid;place-items:center;
  font-size:21px;font-weight:800;color:#fff;background:var(--arancio)}
.persona:nth-child(2) .sigla{background:var(--verde)}
.persona:nth-child(3) .sigla{background:var(--blu)}
.persona b{display:block;font-size:19px}
.persona span{font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(42,31,25,.55)}

/* ══════════ ELENCO ICONE (scopi) ══════════ */
.scopi{display:grid;gap:16px}
@media(min-width:720px){.scopi{grid-template-columns:repeat(2,1fr)}}
/* sei colonne per poter centrare l'ultima riga quando resta spaiata:
   con 4 o 5 voci restava un buco vistoso sulla destra. */
@media(min-width:1000px){.scopi{grid-template-columns:repeat(6,minmax(0,1fr))}
  .scopi>*{grid-column:span 2}
  .scopi>:last-child:nth-child(3n+1){grid-column:3/span 2}
  .scopi:has(>:nth-child(5):last-child)>:nth-child(4){grid-column:2/span 2}}
.scopo{display:grid;grid-template-columns:46px 1fr;gap:15px;align-items:start;
  background:#fff;border-radius:var(--r);padding:20px 22px;box-shadow:var(--ombra-s)}
.scopo .tondo{width:46px;height:46px;border-radius:14px;background:#FBF3E6;display:grid;place-items:center;
  color:var(--arancio-s)}
.scopo .tondo svg{width:23px;height:23px}
.scopo b{font-size:17px;display:block}
.scopo span{font-size:15.5px;color:rgba(42,31,25,.7);line-height:1.45}

/* ══════════ GALLERIA ══════════ */
/* le gallerie hanno 8 o 12 foto: con le colonne automatiche restavano
   celle vuote in fondo. Quattro (o due) colonne chiudono sempre la griglia. */
.galleria{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(min-width:900px){.galleria{grid-template-columns:repeat(4,1fr);gap:16px}}
.galleria figure{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:1;position:relative;
  cursor:zoom-in;box-shadow:var(--ombra-s)}
.galleria img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.galleria figure:hover img{transform:scale(1.07)}
.galleria figure::before{content:"";position:absolute;inset:0;z-index:2;opacity:0;transition:opacity .3s;
  background:linear-gradient(180deg,transparent 40%,rgba(42,31,25,.4))}
.galleria figure:hover::before{opacity:1}
.lente{position:absolute;z-index:3;left:50%;top:50%;width:44px;height:44px;
  transform:translate(-50%,-50%) scale(.82);opacity:0;transition:opacity .3s,transform .3s;
  background:rgba(255,255,255,.95);border-radius:50%;display:grid;place-items:center;color:#2A1F19}
.galleria figure:hover .lente{opacity:1;transform:translate(-50%,-50%) scale(1)}
.lente svg{width:19px;height:19px}

/* ══════════ FISARMONICA ══════════ */
.pieghe{display:grid;gap:10px}
.piega{background:#fff;border-radius:var(--r);box-shadow:var(--ombra-s);overflow:hidden}
.piega summary{list-style:none;cursor:pointer;padding:20px 24px;font-weight:700;font-size:17.5px;
  display:flex;align-items:center;justify-content:space-between;gap:16px}
.piega summary::-webkit-details-marker{display:none}
.piega summary::after{content:"";width:11px;height:11px;border-right:2.4px solid var(--arancio-s);
  border-bottom:2.4px solid var(--arancio-s);transform:rotate(45deg) translateY(-2px);
  transition:transform .3s;flex-shrink:0}
.piega[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.piega .dentro{padding:0 24px 22px;font-size:16.5px;color:rgba(42,31,25,.76)}
.piega .dentro p+p{margin-top:10px}

/* ══════════ DOCUMENTI ══════════ */
.documenti{display:grid;gap:12px}
.documento{background:#fff;border-radius:var(--r);padding:22px 26px;box-shadow:var(--ombra-s);
  display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.documento .info{display:flex;align-items:center;gap:16px}
.documento .tondo{width:46px;height:46px;border-radius:14px;background:#FBF3E6;display:grid;
  place-items:center;color:var(--arancio-s);flex-shrink:0}
.documento b{display:block;font-size:18px}
.documento span{font-size:14px;color:rgba(42,31,25,.6)}

/* ══════════ CONTATTI ══════════ */
.contatti{display:grid;gap:18px}
@media(min-width:820px){.contatti{grid-template-columns:repeat(3,1fr)}}
.contatto{background:#fff;border-radius:var(--r-g);padding:32px 28px;box-shadow:var(--ombra-s);
  text-decoration:none;display:block;transition:transform .28s,box-shadow .28s}
.contatto:hover{transform:translateY(-5px);box-shadow:var(--ombra)}
.contatto .tondo{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;margin-bottom:16px}
.contatto:nth-child(1) .tondo{background:#E4F6E9;color:#1E8A4C}
.contatto:nth-child(2) .tondo{background:#FDF0DA;color:var(--arancio-s)}
.contatto:nth-child(3) .tondo{background:#E6F0FA;color:#2C6CAE}
.contatto .tondo svg{width:26px;height:26px}
.contatto b{display:block;font-size:14px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(42,31,25,.55);margin-bottom:6px}
.contatto .val{font-size:clamp(15.5px,4.2vw,19px);font-weight:700;letter-spacing:-.02em;display:block;
  margin-bottom:8px;overflow-wrap:anywhere;line-height:1.25}
.contatto p{font-size:15.5px;color:rgba(42,31,25,.7);line-height:1.5}

/* tabella dati */
.dati{background:#fff;border-radius:var(--r-g);overflow:hidden;box-shadow:var(--ombra-s)}
.dati div{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:17px 26px;border-bottom:1px solid var(--linea)}
.dati div:last-child{border-bottom:0}
.dati dt{font-size:14px;font-weight:700;color:rgba(42,31,25,.55);text-transform:uppercase;letter-spacing:.08em}
.dati dd{font-size:16.5px}
@media(max-width:600px){.dati div{grid-template-columns:1fr;gap:3px}}

/* pastiglie del luogo */
.chip-riga{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.chip{background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.9);border-radius:999px;
  padding:9px 18px;font-size:15px;font-weight:600;box-shadow:var(--ombra-s)}
.s-scura .chip{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#fff}

/* ispirazioni */
.ispirazioni{display:flex;flex-wrap:wrap;gap:10px}
.ispirazione{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);
  border-radius:999px;padding:11px 20px;font-size:15.5px}
.ispirazione b{font-weight:700;color:#fff}
.ispirazione span{color:rgba(255,243,226,.7)}

/* ══════════ PULSANTI ══════════ */
.bottone{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;
  font-size:16.5px;padding:15px 28px;border-radius:999px;transition:transform .2s,box-shadow .2s,background .2s;
  border:0;cursor:pointer;font-family:inherit}
.bottone svg{width:19px;height:19px}
.bottone:hover{transform:translateY(-2px)}
.bottone:active{transform:translateY(0) scale(.985)}
.b-scuro{background:var(--marrone);color:#fff;box-shadow:0 8px 22px rgba(59,42,34,.28)}
.b-scuro:hover{background:#2A1D17;box-shadow:0 14px 32px rgba(59,42,34,.34)}
.b-verde{background:#25D366;color:#fff;box-shadow:0 8px 22px rgba(37,211,102,.3)}
.b-verde:hover{background:#1FBA59}
.b-chiaro{background:rgba(255,255,255,.82);color:var(--inchiostro);box-shadow:var(--ombra-s)}
.b-chiaro:hover{background:#fff}
.b-bordo{background:transparent;border:2px solid currentColor;color:inherit}
.b-arancio{background:var(--arancio);color:#fff;box-shadow:0 8px 22px rgba(232,144,30,.32)}
.b-arancio:hover{background:var(--arancio-s)}
.s-scura .b-chiaro,.s-arancio .b-chiaro{background:#fff}

/* ══════════ RICHIAMO FINALE ══════════ */
.richiamo{background:#fff;border-radius:var(--r-xl);padding:clamp(38px,6vw,64px);text-align:center;
  box-shadow:var(--ombra-g);position:relative;overflow:hidden}
.richiamo::before{content:"";position:absolute;inset:auto -60px -90px auto;width:240px;height:240px;
  border-radius:50%;background:var(--giallo);opacity:.22}
.richiamo>*{position:relative;z-index:2}
.richiamo h2{margin-inline:auto;margin-bottom:12px}
.richiamo p{font-size:18.5px;color:rgba(42,31,25,.74);max-width:48ch;margin:0 auto 26px}
.richiamo .azioni{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ══════════ PIEDE ══════════ */
footer{background:#231812;color:rgba(255,243,226,.76);padding:70px 0 28px;position:relative;z-index:6;
  margin-top:70px}
.piede{display:grid;gap:36px}
@media(min-width:820px){.piede{grid-template-columns:1.45fr .8fr 1.35fr 1fr}}
footer :is(h2,h4){font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--arancio);
  margin-bottom:14px;font-weight:800}
footer a{color:rgba(255,243,226,.76);text-decoration:none;display:block;padding:4px 0;transition:color .2s}
@media(max-width:820px){footer a{padding:11px 0}}
footer a:hover{color:#fff}
footer .marchio-p{height:62px;margin-bottom:14px}
footer p{font-size:15.5px;line-height:1.6;overflow-wrap:anywhere}
footer a{overflow-wrap:anywhere}
footer a[href^="mailto:"]{font-size:15px;overflow-wrap:normal;word-break:normal}
footer b{color:#fff}
.piede-basso{margin-top:46px;padding-top:20px;border-top:1px solid rgba(255,243,226,.14);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:13.5px;opacity:.6}

/* ══════════ FLOTTANTE ══════════ */
.flotta{position:fixed;right:20px;bottom:20px;z-index:70;background:#25D366;width:58px;height:58px;
  border-radius:50%;display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.26);color:#fff;
  transition:transform .25s}
.flotta:hover{transform:scale(1.07)}
.flotta svg{width:28px;height:28px}

/* ══════════ LIGHTBOX ══════════ */
.lb{position:fixed;inset:0;z-index:200;display:none;place-items:center;padding:24px;
  background:rgba(20,14,10,.95);backdrop-filter:blur(10px)}
.lb.on{display:grid}
.lb img{max-width:min(1200px,94vw);max-height:86vh;border-radius:10px;box-shadow:0 40px 100px rgba(0,0,0,.6);
  animation:lbIn .35s cubic-bezier(.2,.7,.3,1)}
@keyframes lbIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
.lb button{position:absolute;background:rgba(255,255,255,.14);border:0;color:#fff;width:48px;height:48px;
  border-radius:50%;display:grid;place-items:center;cursor:pointer;transition:background .2s,transform .2s}
.lb button:hover{background:rgba(255,255,255,.26);transform:scale(1.08)}
.lb button svg{width:20px;height:20px}
.lb .x{top:22px;right:22px}.lb .p{left:22px;top:50%;margin-top:-24px}.lb .n{right:22px;top:50%;margin-top:-24px}
.lb .conta{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.75);
  font-size:14px;letter-spacing:.06em}
.lb .comandi{display:contents}
@media(max-width:760px){
  .lb{grid-template-rows:1fr auto;gap:16px;padding:64px 12px 22px;align-content:center}
  .lb img{max-height:70vh}
  .lb .comandi{display:flex;gap:22px;align-items:center;justify-content:center}
  .lb .p,.lb .n{position:static;margin:0;transform:none}
  .lb .p:hover,.lb .n:hover{transform:scale(1.08)}
  .lb .conta{position:static;transform:none;min-width:66px;text-align:center}
}

/* ══════════ COMPARSA ══════════ */
img:not([src$=".png"]){background-color:rgba(59,42,34,.05)}
.js .rv{opacity:0;transform:translateY(38px) scale(.975);
  transition:opacity .8s cubic-bezier(.2,.7,.3,1),transform .9s cubic-bezier(.16,.86,.3,1);
  transition-delay:calc(var(--i,0) * 95ms)}
.js .rv.dentro{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none;transition:none}
  .foglia,.lucciola,.avanza{display:none}
  body{transition:none}
  .progetto,.principio,.stagione,.contatto,.galleria img,.bottone{transition:none}
  .lb img{animation:none}
}
@media(max-width:700px){
  .s-cielo,.s-crema,.s-foglio,.s-scura,.s-arancio{padding:58px 0}
  .s-foglio{border-radius:var(--r-g)}
}

/* ═══════════════ EFFETTI ═══════════════ */

/* 1 · FOTO CHE SI APRONO — una tenda che sale, con lo zoom che rallenta */
.js .apre{clip-path:inset(100% 0 0 0);transition:clip-path 1.15s cubic-bezier(.16,.84,.3,1)}
.js .apre.viva{clip-path:inset(0 0 0 0)}
.js .apre img{transform:scale(1.22);transition:transform 1.9s cubic-bezier(.16,.84,.3,1)}
.js .apre.viva img{transform:scale(1)}

/* 2 · TITOLI PAROLA PER PAROLA — salgono dal basso, una dopo l'altra */
x-parola{display:inline-block;overflow:hidden;vertical-align:bottom}
x-parola>x-voce{display:inline-block;font-style:inherit;transform:translateY(102%) rotate(3deg);opacity:0;
  transition:transform .82s cubic-bezier(.2,.9,.25,1),opacity .5s ease;
  transition-delay:calc(var(--w,0) * 55ms)}
.viva x-parola>x-voce{transform:none;opacity:1}

/* 3 · NUMERI CHE CONTANO — con un lieve rimbalzo all'arrivo */
.numero b{font-variant-numeric:tabular-nums}
.numero.viva b{animation:balza .7s cubic-bezier(.2,1.5,.4,1) .35s both}
@keyframes balza{0%{transform:scale(.86)}60%{transform:scale(1.07)}100%{transform:scale(1)}}

/* 4 · IL PERCORSO SI DISEGNA — la linea cresce, le bolle si accendono */
.giornata::before{transform:scaleY(var(--cresce,0));transform-origin:top;
  transition:transform 1.5s cubic-bezier(.2,.75,.3,1)}
.js .momento .bolla{transform:scale(.4);opacity:0;
  transition:transform .7s cubic-bezier(.2,1.4,.4,1),opacity .5s ease;
  transition-delay:calc(var(--i,0) * 120ms + .18s)}
.js .momento.viva .bolla{transform:none;opacity:1}
.js .momento .txt{opacity:0;transform:translateX(-16px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.3,1);
  transition-delay:calc(var(--i,0) * 120ms + .3s)}
.js .momento.viva .txt{opacity:1;transform:none}

/* 5 · CARTE CHE SI INCLINANO sotto il puntatore */
@media(hover:hover) and (pointer:fine){
  .progetto{transform-style:preserve-3d;will-change:transform}
  .progetto .corpo,.progetto .sopra{transform:translateZ(28px)}
  .progetto .marca,.progetto .tag{transform:translateZ(46px)}
}

/* 6 · FRASE CHE SI ACCENDE mentre scorre */
.accende{background-image:linear-gradient(90deg,var(--arancio) 0 0);
  background-repeat:no-repeat;background-size:0% 38%;background-position:0 88%;
  transition:background-size 1.4s cubic-bezier(.2,.8,.3,1);padding:0 .12em;margin:0 -.12em;
  border-radius:4px}
.viva .accende{background-size:100% 38%}

/* 7 · NASTRO SCORREVOLE — le parole del progetto che passano */
.nastro{overflow:hidden;padding:26px 0;position:relative;z-index:6;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.nastro .pista{display:flex;gap:0;width:max-content;animation:scorre 46s linear infinite}
.nastro:hover .pista{animation-play-state:paused}
.nastro span{display:inline-flex;align-items:center;gap:24px;padding-right:24px;
  font-size:clamp(22px,3.6vw,40px);font-weight:700;letter-spacing:-.03em;color:var(--marrone);opacity:.42;
  white-space:nowrap}
.nastro span::after{content:"";width:11px;height:11px;border-radius:50%;background:var(--arancio);flex:0 0 auto}
@keyframes scorre{to{transform:translateX(-50%)}}

/* 8 · PARALLASSE sulle foto grandi */
.js [data-lento]{will-change:transform}

/* 9 · IL FOGLIO SI SOLLEVA entrando */
.js .s-foglio{transform:translateY(46px) scale(.97);opacity:0;
  transition:transform 1s cubic-bezier(.2,.8,.3,1),opacity .8s ease}
.js .s-foglio.viva{transform:none;opacity:1}

/* 10 · LE PASTIGLIE ARRIVANO A RAFFICA */
.js .pastiglia,.js .chip{opacity:0;transform:translateY(14px) scale(.9);
  transition:opacity .5s ease,transform .6s cubic-bezier(.2,1.4,.4,1);
  transition-delay:calc(var(--i,0) * 80ms)}
.js .viva .pastiglia,.js .viva .chip,.js .pastiglia.viva,.js .chip.viva{opacity:1;transform:none}

/* 11 · IL SOLE PULSA piano */
.sole{animation:respira 7s ease-in-out infinite}
@keyframes respira{0%,100%{filter:brightness(1)}50%{filter:brightness(1.14)}}

/* 12 · LE FOGLIE SEGUONO IL PUNTATORE */
.foglia{transition:transform .4s ease-out}

/* 13 · SOTTOLINEATURA CHE CORRE sui link del menu */
.voci a{position:relative}
@media(min-width:1001px){
  .voci a::after{content:"";position:absolute;left:16px;right:16px;bottom:4px;height:2px;
    background:var(--arancio);transform:scaleX(0);transform-origin:right;
    transition:transform .4s cubic-bezier(.2,.8,.3,1)}
  .voci a:hover::after{transform:scaleX(1);transform-origin:left}
  .voci a[aria-current]::after{display:none}
}

/* 14 · IL RICHIAMO FINALE RESPIRA */
.richiamo::before{transition:transform 1.4s cubic-bezier(.2,.8,.3,1);transform:scale(.4)}
.richiamo.viva::before{transform:scale(1)}

/* 15 · IMMAGINI DELLE CARTE che scorrono piano dentro la cornice */
.progetto .ph img,.split-foto img,.testata-foto img{will-change:transform}

/* 16 · L'OCCHIELLO SI ANNUNCIA — la lineetta cresce come una radice */
.js .intest .occhio{opacity:0;transform:translateX(-10px);
  transition:opacity .5s ease .1s,transform .6s cubic-bezier(.2,.8,.3,1) .1s}
.js .intest.dentro .occhio{opacity:1;transform:none}
.js .intest .occhio::before{width:0;transition:width .7s cubic-bezier(.16,.86,.3,1) .25s}
.js .intest.dentro .occhio::before{width:22px}

/* 17 · LE ICONE SBOCCIANO — il tondo si apre, il segno dentro arriva dopo */
.js .rv .tondo{transform:scale(.5) rotate(-14deg);opacity:0;
  transition:transform .72s cubic-bezier(.2,1.45,.4,1),opacity .4s ease;
  transition-delay:calc(var(--i,0) * 95ms + .1s)}
.js .rv.dentro .tondo,.js .rv.dentro.dentro .tondo{transform:none;opacity:1}
.js .rv .tondo svg{opacity:0;transform:scale(.7);
  transition:opacity .4s ease,transform .5s cubic-bezier(.2,1.5,.4,1);
  transition-delay:calc(var(--i,0) * 95ms + .34s)}
.js .rv.dentro .tondo svg{opacity:1;transform:none}

/* 18 · LE FOTO DELLA GALLERIA ENTRANO A CASCATA, non tutte insieme */
.js .galleria figure{transform:translateY(30px) scale(.94);opacity:0;
  transition:transform .8s cubic-bezier(.16,.86,.3,1),opacity .6s ease;
  transition-delay:calc(var(--i,0) * 85ms)}
.js .galleria figure.dentro{transform:none;opacity:1}

/* 19 · LE SEZIONI SI PRESENTANO da lati opposti, così si sente il passaggio */
.js .split-foto.rv{transform:translateX(-42px) translateY(0) scale(1)}
.js .split-testo.rv{transform:translateX(34px) translateY(0) scale(1)}
.js .inverso .split-foto.rv{transform:translateX(42px)}
.js .inverso .split-testo.rv{transform:translateX(-34px)}
.js .split-foto.rv,.js .split-testo.rv{transition:transform 1.05s cubic-bezier(.16,.86,.3,1),opacity .8s ease}
.js .split-foto.rv.dentro,.js .split-testo.rv.dentro,
.js .inverso .split-foto.rv.dentro,.js .inverso .split-testo.rv.dentro{transform:none}

/* 20 · IL TITOLO GRANDE HA UN'OMBRA CHE SI POSA */
.js .cop h1,.js .testata h1{text-shadow:0 18px 34px rgba(59,42,34,0);
  transition:text-shadow 1.4s ease .5s}
.js .cop h1.viva,.js .testata h1.viva{text-shadow:0 18px 34px rgba(59,42,34,.09)}

/* 21 · IL PULSANTE DI WHATSAPP CHIAMA — un solo battito quando compare */
.flotta{animation:battito 2.6s ease-in-out 1.4s 2}
@keyframes battito{0%,100%{box-shadow:0 10px 26px rgba(37,211,102,.34)}
  50%{box-shadow:0 10px 26px rgba(37,211,102,.34),0 0 0 16px rgba(37,211,102,0)}
  1%{box-shadow:0 10px 26px rgba(37,211,102,.34),0 0 0 0 rgba(37,211,102,.42)}}

.mostra-tutto .apre{clip-path:inset(0 0 0 0)!important}
.mostra-tutto .apre img{transform:none!important}
.mostra-tutto x-parola>x-voce{transform:none!important;opacity:1!important}
.mostra-tutto .s-foglio{transform:none!important;opacity:1!important}
.mostra-tutto .momento .bolla,.mostra-tutto .momento .txt{transform:none!important;opacity:1!important}
.mostra-tutto .pastiglia,.mostra-tutto .chip{opacity:1!important;transform:none!important}
.mostra-tutto .rv{opacity:1!important;transform:none!important}
.mostra-tutto .tondo,.mostra-tutto .tondo svg,.mostra-tutto .occhio,
.mostra-tutto .galleria figure,.mostra-tutto .split-foto,.mostra-tutto .split-testo{
  opacity:1!important;transform:none!important}
.mostra-tutto .intest .occhio::before{width:22px!important}

@media(prefers-reduced-motion:reduce){
  .js .apre{clip-path:none!important;transition:none}
  .js .apre img{transform:none!important;transition:none}
  x-parola>x-voce{transform:none!important;opacity:1!important;transition:none}
  .js .s-foglio{transform:none!important;opacity:1!important;transition:none}
  .js .momento .bolla,.js .momento .txt{transform:none!important;opacity:1!important;transition:none}
  .js .pastiglia,.js .chip{opacity:1!important;transform:none!important}
  .js .tondo,.js .tondo svg,.js .intest .occhio,.js .galleria figure{opacity:1!important;transform:none!important}
  .js .intest .occhio::before{width:22px!important;transition:none}
  .js .split-foto,.js .split-testo{transform:none!important}
  .flotta{animation:none}
  .nastro .pista{animation:none}
  .sole{animation:none}
  .accende{background-size:100% 38%!important;transition:none}
  .giornata::before{transform:none!important}
  .numero.viva b{animation:none}
}