/* ---------- font in locale (Archivo e Newsreader, licenza OFL, file in /font) ---------- */
@font-face{font-family:"Archivo";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url("font/archivo-latin-wdth-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url("font/archivo-latin-ext-wdth-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Newsreader";font-style:normal;font-display:swap;font-weight:200 800;src:url("font/newsreader-latin-opsz-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Newsreader";font-style:normal;font-display:swap;font-weight:200 800;src:url("font/newsreader-latin-ext-opsz-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Newsreader";font-style:italic;font-display:swap;font-weight:200 800;src:url("font/newsreader-latin-opsz-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --asfalto:#1A2230;      /* inchiostro e fasce scure */
  --asfalto-2:#253043;
  --carta:#E9ECF0;        /* fondo chiaro, freddo */
  --bianco:#F7F8FA;
  --grigio:#5E6878;       /* testo secondario */
  --linea:#C5CBD4;
  --giallo:#F2B705;       /* segnaletica orizzontale */
  --blu:#2450B8;          /* link */
  --bg:var(--carta); --fg:var(--asfalto); --muted:var(--grigio); --rule:var(--linea); --surface:var(--bianco); --link:var(--blu);
  --display:"Archivo", system-ui, sans-serif;
  --testo:"Newsreader", Georgia, serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#141A24; --fg:#E6E9EE; --muted:#9AA3B2; --rule:#2E3848; --surface:#1B2330; --link:#8FB0FF;
  }
}
:root[data-theme="dark"]{ --bg:#141A24; --fg:#E6E9EE; --muted:#9AA3B2; --rule:#2E3848; --surface:#1B2330; --link:#8FB0FF; }

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{transition:none!important;animation:none!important} }
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--testo);font-size:1.125rem;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--link);text-underline-offset:.18em}
a:focus-visible,button:focus-visible{outline:3px solid var(--giallo);outline-offset:3px}
img{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
@media (max-width:600px){ .wrap{padding:0 16px} }

/* ---------- testata ---------- */
.testata{background:var(--asfalto);color:#E9ECF0;position:relative;overflow:hidden}
.testata .barra{position:relative;z-index:2;display:flex;justify-content:flex-end;align-items:center;padding-top:18px;font-family:var(--display);font-size:.95rem}
.testata .barra a{color:#E9ECF0;text-decoration:none;margin-left:22px}
.testata .barra a:hover{color:var(--giallo)}
.marchio{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:16vw;line-height:.82;letter-spacing:-.035em;margin:36px 0 0;color:#F7F8FA;white-space:nowrap}
.marchio span{display:inline-block}
.battistrada{height:56px;margin:32px 0 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='56' viewBox='0 0 26 56'%3E%3Crect width='26' height='56' fill='%23F2B705'/%3E%3Cg stroke='%231A2230' stroke-width='5' fill='none'%3E%3Cpath d='M2 -2 L16 25'/%3E%3Cpath d='M16 31 L2 58'/%3E%3C/g%3E%3Crect y='26.5' width='26' height='3' fill='%231A2230'/%3E%3Crect y='9' width='26' height='2' fill='%231A2230'/%3E%3Crect y='45' width='26' height='2' fill='%231A2230'/%3E%3C/svg%3E") repeat-x left center/26px 56px}
.manifesto{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-block:28px 56px}
.manifesto p{margin:0;font-size:1.25rem;line-height:1.45;max-width:30ch}
.manifesto p.secondo{color:#AEB7C5;font-size:1.05rem;max-width:44ch;align-self:end}
@media (max-width:760px){ .manifesto{grid-template-columns:1fr;gap:16px} }

/* ---------- in evidenza ---------- */
.evidenza{padding-block:64px 40px}
.evidenza{display:grid;gap:80px}
.evidenza .griglia{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:start}
.evidenza .griglia.inversa{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.evidenza .griglia.inversa > a{order:2}
@media (max-width:900px){ .evidenza{gap:56px} .evidenza .griglia,.evidenza .griglia.inversa{grid-template-columns:1fr;gap:24px} .evidenza .griglia.inversa > a{order:0} }
.foto{aspect-ratio:3/2;background:
  linear-gradient(135deg,transparent 0 46%,rgba(242,183,5,.9) 46% 48%,transparent 48% 100%),
  var(--asfalto-2);display:flex;align-items:flex-end;padding:14px 16px;color:#AEB7C5;font-family:var(--display);font-size:.85rem}
.evidenza h2{font-family:var(--display);font-stretch:112%;font-weight:800;font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:.98;letter-spacing:-.02em;margin:0 0 18px}
.evidenza h2 a{color:inherit;text-decoration:none}
.evidenza h2 a:hover{text-decoration:underline;text-decoration-color:var(--giallo);text-decoration-thickness:4px}
.evidenza .occhiello{font-size:1.3rem;line-height:1.45;margin:0 0 26px;max-width:36ch}
.scheda{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 18px;font-family:var(--display);font-size:.95rem;border-top:3px solid var(--fg);padding-top:14px}
.scheda dt{color:var(--muted)}
.scheda dd{margin:0;font-weight:600}
.leggi{display:inline-block;margin-top:24px;font-family:var(--display);font-weight:700;font-size:1rem;background:var(--giallo);color:var(--asfalto);padding:12px 18px;text-decoration:none}
.leggi:hover{background:var(--fg);color:var(--bg)}

/* ---------- alla guida ---------- */
.garage{background:var(--surface);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin:40px 0 0}
.garage .wrap{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,22rem);gap:40px;padding-top:36px;padding-bottom:36px;align-items:center}
@media (max-width:900px){ .garage .wrap{grid-template-columns:1fr;gap:12px} }
.garage .intro{font-family:var(--display);font-size:1rem;color:var(--muted);margin:0}
.garage ul{list-style:none;margin:0;padding:0;font-family:var(--display);font-stretch:118%;font-weight:800;font-size:clamp(1.3rem,2.4vw,1.8rem);line-height:1.15;letter-spacing:-.015em}
.garage p.nota{margin:0;font-size:1.05rem;color:var(--muted)}

/* ---------- indice prove ---------- */
.indice{padding-block:72px 24px}
.indice h3,.arrivo h3{font-family:var(--display);font-weight:800;font-size:1.6rem;margin:0 0 6px}
.indice .sotto,.arrivo .sotto{color:var(--muted);margin:0 0 28px;font-size:1.05rem}
.filtri{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}
.filtri button{font-family:var(--display);font-size:.9rem;font-weight:600;background:transparent;color:var(--fg);border:2px solid var(--fg);padding:6px 14px;cursor:pointer}
.filtri button[aria-pressed="true"]{background:var(--fg);color:var(--bg)}
.prove{list-style:none;margin:0;padding:0;border-top:3px solid var(--fg)}
.prove li{border-bottom:1px solid var(--rule)}
.prove a{display:grid;grid-template-columns:minmax(0,1fr) 170px 70px;gap:20px;align-items:baseline;padding:20px 0;color:inherit;text-decoration:none}
.prove a:hover .modello{text-decoration:underline;text-decoration-color:var(--giallo);text-decoration-thickness:4px;text-underline-offset:.12em}
.prove .modello{font-family:var(--display);font-stretch:118%;font-weight:800;font-size:clamp(1.3rem,2.6vw,2rem);line-height:1.05;letter-spacing:-.015em}
.prove .modello span{display:block;font-family:var(--testo);font-stretch:100%;font-weight:400;font-size:1.05rem;letter-spacing:0;color:var(--muted);margin-top:6px;line-height:1.4}
.prove .come,.prove .anno{font-family:var(--display);font-size:.95rem;color:var(--muted)}
.prove .anno{text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:640px){
  .prove a{grid-template-columns:1fr auto;gap:4px 12px}
  .prove .modello{grid-column:1/-1}
}
.archivio{margin:22px 0 0;font-family:var(--display);font-size:1rem}

/* ---------- in arrivo ---------- */
.arrivo{padding-block:56px 80px}
.arrivo .coppia{display:grid;grid-template-columns:1fr 1fr;gap:0;border:3px solid var(--fg)}
.arrivo .coppia > div{padding:26px 28px}
.arrivo .coppia > div + div{border-left:3px solid var(--fg)}
@media (max-width:700px){ .arrivo .coppia{grid-template-columns:1fr} .arrivo .coppia > div + div{border-left:0;border-top:3px solid var(--fg)} }
.arrivo h4{font-family:var(--display);font-stretch:118%;font-weight:800;font-size:1.6rem;line-height:1.05;margin:0 0 10px}
.arrivo p{margin:0;color:var(--muted)}

/* ---------- piede ---------- */
footer{background:var(--asfalto);color:#AEB7C5;font-family:var(--display);font-size:.95rem}
footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:32px;padding-bottom:40px}
footer .piccolo{font-stretch:125%;font-weight:900;font-size:1.6rem;color:#F7F8FA;letter-spacing:-.02em}
footer a{color:#E9ECF0}

/* ---------- articolo ---------- */
.avanzamento{position:fixed;top:0;left:0;height:6px;width:0;z-index:10;background:repeating-linear-gradient(90deg,var(--giallo) 0 40px,transparent 40px 64px)}
.art-testata{background:var(--asfalto);color:#E9ECF0}
.art-testata .barra{display:flex;justify-content:space-between;align-items:center;padding-top:18px;padding-bottom:18px;font-family:var(--display)}
.art-testata .barra a{color:#E9ECF0;text-decoration:none}
.art-testata .barra .piccolo{font-stretch:125%;font-weight:900;font-size:1.5rem;letter-spacing:-.02em}
.art-testata h1{font-family:var(--display);font-stretch:118%;font-weight:900;font-size:clamp(2.6rem,7vw,5.6rem);line-height:.95;letter-spacing:-.03em;margin:36px 0 22px;max-width:14ch}
.art-testata .occhiello{font-size:1.35rem;line-height:1.45;max-width:40ch;margin:0;color:#C9D0DB;padding-bottom:48px}
.art-foto{display:block;width:100%;height:auto;aspect-ratio:21/9;max-height:78vh;object-fit:cover;background:var(--asfalto-2)}
img.foto{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;padding:0;background:var(--asfalto-2)}
.testo figure{margin:2em 0}
.testo figure img{display:block;width:100%;height:auto;background:var(--asfalto-2)}
.testo figcaption{font-family:var(--display);font-size:.9rem;line-height:1.4;color:var(--muted);margin-top:10px}
.dittico{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dittico img{aspect-ratio:3/4;object-fit:cover}
.art-corpo{display:grid;grid-template-columns:240px minmax(0,1fr);gap:64px;padding-top:56px;padding-bottom:80px}
@media (max-width:900px){ .art-corpo{grid-template-columns:1fr;gap:32px} }
.art-corpo aside .scheda{position:sticky;top:28px;grid-template-columns:1fr;gap:2px}
.art-corpo aside .scheda dd{margin-bottom:12px}
.testo{max-width:66ch}
.testo p{margin:0 0 1.1em;line-height:1.7}
.testo h2{font-family:var(--display);font-weight:800;font-size:1.55rem;line-height:1.15;margin:2em 0 .6em}
.testo .esempio{color:var(--muted);font-style:italic}
.verdetto{margin:2.4em 0 0;border-top:3px solid var(--fg);padding-top:20px}
.verdetto h2{margin-top:0}
.torna{display:inline-block;margin-top:40px;font-family:var(--display);font-weight:700}

/* ---------- aggiunte ---------- */
.prove li.presto a,.prove li.presto > span{pointer-events:none}
.prove li.presto .modello{color:var(--muted)}
.testo .attacco{font-size:1.3rem;line-height:1.5}
.testo blockquote{margin:2em 0;padding:0 0 0 20px;border-left:6px solid var(--giallo);font-family:var(--display);font-weight:800;font-stretch:112%;font-size:1.6rem;line-height:1.15}
.art-testata h1.lungo{max-width:18ch;font-size:clamp(2.4rem,6vw,4.8rem)}
.art-testata .battistrada{margin-top:0}
.prove a{grid-template-columns:150px minmax(0,1fr) 150px 60px}
.prove .mini{display:block;width:150px;height:auto;aspect-ratio:3/2;object-fit:cover;align-self:center;background:var(--asfalto-2)}
@media (max-width:640px){
  .prove a{grid-template-columns:96px minmax(0,1fr);gap:4px 14px}
  .prove .mini{width:96px;grid-row:1 / span 2}
  .prove .modello{grid-column:2}
  .prove .come{grid-column:2}
  .prove .anno{display:none}
}
picture{display:block}
@media (max-width:700px){ .art-foto{aspect-ratio:4/3;max-height:none} }

/* ---------- piede, contatti, pagine di servizio ---------- */
footer .piede-link{display:flex;flex-wrap:wrap;gap:6px 20px}
.modulo{display:grid;gap:20px;max-width:40rem;margin:1.6em 0 0}
.modulo label{display:grid;gap:6px;font-family:var(--display);font-size:.95rem;font-weight:600}
.modulo input,.modulo select,.modulo textarea{font-family:var(--testo);font-size:1.05rem;font-weight:400;line-height:1.4;color:var(--fg);background:var(--surface);border:2px solid var(--fg);border-radius:0;padding:10px 12px;width:100%}
.modulo textarea{min-height:10em;resize:vertical}
.modulo input:focus-visible,.modulo select:focus-visible,.modulo textarea:focus-visible{outline:3px solid var(--giallo);outline-offset:2px}
.modulo button{justify-self:start;font-family:var(--display);font-weight:700;font-size:1rem;background:var(--giallo);color:var(--asfalto);border:0;padding:12px 22px;cursor:pointer}
.modulo button:hover{background:var(--fg);color:var(--bg)}
.modulo .nota{margin:0;font-size:.95rem;color:var(--muted)}
.nascosto{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.da-completare{background:var(--giallo);color:var(--asfalto);padding:0 4px}
.testo ul{margin:0 0 1.1em;padding-left:1.2em}
.testo li{margin-bottom:.4em;line-height:1.6}

/* ---------- guide all'acquisto ---------- */
.art-testata .etichetta{font-family:var(--display);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;color:var(--giallo);margin:36px 0 -18px}
.dittico.largo img{aspect-ratio:3/2}
@media (max-width:600px){ .dittico.largo{grid-template-columns:1fr} }
.testo.guida .auto{scroll-margin-top:24px;border-top:3px solid var(--fg);margin-top:3.2em;padding-top:.2em}
.testo.guida .auto h2{margin:.7em 0 .5em}
.testo .bollino{display:inline-block;font-family:var(--display);font-weight:700;font-size:.85rem;line-height:1.3;background:var(--giallo);color:var(--asfalto);padding:4px 10px;margin:0 0 .4em}
.testo .cerca{font-family:var(--display);font-size:1rem;line-height:1.45;border-left:6px solid var(--giallo);padding:2px 0 2px 14px}
.testo .cerca span{display:block;font-weight:800;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.indice-auto{margin:2.4em 0;border:3px solid var(--fg);padding:18px 22px}
.testo .indice-auto h2{margin:0 0 .5em;font-size:1.2rem}
.indice-auto ol{columns:2;column-gap:28px;margin:0;padding-left:1.6em;font-family:var(--display);font-size:.95rem}
.indice-auto li{break-inside:avoid;margin-bottom:.3em}
@media (max-width:600px){ .indice-auto ol{columns:1} }
.testo .crediti{font-family:var(--display);font-size:.9rem;line-height:1.45;color:var(--muted);margin-top:2.4em}
