:root{
  --ground:#FBFAF8;
  --surface:#FFFFFF;
  --surface-2:#F4F1EC;
  --char:#211D18;
  --char-2:#2E2821;
  --ink:#1A1714;
  --ink-soft:#5C554C;
  --ink-faint:#8A8177;
  --ember:#B93B0B;
  --ember-deep:#8A2B07;
  --ember-wash:#FBEDE6;
  --smoke:#E4DED4;
  --smoke-2:#D6CEC1;
  --on-char:#F5F0E8;
  --on-char-soft:#A79D90;
  --ok:#3F6B44;
  --busy:#8A8177;
  --ok-wash:#EAF1EA;
  --attesa:#96650B;
  --attesa-wash:#FBF2DF;
  --errore:#A32A12;

  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"Source Serif 4",Georgia,"Times New Roman",serif;
  --f-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;

  --wrap:1120px;
  --r:4px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#141110;
    --surface:#1C1815;
    --surface-2:#231E1A;
    --char:#0D0B09;
    --char-2:#171310;
    --ink:#F2EDE5;
    --ink-soft:#A79D90;
    --ink-faint:#7C736A;
    --ember:#E8641F;
    --ember-deep:#F0854A;
    --ember-wash:#2A1810;
    --smoke:#332C25;
    --smoke-2:#453C32;
    --on-char:#F2EDE5;
    --on-char-soft:#9A9085;
    --ok:#7FAE84;
    --busy:#7C736A;
    --ok-wash:#1B241C;
    --attesa:#D9A441;
    --attesa-wash:#2A2213;
    --errore:#F0854A;
  }
}
:root[data-theme="dark"]{
  --ground:#141110;
  --surface:#1C1815;
  --surface-2:#231E1A;
  --char:#0D0B09;
  --char-2:#171310;
  --ink:#F2EDE5;
  --ink-soft:#A79D90;
  --ink-faint:#7C736A;
  --ember:#E8641F;
  --ember-deep:#F0854A;
  --ember-wash:#2A1810;
  --smoke:#332C25;
  --smoke-2:#453C32;
  --on-char:#F2EDE5;
  --on-char-soft:#9A9085;
  --ok:#7FAE84;
  --busy:#7C736A;
}

*{box-sizing:border-box}
body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:700;line-height:1.1;text-wrap:balance;margin:0}
p{margin:0}
a{color:inherit}
img{max-width:100%}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding-inline:20px}

/* ---------- prototype bar ---------- */
.proto{
  background:var(--ember-wash);
  border-bottom:1px solid var(--smoke);
  font-family:var(--f-mono);
  font-size:11px;
  letter-spacing:.04em;
  color:var(--ember-deep);
  text-transform:uppercase;
}
.proto .wrap{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding-block:7px}
.proto strong{font-weight:500}

/* ---------- header ---------- */
header.site{
  position:sticky;top:env(safe-area-inset-top,0px);z-index:40;
  background:color-mix(in srgb, var(--ground) 92%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--smoke);
}
.bar{display:flex;align-items:center;gap:18px;padding-block:12px}
.mark{display:flex;flex-direction:column;line-height:1;flex:0 0 auto}
.mark b{font-family:var(--f-display);font-weight:800;font-size:15px;letter-spacing:-.01em}
.mark span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.16em;color:var(--ink-faint);text-transform:uppercase;margin-top:3px}
.navwrap{flex:1;min-width:0;display:flex;align-items:center;gap:4px}
nav.main{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}
nav.main::-webkit-scrollbar{display:none}
nav.main.fade-l{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22px);mask-image:linear-gradient(90deg,transparent 0,#000 22px)}
nav.main.fade-r{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 22px),transparent 100%);mask-image:linear-gradient(90deg,#000 calc(100% - 22px),transparent 100%)}
nav.main.fade-l.fade-r{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%)}
.navarr{
  flex:0 0 auto;width:25px;height:27px;padding:0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--smoke-2);border-radius:var(--r);
  background:var(--surface);color:var(--ember);cursor:pointer;
  font-family:var(--f-display);font-size:15px;font-weight:700;line-height:1;
}
.navarr:hover{border-color:var(--ember);background:var(--ember-wash)}
.navarr[hidden]{display:none}
nav.main ul{display:flex;gap:2px;list-style:none;margin:0;padding:0}
nav.main button{
  font-family:var(--f-display);font-size:13px;font-weight:600;
  background:none;border:0;padding:7px 11px;border-radius:var(--r);
  color:var(--ink-soft);cursor:pointer;white-space:nowrap;
}
nav.main button:hover{color:var(--ink);background:var(--surface-2)}
nav.main button[aria-current="page"]{color:var(--ember);background:var(--ember-wash)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--ember);outline-offset:2px}

