/* =============================================================
   DOLCE CHIARA — foglio di stile condiviso
   Palette: lampone e pistacchio. Titoli Bodoni Moda, testo Hanken Grotesk.
   ============================================================= */

:root{
  --lampone:#5E1433;
  --lampone-2:#7A1C43;
  --vivo:#A8285A;
  --vivo-hover:#8C1F4A;
  --zucchero:#FBF4F2;
  --rosa:#F3D8DE;
  --rosa-2:#F8E6EA;
  --pistacchio:#C3D3A6;
  --pistacchio-scuro:#4A6536;
  --inchiostro:#2A0E1A;
  --tenue:#6D4A58;
  --oro:#D2AE72;
  --su-scuro:#FBEFF2;
  --su-scuro-tenue:#E7C6D0;
  --linea:rgba(42,14,26,.14);
  --linea-scuro:rgba(251,239,242,.2);

  --f-titolo:'Bodoni Moda', 'Didot', Georgia, serif;
  --f-testo:'Hanken Grotesk', 'Segoe UI', system-ui, sans-serif;

  --w:1180px;
  --pad:clamp(20px, 4vw, 40px);
  --sez:clamp(72px, 10vw, 128px);
  --ease:cubic-bezier(.22,.8,.24,1);
  --pirottino:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M99.0 50.0L98.7 51.4L97.9 52.7L96.7 53.9L95.2 55.1L96.4 56.5L97.3 58.0L97.8 59.5L97.8 60.9L97.2 62.2L96.1 63.3L94.6 64.2L92.9 65.0L93.8 66.7L94.3 68.4L94.5 69.9L94.1 71.3L93.3 72.4L92.0 73.2L90.3 73.8L88.5 74.2L88.9 76.0L89.1 77.8L88.9 79.3L88.3 80.6L87.2 81.4L85.8 82.0L84.0 82.2L82.2 82.2L82.2 84.0L82.0 85.8L81.4 87.2L80.6 88.3L79.3 88.9L77.8 89.1L76.0 88.9L74.2 88.5L73.8 90.3L73.2 92.0L72.4 93.3L71.3 94.1L69.9 94.5L68.4 94.3L66.7 93.8L65.0 92.9L64.2 94.6L63.3 96.1L62.2 97.2L60.9 97.8L59.5 97.8L58.0 97.3L56.5 96.4L55.1 95.2L53.9 96.7L52.7 97.9L51.4 98.7L50.0 99.0L48.6 98.7L47.3 97.9L46.1 96.7L44.9 95.2L43.5 96.4L42.0 97.3L40.5 97.8L39.1 97.8L37.8 97.2L36.7 96.1L35.8 94.6L35.0 92.9L33.3 93.8L31.6 94.3L30.1 94.5L28.7 94.1L27.6 93.3L26.8 92.0L26.2 90.3L25.8 88.5L24.0 88.9L22.2 89.1L20.7 88.9L19.4 88.3L18.6 87.2L18.0 85.8L17.8 84.0L17.8 82.2L16.0 82.2L14.2 82.0L12.8 81.4L11.7 80.6L11.1 79.3L10.9 77.8L11.1 76.0L11.5 74.2L9.7 73.8L8.0 73.2L6.7 72.4L5.9 71.3L5.5 69.9L5.7 68.4L6.2 66.7L7.1 65.0L5.4 64.2L3.9 63.3L2.8 62.2L2.2 60.9L2.2 59.5L2.7 58.0L3.6 56.5L4.8 55.1L3.3 53.9L2.1 52.7L1.3 51.4L1.0 50.0L1.3 48.6L2.1 47.3L3.3 46.1L4.8 44.9L3.6 43.5L2.7 42.0L2.2 40.5L2.2 39.1L2.8 37.8L3.9 36.7L5.4 35.8L7.1 35.0L6.2 33.3L5.7 31.6L5.5 30.1L5.9 28.7L6.7 27.6L8.0 26.8L9.7 26.2L11.5 25.8L11.1 24.0L10.9 22.2L11.1 20.7L11.7 19.4L12.8 18.6L14.2 18.0L16.0 17.8L17.8 17.8L17.8 16.0L18.0 14.2L18.6 12.8L19.4 11.7L20.7 11.1L22.2 10.9L24.0 11.1L25.8 11.5L26.2 9.7L26.8 8.0L27.6 6.7L28.7 5.9L30.1 5.5L31.6 5.7L33.3 6.2L35.0 7.1L35.8 5.4L36.7 3.9L37.8 2.8L39.1 2.2L40.5 2.2L42.0 2.7L43.5 3.6L44.9 4.8L46.1 3.3L47.3 2.1L48.6 1.3L50.0 1.0L51.4 1.3L52.7 2.1L53.9 3.3L55.1 4.8L56.5 3.6L58.0 2.7L59.5 2.2L60.9 2.2L62.2 2.8L63.3 3.9L64.2 5.4L65.0 7.1L66.7 6.2L68.4 5.7L69.9 5.5L71.3 5.9L72.4 6.7L73.2 8.0L73.8 9.7L74.2 11.5L76.0 11.1L77.8 10.9L79.3 11.1L80.6 11.7L81.4 12.8L82.0 14.2L82.2 16.0L82.2 17.8L84.0 17.8L85.8 18.0L87.2 18.6L88.3 19.4L88.9 20.7L89.1 22.2L88.9 24.0L88.5 25.8L90.3 26.2L92.0 26.8L93.3 27.6L94.1 28.7L94.5 30.1L94.3 31.6L93.8 33.3L92.9 35.0L94.6 35.8L96.1 36.7L97.2 37.8L97.8 39.1L97.8 40.5L97.3 42.0L96.4 43.5L95.2 44.9L96.7 46.1L97.9 47.3L98.7 48.6Z' fill='black'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%;}
body{
  font-family:var(--f-testo); font-size:1.0625rem; line-height:1.65;
  color:var(--inchiostro); background:var(--zucchero);
  -webkit-font-smoothing:antialiased;
  transition:opacity .45s ease;
}
.js body{opacity:0;}
.js body.pronto{opacity:1;}
.js body.uscita{opacity:0;}
img{display:block; max-width:100%;}
a{color:inherit;}
ul{list-style:none;}
button, input, select, textarea{font:inherit; color:inherit;}
::selection{background:var(--vivo); color:#fff;}
:focus-visible{outline:3px solid var(--vivo); outline-offset:3px; border-radius:4px;}
.scuro :focus-visible{outline-color:var(--pistacchio);}

.wrap{max-width:var(--w); margin:0 auto; padding:0 var(--pad);}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* ---------- tipografia ---------- */
h1,h2,h3,.titolo{font-family:var(--f-titolo); font-weight:500; line-height:1.08; letter-spacing:-.01em;}
h1{font-size:clamp(2.6rem, 6.4vw, 5.4rem);}
h2{font-size:clamp(2rem, 4.2vw, 3.3rem);}
h3{font-size:clamp(1.3rem, 2vw, 1.6rem); line-height:1.2;}
.corsivo{font-style:italic;}
.intro{font-size:1.15rem; color:var(--tenue); max-width:58ch;}
.scuro .intro{color:var(--su-scuro-tenue);}
.cappello{font-family:var(--f-titolo); font-style:italic; font-size:1.15rem; color:var(--vivo); display:block; margin-bottom:10px;}
.scuro .cappello{color:var(--pistacchio);}
.testa{max-width:680px; margin-bottom:clamp(36px, 5vw, 56px);}
.testa h2 + p{margin-top:16px;}
.testa.centro{margin-left:auto; margin-right:auto; text-align:center;}
.testa.centro .intro{margin:0 auto;}

/* ---------- bottoni ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 28px; border-radius:100px; border:1.5px solid transparent;
  font-weight:600; font-size:.98rem; text-decoration:none; cursor:pointer;
  transition:background .25s ease, color .25s ease, transform .25s var(--ease), border-color .25s ease;
}
.btn:active{transform:scale(.97);}
.btn-pieno{background:var(--vivo); color:#fff;}
.btn-pieno:hover{background:var(--vivo-hover);}
.btn-bordo{border-color:currentColor; color:var(--inchiostro); background:transparent;}
.btn-bordo:hover{background:var(--inchiostro); color:var(--zucchero);}
.scuro .btn-bordo{color:var(--su-scuro);}
.scuro .btn-bordo:hover{background:var(--su-scuro); color:var(--lampone);}
.btn-chiaro{background:var(--su-scuro); color:var(--lampone);}
.btn-chiaro:hover{background:var(--pistacchio); color:var(--inchiostro);}
.btn svg{width:18px; height:18px; flex-shrink:0;}
.link{font-weight:600; color:var(--vivo); text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1.5px;}
.link:hover{color:var(--vivo-hover);}
.scuro .link{color:var(--pistacchio);}

/* =============================================================
   BARRA STATO / ORARI (in cima a ogni pagina)
   ============================================================= */
.stato{background:var(--inchiostro); color:var(--su-scuro); font-size:.86rem;}
.stato .wrap{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 24px; padding-top:10px; padding-bottom:10px;}
.stato-live{display:flex; align-items:center; gap:10px; font-weight:600;}
.stato-punto{width:9px; height:9px; border-radius:50%; background:#8FB36B; box-shadow:0 0 0 0 rgba(143,179,107,.6); animation:pulsa 2.2s infinite;}
.stato-live.chiuso .stato-punto{background:#E0778F; animation:none;}
.stato-orari{color:var(--su-scuro-tenue);}
.stato-orari strong{color:var(--su-scuro); font-weight:600;}
.stato a{color:var(--pistacchio); text-decoration:none; font-weight:600;}
.stato a:hover{text-decoration:underline;}
@keyframes pulsa{70%{box-shadow:0 0 0 8px rgba(143,179,107,0);} 100%{box-shadow:0 0 0 0 rgba(143,179,107,0);}}

/* =============================================================
   INTESTAZIONE
   ============================================================= */
.testata{position:sticky; top:0; z-index:40; background:rgba(251,244,242,.9); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--linea); transition:box-shadow .3s ease;}
.testata.ombra{box-shadow:0 8px 30px rgba(42,14,26,.08);}
.testata .wrap{display:flex; align-items:center; justify-content:space-between; gap:24px; height:74px;}
.marchio{display:flex; align-items:center; gap:12px; text-decoration:none;}
.marchio-sigillo{width:40px; height:40px; background:var(--lampone); -webkit-mask:var(--pirottino) center/contain no-repeat; mask:var(--pirottino) center/contain no-repeat; display:grid; place-items:center; color:var(--su-scuro); font-family:var(--f-titolo); font-style:italic; font-size:1.05rem;}
.marchio-nome{font-family:var(--f-titolo); font-size:1.5rem; font-style:italic; color:var(--lampone); line-height:1;}
.menu{display:flex; align-items:center; gap:clamp(18px, 3vw, 36px);}
.menu a{text-decoration:none; font-weight:500; font-size:.98rem; padding:6px 0; position:relative;}
.menu a::after{content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--vivo); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);}
.menu a:hover::after, .menu a[aria-current="page"]::after{transform:scaleX(1);}
.menu a[aria-current="page"]{color:var(--vivo);}
.testata .btn{padding:11px 20px; font-size:.92rem;}
.hamburger{display:none; background:none; border:0; width:44px; height:44px; cursor:pointer; position:relative;}
.hamburger span{position:absolute; left:10px; right:10px; height:2px; background:var(--inchiostro); transition:transform .3s var(--ease), opacity .2s;}
.hamburger span:nth-child(1){top:15px;} .hamburger span:nth-child(2){top:21px;} .hamburger span:nth-child(3){top:27px;}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* =============================================================
   BORDO SMERLATO (pirottino) tra sezioni
   ============================================================= */
.smerlo{position:relative;}
.smerlo::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px; height:16px; z-index:2;
  background:radial-gradient(circle at 14px 0, transparent 13px, var(--smerlo-colore, var(--zucchero)) 13.5px) repeat-x;
  background-size:28px 16px;
}

