/* ============================================================
   Cremeria delle Valli — Site sections
   Extends the palette/vars defined in hero-scrub.css.
   Layout modeled on the section anatomy of the great houses
   (Iginio Massari, Pierre Hermé, Ladurée, Marchesi 1824):
   vetrina collezioni → panettoni & colombe → mignon → storia →
   laboratorio → numeri → recensioni → sedi → FAQ → instagram → footer.
   ============================================================ */

:root{
  --bg-warm:var(--panna-alt);  /* soft warm panel → token panna-alt */
  --wrap:1200px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

html{ background:var(--panna); }
body{ margin:0; font-family:var(--lettura); font-size:17px; line-height:1.62;
  background:var(--panna); color:var(--cacao);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
img{ max-width:100%; display:block; }
a{ color:inherit; }

/* ---- shared layout helpers ---------------------------------- */
.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 24px; }
.section{ padding:clamp(72px,11vh,140px) 0; }
.eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.34em;
  text-transform:uppercase; color:var(--caramello); /* 6.1:1 — regola 1.15 */
  display:inline-flex; align-items:center; gap:12px;
}
.eyebrow::before{ content:''; width:28px; height:1px; background:var(--gold); }
.section-title{
  font-family:var(--serif); font-weight:400; color:var(--ink);
  font-size:clamp(30px,4.6vw,52px); line-height:1.05; letter-spacing:-.01em;
  margin:18px 0 0;
}
.section-title em{ font-style:italic; color:var(--gold-deep); }
.section-lead{
  max-width:600px; color:var(--muted); line-height:1.75;
  font-size:clamp(15px,1.7vw,17px); margin:18px 0 0;
}
.section-lead strong{ color:var(--caramello); font-weight:500; }
.center{ text-align:center; }
.center .eyebrow::after{ content:''; width:28px; height:1px; background:var(--gold); }
.center .section-lead{ margin-left:auto; margin-right:auto; }

/* skip-link: visibile solo al focus da tastiera */
.skip-link{ position:absolute; left:16px; top:-60px; z-index:60; padding:10px 16px; border-radius:100px;
  background:var(--ink); color:#fff; font-family:var(--mono); font-size:13px; text-decoration:none;
  transition:top .2s; }
.skip-link:focus{ top:12px; outline:2px solid var(--gold); outline-offset:2px; }

/* reveal-on-scroll */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s } .reveal.d2{ transition-delay:.16s }
.reveal.d3{ transition-delay:.24s } .reveal.d4{ transition-delay:.32s }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* touch: niente ritardo doppio-tap / zoom accidentale sui controlli */
button, .btn, .ord-btn, .nav-cta, .social-btn, .size, .add, .q, .wa-float, .chero-btn{ touch-action:manipulation; -webkit-tap-highlight-color:transparent; }

/* ---- buttons ------------------------------------------------ */
.btn{
  display:inline-flex; align-items:center; gap:9px; cursor:pointer;
  padding:14px 30px; border-radius:100px; font-family:var(--mono);
  font-size:13px; font-weight:500; letter-spacing:.02em; text-decoration:none;
  transition:transform .2s var(--ease), background .2s, color .2s, border-color .2s;
  border:1px solid transparent;
}
.btn:hover{ transform:translateY(-2px); }
.btn svg{ width:16px; height:16px; flex:none; }
.btn-primary{ background:var(--gold); color:#2a1a12; border-color:var(--gold); }
.btn-primary:hover{ background:#dcab3d; border-color:#dcab3d; }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--gold); color:var(--caramello); }
.btn-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,.4); }
.btn-light:hover{ background:#fff; color:var(--ink); }

/* ---- pagina legale (privacy) -------------------------------- */
.legal{ padding-top:130px; background:var(--panna); }
.legal .wrap{ max-width:760px; }
.legal h2{ font-family:var(--serif); font-weight:400; font-size:24px; color:var(--ink);
  margin:38px 0 10px; }
.legal p, .legal li{ color:var(--muted); line-height:1.8; font-size:15.5px; }
.legal ul{ padding-left:20px; margin:10px 0; }
.legal li{ margin-bottom:8px; }
.legal strong{ color:var(--ink); font-weight:500; }
.legal a{ color:var(--caramello); }

/* =============================================================
   NAV
   ============================================================= */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:40; height:74px;
  display:flex; align-items:center;
  transition:background .35s var(--ease), box-shadow .35s var(--ease), height .35s var(--ease);
}
.nav-in{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; }
.nav-logo{ display:flex; align-items:center; line-height:0; text-decoration:none; }
.nav-logo img{ height:52px; width:auto; display:block; transition:height .35s var(--ease);
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.38)); }
.nav.solid .nav-logo img{ height:46px; filter:drop-shadow(0 1px 3px rgba(0,0,0,.16)); }
.nav-links{ display:flex; align-items:center; gap:30px; list-style:none; margin:0; padding:0; }
.nav-links a{
  font-family:var(--mono); font-size:13px; letter-spacing:.02em; color:rgba(255,255,255,.9);
  text-decoration:none; transition:color .25s; position:relative; padding:4px 0;
}
.nav-links a::after{ content:''; position:absolute; left:0; bottom:-2px; width:0; height:1px;
  background:var(--gold); transition:width .25s var(--ease); }
.nav-links a:hover::after{ width:100%; }
.nav-cta{ font-family:var(--mono); font-size:12px; letter-spacing:.02em; text-decoration:none;
  padding:10px 22px; border-radius:100px; background:var(--gold); color:#2a1a12; font-weight:500;
  transition:transform .2s, background .2s; }