/* ---------- generic ---------- */
main{padding-bottom:72px}
.page{padding-top:8px}
section.block{padding-block:clamp(36px,6vw,64px);border-top:1px solid var(--smoke)}
section.block:first-of-type{border-top:0}
.eyebrow{
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ember);margin-bottom:14px;display:block;
}
.lede{font-size:clamp(18px,2.2vw,21px);color:var(--ink-soft);max-width:60ch;line-height:1.55}
.h-page{font-size:clamp(32px,5.2vw,52px);letter-spacing:-.02em;margin-bottom:16px}
.h-sec{font-size:clamp(23px,3vw,31px);letter-spacing:-.01em;margin-bottom:12px}
.h-sub{font-size:16px;font-family:var(--f-display);font-weight:700;letter-spacing:.01em;margin-bottom:6px}
.prose{max-width:62ch;display:flex;flex-direction:column;gap:14px;color:var(--ink-soft)}
.prose strong{color:var(--ink);font-weight:600}
.stack{display:flex;flex-direction:column}
.g12{gap:12px}.g20{gap:20px}.g32{gap:32px}

/* ---------- hero ---------- */
.hero{background:var(--char);color:var(--on-char);position:relative;overflow:hidden}
.hero .wrap{padding-block:clamp(48px,8vw,88px);position:relative;z-index:1}
.hero h1{font-size:clamp(38px,7.5vw,74px);letter-spacing:-.03em;max-width:15ch}
.hero .kicker{font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ember-deep);margin-bottom:22px;display:block}
.hero p.sell{margin-top:20px;max-width:52ch;font-size:clamp(17px,2vw,19.5px);color:var(--on-char-soft);line-height:1.6}
.hero .cta-row{margin-top:32px}
.emberline{height:3px;background:linear-gradient(90deg,var(--ember-deep),var(--ember) 45%,transparent)}
.params{
  background:var(--char-2);
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--on-char-soft);
  overflow:hidden;
}
.ticker{
  overflow:hidden;padding-block:13px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%);
}
.ticker-track{display:flex;width:max-content;animation:ticker-run 38s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-set{display:flex;flex:0 0 auto}
.ticker-set span{white-space:nowrap;padding-right:46px}
.params i{color:var(--ember-deep);font-style:normal;margin-right:5px}
@keyframes ticker-run{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .ticker{overflow-x:auto}
  .ticker-set[aria-hidden="true"]{display:none}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--f-display);font-weight:700;font-size:14px;
  padding:12px 20px;border-radius:var(--r);border:1px solid transparent;
  background:var(--ember);color:#fff;cursor:pointer;text-decoration:none;
}
.btn:hover{background:var(--ember-deep)}
.btn.ghost{background:transparent;border-color:var(--smoke-2);color:var(--ink)}
.btn.ghost:hover{border-color:var(--ember);color:var(--ember);background:transparent}
.btn.onchar{background:var(--ember);color:#fff}
.btn.onchar.ghost{background:transparent;border-color:rgba(255,255,255,.28);color:var(--on-char)}
.btn.onchar.ghost:hover{border-color:var(--ember);color:var(--ember)}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- photo placeholder ---------- */
.ph{
  background:
    repeating-linear-gradient(135deg,transparent,transparent 9px,color-mix(in srgb,var(--smoke) 55%,transparent) 9px,color-mix(in srgb,var(--smoke) 55%,transparent) 10px),
    var(--surface-2);
  border:1px dashed var(--smoke-2);
  border-radius:var(--r);
  display:flex;align-items:center;justify-content:center;text-align:center;
  font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-faint);padding:14px;max-width:100%;
}
.foto{display:block;width:100%;height:auto;border-radius:var(--r);object-fit:cover;background:var(--surface-2)}
.foto.wide{aspect-ratio:16/9}
.foto.sq{aspect-ratio:3/4}
.foto.port{aspect-ratio:3/4}
.ph.wide{aspect-ratio:16/9}
.ph.sq{aspect-ratio:4/3}
.ph.port{aspect-ratio:3/4}