/* =============================================================
   HOME — HERO
   ============================================================= */
.hero{background:var(--lampone); color:var(--su-scuro); overflow:hidden; --smerlo-colore:var(--zucchero);}
.hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:clamp(32px, 5vw, 72px); padding-top:clamp(48px, 7vw, 96px); padding-bottom:clamp(72px, 9vw, 120px);}
.hero h1{color:var(--su-scuro);}
.hero h1 .riga{display:block; overflow:hidden;}
.hero h1 .riga > span{display:block; transition:transform 1s var(--ease);}
.js .hero h1 .riga > span{transform:translateY(105%);}
.js .pronto .hero h1 .riga > span{transform:none;}
.pronto .hero h1 .riga:nth-child(2) > span{transition-delay:.12s;}
.pronto .hero h1 .riga:nth-child(3) > span{transition-delay:.24s;}
.hero h1 em{color:var(--pistacchio);}
.hero .intro{margin-top:26px;}
.hero-azioni{display:flex; flex-wrap:wrap; gap:14px; margin-top:36px;}
.hero-fatti{display:flex; flex-wrap:wrap; gap:14px 34px; margin-top:44px; padding-top:26px; border-top:1px solid var(--linea-scuro); color:var(--su-scuro-tenue); font-size:.95rem;}
.hero-fatti strong{display:block; font-family:var(--f-titolo); font-size:1.5rem; font-weight:500; color:var(--su-scuro);}

