/* ============================================================================
   PIZZA VERA — FOGLIO DI STILE UNICO
   Mobile-first: le regole base sono per il telefono, i @media allargano.
   Palette: crema (sfondo), carbone (testi e sezioni scure), rosso pomodoro
   (azioni), verde basilico (conferme), oro caldo (dettagli).
   ========================================================================== */

:root{
  --crema:#F6EFE2;
  --crema-2:#EEE4D1;
  --panna:#FFFBF4;
  --carbone:#141311;
  --carbone-2:#1E1C19;
  --carbone-3:#2A2723;
  --ink:#1B1917;
  --muted:#6F685E;
  --line:rgba(27,25,23,.10);
  --line-strong:rgba(27,25,23,.18);
  --pomodoro:#C4161C;
  --pomodoro-2:#A5121A;
  --pomodoro-soft:#FBE9E8;
  --basilico:#2E6B3E;
  --basilico-soft:#E6F0E6;
  --oro:#D9A441;
  --oro-soft:#FBF1DC;
  --r-sm:10px; --r:16px; --r-lg:24px; --r-xl:32px;
  --shadow-sm:0 1px 2px rgba(20,19,17,.06), 0 2px 8px rgba(20,19,17,.06);
  --shadow:0 10px 30px -10px rgba(20,19,17,.25);
  --shadow-lg:0 30px 60px -20px rgba(20,19,17,.35);
  --font-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --header-h:64px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --safe-b:env(safe-area-inset-bottom, 0px);
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
html:focus-within{scroll-behavior:smooth;}
body{
  margin:0; background:var(--crema); color:var(--ink);
  font-family:var(--font-body); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,picture,video{max-width:100%; display:block;}
button,input,select,textarea{font:inherit; color:inherit;}
button{cursor:pointer; background:none; border:0; padding:0;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{margin:0; font-family:var(--font-display); font-weight:600; line-height:1.08; letter-spacing:-.01em;}
p{margin:0;}
ul{margin:0; padding:0; list-style:none;}
:focus-visible{outline:3px solid var(--oro); outline-offset:3px; border-radius:6px;}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
.hidden{display:none !important;}

.wrap{width:min(100% - 40px, 1180px); margin-inline:auto;}
@media (max-width:480px){ .wrap{width:min(100% - 32px, 1180px);} }

/* ------------------------------ TIPOGRAFIA ------------------------------ */
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:.74rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--pomodoro);
}
.eyebrow::before{content:''; width:22px; height:2px; background:currentColor; border-radius:2px;}
.eyebrow.light{color:var(--oro);}
.h-xl{font-size:clamp(2.5rem, 9vw, 5.2rem); font-weight:700;}
.h-l{font-size:clamp(2rem, 6vw, 3.4rem);}
.h-m{font-size:clamp(1.55rem, 4.5vw, 2.3rem);}
.lead{font-size:clamp(1.02rem, 2.6vw, 1.2rem); color:var(--muted); max-width:56ch;}
.serif-i{font-family:var(--font-display); font-style:italic; font-weight:500;}
.red{color:var(--pomodoro);}

/* ------------------------------ BOTTONI ------------------------------ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 22px; border-radius:999px;
  font-weight:800; font-size:1rem; letter-spacing:.01em; line-height:1;
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), background .18s, color .18s;
  -webkit-tap-highlight-color:transparent; user-select:none; white-space:nowrap;
}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--pomodoro); color:#fff; box-shadow:0 10px 24px -10px rgba(196,22,28,.7);}
.btn-primary:hover{background:var(--pomodoro-2); box-shadow:0 14px 28px -10px rgba(196,22,28,.8); transform:translateY(-1px);}
.btn-dark{background:var(--carbone); color:var(--crema);}
.btn-dark:hover{background:#000;}
.btn-light{background:var(--panna); color:var(--carbone); border:1px solid var(--line-strong);}
.btn-light:hover{background:#fff;}
.btn-ghost{background:transparent; color:var(--carbone); border:1.5px solid var(--line-strong);}
.btn-ghost:hover{border-color:var(--carbone);}
.btn-ghost.on-dark{color:var(--crema); border-color:rgba(246,239,226,.35);}
.btn-ghost.on-dark:hover{border-color:var(--crema); background:rgba(246,239,226,.08);}
.btn-lg{min-height:58px; padding:0 28px; font-size:1.05rem;}
.btn-sm{min-height:42px; padding:0 16px; font-size:.9rem;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.45; pointer-events:none; box-shadow:none;}
.btn .ico{width:20px; height:20px; flex:none;}
.icon-btn{
  width:44px; height:44px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  color:var(--carbone); transition:background .15s;
}
.icon-btn:hover{background:rgba(27,25,23,.06);}
.icon-btn svg{width:22px; height:22px;}

/* ------------------------------ HEADER ------------------------------ */
.header{
  position:sticky; top:0; z-index:60; height:var(--header-h);
  background:rgba(246,239,226,.82); backdrop-filter:saturate(160%) blur(14px); -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid transparent; transition:border-color .2s, background .2s;
}
.header.scrolled{border-bottom-color:var(--line);}
.header.dark{background:rgba(20,19,17,.78); color:var(--crema);}
.header.dark .icon-btn{color:var(--crema);}
.header .wrap{height:100%; display:flex; align-items:center; justify-content:space-between; gap:12px;}
.brand{display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:700; font-size:1.25rem; letter-spacing:-.01em;}
.brand img{width:40px; height:40px; border-radius:10px;}
.brand em{font-style:italic; color:var(--pomodoro); font-weight:600;}
.nav{display:none; gap:6px; align-items:center;}
.nav a{padding:10px 14px; border-radius:999px; font-weight:700; font-size:.95rem; color:inherit; opacity:.85; transition:background .15s, opacity .15s;}
.nav a:hover{background:rgba(27,25,23,.06); opacity:1;}
.header.dark .nav a:hover{background:rgba(246,239,226,.1);}
.nav a.active{opacity:1;}
.header-actions{display:flex; align-items:center; gap:6px;}
.header .btn-order{display:none;}
@media (min-width:900px){
  .nav{display:flex;}
  .header .btn-order{display:inline-flex;}
  .header .burger{display:none;}
}

/* Menu mobile a tendina */
.mnav{position:fixed; inset:0; z-index:80; display:none;}
.mnav.open{display:block;}
.mnav-bg{position:absolute; inset:0; background:rgba(20,19,17,.55); backdrop-filter:blur(3px); animation:fade .25s var(--ease);}
.mnav-panel{
  position:absolute; top:0; right:0; bottom:0; width:min(86vw, 360px);
  background:var(--carbone); color:var(--crema); padding:22px 22px calc(28px + var(--safe-b));
  display:flex; flex-direction:column; animation:slideL .32s var(--ease);
}
.mnav-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:26px;}
.mnav-links a{display:flex; align-items:center; justify-content:space-between; padding:16px 4px; border-bottom:1px solid rgba(246,239,226,.12); font-family:var(--font-display); font-size:1.6rem; font-weight:600;}
.mnav-links a span{font-size:1rem; opacity:.5;}
.mnav-foot{margin-top:auto; display:grid; gap:10px;}
.mnav-meta{font-size:.85rem; opacity:.65; line-height:1.5;}
@keyframes fade{from{opacity:0} to{opacity:1}}
@keyframes slideL{from{transform:translateX(30px); opacity:0} to{transform:none; opacity:1}}
@keyframes slideUp{from{transform:translateY(40px); opacity:0} to{transform:none; opacity:1}}