/* ---------- value grid ---------- */
.vgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--smoke);border:1px solid var(--smoke);border-radius:var(--r);overflow:hidden}
.vgrid > div{background:var(--surface);padding:22px 20px;display:flex;flex-direction:column;gap:7px}
.vgrid .n{font-family:var(--f-mono);font-size:10.5px;color:var(--ember);letter-spacing:.12em}
.vgrid p{font-size:15px;color:var(--ink-soft);line-height:1.55}

/* ---------- product ---------- */
.prod{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:26px;align-items:start}
.prod + .prod{margin-top:34px;padding-top:34px;border-top:1px solid var(--smoke)}
.prod .name{font-size:clamp(21px,2.6vw,26px);letter-spacing:-.01em}
.prod .tag{font-family:var(--f-mono);font-size:11px;color:var(--ember);letter-spacing:.06em;margin-top:5px;display:block}
.prod .desc{margin-top:13px;color:var(--ink-soft);max-width:60ch}
.use{margin-top:14px;background:var(--surface-2);border-left:2px solid var(--ember);padding:11px 14px;border-radius:0 var(--r) var(--r) 0;font-size:15px;color:var(--ink-soft)}
.use b{font-family:var(--f-display);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);display:block;margin-bottom:3px;font-weight:700}
.specs{margin-top:14px;display:flex;flex-wrap:wrap;gap:6px}
.spec{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);border:1px dashed var(--smoke-2);padding:4px 8px;border-radius:var(--r)}
.spec.done{border-style:solid;border-color:var(--smoke);color:var(--ink-soft)}

/* ---------- verifica CAP ---------- */
.capcheck{display:flex;flex-direction:column;gap:9px;max-width:440px;margin-top:8px}
.caprow{display:flex;gap:8px;flex-wrap:wrap;align-items:stretch}
.caprow input{max-width:140px;font-family:var(--f-mono);letter-spacing:.1em;font-size:16px}
.caprow .btn{flex:0 0 auto}
.capres:empty{display:none}
.capres{border-radius:var(--r);padding:15px 17px;font-size:15px;line-height:1.55;display:flex;flex-direction:column;gap:12px;align-items:flex-start;margin-top:3px}
.capres b{font-family:var(--f-display);font-size:17px;display:block;margin-bottom:5px}
.capres.yes{background:var(--ember-wash);border:1px solid color-mix(in srgb,var(--ember) 32%,transparent);color:var(--ink)}
.capres.yes b{color:var(--ember-deep)}
.capres.no{background:var(--surface-2);border:1px solid var(--smoke-2);color:var(--ink)}
.capres.err{background:transparent;border:1px dashed var(--smoke-2);color:var(--ink-soft);padding:11px 14px;font-size:14px}
.capnote{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-faint);letter-spacing:.03em;line-height:1.6}