.nav-cta:hover{ transform:translateY(-2px); background:#dcab3d; }
.nav-burger{ display:none; background:none; border:0; cursor:pointer; width:30px; height:22px;
  position:relative; padding:0; }
.nav-burger span{ position:absolute; left:0; height:2px; width:100%; background:#fff; border-radius:2px;
  transition:transform .3s var(--ease), opacity .2s, background .35s; }
.nav-burger span:nth-child(1){ top:0 } .nav-burger span:nth-child(2){ top:10px } .nav-burger span:nth-child(3){ top:20px }

/* solid state once scrolled past the hero */
.nav.solid{ background:rgba(250,243,232,.92); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  height:64px; box-shadow:0 1px 0 var(--line); }
.nav.solid .nav-logo{ color:var(--ink); }
.nav.solid .nav-links a{ color:var(--ink); }
.nav.solid .nav-burger span{ background:var(--ink); }

/* mobile menu */
@media (max-width:900px){
  .nav-links{ display:none; }
  .nav-in{ justify-content:flex-start; gap:14px; }
  .nav-logo{ margin-right:auto; }
  .nav > .nav-in > .nav-cta{ display:inline-block; padding:10px 16px; font-size:11.5px; }
  .nav-burger{ display:block; box-sizing:content-box; padding:11px 7px; margin-right:-7px; width:30px; height:22px; }
  .nav-burger span{ left:7px; width:30px; }
  .nav-burger span:nth-child(1){ top:11px } .nav-burger span:nth-child(2){ top:21px } .nav-burger span:nth-child(3){ top:31px }

  .nav-logo img{ height:46px; } .nav.solid .nav-logo img{ height:42px; }
  .nav-menu{
    position:fixed; inset:0; z-index:39; background:rgba(24,14,8,.97);
    -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:26px;
    opacity:0; pointer-events:none; transition:opacity .35s var(--ease); }
  .nav-menu.open{ opacity:1; pointer-events:auto; }
  .nav-menu a{ font-family:var(--serif); font-size:26px; color:#fff; text-decoration:none; }
  .nav-menu .btn{ margin-top:12px; }
  body.menu-open .nav-burger span{ background:#fff; }
  body.menu-open .nav-burger span:nth-child(1){ top:21px; transform:rotate(45deg); }
  body.menu-open .nav-burger span:nth-child(2){ opacity:0; }
  body.menu-open .nav-burger span:nth-child(3){ top:21px; transform:rotate(-45deg); }
}
@media (min-width:901px){ .nav-menu{ display:none; } }

/* =============================================================
   MARQUEE strip (between hero and content)
   ============================================================= */
.marquee{ background:var(--ink); color:var(--cream); overflow:hidden; padding:16px 0;
  border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); }
.marquee-track{ display:flex; gap:44px; white-space:nowrap; width:max-content;
  animation:marq 32s linear infinite; }
.marquee span{ font-family:var(--serif); font-size:clamp(16px,2vw,22px); letter-spacing:.02em;
  display:inline-flex; align-items:center; gap:44px; opacity:.92; }
.marquee span::after{ content:'✦'; color:var(--gold); font-size:12px; }
@keyframes marq{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .marquee-track{ animation:none; } }

/* =============================================================
   RULLINO foto "creazioni" — nessun titolo, scorre da solo
   La traccia contiene l'elenco foto DUE volte: l'animazione trasla
   di mezza traccia e riparte identica, senza stacco visibile.
   Cambiando il numero di foto non serve toccare nulla qui.
   ============================================================= */
.rullino{ overflow:hidden; background:var(--ink); padding:10px 0; }
.rullino-track{ display:flex; gap:10px; width:max-content; animation:rull 80s linear infinite; }
.rullino:hover .rullino-track{ animation-play-state:paused; }
.rullino img{ display:block; flex:none; border-radius:8px; object-fit:cover;
  width:clamp(190px,23vw,300px); height:clamp(190px,23vw,300px); }
/* -50% = meta' traccia, ma i gap sono 2n-1: il -5px recupera il mezzo gap mancante */
@keyframes rull{ to{ transform:translateX(calc(-50% - 5px)); } }
@media (prefers-reduced-motion:reduce){
  .rullino{ overflow-x:auto; }
  .rullino-track{ animation:none; }
}

/* =============================================================
   MANIFESTO
   ============================================================= */
.manifesto{ background:var(--paper); text-align:center; }
.manifesto .big{
  font-family:var(--serif); font-weight:400; color:var(--ink);
  font-size:clamp(26px,4.4vw,46px); line-height:1.25; letter-spacing:-.01em;
  max-width:920px; margin:26px auto 0;
}
.manifesto .big em{ font-style:italic; color:var(--gold-deep); }
.manifesto .sign{ font-family:var(--serif); font-style:italic; color:var(--muted);
  margin-top:30px; font-size:18px; }

/* =============================================================
   DOVE TROVARCI (mappa + indirizzo + social)
   ============================================================= */
.dove{ background:var(--bg-warm); }
.dove-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(28px,5vw,60px); align-items:stretch; margin-top:44px; }
.dove-info{ display:flex; flex-direction:column; }
.dove-info .place{ font-family:var(--serif); font-size:clamp(22px,2.6vw,30px); color:var(--ink); margin:0 0 4px; }
.dove-row{ display:flex; gap:13px; align-items:flex-start; padding:14px 0; border-bottom:1px solid var(--line); }
.dove-row:first-of-type{ border-top:1px solid var(--line); margin-top:18px; }
.dove-row .ic{ color:var(--oro-scuro); flex:none; margin-top:2px; }
.dove-row .ic svg{ width:20px; height:20px; display:block; }
.dove-row .tx{ font-size:15px; line-height:1.55; color:var(--ink); }
.dove-row .tx small{ display:block; color:var(--muted); font-size:13px; margin-top:2px; }
.dove-row a.tx, .dove-row .tx a{ color:var(--caramello); text-decoration:none; }
.dove-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px;
  align-items:flex-start; align-content:flex-start; }
.social-btn{ display:inline-flex; align-items:center; gap:10px; text-decoration:none;
  flex:0 0 auto; align-self:flex-start;
  padding:12px 20px; border-radius:100px; border:1px solid var(--line); background:var(--paper);
  font-family:var(--mono); font-size:13px; color:var(--ink); transition:transform .2s var(--ease), border-color .2s, background .2s; }
