/* Pling Lab — ravioleria, Livorno
   Foglio di stile unico del sito. Colori presi dal progetto d'arredo R.Design:
   rosso ruggine delle pareti, grigio antracite, legno caldo, crema per il testo. */

:root{
  --antracite:#2a2826;
  --carbone:#1e1c1b;
  --pietra:#35312e;
  --ruggine:#823d24;
  --ruggine-2:#96472a;
  --legno:#a8683f;
  --legno-chiaro:#c98a5a;
  --crema:#f3e6d3;
  --crema-2:#cdbba5;
  --carta:#efe2cc;
  --linea:rgba(243,230,211,.16);
  --fuoco:#f0b37e;
  --verde:#86c77f;

  --f-testo:"Bricolage Grotesque", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --f-mono:"DM Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --f-cina:"PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;

  --gutter:20px;
  --wrap:1200px;
  --h-testata:64px;
  --raggio:14px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--antracite);
  color:var(--crema);
  font-family:var(--f-testo);
  font-size:1.0625rem;
  line-height:1.55;
  font-optical-sizing:auto;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
p{margin:0 0 1em}
h1,h2,h3{font-weight:800;line-height:1.02;letter-spacing:-.025em;margin:0 0 .45em;text-wrap:balance}
address{font-style:normal}
:focus-visible{outline:3px solid var(--fuoco);outline-offset:3px;border-radius:6px}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.salta{position:absolute;left:8px;top:-60px;z-index:100;background:var(--crema);color:var(--carbone);padding:.6rem 1rem;border-radius:8px;font-weight:700;text-decoration:none}
.salta:focus{top:8px}

.etichetta{font-family:var(--f-mono);font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--legno-chiaro);margin:0 0 1rem}
.sez{padding-block:clamp(56px, 9vw, 120px)}
.testo-pieno{text-wrap:pretty}

/* ---------- bottoni ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  min-height:48px;padding:.7rem 1.3rem;border-radius:999px;border:2px solid transparent;
  font:inherit;font-weight:700;font-size:1rem;line-height:1.1;text-decoration:none;cursor:pointer;
  transition:background-color .15s ease, color .15s ease, transform .15s ease;
}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn svg{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn-primario{background:var(--ruggine);border-color:var(--ruggine);color:var(--crema)}
.btn-primario:hover{background:var(--ruggine-2);border-color:var(--ruggine-2)}
.btn-linea{background:transparent;border-color:rgba(243,230,211,.55);color:var(--crema)}
.btn-linea:hover{background:rgba(243,230,211,.08);border-color:var(--crema)}
.btn-crema{background:var(--crema);border-color:var(--crema);color:var(--carbone)}
.btn-crema:hover{background:#fff6e8}
.btn-grande{min-height:56px;padding-inline:1.3rem;font-size:1.08rem}
.azioni{display:flex;flex-wrap:wrap;gap:.75rem}

.link-freccia{display:inline-flex;align-items:center;gap:.45em;font-weight:700;text-decoration:none;border-bottom:2px solid var(--legno-chiaro);padding-bottom:2px}
.link-freccia svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s ease}
.link-freccia:hover svg{transform:translateX(3px)}

/* ---------- testata ---------- */
.testata{
  position:sticky;top:0;z-index:50;
  background:rgba(30,28,27,.94);
  -webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid var(--linea);
}
.testata-in{display:flex;align-items:center;gap:1rem;min-height:var(--h-testata)}
.marchio{display:block;flex:none;padding:4px 0}
.marchio img{height:44px;width:auto}
.voci{display:flex;flex-wrap:wrap;gap:.15rem;margin-left:auto}
.voci a{padding:.5rem .8rem;border-radius:999px;font-weight:600;text-decoration:none}
.voci a:hover{background:rgba(243,230,211,.07)}
.voci a[aria-current="page"]{background:rgba(243,230,211,.12);box-shadow:inset 0 -2px 0 var(--legno-chiaro)}
.testata-cta{display:none}
.burger{
  display:none;margin-left:auto;width:48px;height:48px;border-radius:12px;
  background:transparent;border:1.5px solid var(--linea);color:var(--crema);cursor:pointer;
  align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:0;
}
.burger span{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;transition:transform .2s ease, opacity .2s ease}
.menu-aperto .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-aperto .burger span:nth-child(2){opacity:0}
.menu-aperto .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.pannello{display:none}

