/* ────────────────────────────────────────────────────────────
   mercato_pop — Fiordipizza Rufina (production, DNA C)
   Sagra di paese / manifesto vintage italiano. Tricolore sfacciato,
   type da poster (Anton), gingham, ombre-poster, blocchi di colore.
   Light + dark (token semantici): in dark le linee/ombre poster
   diventano crema su near-black (poster invertito). Sezioni
   sempre-scure (hero/footer) non flippano.
   ──────────────────────────────────────────────────────────── */

:root{
  /* ── costanti ── */
  --paper:    oklch(0.966 0.022 88);   /* chiaro stabile: testo/badge su rosso/verde/scuro */
  --ink-fixed:oklch(0.200 0.020 50);   /* scuro stabile: bg footer + testo su giallo */
  --red:      oklch(0.550 0.200 27);
  --red-br:   oklch(0.610 0.210 29);
  --green:    oklch(0.500 0.130 146);
  --yellow:   oklch(0.830 0.160 86);
  --yellow-d: oklch(0.760 0.155 80);
  --gingham:  color-mix(in oklab, var(--red) 42%, transparent);

  /* ── semantici (flippano) — default chiaro ── */
  --bg:         oklch(0.966 0.022 88);
  --bg-alt:     oklch(0.935 0.030 84);
  --fg:         oklch(0.220 0.020 50);   /* testo + linee/ombre poster */
  --fg-2:       oklch(0.380 0.024 48);
  --fg-mute:    oklch(0.510 0.022 50);
  --border:     color-mix(in oklab, var(--fg) 16%, transparent);
  --border-2:   color-mix(in oklab, var(--fg) 30%, transparent);
  --accent-ink: oklch(0.470 0.180 27);   /* rosso leggibile come testo su bg */

  --s1:8px;--s2:16px;--s3:24px;--s4:40px;--s5:64px;--s6:96px;--s7:120px;
  --radius:4px; --shell:1200px; --narrow:760px; --pad:clamp(1.25rem,4vw,3.25rem);
  --poster:"Anton",Impact,sans-serif; --sans:"Hanken Grotesk",system-ui,sans-serif; --serif:"Fraunces",Georgia,serif;
}

:root[data-theme="dark"]{
  --bg:         oklch(0.198 0.014 58);   /* near-black caldo */
  --bg-alt:     oklch(0.250 0.016 56);
  --fg:         oklch(0.928 0.018 86);   /* crema (linee/ombre poster diventano chiare) */
  --fg-2:       oklch(0.790 0.020 80);
  --fg-mute:    oklch(0.670 0.022 78);
  --border:     color-mix(in oklab, var(--fg) 18%, transparent);
  --border-2:   color-mix(in oklab, var(--fg) 34%, transparent);
  --accent-ink: oklch(0.760 0.160 32);   /* rosso schiarito per AA su scuro */
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:oklch(0.198 0.014 58); --bg-alt:oklch(0.250 0.016 56);
    --fg:oklch(0.928 0.018 86); --fg-2:oklch(0.790 0.020 80); --fg-mute:oklch(0.670 0.022 78);
    --border:color-mix(in oklab,var(--fg) 18%,transparent); --border-2:color-mix(in oklab,var(--fg) 34%,transparent);
    --accent-ink:oklch(0.760 0.160 32);
  }
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:1.075rem;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background-color .3s ease,color .3s ease;}
h1,h2{font-family:var(--poster);font-weight:400;line-height:.94;letter-spacing:.005em;margin:0;text-transform:uppercase;}
h3{font-family:var(--sans);font-weight:800;margin:0;letter-spacing:-0.01em;}
p{margin:0;} img{max-width:100%;display:block;}
a{color:var(--fg);text-decoration:none;border-bottom:2px solid var(--border-2);transition:color .15s,border-color .15s,background-color .15s;}
a:hover{color:var(--accent-ink);border-color:var(--red);}
a:focus-visible,button:focus-visible{outline:3px solid var(--red);outline-offset:2px;border-radius:2px;}
::selection{background:var(--yellow);color:var(--ink-fixed);}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
.skip{position:absolute;left:-9999px;background:var(--ink-fixed);color:var(--paper);padding:.5rem 1rem;z-index:300;border:0;}
.skip:focus{left:1rem;top:1rem;}
.ico{width:1em;height:1em;display:inline-block;vertical-align:-0.12em;}