.piatto{position:relative; aspect-ratio:1; max-width:540px; width:100%; justify-self:center;}
.piatto-foto{position:absolute; inset:8%; -webkit-mask:var(--pirottino) center/contain no-repeat; mask:var(--pirottino) center/contain no-repeat; overflow:hidden;}
.piatto-foto img{width:100%; height:100%; object-fit:cover; transform:scale(1.12); transition:transform 1.6s var(--ease);}
.pronto .piatto-foto img{transform:scale(1);}
.piatto-anello{position:absolute; inset:0; border-radius:50%; border:1px solid var(--linea-scuro);}
.timbro{position:absolute; right:-2%; bottom:4%; width:32%; aspect-ratio:1; background:var(--pistacchio); border-radius:50%; display:grid; place-items:center; color:var(--inchiostro); box-shadow:0 18px 40px rgba(0,0,0,.25);}
.timbro svg{position:absolute; inset:6%; width:88%; height:88%; animation:gira 26s linear infinite;}
.timbro text{font-family:var(--f-testo); font-size:9.5px; font-weight:600; fill:var(--inchiostro);}
.timbro-centro{font-family:var(--f-titolo); font-style:italic; font-size:clamp(1.4rem, 3vw, 2.1rem);}
@keyframes gira{to{transform:rotate(360deg);}}

/* =============================================================
   SEZIONI GENERICHE
   ============================================================= */