/* ---------- mappa consegne ---------- */
.mapfig{margin:0;background:var(--surface);border:1px solid var(--smoke);border-radius:var(--r);padding:18px}
.vmap{display:block;width:100%;max-width:100%;height:auto}
.vshape{fill:var(--ember-wash);stroke:var(--ember);stroke-width:1.6;stroke-linejoin:round}
/* cresta e bargiglio: disegnati dietro la regione, così sporgono appena dal profilo */
.vfowl-back circle,.vfowl-back ellipse{fill:var(--ember-wash);stroke:var(--ember);stroke-width:1.6}
.veye-ring{fill:var(--surface);stroke:var(--ember);stroke-width:1.5}
.veye-pupil{fill:var(--ember)}
.vbeak{stroke:var(--ember);stroke-width:1.4;fill:none;opacity:.7;stroke-linecap:round}
.vcity circle{fill:var(--ink-faint)}
.vcity text{font-family:var(--f-mono);font-size:11.5px;fill:var(--ink-soft);letter-spacing:.02em}
.vhome circle{fill:var(--ember)}
.vhome .halo{fill:var(--ember);opacity:.16}
.vhome text{font-family:var(--f-display);font-size:13px;font-weight:700;fill:var(--ink)}
.vhome text.sub{font-family:var(--f-mono);font-size:10.5px;font-weight:400;fill:var(--ember);letter-spacing:.08em;text-transform:uppercase}
.mapfig figcaption{display:flex;flex-direction:column;gap:7px;margin-top:14px;padding-top:13px;border-top:1px solid var(--smoke)}
.mapfig .key{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink)}
.mapfig .sw{width:13px;height:13px;border-radius:2px;background:var(--ember-wash);border:1.5px solid var(--ember);flex:0 0 auto;display:inline-block}
.mapfig .note{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-faint);letter-spacing:.03em;line-height:1.6}

/* ---------- list ---------- */
ul.clean{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
ul.clean li{padding-left:20px;position:relative;color:var(--ink-soft);max-width:62ch}
ul.clean li::before{content:"";position:absolute;left:0;top:11px;width:7px;height:1.5px;background:var(--ember)}
ul.clean li b{color:var(--ink);font-family:var(--f-display);font-weight:700;font-size:15.5px}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:1px;background:var(--smoke);border:1px solid var(--smoke);border-radius:var(--r);overflow:hidden}
.steps div{background:var(--surface);padding:18px 16px}
.steps .num{font-family:var(--f-mono);font-size:11px;color:var(--ember);display:block;margin-bottom:8px}
.steps p{font-family:var(--f-display);font-weight:600;font-size:15px;line-height:1.3;color:var(--ink)}

/* ---------- quotes ---------- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:16px}
.quote{background:var(--surface);border:1px solid var(--smoke);border-radius:var(--r);padding:22px 20px;display:flex;flex-direction:column;gap:14px}
.quote blockquote{margin:0;font-size:16.5px;line-height:1.55;color:var(--ink)}
.quote .who{font-family:var(--f-mono);font-size:11px;color:var(--ink-faint);letter-spacing:.04em}
.flag{
  display:inline-block;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ember-deep);background:var(--ember-wash);border:1px solid color-mix(in srgb,var(--ember) 30%,transparent);
  padding:3px 7px;border-radius:2px;
}

/* ---------- marchi dei locali: sempre in bianco e nero ---------- */
.marchio{display:flex;align-items:center;gap:11px;flex-wrap:wrap;min-height:48px}
/* il marchio verticale sborda un filo verso l'alto senza spostare il testo sotto */
.logo.alto{margin-block:-6px}
.logo-link{display:inline-flex;flex:0 0 auto;line-height:0;border-radius:2px}
.logo-link:hover .logo{opacity:1}
.marchio .h-sub{margin-bottom:0}
.logo{
  height:34px;width:auto;max-width:70px;object-fit:contain;flex:0 0 auto;
  opacity:.9;
}
/* marchio verticale: alzato per pareggiare il peso ottico degli altri due */
.logo.alto{height:46px;max-width:40px}
/* i marchi sono monocromi scuri: su fondo scuro si invertono per restare leggibili */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .logo{filter:invert(1);opacity:.82}}
:root[data-theme="dark"] .logo{filter:invert(1);opacity:.82}
.logo-ph{
  flex:0 0 auto;height:30px;min-width:48px;padding:0 8px;
  display:flex;align-items:center;justify-content:center;
  border:1px dashed var(--smoke-2);border-radius:2px;
  font-family:var(--f-mono);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);
}