/* ------------------------------ PROMO BAR ------------------------------ */
.promo-bar{background:var(--carbone); color:var(--crema); font-size:.82rem; font-weight:700; text-align:center; padding:9px 14px; letter-spacing:.02em;}
.promo-bar b{color:var(--oro);}
.promo-bar code{background:rgba(246,239,226,.14); padding:2px 8px; border-radius:6px; font-family:inherit; letter-spacing:.08em;}

/* ------------------------------ HERO ------------------------------ */
.hero{position:relative; background:var(--carbone); color:var(--crema); overflow:hidden; isolation:isolate;}
.hero-media{position:absolute; inset:0; z-index:-1;}
.hero-media img{width:100%; height:100%; object-fit:cover; object-position:center 70%; animation:kenburns 18s ease-in-out infinite alternate; transform-origin:center;}
@keyframes kenburns{from{transform:scale(1)} to{transform:scale(1.08)}}
.hero-media::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,19,17,.55) 0%, rgba(20,19,17,.25) 35%, rgba(20,19,17,.72) 75%, var(--carbone) 100%);
}
.hero .wrap{position:relative; min-height:calc(100svh - var(--header-h) - 38px); display:flex; flex-direction:column; justify-content:flex-end; padding:70px 0 40px;}
.hero-badges{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px;}
.pill{display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border-radius:999px; font-size:.78rem; font-weight:800; letter-spacing:.02em; background:rgba(246,239,226,.14); backdrop-filter:blur(6px); border:1px solid rgba(246,239,226,.22);}
.pill .dot{width:8px; height:8px; border-radius:50%; background:#4ADE80; box-shadow:0 0 0 4px rgba(74,222,128,.25);}
.pill.closed .dot{background:#F87171; box-shadow:0 0 0 4px rgba(248,113,113,.25);}
.hero h1{font-size:clamp(2.7rem, 11vw, 6rem); font-weight:700; line-height:.98; letter-spacing:-.02em; max-width:12ch; text-wrap:balance;}
.hero h1 em{font-style:italic; font-weight:500; color:var(--oro);}
.hero p{margin-top:18px; font-size:clamp(1rem, 2.8vw, 1.25rem); max-width:44ch; color:rgba(246,239,226,.82); text-wrap:pretty;}
.hero-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px;}
.hero-meta{display:flex; flex-wrap:wrap; gap:18px 26px; margin-top:34px; padding-top:22px; border-top:1px solid rgba(246,239,226,.18); font-size:.9rem; color:rgba(246,239,226,.78);}
.hero-meta b{display:block; color:var(--crema); font-weight:800;}
@media (min-width:900px){
  .hero .wrap{min-height:min(88svh, 820px); justify-content:center; padding:110px 0 90px;}
  .hero-media img{object-position:center 40%;}
  .hero-media::after{background:linear-gradient(90deg, rgba(20,19,17,.88) 0%, rgba(20,19,17,.55) 50%, rgba(20,19,17,.15) 100%);}
}

/* ------------------------------ SEZIONI ------------------------------ */
.section{padding:64px 0;}
.section.tight{padding:44px 0;}
.section-head{display:flex; flex-direction:column; gap:12px; margin-bottom:28px;}
.section-head .lead{margin-top:2px;}
.section-head-row{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.dark{background:var(--carbone); color:var(--crema);}
.dark .lead{color:rgba(246,239,226,.72);}
.dark .h-l,.dark .h-m{color:var(--crema);}
.panna{background:var(--panna);}
@media (min-width:900px){ .section{padding:96px 0;} .section.tight{padding:64px 0;} .section-head{margin-bottom:40px;} }

/* Strip marquee */
.marquee{overflow:hidden; background:var(--pomodoro); color:#fff; padding:12px 0; font-family:var(--font-display); font-style:italic; font-size:1.05rem; white-space:nowrap;}
.marquee-track{display:inline-flex; gap:0; animation:marquee 32s linear infinite; will-change:transform;}
.marquee span{padding:0 22px; display:inline-flex; align-items:center; gap:22px;}
.marquee span::after{content:'✦'; font-style:normal; font-size:.7rem; opacity:.7;}
@keyframes marquee{to{transform:translateX(-50%)}}

/* Griglia categorie in home */
.cat-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:12px;}
.cat-card{
  position:relative; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:1/1.05; color:#fff; background:var(--carbone-2);
  box-shadow:var(--shadow-sm); transform:translateZ(0); transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.cat-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease);}
.cat-card::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,19,17,0) 35%, rgba(20,19,17,.85) 100%);}
.cat-card .cc-body{position:absolute; inset:auto 0 0 0; padding:16px; z-index:1;}
.cat-card h3{font-size:1.35rem; font-weight:600;}
.cat-card small{display:block; font-size:.78rem; opacity:.8; margin-top:2px;}
.cat-card .cc-arrow{position:absolute; top:12px; right:12px; z-index:1; width:36px; height:36px; border-radius:50%; background:rgba(246,239,226,.18); backdrop-filter:blur(6px); display:grid; place-items:center; transition:background .2s;}
.cat-card:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
.cat-card:hover img{transform:scale(1.06);}
.cat-card:hover .cc-arrow{background:var(--pomodoro);}
.cat-card.wide{grid-column:span 2; aspect-ratio:2/1.1;}
@media (min-width:700px){ .cat-grid{grid-template-columns:repeat(3, 1fr); gap:16px;} .cat-card{aspect-ratio:1/1;} .cat-card.wide{grid-column:span 2; aspect-ratio:auto;} }
@media (min-width:1000px){ .cat-grid{grid-template-columns:repeat(4, 1fr);} .cat-card.wide{grid-column:span 2; grid-row:span 1;} .cat-card h3{font-size:1.6rem;} }