.btn{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--sans);font-weight:800;font-size:1rem;padding:.9rem 1.5rem;border-radius:var(--radius);border:2.5px solid var(--fg);cursor:pointer;line-height:1;letter-spacing:.005em;transition:background-color .15s,color .15s,box-shadow .15s,border-color .15s;}
.btn--sm{padding:.5rem 1rem;font-size:.92rem;border-width:2px;}
.btn--red{background:var(--red);color:var(--paper);border-color:var(--fg);}
.btn--red:hover{background:var(--red-br);box-shadow:3px 3px 0 var(--fg);}
.btn--yellow{background:var(--yellow);color:var(--ink-fixed);border-color:var(--ink-fixed);}
.btn--yellow:hover{background:var(--yellow-d);box-shadow:3px 3px 0 var(--ink-fixed);}
.btn--ghost{background:transparent;color:var(--fg);}
.btn--ghost:hover{background:var(--fg);color:var(--bg);}
.btn--ghost-light{background:rgba(0,0,0,.28);color:var(--paper);border-color:var(--paper);}
.btn--ghost-light:hover{background:var(--paper);color:var(--ink-fixed);}
.cta{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;}

.bar{position:sticky;top:0;z-index:100;background:var(--bg);border-bottom:3px solid var(--fg);}
.bar__in{max-width:var(--shell);margin:0 auto;padding:.55rem var(--pad);display:flex;align-items:center;justify-content:space-between;gap:var(--s2);}
.bar__brand{border:0;display:flex;align-items:center;}
.bar__brand img{height:44px;width:auto;}
.bar__nav{display:flex;gap:1.6rem;}
.bar__nav a{border:0;font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--fg);}
.bar__nav a:hover{color:var(--accent-ink);}
.bar__end{display:flex;align-items:center;gap:var(--s2);}
.bar__tel{border:0;font-weight:800;font-size:.95rem;white-space:nowrap;color:var(--fg);}
.bar__tel:hover{color:var(--accent-ink);}
.theme-tog{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:transparent;border:2.5px solid var(--fg);border-radius:var(--radius);color:var(--fg);cursor:pointer;transition:color .15s,border-color .15s,background-color .15s;}
.theme-tog:hover{color:var(--paper);background:var(--red);border-color:var(--fg);}
.theme-tog svg{display:block;transition:transform .4s cubic-bezier(.2,.6,.2,1);}
:root[data-theme="dark"] .theme-tog svg{transform:rotate(180deg);}
.lang-tog{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 .7rem;font-family:var(--sans);font-weight:800;font-size:.82rem;letter-spacing:.04em;color:var(--fg);border:2.5px solid var(--fg);border-radius:var(--radius);}
.lang-tog:hover{color:var(--paper);background:var(--red);}
.burger{display:none;flex-direction:column;gap:5px;width:42px;height:42px;align-items:center;justify-content:center;background:none;border:2.5px solid var(--fg);border-radius:var(--radius);}
.burger span{width:20px;height:2.5px;background:var(--fg);transition:transform .2s,opacity .2s;}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mnav{display:none;flex-direction:column;padding:var(--s2) var(--pad) var(--s3);border-bottom:3px solid var(--fg);background:var(--bg);position:sticky;top:60px;z-index:99;}
.mnav a{border:0;padding:.7rem 0;font-size:1.2rem;font-weight:800;text-transform:uppercase;border-bottom:1px solid var(--border);}
.mnav__cta{margin-top:var(--s2);color:var(--accent-ink);}

/* Ticker — gingham da tovaglia (rosso stabile) */
.ticker{color:var(--paper);background:var(--red);overflow:hidden;border-top:3px solid var(--ink-fixed);border-bottom:3px solid var(--ink-fixed);
  background-image:repeating-linear-gradient(0deg, rgba(0,0,0,.14) 0 11px, transparent 11px 22px), repeating-linear-gradient(90deg, rgba(0,0,0,.14) 0 11px, transparent 11px 22px);}