.social-btn:hover{ transform:translateY(-2px); border-color:var(--oro); }
.social-btn svg{ width:18px; height:18px; flex:0 0 auto; }
.social-btn b{ font-weight:500; }
.social-btn.s-ig:hover{ background:#fdf0f3; }
.social-btn.s-tt:hover{ background:#eef7f6; }
.dove-map{ position:relative; border-radius:18px; overflow:hidden; min-height:380px;
  border:1px solid var(--line); box-shadow:0 18px 44px rgba(42,26,18,.14); }
.dove-map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
@media (max-width:820px){ .dove-grid{ grid-template-columns:1fr; } .dove-map{ min-height:300px; height:320px; } }

/* =============================================================
   ORDINA — due tasti (Ritira in negozio / Ordina a casa).
   Al click si apre il pannello relativo, uno alla volta; ricliccando
   si chiude. Pannello negozio = chiaro, pannello casa = box scuro.
   Split testo + card "come funziona" in 3 passi, lato specchiato.
   ============================================================= */
.ordina{ background:var(--paper); }

/* i due tasti */
.ord-choice{ display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:920px; margin:44px auto 0; }
.ord-btn{ display:flex; align-items:center; gap:18px; width:100%; text-align:left; cursor:pointer;
  padding:22px 24px; border-radius:18px; border:1px solid var(--line); background:var(--panna-alt); color:var(--ink);
  font-family:inherit; box-shadow:0 8px 24px rgba(42,26,18,.06);
  transition:transform .25s var(--ease), border-color .25s, box-shadow .25s, background .3s, color .3s; }
.ord-btn:hover{ transform:translateY(-3px); border-color:var(--gold); box-shadow:0 16px 36px rgba(42,26,18,.12); }
.ord-btn:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.ord-btn-ico{ width:54px; height:54px; border-radius:50%; border:1px solid var(--gold); flex:none;
  display:flex; align-items:center; justify-content:center; color:var(--gold-deep); transition:background .3s, color .3s; }
.ord-btn-ico svg{ width:24px; height:24px; display:block; }
.ord-btn-tx{ flex:1; min-width:0; }
.ord-btn-tx b{ display:block; font-family:var(--serif); font-weight:400; font-size:clamp(20px,2.2vw,24px); line-height:1.15; }
.ord-btn-tx small{ display:block; font-family:var(--mono); font-size:12px; letter-spacing:.03em; line-height:1.45;
  color:var(--muted); margin-top:5px; transition:color .3s; }
.ord-btn-arrow{ width:11px; height:11px; flex:none; margin:-4px 8px 0 0; opacity:.55;
  border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:rotate(45deg);
  transition:transform .35s var(--ease), opacity .3s; }
.ord-btn[aria-expanded="true"]{ border-color:var(--gold); box-shadow:inset 0 0 0 1px var(--gold), 0 16px 36px rgba(42,26,18,.12); }
.ord-btn[aria-expanded="true"] .ord-btn-ico{ background:var(--gold); color:var(--cacao); }
.ord-btn[aria-expanded="true"] .ord-btn-arrow{ transform:rotate(225deg) translate(-3px,-3px); opacity:.9; }
/* il tasto "casa" diventa scuro quando è aperto: si lega al suo pannello */
.ord-btn.is-dark[aria-expanded="true"]{ background:var(--ink); color:#fff; border-color:var(--ink);
  box-shadow:inset 0 0 0 1px var(--gold), 0 20px 44px rgba(42,26,18,.26); }
.ord-btn.is-dark[aria-expanded="true"] .ord-btn-tx small{ color:rgba(255,255,255,.72); }

/* pannelli a scomparsa: grid-rows 0fr → 1fr (nessuna misura in JS) */
.ord-panel{ display:grid; grid-template-rows:0fr; opacity:0; visibility:hidden; scroll-margin-top:96px;
  transition:grid-template-rows .55s var(--ease), opacity .3s, visibility 0s .55s; }
.ord-panel.open{ grid-template-rows:1fr; opacity:1; visibility:visible;
  transition:grid-template-rows .55s var(--ease), opacity .5s .1s, visibility 0s; }
/* taglia solo in verticale (serve all'apertura): in orizzontale lascia uscire le
   fasce a filo schermo del telefono, e clip non e' scorribile, quindi il focus su
   un campo non puo' spostare il pannello di lato */
.ord-panel-in{ overflow:hidden; overflow-x:visible; overflow-y:clip; min-height:0; min-width:0; }
.ord-panel-in > .ord-grid, .ord-panel-in > .ord-box{ margin-top:44px; }
.ord-box{ background:var(--ink); color:#fff; border-radius:22px; padding:clamp(28px,4.5vw,60px); }

/* la torta personalizzata vive dentro il pannello "Ritira in negozio" */
.ord-panel-in > .ord-torte{ margin-top:26px; background:var(--panna-alt); border:1px solid var(--line);
  border-radius:22px; padding:clamp(24px,4vw,52px); }
.ord-torte .torta-desc{ text-align:center; }

/* split testo + card */
.ord-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,80px); align-items:center; }
.ord-panel.dark .ord-grid > .ord-text{ order:2; }        /* specchia: card a sinistra, testo a destra */
.ord-text .section-title{ margin-top:18px; }
.ord-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.ord-chip{ font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; padding:7px 13px; border-radius:100px;
  border:1px solid var(--line); background:var(--panna-alt); color:var(--caramello); }
.ord-ctas{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.ord-note{ font-family:var(--mono); font-size:12.5px; line-height:1.65; color:var(--muted); margin:18px 0 0; max-width:48ch; }
.ord-note a{ color:var(--caramello); text-decoration:none; border-bottom:1px solid var(--line); }
.ord-note a:hover{ border-color:var(--caramello); }

/* card con i tre passi */
.ord-card{ border-radius:18px; padding:clamp(24px,3.4vw,40px); background:var(--panna-alt);
  border:1px solid var(--line); box-shadow:0 18px 44px rgba(42,26,18,.10); }
.ord-card-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  padding-bottom:18px; border-bottom:1px solid var(--line); }
.ord-card-head .lbl{ font-family:var(--mono); font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--caramello); }
.ord-card-head .tag{ font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  padding:6px 11px; border-radius:100px; background:var(--gold); color:var(--cacao); white-space:nowrap; }
.ord-steps{ list-style:none; margin:0; padding:0; }
.ord-step{ display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:flex-start;
  padding:20px 0; border-bottom:1px solid var(--line); }