/* Best seller (scroller orizzontale su mobile) */
.scroller{display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 20px 18px; margin:0 -20px; scrollbar-width:none; -webkit-overflow-scrolling:touch;}
.scroller::-webkit-scrollbar{display:none;}
.scroller > *{scroll-snap-align:start; flex:0 0 min(78vw, 300px);}
@media (min-width:900px){ .scroller{display:grid; grid-template-columns:repeat(4, 1fr); overflow:visible; margin:0; padding:0;} .scroller > *{flex:auto;} }
.dish{background:var(--panna); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s var(--ease);}
.dish:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
.dish-img{aspect-ratio:4/3; overflow:hidden; background:var(--crema-2);}
.dish-img img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease);}
.dish:hover .dish-img img{transform:scale(1.05);}
.dish-body{padding:16px 16px 18px; display:flex; flex-direction:column; gap:8px; flex:1;}
.dish-top{display:flex; justify-content:space-between; gap:12px; align-items:baseline;}
.dish h3{font-size:1.25rem;}
.price{font-family:var(--font-display); font-weight:700; font-size:1.15rem; white-space:nowrap;}
.dish p{font-size:.88rem; color:var(--muted); flex:1;}
.dish .btn{margin-top:6px;}

/* Come funziona */
.steps{display:grid; gap:14px;}
.step{background:var(--panna); border:1px solid var(--line); border-radius:var(--r-lg); padding:22px; display:flex; gap:16px; align-items:flex-start;}
.step-n{flex:none; width:48px; height:48px; border-radius:14px; background:var(--carbone); color:var(--oro); font-family:var(--font-display); font-weight:700; font-size:1.3rem; display:grid; place-items:center;}
.step h3{font-size:1.2rem; margin-bottom:6px;}
.step p{color:var(--muted); font-size:.95rem;}
@media (min-width:800px){ .steps{grid-template-columns:repeat(3, 1fr);} .step{flex-direction:column; padding:28px;} }

/* Perché noi (sezione scura con foto) */
.about-grid{display:grid; gap:28px; align-items:center;}
.about-photo{position:relative; border-radius:var(--r-xl); overflow:hidden; aspect-ratio:4/5; box-shadow:var(--shadow-lg);}
.about-photo img{width:100%; height:100%; object-fit:cover;}
.about-photo .stamp{position:absolute; left:16px; bottom:16px; background:var(--crema); color:var(--carbone); border-radius:14px; padding:12px 14px; font-size:.8rem; font-weight:800; line-height:1.2; box-shadow:var(--shadow);}
.about-photo .stamp b{display:block; font-family:var(--font-display); font-size:1.5rem; color:var(--pomodoro);}
.about-list{display:grid; gap:14px; margin-top:26px;}
.about-list li{display:flex; gap:14px; align-items:flex-start;}
.about-list .ic{flex:none; width:42px; height:42px; border-radius:12px; background:rgba(246,239,226,.08); border:1px solid rgba(246,239,226,.14); display:grid; place-items:center; font-size:1.2rem;}
.about-list b{display:block; font-weight:800;}
.about-list span{font-size:.92rem; color:rgba(246,239,226,.7);}
@media (min-width:900px){ .about-grid{grid-template-columns:1.05fr 1fr; gap:64px;} .about-photo{aspect-ratio:4/5;} }

/* Recensioni */
.reviews{display:grid; gap:14px;}
.review{background:var(--panna); border:1px solid var(--line); border-radius:var(--r-lg); padding:22px; display:flex; flex-direction:column; gap:12px;}
.stars{color:var(--oro); letter-spacing:2px; font-size:.95rem;}
.review p{font-size:.98rem; line-height:1.6; text-wrap:pretty;}
.review .who{display:flex; align-items:center; gap:10px; margin-top:auto; font-size:.85rem; color:var(--muted);}
.review .who b{color:var(--ink);}
.avatar{width:36px; height:36px; border-radius:50%; background:var(--carbone); color:var(--oro); font-weight:800; display:grid; place-items:center; font-size:.9rem;}
.rating-box{display:flex; align-items:center; gap:14px; background:var(--carbone); color:var(--crema); border-radius:var(--r-lg); padding:18px 20px;}
.rating-box .big{font-family:var(--font-display); font-size:2.6rem; font-weight:700; line-height:1;}
.rating-box small{display:block; opacity:.7; font-size:.8rem;}
@media (min-width:800px){ .reviews{grid-template-columns:repeat(3, 1fr);} }