/* ---------- locali dove provare i prodotti ---------- */
.locali{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:16px}
.locale{
  background:var(--surface);border:1px solid var(--smoke);border-top:2px solid var(--ember);
  border-radius:var(--r);padding:20px 20px 18px;display:flex;flex-direction:column;gap:8px;
}
.locale .dove{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ember)}
.locale .nome{font-family:var(--f-display);font-weight:700;font-size:21px;letter-spacing:-.01em;color:var(--ink);line-height:1.15}
.locale .cosa{font-size:15px;color:var(--ink-soft);line-height:1.55;flex:1}
.locale .nota{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-faint);line-height:1.6;letter-spacing:.02em}
.al-banco{
  align-self:flex-start;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ember-deep);background:var(--ember-wash);border:1px solid color-mix(in srgb,var(--ember) 30%,transparent);
  padding:3px 8px;border-radius:2px;
}

/* ---------- ricette su prenotazione: lista compatta ---------- */
ul.clean.stretta{gap:7px}
ul.clean.stretta li{font-size:15.5px;line-height:1.5;max-width:70ch}
ul.clean.stretta li::before{top:10px}
ul.clean.stretta li b{font-size:15.5px}

/* ---------- calendar ---------- */
.cal{border:1px solid var(--smoke);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.cal-row{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:18px;align-items:center;padding:16px 18px;border-top:1px solid var(--smoke)}
.cal-row:first-child{border-top:0}
.cal-date{font-family:var(--f-mono);font-size:13px;color:var(--ink);line-height:1.35}
.cal-date b{display:block;font-size:20px;font-weight:500;letter-spacing:-.02em}
.cal-date span{color:var(--ink-faint);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}
.cal-date.periodo b{font-size:15px;white-space:nowrap}
.cal-main .t{font-family:var(--f-display);font-weight:700;font-size:16.5px;color:var(--ink)}
.cal-main .l{font-size:14px;color:var(--ink-soft);margin-top:3px}
.cal-main .h{font-family:var(--f-mono);font-size:11px;color:var(--ink-faint);margin-top:5px;letter-spacing:.04em}
.cal-main .m{font-size:13.5px;color:var(--ink-soft);margin-top:7px;line-height:1.45}
.cal-main .m b{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ember);margin-right:8px;font-weight:500}
.chip{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:5px 9px;border-radius:2px;white-space:nowrap}
.chip.pub{background:var(--ember-wash);color:var(--ember-deep);border:1px solid color-mix(in srgb,var(--ember) 28%,transparent)}
.chip.busy{background:var(--surface-2);color:var(--busy);border:1px solid var(--smoke-2)}
.cal-row.is-busy{background:var(--surface-2)}
.cal-row.is-busy .cal-date b,.cal-row.is-busy .cal-main .t{color:var(--ink-faint);font-weight:500}
.cal-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;font-family:var(--f-mono);font-size:11px;color:var(--ink-faint);letter-spacing:.04em}