/* con JavaScript: sul telefono le voci stanno dietro al bottone */
.js .voci{display:none}
.js .burger{display:inline-flex}
.js .menu-aperto .pannello{display:block}
.pannello{
  border-top:1px solid var(--linea);
  max-height:calc(100vh - var(--h-testata));overflow-y:auto;
  padding:12px var(--gutter) 28px;
}
.pannello ul{list-style:none;margin:0;padding:0}
.pannello li a{display:block;padding:.7rem 0;font-size:1.7rem;font-weight:800;letter-spacing:-.02em;text-decoration:none;border-bottom:1px solid var(--linea)}
.pannello li a[aria-current="page"]{color:var(--legno-chiaro)}
.pannello .btn{width:100%;margin-top:1.4rem}
.pannello p{margin:1rem 0 0;color:var(--crema-2);font-size:.95rem}
.intero{white-space:nowrap}

/* barra fissa del telefono */
.barra-mobile{
  position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;gap:.6rem;
  padding:.65rem var(--gutter) calc(.65rem + env(safe-area-inset-bottom));
  background:rgba(30,28,27,.97);border-top:1px solid var(--linea);
}
.barra-mobile .btn-primario{flex:1}
.barra-mobile .btn-linea{flex:none;padding-inline:1.1rem}

/* ---------- apertura (home) ---------- */
.apertura{padding-block:22px 52px;position:relative}
.apertura-griglia{display:grid;gap:30px}
.apertura h1{font-size:clamp(2.75rem, 12vw, 5.6rem);line-height:.93;letter-spacing:-.04em;margin-bottom:.3em}
.apertura h1 span{display:block;color:var(--legno-chiaro)}
.apertura-sotto{font-size:1.15rem;color:var(--crema-2);max-width:36ch;text-wrap:pretty}
.apertura .azioni{margin-top:1.4rem}
.apertura-nota{margin:1rem 0 0;font-size:.95rem;color:var(--crema-2)}