/* Contatti */
.contact-grid{display:grid; gap:18px;}
.contact-card{background:var(--panna); border:1px solid var(--line); border-radius:var(--r-lg); padding:22px; display:grid; gap:14px;}
.contact-row{display:flex; gap:14px; align-items:flex-start; padding:12px 0; border-bottom:1px solid var(--line);}
.contact-row:last-child{border-bottom:0;}
.contact-row .ic{flex:none; width:42px; height:42px; border-radius:12px; background:var(--crema); display:grid; place-items:center; font-size:1.2rem;}
.contact-row b{display:block;}
.contact-row span{color:var(--muted); font-size:.92rem;}
.contact-row a.lnk{color:var(--pomodoro); font-weight:800;}
.map{border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-sm); min-height:280px; background:var(--crema-2); position:relative;}
.map iframe{width:100%; height:100%; min-height:320px; border:0; display:block; filter:saturate(.85) contrast(1.05);}
.map-consent{position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:28px; background:linear-gradient(160deg, var(--crema-2), var(--crema));}
.map-consent p{max-width:34ch; color:var(--muted); margin-bottom:14px;}
.hours-table{display:grid; gap:6px; font-size:.95rem;}
.hours-table div{display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px dashed var(--line);}
.hours-table b{font-weight:800;}
@media (min-width:900px){ .contact-grid{grid-template-columns:1fr 1.2fr; gap:28px;} }

/* Footer */
.footer{background:var(--carbone); color:rgba(246,239,226,.72); padding:56px 0 calc(28px + var(--safe-b)); font-size:.9rem;}
.footer-grid{display:grid; gap:28px;}
.footer h4{color:var(--crema); font-family:var(--font-body); font-weight:800; font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:14px;}
.footer li{padding:5px 0;}
.footer a:hover{color:var(--crema);}
.footer .brand{color:var(--crema); font-size:1.5rem;}
.footer .brand img{width:46px; height:46px;}
.footer-bottom{margin-top:36px; padding-top:20px; border-top:1px solid rgba(246,239,226,.12); display:flex; flex-wrap:wrap; gap:10px 22px; justify-content:space-between; font-size:.8rem; opacity:.75;}
.footer-bottom button{text-decoration:underline; color:inherit;}
@media (min-width:800px){ .footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr;} }

/* WhatsApp galleggiante */
.wa-fab{position:fixed; right:16px; bottom:calc(16px + var(--safe-b)); z-index:50; width:54px; height:54px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow:0 12px 24px -8px rgba(37,211,102,.7); transition:transform .2s;}
.wa-fab:hover{transform:scale(1.06);}
.wa-fab svg{width:28px; height:28px;}
body.has-cartbar .wa-fab{bottom:calc(88px + var(--safe-b));}
@media (min-width:900px){ body.has-cartbar .wa-fab{bottom:calc(16px + var(--safe-b));} }

/* Animazioni di comparsa allo scroll */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s 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){
  *,*::before,*::after{animation:none !important; transition:none !important; scroll-behavior:auto !important;}
  .reveal{opacity:1; transform:none;}
}

/* ============================================================================
   PAGINA MENU / ORDINA
   ========================================================================== */