.ticker__track{display:flex;align-items:center;white-space:nowrap;width:max-content;padding:.6rem 0;animation:marquee 26s linear infinite;}
.ticker__track>*{margin-right:1.2rem;}
.ticker__track span{font-family:var(--sans);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:.92rem;}
.ticker .ico{color:var(--yellow);width:1.3em;height:1.3em;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* Hero (sempre scuro: foto + scrim) */
.hero{position:relative;min-height:min(86vh,760px);display:flex;align-items:flex-end;overflow:hidden;border-bottom:4px solid var(--fg);}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:
  linear-gradient(to top, rgba(18,10,6,.88) 0%, rgba(18,10,6,.52) 24%, transparent 58%),
  linear-gradient(to right, rgba(18,10,6,.74) 0%, rgba(18,10,6,.3) 44%, transparent 74%);}
.hero__media{position:absolute;inset:0;z-index:0;}
.hero__img{width:100%;height:100%;object-fit:cover;object-position:center 58%;filter:saturate(1.16) contrast(1.05) brightness(.9);animation:kenburns 24s ease-in-out infinite alternate;}
@keyframes kenburns{from{transform:scale(1.03);}to{transform:scale(1.12);}}
.hero__body{position:relative;z-index:2;max-width:var(--shell);margin:0 auto;width:100%;padding:var(--s5) var(--pad) var(--s5);color:var(--paper);
  text-shadow:0 2px 22px rgba(0,0,0,.55);}
.hero__eyebrow{display:inline-block;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.82rem;color:var(--ink-fixed);background:var(--yellow);padding:.4rem .8rem;border:2px solid var(--ink-fixed);border-radius:var(--radius);margin-bottom:var(--s3);text-shadow:none;transform:rotate(-1.5deg);}
.hero__title{font-family:var(--poster);font-size:clamp(3.2rem,2rem+7vw,7rem);line-height:.9;letter-spacing:.01em;color:var(--paper);}
.u-year{display:inline-block;background:var(--red);color:var(--paper);padding:.02em .3em;border:3px solid var(--paper);transform:rotate(-2deg);box-shadow:6px 6px 0 rgba(0,0,0,.25);text-shadow:none;}
.hero__lede{max-width:46ch;margin:var(--s3) 0 var(--s4);font-size:1.16rem;font-weight:500;}
.hero__open{display:inline-flex;align-items:center;gap:.6rem;margin-top:var(--s4);font-size:.95rem;font-weight:600;}
.dot{width:10px;height:10px;border-radius:50%;background:var(--paper);display:inline-block;opacity:.6;}
.dot.is-open{background:var(--yellow);opacity:1;box-shadow:0 0 0 4px rgba(255,255,255,.25);}
.dot.is-closed{background:var(--paper);opacity:1;}

.intro{max-width:var(--narrow);margin:0 auto;padding:var(--s4) var(--pad) var(--s3);text-align:center;}
.intro p{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.4rem,1.05rem+1.6vw,2.05rem);line-height:1.36;font-optical-sizing:auto;}
.intro strong{font-style:normal;font-weight:600;color:var(--accent-ink);box-shadow:inset 0 -.5em 0 color-mix(in oklab,var(--yellow) 55%,transparent);}

.sec{max-width:var(--shell);margin:0 auto;padding:var(--s6) var(--pad);}
.sec--alt{max-width:none;background:var(--bg-alt);}
.sec--alt>*{max-width:var(--shell);margin-inline:auto;}
.sec__head{max-width:54ch;margin-bottom:var(--s4);}
.kick{display:inline-block;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;color:var(--paper);background:var(--green);padding:.3rem .7rem;border-radius:var(--radius);margin-bottom:var(--s3);}
.kick--on{background:var(--red);}
.kick--light{background:var(--yellow);color:var(--ink-fixed);}
.sec h2{font-size:clamp(2.2rem,1.4rem+3.2vw,4rem);}
.sec__intro{color:var(--fg-2);margin-top:var(--s3);font-size:1.08rem;font-weight:500;}

