/* ===================== HOME «CRUSCOTTO» ===================== */
.cruscotto{background:#0B0C0E;color:#EEE8DA;position:relative;overflow:hidden;isolation:isolate;padding-block:clamp(2rem,5vw,3.6rem) clamp(2.2rem,5vw,3.8rem)}
.cr-curve{position:absolute;inset:0;z-index:-3;background:url("../img/curve-livello.svg") center/cover no-repeat;opacity:.55;transition:opacity 1.2s}
.cr-strada{position:absolute;inset:0;z-index:-2;opacity:.62;--bx:50%;--bw:0%;--bh:0%;
  -webkit-mask-image:radial-gradient(ellipse var(--bw) var(--bh) at var(--bx) 108%,#000 35%,rgba(0,0,0,.55) 58%,transparent 76%);
          mask-image:radial-gradient(ellipse var(--bw) var(--bh) at var(--bx) 108%,#000 35%,rgba(0,0,0,.55) 58%,transparent 76%)}
.cr-strada img{width:100%;height:100%;object-fit:cover;object-position:50% 65%;filter:saturate(.85) contrast(1.05)}
.cruscotto::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,12,14,.86) 0%,rgba(11,12,14,.45) 45%,rgba(11,12,14,.7) 100%)}
.cr-anno{position:absolute;z-index:-1;right:-2vw;top:.2rem;font:700 clamp(9rem,34vw,26rem)/.8 var(--f-display);color:transparent;-webkit-text-stroke:1.5px rgba(242,182,27,.22);letter-spacing:-.02em;pointer-events:none;user-select:none}
.cr-in{display:grid;gap:clamp(1.2rem,3vw,2rem)}
.cr-occ{color:#A9A395}
.cr-occ b{color:var(--mezzeria)}
.cr-h1{font-size:var(--t-xxl);line-height:.86;text-transform:uppercase;letter-spacing:-.005em;display:flex;flex-wrap:wrap;column-gap:.22em;align-items:baseline}
.cr-h1 .g1,.cr-h1 .g3{font-weight:600;color:#EEE8DA}
.cr-h1 .g2{color:var(--mezzeria);font-variant-numeric:tabular-nums;text-shadow:0 0 0 rgba(242,182,27,0);transition:text-shadow 1.2s}
.cruscotto[data-stato="acceso"] .cr-h1 .g2{text-shadow:0 0 28px rgba(242,182,27,.35)}
.cr-lead{color:#D9D2C3;max-width:44rem;font-size:clamp(1.02rem,2.4vw,1.2rem)}
.cr-lead strong{color:#fff}
/* quadro */
.quadro{position:relative;max-width:980px;width:100%;margin-inline:auto}
.quadro-svg{width:100%;height:auto;display:block;overflow:visible}
.qd-fondo{fill:url(#qd-g)}
.qd-anello{fill:none;stroke:#3a4048;stroke-width:3}
.qd-rosso{fill:none;stroke:#C4321F;stroke-width:12;opacity:.35;transition:opacity .6s}
.tk-M{stroke:#6d7178;stroke-width:4;stroke-linecap:round;transition:stroke .6s}
.tk-m{stroke:#474c53;stroke-width:2;transition:stroke .6s}
.qd-num{fill:#6d7178;font:600 30px var(--f-display);text-anchor:middle;transition:fill .6s}
.qd-lbl{fill:#8d8a82;font:700 22px var(--f-display);letter-spacing:.14em;text-anchor:middle;transition:fill .6s}
.qd-sotto{fill:#6a675f;font:500 15px var(--f-ui);text-anchor:middle}
.lancetta path{fill:#7a3228;transition:fill .6s}
.qd-perno{fill:#2a2e34;stroke:#4a5058;stroke-width:3}
.tft-fondo{fill:url(#tft-g);stroke:#2c3137;stroke-width:3}
.spia{fill:#252a30;stroke:#252a30;transition:fill .25s,stroke .25s,filter .25s}
.spia text{font-family:var(--f-display)}
.tft-lbl,.tft-sotto{fill:#5d6168;font:700 16px var(--f-display);letter-spacing:.16em;text-anchor:middle;transition:fill .6s}
.odo-cella{fill:#050709;stroke:#262b31;stroke-width:2}
.odo-cifra{fill:#4c4a45;font:700 46px var(--f-display);text-anchor:middle;transition:fill .6s}
.tft-trip,.tft-trip-n{fill:#5d6168;font:700 19px var(--f-display);letter-spacing:.08em;transition:fill .6s}
.tft-trip-v{fill:#5d6168;font:700 19px var(--f-display);text-anchor:end;font-variant-numeric:tabular-nums;transition:fill .6s}
.tft-riga{stroke:#2c3137;stroke-width:2}
.tft-ora{fill:#5d6168;font:700 26px var(--f-display);transition:fill .6s}
.tft-marcia{fill:#1f3a2a;font:700 34px var(--f-display);text-anchor:end;transition:fill .4s}
/* acceso */
.cruscotto[data-stato="acceso"] .cr-curve{opacity:.95}
.cruscotto[data-stato="acceso"] .tk-M{stroke:#F4EFE3}
.cruscotto[data-stato="acceso"] .tk-m{stroke:#9aa0a8}
.cruscotto[data-stato="acceso"] .qd-num{fill:#F4EFE3}
.cruscotto[data-stato="acceso"] .qd-lbl{fill:var(--mezzeria)}
.cruscotto[data-stato="acceso"] .qd-rosso{opacity:1}
.cruscotto[data-stato="acceso"] .lancetta path{fill:#FF5A36;filter:drop-shadow(0 0 6px rgba(255,90,54,.7))}
.cruscotto[data-stato="acceso"] .tft-lbl,.cruscotto[data-stato="acceso"] .tft-sotto{fill:#8FB7C9}
.cruscotto[data-stato="acceso"] .odo-cifra{fill:#F4EFE3}
.cruscotto[data-stato="acceso"] .tft-trip,.cruscotto[data-stato="acceso"] .tft-ora{fill:#F4EFE3}
.cruscotto[data-stato="acceso"] .tft-trip-n{fill:#A9C7D4}
.cruscotto[data-stato="acceso"] .tft-trip-v{fill:var(--mezzeria)}
.cruscotto[data-stato="acceso"] .tft-marcia{fill:var(--spia-verde);filter:drop-shadow(0 0 6px rgba(53,208,127,.8))}
.spia.on.spia-verde{fill:var(--spia-verde);stroke:var(--spia-verde);filter:drop-shadow(0 0 5px rgba(53,208,127,.9))}
.spia.on.spia-blu{fill:var(--spia-blu);stroke:var(--spia-blu);filter:drop-shadow(0 0 5px rgba(63,140,255,.9))}
.spia.on.spia-rossa{fill:var(--spia-rossa);stroke:var(--spia-rossa);filter:drop-shadow(0 0 5px rgba(255,75,58,.9))}
.spia.on.spia-ambra{fill:var(--spia-ambra);stroke:var(--spia-ambra);filter:drop-shadow(0 0 5px rgba(255,166,43,.9))}
/* chiave e comandi */
.cr-comandi{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1rem}
.chiave{display:inline-flex;align-items:center;gap:.8rem;background:#16181B;border:2px solid #3a4048;color:#EEE8DA;border-radius:999px;padding:.45rem 1.2rem .45rem .45rem;font:700 1.15rem/1 var(--f-display);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.chiave:hover{border-color:var(--mezzeria)}
.blocchetto{width:48px;height:48px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#3b4047,#15171a);border:2px solid #555c64;display:grid;place-items:center;position:relative}
.blocchetto::before,.blocchetto::after{position:absolute;font:700 9px/1 var(--f-display);letter-spacing:.08em;color:#8d8a82}
.blocchetto::before{content:"OFF";left:-2px;top:-12px}
.blocchetto::after{content:"ON";right:-4px;top:-12px;color:var(--spia-verde)}
.blocchetto svg{width:30px;height:30px;transition:transform .45s cubic-bezier(.3,1.6,.5,1);transform:rotate(-45deg)}
.cruscotto[data-stato="acceso"] .blocchetto svg{transform:rotate(45deg)}
.suono{display:inline-flex;align-items:center;gap:.45rem;color:#A9A395;font:500 .92rem/1 var(--f-ui);cursor:pointer}
.suono input{width:18px;height:18px;accent-color:var(--mezzeria)}
.btn-chiaro{background:transparent;color:#EEE8DA;border-color:#EEE8DA}
.btn-chiaro:hover{color:var(--mezzeria);border-color:var(--mezzeria)}
.cr-citazione{font:italic 400 1rem/1.5 var(--f-read);color:#A9A395;max-width:40rem}
.cr-citazione small{font:500 .78rem/1 var(--f-ui);font-style:normal;letter-spacing:.08em;text-transform:uppercase;margin-left:.3rem}
@media (min-width:980px){
  .cr-in{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-areas:"tit tit" "lead quadro" "com quadro" "cit cit";align-items:center;column-gap:3.5rem}
  .cr-titolo{grid-area:tit}.cr-lead{grid-area:lead;align-self:end}.quadro{grid-area:quadro}.cr-comandi{grid-area:com;align-self:start}.cr-citazione{grid-area:cit}
  .cr-h1{font-size:min(var(--t-xxl),9vw);flex-wrap:nowrap;white-space:nowrap}
}

/* ===================== LA STRADA DAL 1999 ===================== */
.storia{position:relative}
.storia-intro{display:grid;gap:1.2rem;margin-bottom:2.6rem}
.storia-intro .leggi{font-size:1.15rem}
.cippi{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:clamp(2.2rem,6vw,3.6rem)}
.strada-svg{position:absolute;top:-1rem;bottom:-1rem;left:34px;width:60px;height:calc(100% + 2rem);z-index:0;overflow:visible}
.strada-asfalto{fill:none;stroke:var(--asfalto);stroke-width:40;stroke-linecap:round}
.strada-bordo{fill:none;stroke:var(--linea);stroke-width:48;stroke-linecap:round}
.strada-mezz{fill:none;stroke:var(--mezzeria);stroke-width:3.5;stroke-dasharray:16 14}
.strada-moto{fill:var(--rocca);stroke:#fff;stroke-width:3}
.cippo-voce{position:relative;z-index:1;display:grid;grid-template-columns:calc(5.4rem + 44px) minmax(0,1fr);gap:1.1rem;align-items:start}
.cippo{width:5.4rem;margin-left:calc(64px - 2.7rem);background:#FBFAF6;border:2px solid #CFC7B6;border-radius:30px 30px 6px 6px;overflow:hidden;box-shadow:0 6px 14px rgba(0,0,0,.18);text-align:center;color:#16181B}
.cippo::before{content:"";display:block;height:26px;background:#B3261E;border-bottom:2px solid #CFC7B6}
.cippo small{display:block;font:700 .66rem/1 var(--f-display);letter-spacing:.16em;margin-top:.5rem;color:#5c574e}
.cippo b{display:block;font:700 1.3rem/1.05 var(--f-display);padding:.1rem .15rem .55rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.cippo-voce time{font:700 .82rem/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--rocca)}
.cippo-voce h3{margin:.35rem 0 .5rem;font-size:clamp(1.35rem,3.6vw,1.7rem)}
.cippo-voce blockquote{margin:0;font:italic 400 1.08rem/1.6 var(--f-read);color:var(--fg);max-width:38rem;border-left:3px solid var(--mezzeria);padding-left:.9rem}
.cippo-voce .fonte{display:block;margin-top:.5rem;font:500 .78rem/1.3 var(--f-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2)}
.cippo-voce>div{min-width:0}
.cippo-voce .btn{margin-top:.8rem;font-size:.9rem;padding:.65rem .95rem;white-space:normal;max-width:100%}
.cippo-voce.oggi .cippo::before{background:var(--mezzeria)}
@media (min-width:860px){
  .cippi{max-width:62rem}
  .cippo-voce{grid-template-columns:calc(5.4rem + 64px) minmax(0,1fr)}
  .strada-svg{left:44px}
  .cippo{margin-left:calc(74px - 2.7rem)}
}

/* ===================== LE MIE STRADE (carta con le scie) ===================== */
.le-strade{display:grid;gap:1.6rem}
.carta-scie{position:relative;border-radius:14px;overflow:hidden;background:var(--asfalto);box-shadow:var(--ombra)}
.carta-scie svg{display:block;width:100%;height:auto}
.scia-alone{fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:.45;filter:url(#sfoca)}
.scia{fill:none;stroke-linecap:round;stroke-linejoin:round}
.scia-g{cursor:pointer}
.scia-g:focus-visible .scia{stroke-width:9}
.scia-g .scia,.scia-g .scia-alone{stroke-dasharray:1;stroke-dashoffset:0}
.carta-scie.disegna .scia-g .scia,.carta-scie.disegna .scia-g .scia-alone{stroke-dashoffset:1;animation:disegna 3.2s cubic-bezier(.5,.1,.3,1) forwards}
.carta-scie.disegna .scia-g:nth-child(2) .scia,.carta-scie.disegna .scia-g:nth-child(2) .scia-alone{animation-delay:.6s}
.carta-scie.disegna .scia-g:nth-child(3) .scia,.carta-scie.disegna .scia-g:nth-child(3) .scia-alone{animation-delay:1.2s}
@keyframes disegna{to{stroke-dashoffset:0}}
.carta-scie .etich{font:700 34px var(--f-display);letter-spacing:.05em;fill:#2b2620;paint-order:stroke;stroke:rgba(245,241,232,.92);stroke-width:8px;text-transform:uppercase}
.carta-scie .punto{fill:#2b2620;stroke:rgba(245,241,232,.9);stroke-width:4}
@media (min-width:900px){.carta-scie .etich{font-size:24px;stroke-width:6px}}
.carta-scie .notte{display:var(--vis-notte)}
.carta-scie .giorno{display:var(--vis-giorno)}
:root{--vis-notte:none;--vis-giorno:inline}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--vis-notte:inline;--vis-giorno:none}}
:root[data-theme="dark"]{--vis-notte:inline;--vis-giorno:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .carta-scie .etich{fill:#EEE8DA;stroke:rgba(10,11,13,.85)}}
:root[data-theme="dark"] .carta-scie .etich{fill:#EEE8DA;stroke:rgba(10,11,13,.85)}
.legenda-scie{display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;font:600 .95rem/1.2 var(--f-display);letter-spacing:.06em;text-transform:uppercase}
.legenda-scie a{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none}
.legenda-scie i{width:28px;height:5px;border-radius:3px;display:inline-block}
@media (min-width:900px){.le-strade{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);align-items:center}}

/* ===================== blocchi della home ===================== */
.emblema{display:grid;gap:2rem;align-items:center}
.sagoma{position:relative;max-width:30rem}
.sagoma img{width:100%;aspect-ratio:4/5;object-fit:cover;-webkit-mask:url("../img/sagoma-curva.svg") center/contain no-repeat;mask:url("../img/sagoma-curva.svg") center/contain no-repeat}
.sagoma .timbro{position:absolute;right:-.5rem;bottom:1.5rem;width:34%;max-width:9rem;border-radius:50%;box-shadow:0 10px 30px rgba(0,0,0,.35);background:#fff}
.firma{font:700 1.4rem/1 var(--f-display);letter-spacing:.08em;color:var(--rocca);margin-top:.8rem}
@media (min-width:860px){.emblema{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.passione{display:grid;gap:1.5rem;align-items:end}
.passione h2{font-size:clamp(2.2rem,8vw,4.6rem);line-height:.92}
.passione img{border-radius:12px;width:100%;aspect-ratio:3/2;object-fit:cover}
@media (min-width:860px){.passione{grid-template-columns:1.1fr 1fr}}
/* interruttori del manubrio («Cosa facciamo») */
.interruttori{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(13rem,100%),1fr));gap:.8rem;margin-top:1.4rem}
.interruttore{display:flex;align-items:center;gap:.9rem;background:var(--asfalto-2);border:1px solid var(--asfalto-3);border-radius:12px;padding:1rem;color:var(--su-asfalto);font:700 1.15rem/1.1 var(--f-display);letter-spacing:.05em;text-transform:uppercase}
.interruttore .led{flex:none;width:12px;height:12px;border-radius:50%;background:var(--spia-verde);box-shadow:0 0 10px var(--spia-verde)}
.territorio{display:grid;gap:1.4rem}
.riquadri-foto{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(15rem,100%),1fr));gap:1rem}
.rq{background:var(--bg);border:1px solid var(--linea);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.rq:hover{transform:translateY(-4px);box-shadow:var(--ombra)}
.rq img{width:100%;aspect-ratio:16/10;object-fit:cover}
.rq-c{padding:1rem 1.1rem 1.2rem;display:grid;gap:.5rem;flex:1;align-content:start}
.rq-c h3{font-size:1.25rem}
.rq-c p{font:400 1rem/1.55 var(--f-read);color:var(--fg)}
.rq-c .btn{justify-self:start;margin-top:.3rem;font-size:.85rem;padding:.6rem .85rem}
.servizi{display:grid;gap:1.6rem;align-items:center}
.servizi ol{list-style:none;margin:0;padding:0;display:grid;gap:1.2rem;counter-reset:s}
.servizi li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:1rem;align-items:start}
.servizi li>*{grid-column:2}
.servizi li::before{grid-column:1;grid-row:1/span 3;counter-increment:s;content:counter(s);font:700 2.6rem/1 var(--f-display);color:var(--mezzeria);-webkit-text-stroke:1px var(--fg);color:transparent}
.servizi img{border-radius:14px;width:100%;aspect-ratio:4/3;object-fit:cover}
@media (min-width:900px){.servizi{grid-template-columns:1fr 1fr}}
.fascia-foto{min-height:24rem;display:grid;align-items:end;color:#fff}
.fascia-foto .wrap{padding-block:4rem}
.fascia-foto h2{font-size:clamp(2rem,7vw,4rem);max-width:16ch}
.fascia-foto p{max-width:36rem;margin-top:.8rem;font:400 1.1rem/1.55 var(--f-read);color:#f0ebe0}
.citazioni .car-slide{min-height:20rem;align-content:center;text-align:center;justify-items:center}
.citazioni .car-slide::after{background:none}
.citazioni blockquote{margin:0;font:italic 400 clamp(1.25rem,3.6vw,1.9rem)/1.45 var(--f-read);max-width:42rem;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.6)}
.citazioni cite{display:block;margin-top:1rem;font:700 .95rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:var(--mezzeria)}
.faq{display:grid;gap:.6rem;max-width:48rem}
.faq details{border:1px solid var(--linea);border-radius:10px;background:var(--bg);padding:0 1.1rem}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;font:700 1.25rem/1.1 var(--f-display);letter-spacing:.04em;text-transform:uppercase}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;color:var(--rocca)}
.faq details[open] summary::after{content:"–"}
.faq .leggi{padding-bottom:1.1rem}
.articoli{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(16rem,100%),1fr));gap:1rem}
.art{display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--linea);border-radius:12px;overflow:hidden;text-decoration:none;transition:transform .2s,box-shadow .2s}
.art:hover{transform:translateY(-4px);box-shadow:var(--ombra);color:inherit}
.art img{aspect-ratio:16/10;object-fit:cover;width:100%}
.art div{padding:1rem 1.1rem 1.2rem;display:grid;gap:.4rem}
.art h3{font-size:1.3rem}
.art time{font:700 .78rem/1 var(--f-display);letter-spacing:.14em;color:var(--rocca);text-transform:uppercase}
.art p{font:400 .98rem/1.5 var(--f-read);color:var(--fg-2)}
.art .in-arrivo{justify-self:start;font:700 .7rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;background:var(--bg-2);border:1px solid var(--linea);border-radius:4px;padding:.3rem .45rem;color:var(--fg-2)}
.iscrizione{display:grid;gap:1rem;max-width:38rem}
.iscrizione h2{font-size:clamp(2rem,7vw,3.6rem)}
/* telefono stretto: il cippo resta un segnale grafico di misura fissa (la data e' comunque nel testo) */
@media (max-width:480px){
  .cippo-voce{grid-template-columns:108px minmax(0,1fr);gap:.8rem}
  .cippo{width:64px;margin-left:32px}
  .cippo::before{height:20px}
  .cippo small{font-size:10px}
  .cippo b{font-size:18px}
}
.cippo-voce blockquote{overflow-wrap:break-word}