.stato{
  display:inline-flex;align-items:center;gap:.6rem;margin:1.4rem 0 0;
  padding:.45rem .9rem;border:1px solid var(--linea);border-radius:999px;
  font-family:var(--f-mono);font-size:.85rem;
}
.pallino{width:9px;height:9px;border-radius:50%;background:var(--crema-2);flex:none}
.stato.aperto .pallino{background:var(--verde);box-shadow:0 0 0 4px rgba(134,199,127,.22)}
.stato.chiuso .pallino{background:#e3906a}

.foto{position:relative;margin:0}
.foto img{width:100%;border-radius:var(--raggio)}
.tag-render{
  position:absolute;left:10px;bottom:10px;
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.04em;line-height:1.3;
  background:rgba(30,28,27,.85);color:var(--crema);padding:.32rem .6rem;border-radius:6px;
}
.adesivo{
  position:absolute;right:-4px;top:-22px;width:98px;height:98px;border-radius:50%;
  background:var(--crema);color:var(--carbone);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  transform:rotate(9deg);box-shadow:0 5px 0 rgba(0,0,0,.28);
  font-family:var(--f-mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;text-align:center;line-height:1.1;
}
.raviolo-m{
  display:block;width:36px;aspect-ratio:290/371;background:currentColor;
  -webkit-mask:url(img/raviolo.png) center/contain no-repeat;mask:url(img/raviolo.png) center/contain no-repeat;
}

/* nastro delle cotture */
.nastro-cornice{overflow:hidden;padding-block:14px}
.nastro{
  width:104%;margin-left:-2%;transform:rotate(-1.4deg);
  background:var(--legno);color:var(--carbone);
  border-block:2px solid var(--carbone);overflow:hidden;
}
.nastro-in{display:flex;width:max-content;animation:scorri 32s linear infinite}
.nastro-in span{
  display:flex;align-items:center;gap:1.1rem;padding:.55rem 1.1rem;
  font-weight:800;font-size:1.35rem;letter-spacing:-.01em;text-transform:uppercase;white-space:nowrap;
}
.nastro-in span::after{content:"";width:1.05em;height:.6em;background:currentColor;border-radius:1em 1em .15em .15em / 1.1em 1.1em .15em .15em}
@keyframes scorri{to{transform:translateX(-50%)}}

/* chi siamo */
.chi-griglia{display:grid;gap:.4rem}
.chi-testo{font-size:clamp(1.55rem, 5vw, 2.7rem);line-height:1.18;font-weight:600;letter-spacing:-.02em;margin:0;max-width:30ch;text-wrap:pretty}
.chi-testo em{font-style:normal;color:var(--legno-chiaro)}

/* cotture */
.cottura{background:var(--ruggine)}
.cottura .etichetta{color:var(--crema)}
.cottura-testa{position:relative;margin-bottom:2.4rem;padding-right:64px}
.cottura-testa h2{font-size:clamp(2.3rem, 9vw, 4.4rem);line-height:.96}
.cottura-testa p{max-width:40ch;font-size:1.1rem;margin:0}
.sigillo{
  position:absolute;right:0;top:0;writing-mode:vertical-rl;
  font-family:var(--f-cina);font-weight:700;font-size:1.45rem;line-height:1;letter-spacing:.1em;
  background:var(--crema);color:var(--ruggine);padding:.55rem .4rem;border-radius:6px;
  transform:rotate(5deg);box-shadow:inset 0 0 0 3px var(--crema), inset 0 0 0 5px var(--ruggine);
}
.cotture{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cotture li{background:rgba(30,28,27,.22);border:1.5px solid rgba(243,230,211,.38);border-radius:var(--raggio);padding:1rem 1rem 1.15rem}
.cotture svg{width:46px;height:46px;fill:none;stroke:var(--crema);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-bottom:.7rem}
.cotture .num{display:block;font-family:var(--f-mono);font-size:.78rem;margin-bottom:.25rem}
.cotture h3{font-size:1.4rem;margin-bottom:.3rem}
.cotture p{margin:0;font-size:.97rem;line-height:1.4}

/* ripieni e sfoglie */
.ripieni-griglia{display:grid;gap:2rem}
.ripieni-testa h2{font-size:clamp(2rem, 7vw, 3.4rem)}
.ripieni-testa p{color:var(--crema-2);max-width:38ch}
.ripieni{list-style:none;margin:0;padding:0}
.ripieni li{display:flex;gap:1rem;align-items:flex-start;padding:1rem 0;border-top:1px solid var(--linea)}
.ripieni li:last-child{border-bottom:1px solid var(--linea)}
.ripieni .corpo{flex:1;min-width:0}
.ripieni .riga{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.ripieni b{font-size:1.2rem;font-weight:700}
.ripieni .ingredienti{display:block;color:var(--crema-2);font-size:.97rem;line-height:1.4;margin-top:.15rem}
.ripieni .tipo{display:block;font-family:var(--f-mono);font-size:.78rem;color:var(--legno-chiaro);margin-top:.3rem}
.prezzo{font-family:var(--f-mono);font-weight:500;white-space:nowrap}

.sfoglia{
  flex:none;position:relative;display:inline-block;width:46px;height:25px;margin-top:3px;
  border-radius:24px 24px 5px 5px / 25px 25px 5px 5px;background:var(--c, #efe4d2);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.2);
}
.sfoglia::after{content:"";position:absolute;left:7px;right:7px;top:4px;height:5px;border-radius:4px;background:repeating-linear-gradient(90deg, rgba(0,0,0,.22) 0 2px, transparent 2px 6px)}
.s-00{--c:#efe4d2}
.s-barbabietola{--c:#a3304d}
.s-seppia{--c:#141312;outline:1.5px solid rgba(243,230,211,.55);outline-offset:-1.5px}
.s-spinaci{--c:#5f8b3c}
.s-misti{background:linear-gradient(90deg, #efe4d2 0 25%, #a3304d 25% 50%, #141312 50% 75%, #5f8b3c 75%)}

/* ramen e Xi'an */
.altro{padding-top:0}
.altro-griglia{display:grid;gap:14px}
.scheda{display:flex;flex-direction:column;align-items:flex-start;text-decoration:none;border-radius:var(--raggio);padding:1.6rem 1.4rem;min-height:250px}
.scheda:hover{text-decoration:none}
.scheda h2{font-size:clamp(1.9rem, 6vw, 2.8rem)}
.scheda p{max-width:40ch}
.scheda .giu{margin-top:auto;display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center}
.scheda .prezzo-tag{font-family:var(--f-mono);font-size:.85rem;padding:.3rem .7rem;border:1.5px solid currentColor;border-radius:999px;transform:rotate(-3deg)}
.scheda .vai{font-weight:700;display:inline-flex;gap:.4em;align-items:center}
.scheda .vai svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s ease}
.scheda:hover .vai svg{transform:translateX(3px)}
.scheda-ramen{background:var(--carta);color:var(--carbone)}
.scheda-ramen .etichetta{color:var(--ruggine)}
.scheda-xian{background:var(--pietra);border:1.5px solid var(--linea)}

/* banco a vista */
.banco{background:var(--carbone)}
.banco-griglia{display:grid;gap:1.6rem}
.banco h2{font-size:clamp(2rem, 7vw, 3.4rem)}
.banco p{color:var(--crema-2);max-width:40ch}

/* orari, indirizzo, asporto */
.info-griglia{display:grid;gap:2.4rem}
.scontrino{
  --s:9px;
  position:relative;max-width:400px;background:var(--carta);color:var(--carbone);
  font-family:var(--f-mono);font-size:.95rem;line-height:1.45;
  padding:1.6rem 1.4rem 2.3rem;transform:rotate(-1.5deg);
  -webkit-mask:conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / calc(2*var(--s)) 100%;
          mask:conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / calc(2*var(--s)) 100%;
}
.scontrino .testa{text-align:center;font-weight:500;letter-spacing:.14em;text-transform:uppercase;margin:0}
.scontrino .testa img{width:150px;margin:0 auto .7rem}
.scontrino hr{border:0;border-top:1.5px dashed rgba(30,28,27,.45);margin:1rem 0}
.scontrino dl{margin:0;display:grid;gap:.3rem}
.scontrino dl div{display:flex;justify-content:space-between;gap:1rem}
.scontrino dt{text-transform:uppercase;letter-spacing:.08em}
.scontrino dd{margin:0;font-weight:500}
.scontrino p{margin:0}
.scontrino .su{text-transform:uppercase;letter-spacing:.08em}
.info h2{font-size:clamp(2.1rem, 7.5vw, 3.6rem)}
.info-testo > p{color:var(--crema-2);max-width:42ch}
.info .azioni{margin-top:1.5rem}
.dove{display:flex;gap:.8rem;align-items:flex-start;margin-top:2rem;padding-top:1.4rem;border-top:1px solid var(--linea)}
.dove svg,.fedelta svg{width:24px;height:24px;flex:none;fill:none;stroke:var(--legno-chiaro);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.dove p,.fedelta p{margin:0}
.fedelta{display:flex;gap:.8rem;align-items:flex-start;margin-top:1.1rem}

/* ---------- pagine interne ---------- */
.pagina-testa{padding-block:40px 30px}
.pagina-testa h1{font-size:clamp(2.8rem, 12vw, 5.6rem);line-height:.93;letter-spacing:-.04em}
.pagina-testa .intro{font-size:1.15rem;color:var(--crema-2);max-width:46ch;text-wrap:pretty}
.pagina-testa .azioni{margin-top:1.4rem}

/* menu: indice delle categorie */
.indice{
  position:sticky;top:var(--h-testata);z-index:30;
  background:rgba(30,28,27,.96);border-block:1px solid var(--linea);
}
.indice ul{
  list-style:none;margin:0 auto;max-width:var(--wrap);display:flex;gap:.45rem;
  overflow-x:auto;padding:.65rem var(--gutter);scrollbar-width:none;overscroll-behavior-x:contain;
}
.indice ul::-webkit-scrollbar{display:none}
.indice a{display:block;white-space:nowrap;text-decoration:none;padding:.42rem .9rem;border-radius:999px;border:1.5px solid var(--linea);font-weight:600;font-size:.95rem}
.indice a:hover{border-color:var(--crema-2)}
.indice a.attiva{background:var(--crema);color:var(--carbone);border-color:var(--crema)}

.categoria{scroll-margin-top:calc(var(--h-testata) + 62px);padding-block:44px;border-bottom:1px solid var(--linea)}
.categoria:last-of-type{border-bottom:0}
.categoria-griglia{display:grid;gap:1.1rem}
.cat-num{display:block;font-family:var(--f-mono);font-size:.85rem;color:var(--legno-chiaro);margin-bottom:.6rem}
.categoria h2{font-size:clamp(2.1rem, 8vw, 3.5rem);margin-bottom:.3em}
.cat-nota{color:var(--crema-2);max-width:36ch;margin:0}
.chip{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.chip li{font-family:var(--f-mono);font-size:.8rem;padding:.32rem .7rem;border-radius:999px;background:var(--ruggine);color:var(--crema)}

.piatti{list-style:none;margin:0;padding:0}
.piatto{padding:1rem 0;border-bottom:1px dashed rgba(243,230,211,.24)}
.piatto:first-child{padding-top:.2rem}
.piatto-riga{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.piatto h3{font-size:1.25rem;font-weight:700;letter-spacing:-.01em;line-height:1.2;margin:0;display:flex;align-items:center;gap:.7rem}
.piatto h3 .sfoglia{width:30px;height:17px;margin-top:0;border-radius:16px 16px 4px 4px / 17px 17px 4px 4px}
.piatto h3 .sfoglia::after{left:5px;right:5px;top:3px;height:3px;background:repeating-linear-gradient(90deg, rgba(0,0,0,.22) 0 1.5px, transparent 1.5px 4.5px)}
.piatto .prezzo{font-size:1.02rem}
.piatto p{margin:.3rem 0 0;color:var(--crema-2);font-size:.98rem;line-height:1.45;max-width:62ch;text-wrap:pretty}

.chiusura{padding-block:16px 72px}
.chiusura-box{background:var(--ruggine);border-radius:var(--raggio);padding:2rem 1.4rem;display:grid;gap:1.2rem}
.chiusura-box h2{font-size:clamp(1.9rem, 7vw, 3rem);margin:0}
.chiusura-box p{margin:0;max-width:52ch}
.nota-piccola{font-size:.92rem;color:var(--crema-2);margin-top:1.6rem}
.chiusura-box .nota-piccola{color:var(--crema);margin-top:0}

/* il locale */
.onesta{
  display:flex;gap:.8rem;align-items:flex-start;margin-top:1.4rem;max-width:60ch;
  font-family:var(--f-mono);font-size:.9rem;line-height:1.5;color:var(--crema);
  border-left:3px solid var(--legno);padding:.2rem 0 .2rem 1rem;
}
.materiali{list-style:none;margin:2rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:10px;max-width:640px}
.materiali li{border-radius:10px;padding:3.6rem .8rem .7rem;font-size:.9rem;font-weight:600;line-height:1.2}
.materiali small{display:block;font-family:var(--f-mono);font-weight:400;font-size:.72rem;margin-top:.2rem;opacity:.9}
.m-ruggine{background:var(--ruggine)}
.m-antracite{background:var(--carbone);border:1.5px solid var(--linea)}
.m-legno{background:var(--legno);color:var(--carbone)}

.vetrina-griglia{display:grid;gap:1.6rem}
.vetrina h2{font-size:clamp(2rem, 7vw, 3.4rem)}
.vetrina p{color:var(--crema-2);max-width:42ch}

.galleria-sez{background:var(--carbone)}
.galleria-testa{display:grid;gap:.4rem;margin-bottom:1.8rem}
.galleria-testa h2{font-size:clamp(2rem, 7vw, 3.4rem);margin:0}
.galleria-testa p{color:var(--crema-2);margin:0;max-width:56ch}
.galleria{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);grid-auto-flow:row dense;gap:22px 14px}
.galleria a{display:block;text-decoration:none;border-radius:12px}
.galleria img{width:100%;aspect-ratio:1439/1110;object-fit:cover;border-radius:12px;transition:filter .2s ease}
.galleria a:hover img{filter:brightness(1.08)}
.galleria .g-larga img{aspect-ratio:1439/658}
.g-dida{display:flex;justify-content:space-between;gap:.8rem;margin-top:.5rem;font-size:.95rem}
.g-dida span:last-child{font-family:var(--f-mono);font-size:.72rem;color:var(--legno-chiaro);white-space:nowrap;padding-top:.15rem}

.lightbox{padding:0;border:0;background:transparent;max-width:min(96vw, 1440px);max-height:94vh;color:var(--crema);overflow:visible}
.lightbox::backdrop{background:rgba(20,18,17,.96)}
.lightbox figure{margin:0}
.lightbox img{max-width:min(96vw, 1440px);max-height:82vh;width:auto;height:auto;border-radius:10px}
.lightbox figcaption{font-size:.95rem;margin-top:.6rem;text-align:left}
.lightbox button{
  position:fixed;width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(243,230,211,.5);
  background:rgba(30,28,27,.85);color:var(--crema);font-size:1.6rem;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.lightbox .lb-chiudi{top:14px;right:14px}
.lightbox .lb-prec{left:10px;top:50%;transform:translateY(-50%)}
.lightbox .lb-succ{right:10px;top:50%;transform:translateY(-50%)}

/* contatti */
.contatti-griglia{display:grid;gap:14px;padding-bottom:72px}
.blocco{background:var(--pietra);border:1.5px solid var(--linea);border-radius:var(--raggio);padding:1.4rem 1.3rem 1.5rem}
.blocco h2{font-family:var(--f-mono);font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--legno-chiaro);margin:0 0 .9rem}
.blocco .grande{font-size:1.5rem;font-weight:700;line-height:1.2;letter-spacing:-.015em;margin:0 0 1rem}
.blocco .grande a{text-decoration:none}
.blocco p{color:var(--crema-2)}
.blocco .grande{color:var(--crema)}
.blocco p:last-child{margin-bottom:0}
.blocco dl{margin:0 0 1rem;display:grid;gap:.35rem;font-size:1.15rem}
.blocco dl div{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px dashed rgba(243,230,211,.24);padding-bottom:.35rem}
.blocco dd{margin:0;font-family:var(--f-mono)}
.blocco-ruggine{background:var(--ruggine);border-color:var(--ruggine)}
.blocco-ruggine h2{color:var(--crema)}
.blocco-ruggine p{color:var(--crema)}
.blocco .email{font-size:1.1rem;margin:-.4rem 0 1rem;word-break:break-word}
.blocco .email a{color:var(--crema)}
.blocco .societa{font-size:1.2rem}
.blocco .stato{margin-top:0}
.blocco-foto{padding:0;margin:0;overflow:hidden;position:relative}
.blocco-foto img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 45%}

/* ---------- piede ---------- */
.piede{background:var(--carbone);border-top:1px solid var(--linea);padding-block:56px calc(26px + 76px + env(safe-area-inset-bottom));font-size:.98rem}
.piede-griglia{display:grid;gap:2rem}
.piede-marchio img{height:70px;width:auto;margin-bottom:1rem}
.piede-marchio p{color:var(--crema-2);max-width:32ch}
.piede h2{font-family:var(--f-mono);font-size:.78rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--legno-chiaro);margin:0 0 .8rem}
.piede p{margin:0 0 .6rem}
.piede ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.piede a{text-decoration-color:rgba(243,230,211,.4)}
.piede-legale{
  margin-top:2.6rem;padding-top:1.2rem;border-top:1px solid var(--linea);
  display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;justify-content:space-between;
  color:var(--crema-2);font-size:.88rem;
}
.piede-legale p{margin:0}
.piede-legale nav{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}

/* ---------- schermi più larghi ---------- */
@media (min-width:640px){
  .galleria{grid-template-columns:repeat(2, minmax(0,1fr))}
  .galleria .g-larga{grid-column:span 2}
  .contatti-griglia{grid-template-columns:repeat(2, minmax(0,1fr))}
  .blocco-foto{grid-column:1 / -1}
  .blocco-foto img{aspect-ratio:16/9}
}
@media (min-width:760px){
  .altro-griglia{grid-template-columns:1fr 1fr}
  .piede-griglia{grid-template-columns:1fr 1fr}
  .piatti.due{display:grid;grid-template-columns:1fr 1fr;column-gap:2.4rem}
  .piatti.due .piatto:nth-child(2){padding-top:.2rem}
  .cotture{grid-template-columns:repeat(4, minmax(0,1fr))}
  .chiusura-box{padding:2.6rem 2.4rem}
}
@media (min-width:960px){
  :root{--gutter:32px;--h-testata:76px}
  .piede{padding-bottom:26px}
  .barra-mobile{display:none}
  .marchio img{height:52px}
  .js .voci{display:flex}
  .js .burger,.pannello,.js .menu-aperto .pannello{display:none}
  .voci{margin-left:auto}
  .testata-cta{display:inline-flex;margin-left:.6rem}
  .btn-grande{padding-inline:1.6rem}

  .apertura{padding-block:56px 84px}
  .apertura-griglia{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:56px}
  .adesivo{width:118px;height:118px;top:-30px;right:-24px;font-size:.7rem}
  .adesivo .raviolo-m{width:44px}

  .chi-griglia{grid-template-columns:minmax(0,3fr) minmax(0,9fr);align-items:start}
  .chi-griglia .etichetta{padding-top:.9rem}

  .cottura-testa{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:end;gap:2rem;padding-right:90px}
  .cottura-testa .etichetta{grid-column:1 / -1;margin-bottom:-1rem}
  .cottura-testa h2{margin:0}
  .sigillo{font-size:2rem}
  .cotture li{padding:1.4rem 1.3rem 1.5rem}

  .ripieni-griglia{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:4rem}
  .ripieni-testa{position:sticky;top:calc(var(--h-testata) + 40px);align-self:start}

  .scheda{padding:2.2rem 2rem;min-height:300px}

  .banco-griglia{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:3.5rem}

  .info-griglia{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:4rem}
  .scontrino{justify-self:center;width:100%}

  .pagina-testa{padding-block:72px 44px}

  .categoria{padding-block:64px}
  .categoria-griglia{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:3.5rem}
  .categoria-testa{position:sticky;top:calc(var(--h-testata) + 84px);align-self:start}

  .chiusura-box{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:2rem 3rem}
  .chiusura-box .azioni{justify-content:flex-end}

  .vetrina-griglia{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:3.5rem}

  .galleria-testa{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:end;gap:2rem}

  .contatti-griglia{grid-template-columns:repeat(3, minmax(0,1fr))}
  .blocco-foto img{aspect-ratio:16/7;object-position:center 35%}

  .piede-griglia{grid-template-columns:minmax(0,1.5fr) repeat(3, minmax(0,1fr))}
}
@media (min-width:1100px){
  .galleria{grid-template-columns:repeat(3, minmax(0,1fr))}
  .galleria .g-larga{grid-column:1 / -1}
  .galleria .g-larga img{aspect-ratio:1439/560;object-position:center 60%}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}