.menu{list-style:none;margin:0;padding:0;border-top:3px solid var(--fg);}
.menu__row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);padding:var(--s3) 0;border-bottom:2px solid var(--border);}
.menu__row h3{font-size:1.5rem;font-weight:800;display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;text-transform:uppercase;letter-spacing:-0.005em;}
.menu__row p{color:var(--fg-2);margin-top:.4rem;max-width:58ch;font-weight:500;}
.menu__row a{border:0;color:var(--accent-ink);font-weight:800;}
.menu__price{font-family:var(--poster);color:var(--accent-ink);white-space:nowrap;font-size:1.25rem;letter-spacing:.02em;}
.menu__row--mark{background:var(--yellow);margin-inline:calc(-1*var(--s2));padding-inline:var(--s2);border-radius:var(--radius);border:2.5px solid var(--ink-fixed);border-bottom-width:2.5px;}
.menu__row--mark h3,.menu__row--mark p,.menu__row--mark .menu__price{color:var(--ink-fixed);}
.menu__row--mark a{color:oklch(0.42 0.16 28);}
.tag{font-family:var(--sans);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;font-weight:800;color:var(--paper);background:var(--red);padding:.22rem .55rem;border-radius:4px;}
.allergeni{margin-top:var(--s4);font-size:.92rem;color:var(--fg-mute);max-width:70ch;}
.allergeni strong{color:var(--fg-2);}

.grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);}
.shot{margin:0;position:relative;overflow:hidden;border-radius:var(--radius);background:var(--ink-fixed);aspect-ratio:4/3;border:3px solid var(--fg);}
.shot img{width:100%;height:100%;object-fit:cover;filter:saturate(1.2) contrast(1.05);transition:transform .5s cubic-bezier(.3,.7,.2,1);}
.shot:hover img{transform:scale(1.07);}
.shot figcaption{position:absolute;left:.6rem;bottom:.6rem;color:var(--ink-fixed);font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em;background:var(--yellow);padding:.35rem .6rem;border-radius:var(--radius);border:2px solid var(--ink-fixed);}
.shot--tall{grid-row:span 2;aspect-ratio:3/4;}
.shot--wide{grid-column:1/-1;aspect-ratio:21/9;}
.grid__note{margin-top:var(--s3);color:var(--fg-mute);font-size:.92rem;max-width:60ch;}