/* ---------- blog ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:20px}
.card{background:var(--surface);border:1px solid var(--smoke);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.card .ph{border:0;border-radius:0;border-bottom:1px dashed var(--smoke-2)}
.card-body{padding:18px;display:flex;flex-direction:column;gap:9px;flex:1}
.cat{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ember)}
.card h3{font-size:19px;letter-spacing:-.01em}
.card p{font-size:15px;color:var(--ink-soft);line-height:1.55}
.filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:22px}
.filters button{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:2px;border:1px solid var(--smoke-2);background:transparent;color:var(--ink-soft);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ember);border-color:var(--ember);color:#fff}

/* ---------- faq ---------- */
.faq{border-top:1px solid var(--smoke);max-width:74ch}
.faq details{border-bottom:1px solid var(--smoke)}
.faq summary{
  cursor:pointer;list-style:none;padding:17px 0;
  font-family:var(--f-display);font-weight:700;font-size:16.5px;color:var(--ink);
  display:flex;justify-content:space-between;gap:16px;align-items:flex-start;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-mono);color:var(--ember);font-size:17px;line-height:1.2;flex:0 0 auto}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 0 18px;color:var(--ink-soft);max-width:62ch}
.faq .a .flag{margin-bottom:8px}

/* ---------- forms ---------- */
.form{background:var(--surface);border:1px solid var(--smoke);border-radius:var(--r);padding:clamp(20px,3vw,30px)}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1/-1}
label{font-family:var(--f-display);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
input,select,textarea{
  font-family:var(--f-body);font-size:16px;color:var(--ink);
  background:var(--ground);border:1px solid var(--smoke-2);border-radius:var(--r);
  padding:10px 12px;width:100%;
}
textarea{min-height:92px;resize:vertical}
.callback{
  grid-column:1/-1;background:var(--surface-2);
  border:1px solid var(--smoke);border-left:2px solid var(--ember);
  border-radius:0 var(--r) var(--r) 0;padding:15px 17px;
  display:flex;flex-direction:column;gap:13px;
}
.callback .row{display:flex;gap:11px;align-items:flex-start}
.callback input[type=checkbox]{width:auto;flex:0 0 auto;margin-top:4px}
.callback .lbl{
  font-family:var(--f-display);font-weight:700;font-size:15.5px;color:var(--ink);
  text-transform:none;letter-spacing:0;cursor:pointer;display:block;
}
.callback .hint{font-size:14.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5;font-family:var(--f-body)}
.callback .when{display:none}
.callback .when.on{display:flex;flex-direction:column;gap:6px;max-width:270px}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-soft)}
.consent input{width:auto;margin-top:4px}
.obb{color:var(--ember);font-weight:700;margin-left:3px}
.formnote{font-family:var(--f-mono);font-size:11px;color:var(--ink-faint);margin-top:14px;letter-spacing:.03em}
.sent{margin-top:16px;background:var(--ember-wash);border:1px solid color-mix(in srgb,var(--ember) 30%,transparent);border-radius:var(--r);padding:14px 16px;font-size:15px;color:var(--ember-deep)}

/* ---------- misc ---------- */
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(275px,1fr));gap:clamp(24px,4vw,44px);align-items:start}
.dark-band{background:var(--char-2);color:var(--on-char);border-radius:var(--r);padding:clamp(24px,4vw,40px)}
.dark-band .h-sec{color:var(--on-char)}
.dark-band p{color:var(--on-char-soft)}
.timeline{list-style:none;margin:0;padding:0;border-left:1px solid var(--smoke);display:flex;flex-direction:column;gap:22px}
.timeline li{padding-left:24px;position:relative}
.timeline li::before{content:"";position:absolute;left:-4.5px;top:8px;width:8px;height:8px;border-radius:50%;background:var(--ember)}
.timeline .y{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ember);display:block;margin-bottom:4px}
.timeline p{color:var(--ink-soft);font-size:15.5px;max-width:58ch}
.person{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:26px;align-items:start}
footer.site{background:var(--char);color:var(--on-char-soft);padding-block:44px;margin-top:0}
footer.site .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:28px}
footer.site h4{color:var(--on-char);font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;font-family:var(--f-mono);font-weight:500}
footer.site p,footer.site li{font-size:14px;line-height:1.7}
footer.site ul{list-style:none;margin:0;padding:0}
.legal{font-family:var(--f-mono);font-size:11px;line-height:1.9;letter-spacing:.02em}