.sez{padding:var(--sez) 0;}
.sez-rosa{background:var(--rosa-2);}
.sez-scura{background:var(--lampone); color:var(--su-scuro);}
.sez-pistacchio{background:var(--pistacchio);}
.sez-pistacchio .intro{color:#3A2A30;}
.sez + .sez{padding-top:var(--sez);}

/* ---- Banco di oggi ---- */
.oggi{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(32px, 6vw, 88px); align-items:center;}
.oggi-foto{aspect-ratio:1; -webkit-mask:var(--pirottino) center/contain no-repeat; mask:var(--pirottino) center/contain no-repeat;}
.oggi-foto img{width:100%; height:100%; object-fit:cover;}
.oggi-giorno{display:inline-block; background:var(--pistacchio); color:var(--inchiostro); padding:6px 16px; border-radius:100px; font-weight:600; font-size:.9rem; margin-bottom:22px;}
.oggi h2{margin-bottom:18px;}
.oggi-settimana{display:flex; flex-wrap:wrap; gap:8px; margin-top:32px;}
.oggi-settimana button{border:1px solid var(--linea); background:transparent; padding:8px 14px; border-radius:100px; font-size:.88rem; cursor:pointer; transition:background .2s, color .2s;}
.oggi-settimana button:hover{border-color:var(--vivo); color:var(--vivo);}
.oggi-settimana button[aria-pressed="true"]{background:var(--inchiostro); color:var(--zucchero); border-color:var(--inchiostro);}

/* ---- Caffetteria (banda con foto) ---- */
.caffe{display:grid; grid-template-columns:1fr 1fr; min-height:560px;}
.caffe-foto{position:relative; overflow:hidden;}
.caffe-foto img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.caffe-testo{background:var(--lampone); color:var(--su-scuro); padding:clamp(48px, 7vw, 96px) clamp(28px, 6vw, 80px); display:flex; flex-direction:column; justify-content:center;}
.caffe-testo h2{margin-bottom:22px;}
.caffe-testo p{color:var(--su-scuro-tenue); max-width:48ch;}
.caffe-lista{margin-top:28px; display:grid; gap:14px;}
.caffe-lista li{display:grid; grid-template-columns:28px 1fr; gap:12px; align-items:start;}
.caffe-lista li::before{content:''; width:18px; height:18px; margin-top:4px; background:var(--pistacchio); -webkit-mask:var(--pirottino) center/contain no-repeat; mask:var(--pirottino) center/contain no-repeat;}
.caffe-lista strong{color:var(--su-scuro);}

/* ---- Servizi (lista editoriale) ---- */
.servizi{border-top:1px solid var(--linea);}
.servizio{display:grid; grid-template-columns:120px 1fr auto; gap:clamp(18px, 3vw, 40px); align-items:center; padding:28px 0; border-bottom:1px solid var(--linea); text-decoration:none; transition:padding .35s var(--ease), background .35s ease;}
.servizio:hover{padding-left:14px; padding-right:14px; background:var(--rosa-2);}
.servizio-foto{width:120px; aspect-ratio:1; -webkit-mask:var(--pirottino) center/contain no-repeat; mask:var(--pirottino) center/contain no-repeat;}
.servizio-foto img{width:100%; height:100%; object-fit:cover;}
.servizio h3{margin-bottom:6px;}
.servizio p{color:var(--tenue); max-width:56ch;}
.servizio-vai{font-weight:600; color:var(--vivo); white-space:nowrap;}

/* ---- Ricorrenza in arrivo ---- */
.ricorrenza{display:grid; grid-template-columns:auto 1fr auto; gap:clamp(24px, 5vw, 64px); align-items:center;}
.conta{font-family:var(--f-titolo); font-size:clamp(4.5rem, 12vw, 9rem); line-height:.9; color:var(--lampone);}
.conta small{display:block; font-family:var(--f-testo); font-size:1rem; font-weight:600; color:var(--inchiostro); margin-top:10px;}

/* ---- Visita ---- */
.visita{display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(32px, 6vw, 80px); align-items:end;}
.visita-dati{display:grid; gap:22px;}
.visita-dati div{padding-bottom:18px; border-bottom:1px solid var(--linea-scuro);}
.visita-dati span{display:block; color:var(--su-scuro-tenue); font-size:.9rem;}
.visita-dati a, .visita-dati p{font-family:var(--f-titolo); font-size:1.45rem; text-decoration:none; color:var(--su-scuro);}
.visita-dati a:hover{color:var(--pistacchio);}

/* =============================================================
   INTESTAZIONE PAGINE INTERNE (foto sbiadita)
   ============================================================= */
.pagina-testa{position:relative; background:var(--lampone); color:var(--su-scuro); overflow:hidden; --smerlo-colore:var(--zucchero);}
.pagina-testa img{position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; opacity:.28; filter:grayscale(.4) contrast(1.05); mix-blend-mode:luminosity;}
.pagina-testa::before{content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(100deg, var(--lampone) 35%, rgba(94,20,51,.6) 100%);}
.pagina-testa .wrap{position:relative; z-index:3; padding-top:clamp(64px, 9vw, 120px); padding-bottom:clamp(72px, 9vw, 120px);}
.pagina-testa h1{font-size:clamp(2.4rem, 5.4vw, 4.4rem); max-width:16ch;}
.pagina-testa .intro{margin-top:20px;}
.sotto-menu{display:flex; flex-wrap:wrap; gap:10px; margin-top:32px;}
.sotto-menu a{text-decoration:none; border:1px solid var(--linea-scuro); padding:9px 18px; border-radius:100px; font-size:.92rem; transition:background .2s, color .2s;}
.sotto-menu a:hover{background:var(--su-scuro); color:var(--lampone);}

/* =============================================================
   MENÙ — filtri, prodotti, lightbox
   ============================================================= */
.filtri{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; margin-bottom:40px; padding-bottom:24px; border-bottom:1px solid var(--linea);}
.chips{display:flex; flex-wrap:wrap; gap:8px;}
.chip{border:1px solid var(--linea); background:transparent; padding:10px 18px; border-radius:100px; font-weight:500; cursor:pointer; transition:background .2s, color .2s, border-color .2s;}
.chip:hover{border-color:var(--vivo); color:var(--vivo);}
.chip[aria-pressed="true"]{background:var(--inchiostro); color:var(--zucchero); border-color:var(--inchiostro);}
.chip .n{opacity:.6; font-size:.85em; margin-left:4px;}
.interruttore{display:flex; align-items:center; gap:10px; font-size:.95rem; cursor:pointer; user-select:none;}
.interruttore input{appearance:none; -webkit-appearance:none; width:44px; height:26px; border-radius:100px; background:#D9C4CB; position:relative; cursor:pointer; transition:background .2s;}
.interruttore input::after{content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform .25s var(--ease);}
.interruttore input:checked{background:var(--pistacchio-scuro);}
.interruttore input:checked::after{transform:translateX(18px);}

.prodotti{display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:clamp(20px, 3vw, 36px) clamp(16px, 2.4vw, 28px);}
.prodotto{display:flex; flex-direction:column; text-align:left; background:none; border:0; padding:0; cursor:pointer;}
.prodotto[hidden]{display:none;}
.prodotto-foto{aspect-ratio:4/5; overflow:hidden; border-radius:6px; background:var(--rosa); position:relative;}
.prodotto-foto img{width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease);}
.prodotto:hover .prodotto-foto img{transform:scale(1.05);}
.prodotto-cat{position:absolute; left:12px; top:12px; background:rgba(251,244,242,.94); color:var(--inchiostro); font-size:.8rem; font-weight:600; padding:5px 12px; border-radius:100px;}
.prodotto h3{margin-top:16px; font-size:1.3rem;}
.prodotto p{color:var(--tenue); font-size:.95rem; margin-top:6px;}
.allergeni{display:flex; flex-wrap:wrap; gap:6px; margin-top:12px;}
.allergeni span{font-size:.78rem; font-weight:600; padding:3px 10px; border-radius:100px; background:var(--rosa); color:#6A1A3C;}
.vuoto{padding:48px; text-align:center; border:1px dashed var(--linea); border-radius:8px; color:var(--tenue);}
.nota{margin-top:40px; font-size:.92rem; color:var(--tenue); max-width:78ch;}

.lightbox{position:fixed; inset:0; z-index:100; background:rgba(42,14,26,.92); display:grid; place-items:center; padding:24px; opacity:0; pointer-events:none; transition:opacity .3s ease;}
.lightbox.aperto{opacity:1; pointer-events:auto;}
.lb-scheda{display:grid; grid-template-columns:1.1fr .9fr; max-width:980px; width:100%; max-height:88vh; background:var(--zucchero); border-radius:10px; overflow:hidden; transform:translateY(16px) scale(.98); transition:transform .4s var(--ease);}
.lightbox.aperto .lb-scheda{transform:none;}
.lb-scheda img{width:100%; height:100%; max-height:88vh; object-fit:cover;}
.lb-testo{padding:clamp(28px, 4vw, 48px); display:flex; flex-direction:column; overflow:auto;}
.lb-testo h3{font-size:clamp(1.8rem, 3vw, 2.4rem); margin:8px 0 14px;}
.lb-testo p{color:var(--tenue);}
.lb-testo .btn{margin-top:auto; align-self:flex-start;}
.lb-testo .allergeni{margin:18px 0 28px;}
.lb-btn{position:absolute; width:52px; height:52px; border-radius:50%; border:0; background:var(--su-scuro); color:var(--lampone); font-size:1.4rem; cursor:pointer; display:grid; place-items:center; transition:background .2s;}
.lb-btn:hover{background:var(--pistacchio);}
.lb-chiudi{top:20px; right:20px;}
.lb-prec{left:20px; top:50%; transform:translateY(-50%);}
.lb-succ{right:20px; top:50%; transform:translateY(-50%);}

/* =============================================================
   ORDINA — configuratore torta
   ============================================================= */
.configuratore{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px, 5vw, 64px); align-items:start;}
.passo{border:0; padding:0 0 28px; margin-bottom:28px; border-bottom:1px solid var(--linea);}
.passo legend, .campo > label{display:flex; align-items:baseline; gap:12px; font-family:var(--f-titolo); font-size:1.35rem; margin-bottom:14px;}
.passo legend .num{font-family:var(--f-testo); font-size:.85rem; font-weight:700; color:#fff; background:var(--vivo); width:26px; height:26px; border-radius:50%; display:inline-grid; place-items:center; flex-shrink:0; transform:translateY(-2px);}
.opzioni{display:flex; flex-wrap:wrap; gap:10px;}
.opzione input{position:absolute; opacity:0; pointer-events:none;}
.opzione span{display:flex; align-items:center; gap:10px; padding:11px 18px; border:1.5px solid var(--linea); border-radius:100px; cursor:pointer; font-weight:500; transition:border-color .2s, background .2s, color .2s;}
.opzione span i{width:16px; height:16px; border-radius:50%; background:var(--c); box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);}
.opzione span:hover{border-color:var(--vivo);}
.opzione input:checked + span{background:var(--inchiostro); border-color:var(--inchiostro); color:var(--zucchero);}
.opzione input:focus-visible + span{outline:3px solid var(--vivo); outline-offset:3px;}
.persone{display:flex; align-items:center; gap:18px;}
.persone output{font-family:var(--f-titolo); font-size:2.2rem; min-width:3ch; color:var(--lampone);}
input[type=range]{-webkit-appearance:none; appearance:none; flex:1; height:6px; border-radius:6px; background:linear-gradient(90deg, var(--vivo) var(--p,30%), #E3CDD4 var(--p,30%)); cursor:pointer;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:26px; height:26px; border-radius:50%; background:#fff; border:3px solid var(--vivo); box-shadow:0 4px 12px rgba(42,14,26,.2);}
input[type=range]::-moz-range-thumb{width:22px; height:22px; border-radius:50%; background:#fff; border:3px solid var(--vivo);}
.campo{margin-bottom:22px;}
.campo small{display:block; color:var(--tenue); margin-top:6px; font-size:.86rem;}
.campo small.errore{color:#A3123A; font-weight:600;}
.campi-2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.campo > label.piccola{font-family:var(--f-testo); font-size:.92rem; font-weight:600; margin-bottom:8px;}
input[type=text], input[type=tel], input[type=date], input[type=number], select, textarea{
  width:100%; padding:14px 16px; border-radius:8px; border:1.5px solid var(--linea); background:#fff;
  transition:border-color .2s, box-shadow .2s;
}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--vivo); box-shadow:0 0 0 4px rgba(168,40,90,.14);}
textarea{resize:vertical; min-height:96px;}
.contatore{float:right; font-family:var(--f-testo); font-size:.82rem; color:var(--tenue);}

.anteprima{position:sticky; top:100px; background:var(--rosa-2); border-radius:14px; padding:clamp(24px, 3vw, 36px); border:1px solid rgba(168,40,90,.15);}
.anteprima-titolo{font-family:var(--f-titolo); font-style:italic; font-size:1.2rem; color:var(--vivo);}
.torta-svg{width:100%; height:auto; display:block; margin:10px auto 18px; max-width:420px;}
.torta-svg *{transition:fill .45s ease, opacity .4s ease, transform .5s var(--ease);}
.riepilogo{display:grid; gap:0; border-top:1px solid rgba(42,14,26,.12);}
.riepilogo div{display:flex; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid rgba(42,14,26,.12); font-size:.96rem;}
.riepilogo dt{color:var(--tenue);}
.riepilogo dd{font-weight:600; text-align:right;}
.anteprima .btn{width:100%; margin-top:22px;}
.solo-mobile{display:none;}
.anteprima .piccolo{font-size:.85rem; color:var(--tenue); margin-top:12px; text-align:center;}

/* ---- Vassoi + calcolatore ---- */
.vassoi{display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(18px, 3vw, 32px);}
.vassoio{display:flex; flex-direction:column;}
.vassoio-foto{aspect-ratio:4/3; overflow:hidden; border-radius:6px;}
.vassoio-foto img{width:100%; height:100%; object-fit:cover;}
.vassoio h3{margin-top:18px;}
.vassoio .quanti{display:inline-block; margin-top:8px; font-weight:600; color:var(--pistacchio-scuro);}
.vassoio p{color:var(--tenue); margin-top:8px;}
.vassoio.consigliato .vassoio-foto{outline:4px solid var(--vivo); outline-offset:4px;}
.vassoio .bollino{display:none; margin-top:10px; align-self:flex-start; background:var(--vivo); color:#fff; font-weight:600; font-size:.85rem; padding:5px 14px; border-radius:100px;}
.vassoio.consigliato .bollino{display:inline-block;}

.calcolo{margin-top:clamp(40px, 6vw, 72px); background:var(--lampone); color:var(--su-scuro); border-radius:14px; padding:clamp(28px, 4vw, 48px); display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px, 4vw, 56px); align-items:center;}
.calcolo h3{font-size:clamp(1.6rem, 3vw, 2.2rem); margin-bottom:10px;}
.calcolo p{color:var(--su-scuro-tenue);}
.calcolo label{display:block; font-weight:600; font-size:.92rem; margin:18px 0 8px;}
.calcolo select, .calcolo input[type=number]{background:rgba(255,255,255,.08); border-color:var(--linea-scuro); color:var(--su-scuro);}
.calcolo select option{color:var(--inchiostro);}
.calcolo-esito{background:rgba(255,255,255,.06); border:1px solid var(--linea-scuro); border-radius:12px; padding:28px; text-align:center;}
.calcolo-esito .grande{font-family:var(--f-titolo); font-size:clamp(3.4rem, 7vw, 5rem); line-height:1; color:var(--pistacchio);}
.calcolo-esito p{margin-top:8px;}
.calcolo-esito strong{color:var(--su-scuro);}
.calcolo-esito .btn{margin-top:20px;}

/* ---- Ricorrenze ---- */
.feste{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;}
.festa{background:#fff; border:1px solid var(--linea); border-radius:10px; padding:22px 18px; display:flex; flex-direction:column; gap:6px;}
.festa .quando{font-size:.88rem; color:var(--tenue);}
.festa h3{font-size:1.2rem;}
.festa .mancano{margin-top:auto; padding-top:14px; font-family:var(--f-titolo); font-size:2rem; color:var(--lampone); line-height:1;}
.festa .mancano small{font-family:var(--f-testo); font-size:.82rem; color:var(--tenue); display:block; margin-top:4px;}
.festa.prossima{background:var(--lampone); color:var(--su-scuro); border-color:var(--lampone);}
.festa.prossima .quando, .festa.prossima .mancano small{color:var(--su-scuro-tenue);}
.festa.prossima .mancano{color:var(--pistacchio);}

/* ---- Buono regalo ---- */
.regalo{display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(28px, 5vw, 72px); align-items:center;}
.buono{aspect-ratio:1.6; border-radius:16px; background:var(--lampone); color:var(--su-scuro); padding:clamp(22px, 3vw, 36px); display:flex; flex-direction:column; justify-content:space-between; position:relative; overflow:hidden; box-shadow:0 30px 60px rgba(42,14,26,.25); transform:rotate(-2deg);}
.buono::before{content:''; position:absolute; width:62%; aspect-ratio:1; right:-18%; top:-26%; background:var(--lampone-2); -webkit-mask:var(--pirottino) center/contain no-repeat; mask:var(--pirottino) center/contain no-repeat;}
.buono::after{content:''; position:absolute; width:17%; aspect-ratio:1; right:9%; top:9%; background:var(--pistacchio); opacity:.9; -webkit-mask:var(--pirottino) center/contain no-repeat; mask:var(--pirottino) center/contain no-repeat;}
.buono > *{position:relative; z-index:1;}
.buono-marca{font-family:var(--f-titolo); font-style:italic; font-size:1.3rem;}
.buono-per{font-size:.9rem; color:var(--su-scuro-tenue);}
.buono-nome{font-family:var(--f-titolo); font-size:clamp(1.6rem, 3.2vw, 2.4rem); line-height:1.1; word-break:break-word;}
.buono-msg{font-size:.95rem; color:var(--su-scuro-tenue); max-width:30ch; margin-top:6px; min-height:1.4em;}
.buono-valore{font-family:var(--f-titolo); font-size:1.6rem; color:var(--pistacchio);}

/* =============================================================
   CHI SIAMO
   ============================================================= */
.storia{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px, 6vw, 88px); align-items:center;}
.storia-foto{aspect-ratio:4/5; border-radius:6px; overflow:hidden; position:relative;}
.storia-foto img{width:100%; height:100%; object-fit:cover;}
.storia p + p{margin-top:16px;}
.storia p{color:#4A2E3A;}
.giornata{display:grid; grid-template-columns:repeat(4, 1fr); gap:0; border-top:2px solid var(--inchiostro);}
.giornata li{padding:22px 22px 0 0; position:relative;}
.giornata li::before{content:''; position:absolute; top:-8px; left:0; width:14px; height:14px; border-radius:50%; background:var(--vivo); box-shadow:0 0 0 4px var(--zucchero);}
.giornata .ora{font-family:var(--f-titolo); font-size:2rem; color:var(--lampone);}
.giornata h3{font-size:1.15rem; margin:6px 0;}
.giornata p{color:var(--tenue); font-size:.95rem;}

.recensioni{columns:3 280px; column-gap:24px;}
.recensione{break-inside:avoid; margin-bottom:24px; background:#fff; border-radius:10px; padding:28px; border:1px solid var(--linea);}
.recensione:nth-child(3n+2){background:var(--rosa-2);}
.recensione blockquote{font-family:var(--f-titolo); font-size:1.2rem; line-height:1.45;}
.recensione .stelle{color:var(--vivo); letter-spacing:3px; margin-bottom:12px;}
.recensione figcaption{margin-top:16px; font-weight:600; font-size:.92rem;}
.recensione figcaption span{display:block; font-weight:400; color:var(--tenue);}

.faq{max-width:820px;}
.faq details{border-bottom:1px solid var(--linea);}
.faq summary{list-style:none; cursor:pointer; padding:24px 44px 24px 0; font-family:var(--f-titolo); font-size:1.3rem; position:relative;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:''; position:absolute; right:6px; top:50%; width:14px; height:14px; margin-top:-7px; border-right:2px solid var(--vivo); border-bottom:2px solid var(--vivo); transform:rotate(45deg); transition:transform .3s var(--ease);}
.faq details[open] summary::after{transform:rotate(-135deg); margin-top:-2px;}
.faq details p{padding:0 0 24px; color:var(--tenue); max-width:70ch;}

.dove{display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(32px, 5vw, 64px); align-items:start;}
.orari{width:100%; border-collapse:collapse;}
.orari td{padding:14px 0; border-bottom:1px solid var(--linea-scuro);}
.orari td:last-child{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; padding-left:16px;}
.orari tr.riga-oggi td{color:var(--pistacchio); font-weight:600;}
.orari tr.chiuso td:last-child{color:var(--su-scuro-tenue);}
.contatti{margin-top:32px; display:grid; gap:12px;}
.contatti a, .contatti p{color:var(--su-scuro); text-decoration:none; font-size:1.05rem;}
.contatti a:hover{color:var(--pistacchio);}
.contatti span{display:block; font-size:.85rem; color:var(--su-scuro-tenue);}
.mappa{aspect-ratio:4/3; border-radius:12px; overflow:hidden; background:var(--lampone-2); position:relative;}
.mappa iframe{width:100%; height:100%; border:0; display:block;}
.mappa-consenso{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:14px; padding:clamp(24px, 4vw, 44px);}
.mappa-consenso p{color:var(--su-scuro-tenue); max-width:40ch; font-size:.95rem;}
.mappa-consenso strong{font-family:var(--f-titolo); font-size:1.6rem; font-weight:500; color:var(--su-scuro);}

/* =============================================================
   PAGINA LEGALE
   ============================================================= */
.legale{display:grid; grid-template-columns:240px 1fr; gap:clamp(32px, 6vw, 80px); align-items:start;}
.legale-indice{position:sticky; top:110px; display:grid; gap:4px;}
.legale-indice a{text-decoration:none; padding:10px 14px; border-radius:8px; font-weight:500;}
.legale-indice a:hover{background:var(--rosa-2); color:var(--vivo);}
.legale-testo{max-width:74ch;}
.legale-testo section{padding-bottom:48px; margin-bottom:48px; border-bottom:1px solid var(--linea); scroll-margin-top:110px;}
.legale-testo h2{font-size:clamp(1.8rem, 3vw, 2.4rem); margin-bottom:18px;}
.legale-testo h3{font-size:1.2rem; margin:28px 0 8px;}
.legale-testo p, .legale-testo li{color:#4A2E3A;}
.legale-testo p + p{margin-top:12px;}
.legale-testo ul{list-style:disc; padding-left:22px; margin-top:10px; display:grid; gap:6px;}
.legale-testo .aggiornato{font-size:.9rem; color:var(--tenue);}
.avviso{background:var(--rosa-2); border-left:4px solid var(--vivo); padding:16px 20px; border-radius:6px; margin-bottom:40px; font-size:.95rem;}

/* =============================================================
   PIÈ DI PAGINA
   ============================================================= */
.piede{background:var(--inchiostro); color:var(--su-scuro-tenue); padding:clamp(56px, 8vw, 88px) 0 32px;}
.piede-alto{display:grid; align-items:start; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px;}
.piede .marchio-nome{color:var(--su-scuro); font-size:2rem;}
.piede p{font-size:.95rem; margin-top:12px; max-width:32ch;}
.piede h4{font-family:var(--f-titolo); font-weight:500; font-style:italic; font-size:1.15rem; color:var(--su-scuro); margin-bottom:14px;}
.piede li{margin-bottom:8px; font-size:.95rem;}
.piede a{text-decoration:none; font-size:.95rem;}
.piede a:hover{color:var(--pistacchio);}
.piede-basso{display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:56px; padding-top:24px; border-top:1px solid rgba(251,239,242,.14); font-size:.85rem;}
.piede-basso nav{display:flex; flex-wrap:wrap; align-items:center; gap:18px;}
.piede-basso button{background:none; border:0; padding:0; line-height:inherit; cursor:pointer; font-size:.85rem; text-decoration:underline; text-underline-offset:3px;}
.piede-basso a{font-size:.85rem;}
.piede-basso button:hover{color:var(--pistacchio);}

/* =============================================================
   AVVISO COOKIE + PULSANTI FLUTTUANTI
   ============================================================= */
.cookie{position:fixed; left:20px; bottom:20px; z-index:90; max-width:380px; background:var(--zucchero); border:1px solid var(--linea); border-radius:14px; padding:22px; box-shadow:0 24px 60px rgba(42,14,26,.25); transform:translateY(140%); transition:transform .5s var(--ease);}
.cookie.visibile{transform:none;}
.cookie h2{font-size:1.3rem; margin-bottom:8px;}
.cookie p{font-size:.92rem; color:var(--tenue);}
.cookie-azioni{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px;}
.cookie .btn{padding:10px 16px; font-size:.88rem; flex:1 1 auto;}

.fluttua{position:fixed; right:20px; bottom:20px; z-index:80; display:flex; flex-direction:column; gap:10px;}
.fluttua a, .fluttua button{width:54px; height:54px; border-radius:50%; border:0; display:grid; place-items:center; cursor:pointer; box-shadow:0 12px 30px rgba(42,14,26,.28); transition:transform .3s var(--ease), opacity .3s;}
.fluttua a:hover, .fluttua button:hover{transform:translateY(-3px);}
.fluttua .wa{background:#1F8F55; color:#fff;}
.fluttua .su{background:var(--inchiostro); color:var(--zucchero); font-size:1.3rem; opacity:0; pointer-events:none;}
.fluttua .su.visibile{opacity:1; pointer-events:auto;}
.fluttua svg{width:26px; height:26px;}

/* =============================================================
   COMPARSA ALLO SCORRIMENTO (solo blocchi principali)
   ============================================================= */
.js .appare{opacity:0; transform:translateY(24px); transition:opacity .9s var(--ease), transform .9s var(--ease);}
.js .appare.visto{opacity:1; transform:none;}

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width:1020px){
  .feste{grid-template-columns:repeat(2, 1fr);}
  .piede-alto{grid-template-columns:1fr 1fr;}
  .giornata{grid-template-columns:1fr 1fr; gap:32px 0;}
}
@media (max-width:880px){
  .menu{position:fixed; inset:74px 0 auto 0; flex-direction:column; align-items:stretch; gap:0; background:var(--zucchero); padding:12px var(--pad) 28px; border-bottom:1px solid var(--linea); box-shadow:0 20px 40px rgba(42,14,26,.12); transform:translateY(-12px); opacity:0; pointer-events:none; transition:opacity .25s, transform .3s var(--ease);}
  .menu.aperto{opacity:1; transform:none; pointer-events:auto;}
  .menu a{padding:16px 0; border-bottom:1px solid var(--linea); font-size:1.15rem;}
  .menu a::after{display:none;}
  .hamburger{display:block;}
  .testata .btn{display:none;}
  .hero .wrap, .oggi, .caffe, .configuratore, .calcolo, .regalo, .storia, .dove, .visita, .legale{grid-template-columns:1fr;}
  .piatto{max-width:420px;}
  .caffe-foto{min-height:340px;}
  .anteprima{order:-1; position:sticky; top:74px; z-index:5; padding:6px 12px; margin:0 calc(-1 * var(--pad)); border-radius:0 0 14px 14px; border-width:0 0 1px; box-shadow:0 10px 24px rgba(42,14,26,.1);}
  .anteprima-titolo, .anteprima .riepilogo, .anteprima .btn, .anteprima .piccolo{display:none;}
  .torta-svg{max-height:150px; margin:0 auto;}
  .solo-mobile{display:flex; width:100%; margin-top:8px;}
  .vassoi{grid-template-columns:1fr;}
  .ricorrenza{grid-template-columns:1fr; text-align:left;}
  .servizio{grid-template-columns:80px 1fr;}
  .servizio-foto{width:80px;}
  .servizio-vai{grid-column:2;}
  .lb-scheda{grid-template-columns:1fr; max-height:90vh; overflow:auto;}
  .lb-scheda img{max-height:46vh;}
  .lb-prec, .lb-succ{top:auto; bottom:20px; transform:none;}
  .legale-indice{position:relative; top:0; display:flex; flex-wrap:wrap;}
}
@media (max-width:600px){
  body{font-size:1rem;}
  .stato .wrap{justify-content:center; text-align:center;}
  .stato a{display:none;}
  .stato .wrap{flex-direction:column; gap:2px;}
  .feste{grid-template-columns:1fr;}
  .campi-2{grid-template-columns:1fr;}
  .piede-alto{grid-template-columns:1fr;}
  .giornata{grid-template-columns:1fr;}
  .cookie{left:12px; right:12px; bottom:12px; max-width:none;}
  .fluttua{right:12px; bottom:12px;}
  .buono{transform:none;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none !important; transition:none !important;}
  .js body{opacity:1;}
  .js .appare{opacity:1; transform:none;}
  .js .hero h1 .riga > span{transform:none;}
}