.menu-page{--header-h:64px;}
.menu-hero{background:var(--carbone); color:var(--crema); padding:26px 0 22px; position:relative; overflow:hidden;}
.menu-hero::before{content:''; position:absolute; inset:-40% -20% auto auto; width:60vw; height:60vw; max-width:520px; max-height:520px; border-radius:50%; background:radial-gradient(circle, rgba(217,164,65,.22), transparent 62%); pointer-events:none;}
.menu-hero h1{font-size:clamp(2rem, 7vw, 3.2rem);}
.menu-hero h1 em{font-style:italic; font-weight:500; color:var(--oro);}
.menu-hero p{margin-top:8px; color:rgba(246,239,226,.72); font-size:.95rem; max-width:52ch;}
.menu-hero-row{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.status-pill{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; background:rgba(246,239,226,.1); border:1px solid rgba(246,239,226,.16); font-size:.8rem; font-weight:800;}
.status-pill .dot{width:8px; height:8px; border-radius:50%; background:#4ADE80;}
.status-pill.closed .dot{background:#F87171;}

/* Barra ricerca + categorie appiccicate sotto l'header */
.menu-tools{position:sticky; top:var(--header-h); z-index:40; background:var(--crema); border-bottom:1px solid var(--line); box-shadow:0 8px 20px -18px rgba(20,19,17,.5);}
.menu-tools .wrap{padding:10px 0 0;}
.search{position:relative;}
.search input{
  width:100%; min-height:48px; border-radius:14px; border:1.5px solid var(--line-strong); background:var(--panna);
  padding:0 44px 0 44px; font-size:1rem; outline:none; transition:border-color .15s, box-shadow .15s;
}
.search input:focus{border-color:var(--carbone); box-shadow:0 0 0 4px rgba(27,25,23,.08);}
.search .sico{position:absolute; left:14px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--muted); pointer-events:none;}
.search .sclear{position:absolute; right:6px; top:50%; transform:translateY(-50%); width:36px; height:36px; border-radius:50%; display:none; place-items:center; color:var(--muted);}
.search .sclear.show{display:grid;}
.chips{display:flex; gap:8px; overflow-x:auto; padding:10px 20px 10px; margin:0 -20px; scrollbar-width:none; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;}
.chips::-webkit-scrollbar{display:none;}
.chip{
  flex:none; display:inline-flex; align-items:center; gap:7px; min-height:42px; padding:0 15px; border-radius:999px;
  background:var(--panna); border:1.5px solid var(--line-strong); font-weight:800; font-size:.92rem; color:var(--ink);
  transition:background .15s, color .15s, border-color .15s, transform .15s; scroll-snap-align:start; white-space:nowrap;
}
.chip .em{font-size:1.05rem;}
.chip[aria-selected="true"]{background:var(--carbone); color:var(--crema); border-color:var(--carbone);}
.chip:active{transform:scale(.96);}
.subchips{display:flex; gap:8px; overflow-x:auto; padding:0 20px 12px; margin:0 -20px; scrollbar-width:none;}
.subchips::-webkit-scrollbar{display:none;}
.subchip{flex:none; min-height:36px; padding:0 13px; border-radius:999px; font-size:.84rem; font-weight:800; color:var(--muted); background:transparent; border:1.5px solid transparent; transition:all .15s; white-space:nowrap;}
.subchip[aria-selected="true"]{color:var(--pomodoro); background:var(--pomodoro-soft); border-color:transparent;}
.subchips:empty{display:none;}
@media (min-width:900px){
  .menu-tools .wrap{display:grid; grid-template-columns:1fr auto; gap:14px 24px; align-items:center;}
  .chips,.subchips{margin:0; padding-left:0; padding-right:0;}
  .search{grid-column:1; max-width:460px;}
  .chips{grid-column:1 / -1; padding-top:4px;}
  .subchips{grid-column:1 / -1;}
}

/* Layout: griglia prodotti + carrello laterale (desktop) */
.menu-layout{display:grid; gap:24px; padding:22px 0 120px;}
@media (min-width:900px){ .menu-layout{grid-template-columns:minmax(0,1fr) 380px; gap:32px; padding:32px 0 80px; align-items:start;} }

.cat-intro{display:flex; gap:14px; align-items:center; margin-bottom:14px;}
.cat-intro img{width:76px; height:76px; border-radius:18px; object-fit:cover; flex:none; box-shadow:var(--shadow-sm);}
.cat-intro h2{font-size:1.7rem;}
.cat-intro p{font-size:.88rem; color:var(--muted);}
.group-title{font-family:var(--font-display); font-size:1.35rem; margin:26px 0 12px; display:flex; align-items:center; gap:12px;}
.group-title::after{content:''; flex:1; height:1px; background:var(--line);}
.group-title:first-child{margin-top:6px;}

.products{display:grid; gap:10px;}
@media (min-width:600px){ .products{grid-template-columns:repeat(2, 1fr); gap:12px;} }
@media (min-width:1200px){ .products{grid-template-columns:repeat(2, 1fr);} }
.product{
  position:relative; display:grid; grid-template-columns:1fr auto; gap:6px 14px; align-items:start;
  background:var(--panna); border:1px solid var(--line); border-radius:var(--r); padding:14px 14px 14px 16px;
  text-align:left; width:100%; cursor:pointer; transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s;
  -webkit-tap-highlight-color:transparent;
}
.product:hover{border-color:var(--line-strong); box-shadow:var(--shadow-sm); transform:translateY(-1px);}
.product:active{transform:scale(.99);}
.product .p-name{font-family:var(--font-display); font-weight:600; font-size:1.12rem; line-height:1.15; display:flex; flex-wrap:wrap; gap:6px 8px; align-items:center;}
.product .p-desc{grid-column:1; font-size:.86rem; color:var(--muted); line-height:1.45; text-wrap:pretty;}
.product .p-note{grid-column:1; font-size:.76rem; color:var(--basilico); font-weight:700;}
.product .p-price{grid-column:2; grid-row:1; font-family:var(--font-display); font-weight:700; font-size:1.1rem; white-space:nowrap;}
.product .p-price small{font-family:var(--font-body); font-size:.7rem; font-weight:700; color:var(--muted); display:block; text-align:right; margin-top:-2px;}
.product .p-add{
  grid-column:2; grid-row:2 / span 2; align-self:end; justify-self:end;
  width:40px; height:40px; border-radius:12px; background:var(--carbone); color:var(--crema); display:grid; place-items:center;
  transition:background .15s, transform .15s; box-shadow:0 6px 14px -6px rgba(20,19,17,.5);
}
.product .p-add svg{width:20px; height:20px;}
.product:hover .p-add{background:var(--pomodoro);}
.product .p-add.bump{animation:bump .35s var(--ease);}
.product .in-cart{position:absolute; top:-8px; left:-6px; min-width:24px; height:24px; padding:0 7px; border-radius:999px; background:var(--basilico); color:#fff; font-size:.75rem; font-weight:800; display:grid; place-items:center; box-shadow:var(--shadow-sm);}
@keyframes bump{0%{transform:scale(1)} 40%{transform:scale(1.2)} 100%{transform:scale(1)}}
.tag{display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-family:var(--font-body); font-size:.66rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase;}
.tag.best{background:var(--oro-soft); color:#8A5E10;}
.tag.veg{background:var(--basilico-soft); color:var(--basilico);}
.tag.piccante{background:var(--pomodoro-soft); color:var(--pomodoro);}
.empty-state{text-align:center; padding:50px 20px; color:var(--muted);}
.empty-state b{display:block; font-family:var(--font-display); font-size:1.4rem; color:var(--ink); margin-bottom:6px;}

/* ------------------------------ SCHEDA PRODOTTO (bottom sheet) ------------------------------ */
.sheet-bg{position:fixed; inset:0; z-index:90; background:rgba(20,19,17,.6); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); display:none; animation:fade .2s var(--ease);}
.sheet-bg.open{display:block;}
.sheet{
  position:fixed; left:0; right:0; bottom:0; z-index:95; max-height:min(92svh, 100%); display:none; flex-direction:column;
  background:var(--panna); border-radius:26px 26px 0 0; box-shadow:0 -20px 60px rgba(20,19,17,.35);
  animation:slideUp .32s var(--ease); overflow:hidden;
}
.sheet.open{display:flex;}
.sheet-grip{width:44px; height:5px; border-radius:99px; background:var(--line-strong); margin:10px auto 0; flex:none;}
.sheet-head{display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:12px 20px 0; flex:none;}
.sheet-head h3{font-size:1.55rem; line-height:1.1; text-wrap:balance;}
.sheet-head .sub{color:var(--muted); font-size:.92rem; margin-top:6px; text-wrap:pretty;}
.sheet-head .base-price{font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--muted); margin-top:6px;}
.sheet-body{overflow-y:auto; -webkit-overflow-scrolling:touch; padding:12px 20px 20px; flex:1; overscroll-behavior:contain;}
.sheet-img{border-radius:18px; overflow:hidden; aspect-ratio:16/8; margin-bottom:14px; background:var(--crema-2);}
.sheet-img img{width:100%; height:100%; object-fit:cover;}
.opt-group{margin-top:18px;}
.opt-head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px;}
.opt-head h4{font-family:var(--font-body); font-size:.95rem; font-weight:800;}
.opt-head .req{font-size:.7rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:999px; background:var(--pomodoro-soft); color:var(--pomodoro);}
.opt-head .req.ok{background:var(--basilico-soft); color:var(--basilico);}
.opt-head .opt-hint{font-size:.78rem; color:var(--muted); font-weight:700;}
.opt-list{display:grid; gap:6px;}
.opt{
  display:flex; align-items:center; gap:12px; min-height:50px; padding:8px 12px; border-radius:14px;
  background:var(--crema); border:1.5px solid transparent; cursor:pointer; transition:border-color .15s, background .15s;
  -webkit-tap-highlight-color:transparent; user-select:none;
}
.opt:has(input:checked){border-color:var(--carbone); background:#fff;}
.opt input{appearance:none; -webkit-appearance:none; width:22px; height:22px; margin:0; flex:none; border:2px solid var(--line-strong); border-radius:50%; display:grid; place-items:center; transition:all .15s; background:#fff;}
.opt input[type="checkbox"]{border-radius:7px;}
.opt input:checked{border-color:var(--carbone); background:var(--carbone);}
.opt input:checked::after{content:''; width:10px; height:10px; border-radius:50%; background:var(--crema);}
.opt input[type="checkbox"]:checked::after{width:6px; height:11px; border:solid var(--crema); border-width:0 2.5px 2.5px 0; border-radius:0; transform:translateY(-1px) rotate(45deg); background:none;}
.opt input:disabled{opacity:.35;}
.opt .lbl{flex:1; font-weight:700; font-size:.95rem;}
.opt .lbl small{display:block; font-weight:600; color:var(--muted); font-size:.78rem;}
.opt .pr{font-weight:800; font-size:.88rem; color:var(--muted); white-space:nowrap;}
.opt.remove .lbl::before{content:'Senza '; font-weight:600; color:var(--muted);}
.extras-search{margin-bottom:8px;}
.extras-search input{width:100%; min-height:44px; border-radius:12px; border:1.5px solid var(--line-strong); background:#fff; padding:0 14px; font-size:.95rem;}
.extras-toggle{width:100%; display:flex; justify-content:space-between; align-items:center; min-height:52px; padding:0 14px; border-radius:14px; background:var(--crema); font-weight:800; margin-top:18px;}
.extras-toggle .cnt{font-size:.78rem; color:var(--pomodoro);}
.extras-toggle svg{transition:transform .2s;}
.extras-toggle[aria-expanded="true"] svg{transform:rotate(180deg);}
.extras-panel{display:none; margin-top:8px;}
.extras-panel.open{display:block;}
.extras-grid{display:grid; gap:6px;}
@media (min-width:600px){ .extras-grid{grid-template-columns:1fr 1fr;} }
.field{display:grid; gap:6px; margin-top:16px;}
.field label{font-size:.82rem; font-weight:800; color:var(--ink);}
.field input,.field textarea,.field select{
  width:100%; min-height:50px; border-radius:14px; border:1.5px solid var(--line-strong); background:#fff;
  padding:12px 14px; font-size:1rem; outline:none; transition:border-color .15s, box-shadow .15s; -webkit-appearance:none;
}
.field textarea{resize:vertical; min-height:80px; line-height:1.4;}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--carbone); box-shadow:0 0 0 4px rgba(27,25,23,.08);}
.field.error input,.field.error textarea{border-color:var(--pomodoro); box-shadow:0 0 0 4px rgba(196,22,28,.1);}
.field .err{display:none; font-size:.8rem; color:var(--pomodoro); font-weight:700;}
.field.error .err{display:block;}
.field .help{font-size:.8rem; color:var(--muted);}
.sheet-foot{flex:none; display:flex; align-items:center; gap:12px; padding:12px 20px calc(14px + var(--safe-b)); border-top:1px solid var(--line); background:var(--panna);}
.qty{display:inline-flex; align-items:center; border:1.5px solid var(--line-strong); border-radius:999px; height:52px; flex:none; background:#fff;}
.qty button{width:46px; height:100%; font-size:1.3rem; font-weight:700; color:var(--carbone); display:grid; place-items:center; border-radius:999px;}
.qty button:disabled{opacity:.3;}
.qty output{min-width:28px; text-align:center; font-weight:800; font-size:1.05rem;}
.sheet-foot .btn{flex:1; justify-content:space-between; padding:0 20px 0 24px;}
.sheet-foot .btn .tot{font-family:var(--font-display); font-size:1.1rem;}
@media (min-width:700px){
  .sheet{left:50%; right:auto; bottom:auto; top:50%; transform:translate(-50%, -50%); width:min(560px, calc(100% - 40px)); max-height:min(86vh, 860px); border-radius:26px; animation:pop .28s var(--ease);}
  .sheet-grip{display:none;}
  .sheet-head{padding-top:22px;}
  @keyframes pop{from{opacity:0; transform:translate(-50%, -48%) scale(.97)} to{opacity:1; transform:translate(-50%, -50%) scale(1)}}
}

/* ------------------------------ CARRELLO ------------------------------ */
.cartbar{
  position:fixed; left:12px; right:12px; bottom:calc(12px + var(--safe-b)); z-index:70;
  display:none; align-items:center; justify-content:space-between; gap:12px;
  min-height:60px; padding:0 8px 0 18px; border-radius:20px; background:var(--carbone); color:var(--crema);
  box-shadow:0 18px 40px -12px rgba(20,19,17,.65); transform:translateY(120%); transition:transform .35s var(--ease);
}
.cartbar.show{display:flex; transform:none;}
.cartbar .cb-count{width:30px; height:30px; border-radius:10px; background:var(--pomodoro); color:#fff; font-weight:800; font-size:.9rem; display:grid; place-items:center;}
.cartbar .cb-txt{flex:1; font-weight:800; font-size:.95rem; display:flex; align-items:center; gap:10px;}
.cartbar .cb-total{font-family:var(--font-display); font-size:1.15rem; font-weight:700;}
.cartbar .cb-go{background:var(--crema); color:var(--carbone); border-radius:14px; min-height:44px; padding:0 16px; font-weight:800; display:inline-flex; align-items:center; gap:6px;}
.cartbar.pulse{animation:bump .4s var(--ease);}
@media (min-width:900px){ .cartbar{display:none !important;} }

.cart-bg{position:fixed; inset:0; z-index:85; background:rgba(20,19,17,.55); display:none; animation:fade .2s;}
.cart-bg.open{display:block;}
.cart{
  background:var(--panna); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-sm);
  display:flex; flex-direction:column; overflow:hidden;
}
@media (max-width:899px){
  .cart{position:fixed; inset:auto 0 0 0; z-index:88; max-height:min(94svh, 100%); border-radius:26px 26px 0 0; transform:translateY(105%); transition:transform .35s var(--ease); border:0; box-shadow:0 -20px 60px rgba(20,19,17,.4);}
  .cart.open{transform:none;}
}
@media (min-width:900px){ .cart{position:sticky; top:calc(var(--header-h) + 140px); max-height:calc(100svh - var(--header-h) - 160px);} #cartClose{display:none;} }
.cart-head{display:flex; align-items:center; justify-content:space-between; padding:16px 18px 12px; border-bottom:1px solid var(--line); flex:none;}
.cart-head h2{font-size:1.4rem;}
.cart-head small{display:block; font-family:var(--font-body); color:var(--muted); font-size:.82rem; font-weight:700;}
.cart-body{overflow-y:auto; -webkit-overflow-scrolling:touch; padding:8px 18px; flex:1; overscroll-behavior:contain;}
.cart-empty{text-align:center; padding:36px 10px; color:var(--muted);}
.cart-empty .em{font-size:2.4rem; margin-bottom:8px;}
.line{display:grid; grid-template-columns:1fr auto; gap:4px 12px; padding:14px 0; border-bottom:1px solid var(--line);}
.line:last-child{border-bottom:0;}
.line .l-name{font-weight:800; font-size:.98rem;}
.line .l-meta{grid-column:1; font-size:.82rem; color:var(--muted); line-height:1.45;}
.line .l-price{grid-column:2; grid-row:1; font-family:var(--font-display); font-weight:700; white-space:nowrap;}
.line .l-actions{grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; margin-top:8px;}
.line .qty{height:38px;}
.line .qty button{width:38px; font-size:1.1rem;}
.line .l-edit{font-size:.82rem; font-weight:800; color:var(--muted); text-decoration:underline; text-underline-offset:3px;}
.line .l-remove{font-size:.82rem; font-weight:800; color:var(--pomodoro);}
.coupon{display:flex; gap:8px; margin:14px 0 6px;}
.coupon input{flex:1; min-height:46px; border-radius:12px; border:1.5px solid var(--line-strong); background:#fff; padding:0 14px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; font-size:.92rem;}
.coupon .btn{min-height:46px;}
.coupon-msg{font-size:.8rem; font-weight:700; min-height:1.2em; margin-bottom:6px;}
.coupon-msg.ok{color:var(--basilico);} .coupon-msg.err{color:var(--pomodoro);}
.sums{display:grid; gap:6px; padding:12px 0 4px; font-size:.92rem; color:var(--muted);}
.sums div{display:flex; justify-content:space-between;}
.sums .disc{color:var(--basilico); font-weight:800;}
.sums .total{color:var(--ink); font-weight:800; font-size:1.15rem; padding-top:8px; border-top:1px solid var(--line); margin-top:4px;}
.sums .total .amt{font-family:var(--font-display); font-size:1.5rem;}
.cart-foot{flex:none; padding:10px 18px calc(16px + var(--safe-b)); border-top:1px solid var(--line); background:var(--panna);}
.min-note{font-size:.78rem; color:var(--muted); text-align:center; margin-top:8px;}
.upsell{margin:10px 0 4px;}
.upsell h4{font-family:var(--font-body); font-size:.8rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:8px;}
.upsell-row{display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding-bottom:4px;}
.upsell-row::-webkit-scrollbar{display:none;}
.upsell-btn{flex:none; display:inline-flex; align-items:center; gap:8px; min-height:40px; padding:0 12px 0 10px; border-radius:12px; background:var(--crema); border:1.5px solid var(--line); font-weight:800; font-size:.82rem;}
.upsell-btn .em{font-size:1.05rem;}
.upsell-btn b{color:var(--pomodoro);}

/* ------------------------------ CHECKOUT (vista a tutto schermo) ------------------------------ */
.checkout{position:fixed; inset:0; z-index:100; background:var(--crema); display:none; flex-direction:column; animation:slideUp .3s var(--ease);}
.checkout.open{display:flex;}
.co-head{flex:none; height:60px; display:flex; align-items:center; gap:8px; padding:0 12px; background:var(--panna); border-bottom:1px solid var(--line);}
.co-head h2{font-size:1.25rem; flex:1;}
.co-steps{display:flex; gap:6px; padding:12px 20px 0; font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);}
.co-steps span{flex:1; text-align:center; padding-bottom:8px; border-bottom:3px solid var(--line);}
.co-steps span.on{color:var(--pomodoro); border-color:var(--pomodoro);}
.co-body{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:14px 20px 30px; overscroll-behavior:contain;}
.co-inner{max-width:640px; margin:0 auto; display:grid; gap:14px;}
.card{background:var(--panna); border:1px solid var(--line); border-radius:var(--r-lg); padding:18px;}
.card h3{font-family:var(--font-body); font-size:.82rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:10px;}
.seg{display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:5px; background:var(--crema); border-radius:16px;}
.seg label{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-height:60px; border-radius:12px; cursor:pointer; text-align:center; font-weight:800; transition:background .15s, box-shadow .15s;}
.seg label small{font-weight:600; font-size:.74rem; color:var(--muted);}
.seg label.disabled{opacity:.5;}
.pay-note{font-size:.8rem; color:var(--muted); margin-top:10px; padding:10px 12px; border-radius:12px; background:var(--oro-soft); font-weight:700;}
.seg input{position:absolute; opacity:0; inset:0; cursor:pointer;}
.seg label:has(input:checked){background:var(--panna); box-shadow:var(--shadow-sm);}
.seg label:has(input:checked) .lab{color:var(--pomodoro);}
.seg.three{grid-template-columns:1fr 1fr;}
.row2{display:grid; gap:12px;}
@media (min-width:520px){ .row2{grid-template-columns:1fr 1fr;} }
.addr-status{font-size:.84rem; font-weight:700; min-height:1.3em; margin-top:6px;}
.addr-status.ok{color:var(--basilico);} .addr-status.warn{color:#8A5E10;} .addr-status.err{color:var(--pomodoro);}
.time-grid{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
.time-slot{min-height:40px; padding:0 14px; border-radius:999px; border:1.5px solid var(--line-strong); background:#fff; font-weight:800; font-size:.9rem;}
.time-slot[aria-pressed="true"]{background:var(--carbone); color:var(--crema); border-color:var(--carbone);}
.co-summary{display:grid; gap:6px; font-size:.92rem;}
.co-summary .li{display:flex; justify-content:space-between; gap:12px; color:var(--muted);}
.co-summary .li b{color:var(--ink); font-weight:700;}
.co-foot{flex:none; padding:12px 20px calc(14px + var(--safe-b)); background:var(--panna); border-top:1px solid var(--line);}
.co-foot .inner{max-width:640px; margin:0 auto; display:flex; align-items:center; gap:14px;}
.co-foot .tot{line-height:1.1;}
.co-foot .tot small{display:block; font-size:.74rem; color:var(--muted); font-weight:800; text-transform:uppercase; letter-spacing:.06em;}
.co-foot .tot b{font-family:var(--font-display); font-size:1.5rem;}
.co-foot .btn{flex:1;}
.trust{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; font-size:.76rem; color:var(--muted); font-weight:700; margin-top:10px;}
.trust span{display:inline-flex; align-items:center; gap:6px;}

/* Conferma ordine */
.confirm{text-align:center; padding:20px 0;}
.confirm .check{width:84px; height:84px; border-radius:50%; background:var(--basilico); color:#fff; display:grid; place-items:center; margin:0 auto 18px; animation:pop2 .5s var(--ease);}
.confirm .check svg{width:40px; height:40px;}
@keyframes pop2{0%{transform:scale(.4); opacity:0} 60%{transform:scale(1.1)} 100%{transform:scale(1); opacity:1}}
.confirm h2{font-size:2rem;}
.confirm .oid{display:inline-block; margin:12px 0; padding:8px 16px; border-radius:12px; background:var(--carbone); color:var(--oro); font-weight:800; letter-spacing:.1em; font-size:1.05rem;}
.confirm-list{text-align:left; display:grid; gap:0; margin-top:16px;}
.confirm-list li{display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px dashed var(--line); font-size:.94rem;}
.confirm-list li span{color:var(--muted);}
.confirm-list li b{text-align:right;}
.email-status{font-size:.76rem; color:var(--muted); margin-top:10px;}

/* Toast */
.toast{position:fixed; left:50%; bottom:calc(84px + var(--safe-b)); transform:translate(-50%, 20px); z-index:120; background:var(--carbone); color:var(--crema); padding:12px 18px; border-radius:14px; font-weight:800; font-size:.92rem; box-shadow:var(--shadow-lg); opacity:0; pointer-events:none; transition:opacity .25s, transform .25s var(--ease); max-width:calc(100% - 32px); text-align:center;}
.toast.show{opacity:1; transform:translate(-50%, 0);}
.toast.ok{border-left:4px solid #4ADE80;} .toast.err{border-left:4px solid var(--pomodoro);}
@media (min-width:900px){ .toast{bottom:28px;} }

/* Overlay di caricamento durante il pagamento */
.loading{position:fixed; inset:0; z-index:130; background:rgba(246,239,226,.85); backdrop-filter:blur(4px); display:none; place-items:center; text-align:center; padding:20px;}
.loading.show{display:grid;}
.spinner{width:52px; height:52px; border-radius:50%; border:4px solid var(--line-strong); border-top-color:var(--pomodoro); animation:spin .8s linear infinite; margin:0 auto 14px;}
@keyframes spin{to{transform:rotate(360deg)}}

/* Skeleton */
.skeleton{background:linear-gradient(90deg, var(--crema-2) 25%, #f7f1e6 37%, var(--crema-2) 63%); background-size:400% 100%; animation:shimmer 1.4s infinite; border-radius:var(--r);}
@keyframes shimmer{0%{background-position:100% 0} 100%{background-position:0 0}}

/* Modalità senza animazioni (per test/screenshot: ?qa=1) */
html.no-anim *,html.no-anim *::before,html.no-anim *::after{animation:none !important; transition:none !important;}
html.no-anim .reveal{opacity:1; transform:none;}
html.no-anim{scroll-behavior:auto;}
html.no-anim #iubenda-cs-banner{display:none !important;}
html.qa-shift .header,html.qa-shift .wa-fab,html.qa-shift .cartbar{position:absolute;}
html.qa-shift .reveal{opacity:1 !important; transform:none !important;}

/* Pagina 404 e piccole utilità */
.center{text-align:center;}
.stack{display:grid; gap:12px;}
.mt-1{margin-top:8px} .mt-2{margin-top:16px} .mt-3{margin-top:24px} .mt-4{margin-top:36px}