.ord-step:last-child{ border-bottom:0; padding-bottom:0; }
.ord-step .ico{ width:46px; height:46px; border-radius:50%; border:1px solid var(--gold); flex:none;
  display:flex; align-items:center; justify-content:center; color:var(--gold-deep); }
.ord-step .ico svg{ width:20px; height:20px; display:block; }
.ord-step .num{ font-family:var(--mono); font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--caramello); }
.ord-step h4{ font-family:var(--serif); font-weight:400; font-size:21px; line-height:1.2; color:var(--ink); margin:4px 0 6px; }
.ord-step p{ margin:0; font-size:14.5px; line-height:1.65; color:var(--muted); }
.ord-step p strong{ color:var(--ink); font-weight:500; }
.ord-step p a{ color:var(--caramello); text-decoration:none; border-bottom:1px solid var(--line); }
.ord-step p a:hover{ border-color:var(--caramello); }

/* variante scura (pannello Ordina a casa) */
.ord-panel.dark .eyebrow{ color:var(--gold); }
.ord-panel.dark .section-title{ color:#fff; }
.ord-panel.dark .section-title em{ color:var(--gold); }
.ord-panel.dark .section-lead{ color:rgba(255,255,255,.78); }
.ord-panel.dark .section-lead strong{ color:var(--gold); }
.ord-panel.dark .ord-note{ color:rgba(255,255,255,.62); }
.ord-panel.dark .ord-note a{ color:var(--gold); border-color:rgba(198,149,47,.4); }
.ord-panel.dark .ord-note a:hover{ border-color:var(--gold); }
.ord-panel.dark .ord-card{ background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.12); box-shadow:0 30px 70px rgba(0,0,0,.35); }
.ord-panel.dark .ord-card-head{ border-color:rgba(255,255,255,.12); }
.ord-panel.dark .ord-card-head .lbl{ color:var(--gold); }
.ord-panel.dark .ord-step{ border-color:rgba(255,255,255,.10); }
.ord-panel.dark .ord-step .ico{ color:var(--gold); border-color:rgba(198,149,47,.55); }
.ord-panel.dark .ord-step .num{ color:var(--gold); }
.ord-panel.dark .ord-step h4{ color:#fff; }
.ord-panel.dark .ord-step p{ color:rgba(255,255,255,.72); }
.ord-panel.dark .ord-step p strong{ color:#fff; }

@media (max-width:820px){
  .ord-choice{ grid-template-columns:1fr; gap:12px; margin-top:34px; }
  .ord-btn{ padding:18px 18px; gap:14px; }
  .ord-btn-ico{ width:46px; height:46px; }
  .ord-btn-ico svg{ width:21px; height:21px; }
  .ord-grid{ grid-template-columns:1fr; gap:34px; }
  .ord-panel.dark .ord-grid > .ord-text{ order:0; }   /* su mobile prima il testo, poi la card */
  .ord-panel-in > .ord-grid, .ord-panel-in > .ord-box{ margin-top:30px; }
  .ord-box{ border-radius:18px; }
  .ord-step{ gap:14px; }
  .ord-step .ico{ width:40px; height:40px; }
  .ord-step h4{ font-size:19px; }
}
@media (prefers-reduced-motion:reduce){
  .ord-btn, .ord-btn-ico, .ord-btn-arrow, .ord-panel, .ord-panel.open{ transition:none; }
}

/* =============================================================
   SHOP — pannello "Ordina a casa": colombe/panettoni, 5 gusti,
   tagli 500 g / 750 g / 1 kg, riepilogo ordine → WhatsApp.
   Vive dentro .ord-box (scuro). Il checkout online arriverà dopo.
   ============================================================= */
.shop-head{ max-width:640px; }
.shop-group{ margin-top:40px; }
.shop-group-head{ display:flex; align-items:baseline; gap:12px 14px; flex-wrap:wrap;
  padding-bottom:14px; border-bottom:1px solid rgba(255,255,255,.12); }
.shop-group-head h4{ font-family:var(--serif); font-weight:400; font-size:clamp(22px,2.6vw,28px); color:#fff; margin:0; }
.shop-group-head p{ margin:0; flex-basis:100%; font-size:13.5px; color:rgba(255,255,255,.62); }
.shop-tag{ font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  padding:5px 10px; border-radius:100px; }
.shop-tag.pasqua{ background:var(--cipria); color:var(--cipria-ink); }
.shop-tag.natale{ background:var(--amarena); color:#fff; }
.shop-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; margin-top:22px; }
.shop-item{ display:flex; flex-direction:column; padding:12px; border-radius:14px;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12);
  transition:border-color .25s, transform .25s var(--ease); }
.shop-item:hover{ border-color:rgba(198,149,47,.55); transform:translateY(-2px); }
.shop-media{ position:relative; aspect-ratio:4/5; border-radius:10px; overflow:hidden; background:rgba(255,255,255,.06); }
.shop-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.shop-ph{ display:flex; align-items:flex-end; padding:12px;
  background:radial-gradient(120% 120% at 30% 20%, #6b3a2a 0%, #3b1e14 55%, #24120a 100%); }
.shop-ph span{ font-family:var(--serif); font-size:15px; line-height:1.2; color:rgba(255,255,255,.55); }
.shop-item h5{ font-family:var(--serif); font-weight:400; font-size:16.5px; line-height:1.2; color:#fff; margin:12px 0 4px; }
.shop-item > p{ margin:0; flex:1; font-size:12.5px; line-height:1.5; color:rgba(255,255,255,.66); }
.shop-sizes{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:12px; }
.shop-sizes .size{ font-family:var(--mono); font-size:11.5px; letter-spacing:.02em; padding:6px 4px; text-align:center; border-radius:100px;
  border:1px solid rgba(255,255,255,.25); background:transparent; color:rgba(255,255,255,.88); cursor:pointer;
  transition:background .2s, color .2s, border-color .2s; }
.shop-sizes .size:hover{ border-color:var(--gold); }
.shop-sizes .size.is-on{ background:var(--gold); color:var(--cacao); border-color:var(--gold); }
.shop-sizes .size:focus-visible, .shop-foot .add:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.shop-foot{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:12px; min-height:34px; }
.shop-foot .price{ font-family:var(--mono); font-size:13.5px; color:var(--gold); }
.shop-foot .add{ margin-left:auto; font-family:var(--mono); font-size:12px; letter-spacing:.02em; padding:8px 14px; border-radius:100px;
  border:1px solid var(--gold); background:transparent; color:#fff; cursor:pointer; white-space:nowrap;
  transition:background .2s, color .2s, transform .2s var(--ease); }
.shop-foot .add:hover{ background:var(--gold); color:var(--cacao); transform:translateY(-1px); }
.shop-foot .add.done{ background:var(--gold); color:var(--cacao); }

/* riepilogo ordine */
.shop-order{ margin-top:40px; padding:clamp(20px,3vw,32px); border-radius:18px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); }
.shop-order-head{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding-bottom:14px; border-bottom:1px solid rgba(255,255,255,.12); }
.shop-order-head .lbl{ font-family:var(--mono); font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold); }
.shop-order-head .count{ font-family:var(--mono); font-size:11.5px; color:rgba(255,255,255,.6); }
.shop-order-list{ list-style:none; margin:0; padding:0; }
.shop-order-list li{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:12px 0; border-bottom:1px solid rgba(255,255,255,.10); }
.shop-order-list .tx{ flex:1; min-width:0; }
.shop-order-list .tx b{ display:block; font-family:var(--serif); font-weight:400; font-size:16px; color:#fff; }
.shop-order-list .tx small{ font-family:var(--mono); font-size:11.5px; color:rgba(255,255,255,.6); }
.shop-order-list .qty{ display:inline-flex; align-items:center; gap:8px; flex:none; }
.shop-order-list .q{ width:28px; height:28px; border-radius:50%; border:1px solid rgba(255,255,255,.3); background:transparent;
  color:#fff; font-size:16px; line-height:1; cursor:pointer; transition:border-color .2s, background .2s; }
.shop-order-list .q:hover{ border-color:var(--gold); background:rgba(198,149,47,.18); }
.shop-order-list .n{ font-family:var(--mono); font-size:14px; min-width:16px; text-align:center; color:#fff; }
.shop-order-empty{ margin:14px 0 0; font-size:14px; color:rgba(255,255,255,.62); }
.shop-order-empty[hidden]{ display:none; }
/* messaggio d'errore del pagamento: compare solo se qualcosa va storto */
.shop-errore{ margin:var(--space-sm,12px) 0 0; font-family:var(--mono); font-size:12.5px;
  color:#F0C9A0; background:rgba(142,47,58,.28); border:1px solid rgba(240,201,160,.35);
  border-radius:10px; padding:10px 12px; }
.shop-errore[hidden]{ display:none; }
#shopPaga[hidden]{ display:none; }
.shop-order-note{ margin:16px 0 0; font-family:var(--mono); font-size:12.5px; line-height:1.65; color:rgba(255,255,255,.62); max-width:60ch; }
.shop-order .ord-ctas{ margin-top:20px; }

/* passi in breve */
.shop-steps{ list-style:none; margin:32px 0 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:16px 24px; }
.shop-steps li{ display:flex; gap:12px; align-items:flex-start; }
.shop-steps .ico{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(198,149,47,.55); color:var(--gold); flex:none;
  display:flex; align-items:center; justify-content:center; }
.shop-steps .ico svg{ width:17px; height:17px; display:block; }
.shop-steps b{ display:block; font-family:var(--mono); font-weight:500; font-size:12px; letter-spacing:.06em; color:#fff; }
.shop-steps p{ margin:3px 0 0; font-size:13px; line-height:1.5; color:rgba(255,255,255,.66); }

@media (max-width:1024px){ .shop-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:600px){
  .shop-grid{ grid-template-columns:1fr; gap:12px; }
  .shop-item{ display:grid; grid-template-columns:92px 1fr; grid-template-rows:auto auto auto auto; column-gap:12px; padding:10px; }
  .shop-media{ grid-row:1 / span 4; aspect-ratio:4/5; }
  .shop-item h5{ margin-top:0; }
  .shop-steps{ grid-template-columns:1fr; }
  .shop-sizes .size{ min-height:38px; font-size:12.5px; }
  .shop-foot .add{ min-height:40px; padding:9px 16px; font-size:12.5px; }
  .shop-order-list .q{ width:36px; height:36px; font-size:18px; }
  .shop-order-list .qty{ gap:10px; }
}

/* =============================================================
   MIGNON & PASTICCINI (galleria foto reali)
   ============================================================= */
.mignon{ background:var(--bg-warm); }
.mignon-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:48px; }
.mig{ position:relative; display:block; border-radius:14px; overflow:hidden; aspect-ratio:4/5;
  text-decoration:none; color:#fff; box-shadow:0 10px 26px rgba(42,26,18,.12);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.mig:hover{ transform:translateY(-5px); box-shadow:0 20px 46px rgba(42,26,18,.20); }
.mig .ph{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  background-size:cover; background-position:center; transition:transform .6s var(--ease); }
.mig:hover .ph{ transform:scale(1.06); }
.mig::after{ content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top, rgba(20,11,5,.82) 0%, rgba(20,11,5,.22) 46%, rgba(20,11,5,0) 72%); }
.mig-cap{ position:absolute; left:0; right:0; bottom:0; z-index:1; padding:18px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
.mig-cap h3{ font-family:var(--serif); font-weight:400; font-size:18px; line-height:1.18; margin:0; }
.mig-cap .price{ font-family:var(--mono); font-size:12px; color:var(--oro); white-space:nowrap; }
.mignon .more{ margin-top:44px; text-align:center; }
@media (max-width:900px){
  .mignon-grid{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .mig-cap{ padding:13px; }
  .mig-cap h3{ font-size:14.5px; line-height:1.2; }
}

/* foto AI drop-in — sostituisci i file in images/mignon/. Il background-color
   fa da fallback finché la foto non è stata caricata. */

/* =============================================================
   STORIA / IL MAESTRO (split)
   ============================================================= */
.storia{ background:var(--ink); color:#fff; overflow:hidden; }
.storia-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,80px); align-items:center; }
.storia-media{ position:relative; width:100%; border-radius:18px; overflow:hidden;
  box-shadow:0 30px 70px rgba(0,0,0,.4); }
.storia-media .ph{ display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; }
.storia-media .badge{ position:absolute; right:-18px; bottom:26px; width:128px; height:128px; border-radius:50%;
  background:var(--gold); color:#2a1a12; display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-family:var(--serif); text-align:center; box-shadow:0 12px 30px rgba(0,0,0,.35); }
.storia-media .badge b{ font-size:30px; line-height:1; }
.storia-media .badge small{ font-family:var(--mono); font-size:9px; letter-spacing:.16em; text-transform:uppercase; margin-top:4px; }
.storia .eyebrow{ color:var(--gold); }
.storia .eyebrow::before{ background:var(--gold); }
.storia h2{ font-family:var(--serif); font-weight:400; font-size:clamp(28px,4vw,46px); line-height:1.1;
  margin:18px 0 0; }
.storia h2 em{ font-style:italic; color:var(--gold); }
.storia p{ color:rgba(255,255,255,.82); line-height:1.8; margin:20px 0 0; font-size:15.5px; max-width:52ch; }
.storia p strong{ color:var(--gold); font-weight:500; }
.storia .sign{ font-family:var(--serif); font-style:italic; font-size:22px; color:var(--gold); margin-top:26px; }
.storia .btn{ margin-top:30px; }
@media (max-width:820px){ .storia-grid{ grid-template-columns:1fr; } .storia-media{ max-width:420px; margin:0 auto; } }

/* =============================================================
   LABORATORIO (3 pillars)
   ============================================================= */
.lab{ background:var(--bg-warm); }
.lab-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; margin-top:56px; }
.pillar{ text-align:center; }
.pillar .num{ font-family:var(--serif); font-size:15px; color:var(--caramello); letter-spacing:.1em; }
.pillar .ico{ width:64px; height:64px; margin:0 auto 18px; border-radius:50%; border:1px solid var(--gold);
  display:flex; align-items:center; justify-content:center; color:var(--gold-deep); }
.pillar .ico svg{ width:28px; height:28px; }
.pillar h3{ font-family:var(--serif); font-weight:400; font-size:23px; color:var(--ink); margin:0 0 10px; }
.pillar p{ color:var(--muted); line-height:1.7; font-size:14.5px; max-width:34ch; margin:0 auto; }
.lab-divider{ width:1px; }
@media (max-width:820px){ .lab-grid{ grid-template-columns:1fr; gap:44px; } }

/* =============================================================
   NUMERI (stats band)
   ============================================================= */
.stats{ background:var(--ink); color:#fff; }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center; }
.stat b{ font-family:var(--serif); font-weight:400; font-size:clamp(34px,5vw,56px); color:var(--gold); display:block; line-height:1; }
.stat span{ font-family:var(--mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.7); margin-top:12px; display:block; }
@media (max-width:640px){ .stats-grid{ grid-template-columns:1fr 1fr; gap:40px 24px; } }

/* =============================================================
   SU MISURA (custom cakes / events)
   ============================================================= */
.sumisura{ background:var(--paper); }
.sm-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(30px,6vw,80px); align-items:center; }
.sm-media{ position:relative; aspect-ratio:1/1; border-radius:18px; overflow:hidden;
  box-shadow:0 24px 60px rgba(42,26,18,.16), 0 0 0 1px var(--cipria) inset; }
.sm-media .ph{ position:absolute; inset:0;
  background:radial-gradient(120% 120% at 60% 25%,#f4e6d3,#dcb98f 45%,#9c6a3e 80%,#5f3c20); }
.sm-badge{ position:absolute; top:16px; left:16px; z-index:2; background:var(--cipria); color:var(--cipria-ink);
  font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  padding:8px 14px; border-radius:100px; }
.sm-list{ list-style:none; margin:26px 0 0; padding:0; }
.sm-list li{ display:flex; gap:14px; align-items:flex-start; padding:14px 0; border-bottom:1px solid var(--line);
  font-size:15px; color:var(--ink); }
.sm-list li:last-child{ border-bottom:0; }
.sm-list .mk{ color:var(--cipria-ink); font-family:var(--serif); font-size:15px; margin-top:1px; }
.sm-list b{ font-weight:500; } .sm-list small{ display:block; color:var(--muted); margin-top:3px; font-size:13px; }
.sumisura .btn{ margin-top:26px; }
@media (max-width:820px){ .sm-grid{ grid-template-columns:1fr; } .sm-media{ max-width:460px; } }

/* =============================================================
   RECENSIONI
   ============================================================= */
.recensioni{ background:var(--bg-warm); }
.rec-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:50px; }
.rec{ background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:30px; }
.rec .stars{ color:var(--gold); letter-spacing:3px; font-size:15px; }
.rec p{ font-family:var(--serif); font-size:18px; line-height:1.55; color:var(--ink); margin:16px 0 22px; font-style:italic; }
.rec .who{ display:flex; align-items:center; gap:12px; }
.rec .av{ width:42px; height:42px; border-radius:50%; background:var(--cream); color:var(--caramello);
  display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:17px; }
.rec .who b{ display:block; font-size:14px; color:var(--ink); font-weight:500; }
.rec .who span{ font-family:var(--mono); font-size:11px; letter-spacing:.06em; color:var(--muted); }
.recensioni .more{ margin-top:40px; text-align:center; }
@media (max-width:900px){ .rec-grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; } }

/* =============================================================
   SEDI (locations)
   ============================================================= */
.sedi{ background:var(--paper); }
.sedi-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:48px; }
.sedi-grid.one{ grid-template-columns:minmax(0,460px); justify-content:center; }
.sede{ border:1px solid var(--line); border-radius:16px; padding:28px; background:var(--bg-warm);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.sede:hover{ transform:translateY(-4px); box-shadow:0 16px 40px rgba(42,26,18,.12); }
.sede .city{ font-family:var(--serif); font-size:24px; color:var(--ink); }
.sede .addr{ color:var(--muted); font-size:14px; line-height:1.7; margin:12px 0 16px; }
.sede .row{ display:flex; gap:8px; font-size:13px; font-family:var(--mono); color:var(--ink); padding:5px 0; }
.sede .row .lbl{ color:var(--caramello); min-width:62px; }
.sede .row a{ color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); }
.sede .row a:hover{ border-color:var(--caramello); color:var(--caramello); }
.sede .maplink{ margin-top:18px; display:inline-flex; align-items:center; gap:7px; font-family:var(--mono);
  font-size:12px; letter-spacing:.04em; color:var(--caramello); text-decoration:none; }
.sede .maplink::after{ content:'→'; transition:transform .25s var(--ease); }
.sede .maplink:hover::after{ transform:translateX(4px); }
@media (max-width:900px){ .sedi-grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; } }

/* =============================================================
   FAQ
   ============================================================= */
.faq{ background:var(--bg-warm); }
.faq-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px 40px; margin-top:48px; }
.faq-item h3{ font-family:var(--serif); font-weight:400; font-size:20px; color:var(--ink);
  margin:0 0 8px; line-height:1.25; }
.faq-item p{ margin:0; color:var(--muted); line-height:1.75; font-size:15px; }
.faq-item a{ color:var(--caramello); text-decoration:none; border-bottom:1px solid var(--line); }
.faq-item a:hover{ border-color:var(--caramello); }
@media (max-width:820px){ .faq-grid{ grid-template-columns:1fr; gap:22px; } }

/* =============================================================
   INSTAGRAM gallery
   ============================================================= */
.insta{ background:var(--ink); color:#fff; }
.insta .center .eyebrow, .insta .center .eyebrow::before, .insta .center .eyebrow::after{ color:var(--gold); }
.insta .section-title{ color:#fff; } .insta .section-lead{ color:rgba(255,255,255,.72); }
.insta-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-top:44px; }
.ig{ aspect-ratio:1/1; border-radius:10px; overflow:hidden; position:relative; }
.ig .ph{ position:absolute; inset:0; transition:transform .5s var(--ease); }
.ig img.ph{ width:100%; height:100%; object-fit:cover; }
.ig:hover .ph{ transform:scale(1.08); }
.ig::after{ content:''; position:absolute; inset:0; background:rgba(20,11,5,0); transition:background .3s; }
.ig:hover::after{ background:rgba(20,11,5,.25); }
.ig-1{ background:radial-gradient(120% 120% at 30% 30%,#d8a24c,#6f4310); }
.ig-2{ background:radial-gradient(120% 120% at 60% 30%,#e8b7c0,#5c2f3b); }
.ig-3{ background:radial-gradient(120% 120% at 40% 40%,#7a4a24,#241009); }
.ig-4{ background:radial-gradient(120% 120% at 55% 25%,#f0d9c2,#7d4a2c); }
.ig-5{ background:radial-gradient(120% 120% at 40% 60%,#e6c98f,#5f4212); }
.ig-6{ background:radial-gradient(120% 120% at 60% 40%,#c9a15e,#3a2110); }
.insta .handle{ text-align:center; margin-top:34px; }
.insta .handle a{ font-family:var(--mono); font-size:14px; letter-spacing:.06em; color:var(--gold); text-decoration:none; }
@media (max-width:760px){ .insta-grid{ grid-template-columns:repeat(3,1fr); } }

/* reel Instagram caricati da reels.js: verticali, con badge play */
.insta-grid.is-reels .ig{ aspect-ratio:9/16; }
.ig .play{ position:absolute; right:8px; bottom:8px; width:20px; height:20px; z-index:1; color:#fff;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.65)); }

/* =============================================================
   NEWSLETTER
   ============================================================= */
.news{ background:var(--gold); color:#2a1a12; text-align:center; }
.news h2{ font-family:var(--serif); font-weight:400; font-size:clamp(28px,4vw,44px); margin:16px 0 0; }
.news p{ max-width:520px; margin:14px auto 0; line-height:1.7; color:#5b3f14; font-size:15.5px; }
.news form{ display:flex; gap:10px; max-width:480px; margin:30px auto 0; flex-wrap:wrap; justify-content:center; }
.news input{ flex:1; min-width:220px; padding:15px 20px; border-radius:100px; border:1px solid rgba(42,26,18,.35);
  background:rgba(255,255,255,.6); font-family:var(--mono); font-size:14px; color:var(--ink); }
.news input::placeholder{ color:#8a6b3a; }
.news input:focus{ outline:none; border-color:var(--ink); background:#fff; }
.news button{ padding:15px 30px; border-radius:100px; border:0; cursor:pointer; background:var(--ink); color:var(--cream);
  font-family:var(--mono); font-size:13px; letter-spacing:.04em; transition:transform .2s, background .2s; }
.news button:hover{ transform:translateY(-2px); background:#3d251a; }
.news .fine{ font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:#6b4c1c; margin-top:16px; }

/* =============================================================
   TASTO WHATSAPP FISSO — in basso a destra, compare dopo la hero
   (site.js aggiunge .show insieme allo stato "solid" della nav)
   ============================================================= */
.wa-float{ position:fixed; right:18px; bottom:22px; z-index:38; width:56px; height:56px; border-radius:50%;
  background:#128C7E; color:#fff; display:flex; align-items:center; justify-content:center; text-decoration:none;
  box-shadow:0 10px 28px rgba(0,0,0,.24); opacity:0; transform:translateY(16px) scale(.9); pointer-events:none;
  transition:opacity .35s var(--ease), transform .35s var(--ease), background .2s; }
.wa-float.show{ opacity:1; transform:none; pointer-events:auto; }
.wa-float:hover{ background:#0f766a; }
.wa-float:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.wa-float svg{ width:28px; height:28px; display:block; }
.wa-float .wa-tip{ position:absolute; right:calc(100% + 12px); top:50%; transform:translateY(-50%); white-space:nowrap;
  background:var(--ink); color:#fff; font-family:var(--mono); font-size:12px; letter-spacing:.02em;
  padding:8px 13px; border-radius:100px; opacity:0; transition:opacity .2s; pointer-events:none; }
.wa-float:hover .wa-tip, .wa-float:focus-visible .wa-tip{ opacity:1; }
body.menu-open .wa-float, body.in-ordina .wa-float{ opacity:0; pointer-events:none; }
@media (max-width:600px){ .wa-float{ width:52px; height:52px; right:14px; bottom:16px; } .wa-float .wa-tip{ display:none; } }
@media (prefers-reduced-motion:reduce){ .wa-float{ transition:none; } }

/* =============================================================
   FOOTER
   ============================================================= */
.foot{ background:#20120a; color:rgba(255,255,255,.72); padding:76px 0 30px; }
.foot-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; }
.foot-logo img{ height:100px; width:auto; display:block; margin-bottom:12px; }
.foot-logo small{ display:block; font-family:var(--mono); font-size:9px; letter-spacing:.34em;
  text-transform:uppercase; opacity:.6; }
.foot p.blurb{ margin:18px 0 0; line-height:1.75; font-size:14px; max-width:34ch; }
.foot h3{ font-family:var(--mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold);
  margin:0 0 18px; }
.foot ul{ list-style:none; margin:0; padding:0; }
.foot ul li{ margin-bottom:11px; }
.foot ul a{ text-decoration:none; font-size:14px; color:rgba(255,255,255,.72); transition:color .2s; }
.foot ul a:hover{ color:var(--gold); }
.foot .social{ display:flex; gap:14px; margin-top:6px; }
.foot .social a{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center; color:#fff; transition:border-color .2s, background .2s; }
.foot .social a:hover{ border-color:var(--gold); background:rgba(200,153,46,.14); }
.foot .social svg{ width:17px; height:17px; }
.foot-bottom{ margin-top:56px; padding-top:24px; border-top:1px solid rgba(255,255,255,.1);
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.02em; color:rgba(255,255,255,.5); }
.foot-bottom a{ text-decoration:none; color:rgba(255,255,255,.5); }
.foot-bottom a:hover{ color:var(--gold); }
@media (max-width:820px){ .foot-grid{ grid-template-columns:1fr 1fr; gap:36px; } }
@media (max-width:480px){ .foot-grid{ grid-template-columns:1fr; } }

/* ============================================================
   Tocco sul telefono — 18.09.2026
   Da telefono si tocca col pollice, non si clicca col mouse: i
   bersagli sotto i 44 px si sbagliano. Qui non cambia niente di
   come si vede, si allarga solo l'area sensibile.
   ============================================================ */
@media (max-width:600px){
  /* i due link che valgono davvero: telefono e WhatsApp */
  .dove-row a.tx{ display:block; padding:11px 0; margin:-11px 0; }
  .nav-cta{ min-height:44px; display:inline-flex; align-items:center; }
  .chero-skip{ min-height:44px; }
  /* piu' e meno del carrello: si sbagliavano a 36 px */
  .shop-order-list .q{ width:44px; height:44px; font-size:20px; }
  .sede .maplink{ padding:11px 0; }
  /* telefono e WhatsApp tornano anche qui, nella scheda della sede */
  .sede .row a{ display:inline-block; padding:11px 0; }
  .foot a, .foot-bottom a{ display:inline-block; padding:11px 0; }
  .foot .social a{ width:44px; height:44px; padding:0; }
}


/* ============================================================
   Ordina sul telefono — 01.10.2026
   Su 375 px c'erano tre riquadri uno dentro l'altro (pannello →
   scheda torte → calcolatore), ognuno col suo bordo e 24 px di
   margine: ai campi restavano 230 px. Qui i contenitori diventano
   piatti, le ripetizioni spariscono e le azioni vanno a tutta
   larghezza. Il desktop non cambia.
   ============================================================ */
@media (max-width:600px){
  .wrap{ padding:0 18px; }
  .ord-choice{ margin-top:26px; }
  .ord-btn{ padding:16px; box-shadow:none; }
  .ord-btn-tx small{ font-size:12px; }
  /* ripetono il testo sopra o i tre passi: sul telefono sono solo scroll in piu' */
  .ord-chips, #ritiro .ord-card, .shop-steps, .ord-torte > .center .section-lead{ display:none; }
  .ord-ctas{ flex-direction:column; }
  .ord-ctas .btn{ justify-content:center; width:100%; }
  /* scheda torte: niente riquadro, solo un filetto che la separa */
  .ord-panel-in > .ord-torte{ background:none; border:0; border-radius:0; padding:40px 0 0;
    margin-top:40px; border-top:1px solid var(--line); }
  /* shop: il fondo scuro va a filo schermo invece di stare in una scatola */
  .ord-box{ margin:0 -18px; border-radius:0; padding:40px 18px; }
  .shop-item{ border:0; border-bottom:1px solid rgba(255,255,255,.10); border-radius:0;
    background:none; padding:0 0 14px; grid-template-columns:104px 1fr; }
  .shop-item:hover{ transform:none; }
  .shop-media{ border-radius:10px; }
  .shop-order{ margin-top:28px; padding:18px; }
}