/* Le farine — blocco ROSSO pop (stabile in entrambi i temi) */
.farine{background:var(--red);color:var(--paper);border-top:4px solid var(--ink-fixed);border-bottom:4px solid var(--ink-fixed);
  background-image:radial-gradient(60% 90% at 85% 50%, color-mix(in oklab,#000 14%,transparent), transparent 70%);}
.farine__in{max-width:var(--shell);margin:0 auto;padding:var(--s7) var(--pad);display:grid;gap:var(--s4);}
.farine .kick--light{background:var(--yellow);color:var(--ink-fixed);}
.farine h2{color:var(--paper);font-size:clamp(2.4rem,1.6rem+3.4vw,4.2rem);}
.farine p{color:color-mix(in oklab,var(--paper) 94%,transparent);margin-top:var(--s2);max-width:54ch;font-size:1.16rem;font-weight:500;}
.farine strong{color:var(--yellow);font-weight:700;}
.steps{list-style:none;margin:var(--s4) 0 0;padding:0;display:grid;gap:0;max-width:56ch;}
.steps li{padding:var(--s3) 0;border-top:2px solid rgba(255,255,255,.3);display:flex;gap:1rem;align-items:baseline;font-weight:500;}
.steps span{font-family:var(--poster);color:var(--yellow);font-size:1.5rem;min-width:2.4rem;}
.farine__deco{display:grid;place-items:center;min-height:300px;overflow:clip;}
.farine__sun{width:min(60vw,320px);height:min(60vw,320px);color:var(--yellow);filter:drop-shadow(6px 6px 0 rgba(0,0,0,.18));}
.spin{animation:spin 40s linear infinite;transform-origin:50% 50%;}
@keyframes spin{to{transform:rotate(360deg);}}

.quotes{display:grid;gap:var(--s4);grid-template-columns:1fr;}
.quote{margin:0;padding:var(--s4);border:3px solid var(--fg);border-radius:var(--radius);background:var(--bg-alt);box-shadow:6px 6px 0 var(--fg);}
.quote p{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.25rem,1rem+1.1vw,1.6rem);line-height:1.36;font-optical-sizing:auto;}
.quote cite{display:block;margin-top:var(--s2);font-style:normal;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--fg-mute);font-weight:700;}
.rec-foot{margin-top:var(--s4);color:var(--fg-mute);font-size:.92rem;font-weight:500;}

.orari{display:grid;gap:var(--s4);}
.hours{border-collapse:collapse;width:100%;max-width:420px;}
.hours th,.hours td{text-align:left;padding:.75rem 0;border-bottom:2px solid var(--border);font-size:1.08rem;}
.hours th{font-weight:800;text-transform:uppercase;letter-spacing:.02em;}
.hours td{color:var(--fg-2);text-align:right;font-variant-numeric:tabular-nums;font-weight:600;}
.addr{font-style:normal;margin:var(--s3) 0;color:var(--fg-2);line-height:1.7;font-weight:500;}
.addr a{border:0;color:var(--fg);font-weight:700;}
.addr a:hover{color:var(--accent-ink);}
.orari__map{border-radius:var(--radius);overflow:hidden;min-height:320px;border:3px solid var(--fg);}
.orari__map iframe{width:100%;height:100%;min-height:320px;border:0;display:block;}

.foot{background:var(--ink-fixed);color:color-mix(in oklab,var(--paper) 80%,transparent);border-top:4px solid var(--red);}
.foot__in{max-width:var(--shell);margin:0 auto;padding:var(--s6) var(--pad) var(--s4);display:grid;gap:var(--s4);grid-template-columns:1fr;}
.foot__brand{display:flex;flex-direction:column;gap:.5rem;}
.foot__name{font-family:var(--poster);text-transform:uppercase;font-size:2rem;color:var(--paper);letter-spacing:.01em;}
.foot__brand p{font-size:.92rem;color:color-mix(in oklab,var(--paper) 60%,transparent);max-width:34ch;}
.foot__col h3{font-family:var(--sans);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow);font-weight:800;margin-bottom:var(--s2);}
.foot__col p{font-size:.95rem;color:color-mix(in oklab,var(--paper) 78%,transparent);line-height:1.75;}
.foot a{color:color-mix(in oklab,var(--paper) 80%,transparent);border-bottom-color:rgba(255,255,255,.25);}
.foot a:hover{color:var(--yellow);border-color:var(--yellow);}
.foot__credit{max-width:var(--shell);margin:0 auto;padding:var(--s3) var(--pad);display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);justify-content:space-between;border-top:1px solid rgba(255,255,255,.2);font-size:.82rem;color:color-mix(in oklab,var(--paper) 55%,transparent);}
.foot__credit code{font-family:ui-monospace,Menlo,monospace;color:var(--yellow);}

[data-reveal]{opacity:0;transform:translateY(18px) scale(.985);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.8,.2,1.05);}
[data-reveal].is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1!important;transform:none!important;transition:none!important;}
  .ticker__track,.hero__img,.spin{animation:none!important;}
  body{transition:none!important;}
}
@media (min-width:720px){
  .quotes{grid-template-columns:1fr 1fr;gap:var(--s4);}
  .orari{grid-template-columns:1fr 1fr;gap:var(--s5);}
  .foot__in{grid-template-columns:1.5fr 1fr 1fr 1fr;}
  .farine__in{grid-template-columns:1.1fr .9fr;align-items:center;}
}
@media (min-width:960px){
  .grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;}
  .shot--wide{grid-column:span 2;aspect-ratio:auto;}
}
@media (max-width:860px){.bar__nav{display:none;}.burger{display:flex;}}
@media (max-width:520px){.bar__tel{display:none;}.cta .btn{width:100%;justify-content:center;}.grid{grid-template-columns:1fr;}.shot--tall{aspect-ratio:4/3;grid-row:auto;}.intro{text-align:left;}}