@media (max-width:560px){
  /* su telefono il sottotitolo del marchio rubava spazio al menu */
  .mark span{display:none}
  .mark b{font-size:14px}
  .bar{gap:12px}
}
@media (max-width:720px){
  .ticker{padding-block:11px}
  .ticker-set span{padding-right:34px}
  .prod{grid-template-columns:1fr;gap:16px}
  .person{grid-template-columns:1fr;gap:16px}
  /* da telefono la riga diventa una scheda: data e stato in cima,
     il contenuto sotto su tutta la larghezza invece che in mezza colonna */
  .cal-row{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"data stato" "corpo corpo";
    gap:4px 10px;align-items:center;padding:15px 14px;
  }
  .cal-date{grid-area:data;display:flex;align-items:baseline;gap:7px;font-size:11px}
  .cal-date b{display:inline;font-size:17px}
  .cal-date.periodo b{font-size:15px}
  .cal-main{grid-area:corpo;margin-top:4px}
  .cal-row .chip{grid-area:stato;justify-self:end;align-self:center}
  .cal-main .m{margin-top:5px}
  .hero h1{font-size:clamp(32px,10vw,44px)}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}


/* --- blog: elenco e articolo aperto --- */
.titolo-articolo{color:inherit;text-decoration:none}
.titolo-articolo:hover{color:var(--ember)}
.link-indietro{
  display:table;margin-bottom:18px;
  font-family:var(--f-display);font-size:13px;font-weight:600;
  color:var(--ink-soft);text-decoration:none;
}
.link-indietro:hover{color:var(--ember)}
#articolo-aperto{max-width:68ch}
#articolo-aperto .cat{display:block;margin-bottom:8px}
#articolo-aperto .foto{margin:18px 0;border-radius:var(--r)}
.testo-articolo p{margin-top:14px;font-size:17px;line-height:1.65}

/* ================================================================
   Aggiunte per il sito autonomo (fuori dall'anteprima)
   ================================================================ */
html{color-scheme:light dark}
[hidden]{display:none !important}

/* link "salta al contenuto", per chi naviga da tastiera */
.skip{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--ember);color:#fff;padding:10px 16px;border-radius:0 0 var(--r) 0;
  font-family:var(--f-display);font-weight:700;font-size:14px;text-decoration:none;
}
.skip:focus{left:0}

/* il marchio ora è un link alla home */
a.mark{text-decoration:none;color:inherit}

/* le voci di menu erano <button>, ora sono <a> */
nav.main a{
  display:block;
  font-family:var(--f-display);font-size:13px;font-weight:600;
  padding:7px 11px;border-radius:var(--r);
  color:var(--ink-soft);text-decoration:none;white-space:nowrap;
}
nav.main a:hover{color:var(--ink);background:var(--surface-2)}
nav.main a[aria-current="page"]{color:var(--ember);background:var(--ember-wash)}

/* i pulsanti ora sono anche ancore */
a.btn{text-decoration:none}
footer.site a{text-decoration:none}
footer.site a:hover{color:var(--on-char);text-decoration:underline}

/* la riga del calendario può essere un link alla mappa */
.cal-main .l a{color:var(--ember);text-decoration:none;border-bottom:1px solid transparent}
.cal-main .l a:hover{border-bottom-color:var(--ember)}
.chip.oggi{background:var(--ember);color:#fff;border:1px solid var(--ember)}
.cal-vuoto{padding:26px 20px;color:var(--ink-soft);font-size:15.5px;line-height:1.6;text-align:center}

/* esito invio form */
.sent.ko{background:var(--surface-2);border-color:var(--smoke-2);color:var(--ink)}
