/* Autousate Genova — foglio di stile unico, taglio automotive moderno.
   Antracite + rosso segnale, tipografia netta. Nessuna libreria esterna. */
:root{
  --nero:#14171a; --antracite:#1e2429; --carta:#f5f6f7; --bianco:#fff;
  --rosso:#d1272c; --rosso-scuro:#a81f23; --acciaio:#5b6874; --bordo:#e2e6e9;
  --grigio:#6c7680; --ombra:0 2px 10px rgba(20,23,26,.08); --ombra-alta:0 16px 40px rgba(20,23,26,.22);
  --raggio:8px; --largo:1160px;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--nero);
  background:var(--bianco);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3{line-height:1.12;margin:0 0 .5em;font-weight:800;letter-spacing:-.02em}
h1{font-size:clamp(2.2rem,6vw,4rem);text-transform:uppercase}
h2{font-size:clamp(1.7rem,3.4vw,2.4rem);text-transform:uppercase}
h3{font-size:1.15rem;font-weight:700}
p{margin:0 0 1.1em}
a{color:var(--rosso)}a:hover{color:var(--rosso-scuro)}
img{max-width:100%;display:block}
.contenitore{width:min(var(--largo),92vw);margin-inline:auto}
.sezione{padding:clamp(2.5rem,6vw,4.5rem) 0}
.sezione-scura{background:var(--antracite);color:var(--carta)}
.sezione-scura h2{color:#fff}
.occhiello{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase;
  color:var(--rosso);margin-bottom:.7rem}
.sottotitolo{color:var(--grigio);max-width:60ch;font-size:1.06rem}
.sezione-scura .sottotitolo{color:rgba(245,246,247,.72)}

/* Bottoni */
.bottone{display:inline-block;padding:.85rem 1.8rem;border-radius:var(--raggio);background:var(--rosso);color:#fff;
  font-weight:700;letter-spacing:.02em;text-decoration:none;border:2px solid var(--rosso);transition:.18s;text-transform:uppercase;font-size:.9rem}
.bottone:hover{background:var(--rosso-scuro);border-color:var(--rosso-scuro);color:#fff;transform:translateY(-1px)}
.bottone-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.bottone-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}

/* Testata */
.testata{position:sticky;top:0;z-index:50;background:rgba(20,23,26,.96);backdrop-filter:blur(8px);color:#fff}
.testata-interna{display:flex;align-items:center;gap:1.5rem;min-height:70px}
.marchio{display:flex;align-items:baseline;gap:.25rem;margin-right:auto;text-decoration:none;color:#fff;font-weight:800;
  font-size:1.15rem;letter-spacing:-.02em;text-transform:uppercase}
.marchio b{color:var(--rosso)}
.menu{display:flex;gap:1.5rem;font-size:.9rem;font-weight:600}
.menu a{color:rgba(255,255,255,.82);text-decoration:none}
.menu a:hover{color:#fff}
.menu .tel{color:var(--rosso);font-weight:800}
.apri-menu{display:none;background:none;border:0;color:#fff;font-size:1.5rem;cursor:pointer}
@media(max-width:860px){
  .apri-menu{display:block}
  .menu{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--antracite);padding:.4rem 0;display:none}
  .menu.aperto{display:flex}
  .menu a{padding:.85rem 4vw;border-bottom:1px solid rgba(255,255,255,.08)}
}

/* Hero con foto che ruotano dietro al testo */
.hero{position:relative;min-height:min(84vh,640px);display:flex;align-items:center;color:#fff;background:var(--nero);overflow:hidden}
.hero-foto{position:absolute;inset:0;z-index:0}
.hero-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
.hero-foto img.attiva{opacity:1}
.hero::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(120deg,rgba(20,23,26,.92) 0%,rgba(20,23,26,.62) 55%,rgba(20,23,26,.3) 100%)}
.hero .contenitore{position:relative;z-index:2;padding:4rem 0}
.hero h1{max-width:16ch}
.hero p{font-size:1.2rem;max-width:44ch;color:rgba(255,255,255,.85)}
.hero .azioni{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.8rem}

/* Chi siamo + barre */
.due{display:grid;gap:3rem;grid-template-columns:1.3fr 1fr;align-items:center}
@media(max-width:800px){.due{grid-template-columns:1fr}}
.barra{margin-bottom:1rem}
.barra .et{display:flex;justify-content:space-between;font-weight:700;font-size:.92rem;margin-bottom:.35rem}
.barra .pista{height:8px;background:var(--bordo);border-radius:99px;overflow:hidden}
.barra .val{height:100%;background:var(--rosso);border-radius:99px}
.sezione-scura .barra .pista{background:rgba(255,255,255,.15)}

/* Portali annunci */
.portali{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:2.5rem}
.portale{display:flex;flex-direction:column;gap:.5rem;background:var(--bianco);border:1px solid var(--bordo);
  border-radius:var(--raggio);padding:1.6rem;box-shadow:var(--ombra);text-decoration:none;color:var(--nero);transition:.18s}
.portale:hover{transform:translateY(-3px);box-shadow:var(--ombra-alta);border-color:var(--rosso)}
.portale strong{font-size:1.15rem}
.portale span{color:var(--grigio);font-size:.9rem}
.portale .freccia{margin-top:auto;color:var(--rosso);font-weight:800}

/* Galleria auto */
.griglia-auto{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));margin-top:2.5rem}
.auto{border-radius:var(--raggio);overflow:hidden;background:var(--antracite);aspect-ratio:4/3;box-shadow:var(--ombra)}
.auto img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.auto:hover img{transform:scale(1.06)}

/* Contatti */
.contatti-griglia{display:grid;gap:2.5rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:2rem}
.dato{margin-bottom:1.2rem}
.dato .et{font-size:.76rem;text-transform:uppercase;letter-spacing:.14em;color:var(--rosso);font-weight:800;margin-bottom:.2rem}
.dato a,.dato span{color:var(--carta);font-size:1.05rem;text-decoration:none}
.dato a:hover{color:#fff}
.numeri{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem}

/* Piede */
.piede{background:var(--nero);color:rgba(245,246,247,.6);font-size:.9rem;padding:2.5rem 0}
.piede-basso{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;justify-content:space-between}
.piede a{color:rgba(245,246,247,.6)}.piede a:hover{color:#fff}

/* Logo dei portali nei riquadri annunci */
.logo-portale{height:52px;display:flex;align-items:center;margin-bottom:.4rem}
.logo-portale img{max-height:100%;max-width:180px;width:auto;object-fit:contain}

/* Sezione partner finanziari "Seguiti solo da professionisti" */
.partner{background:#fff;border-top:1px solid var(--bordo);border-bottom:1px solid var(--bordo);
  padding-top:2.4rem;padding-bottom:2.4rem}
.partner-intro{text-align:center;font-weight:800;text-transform:uppercase;letter-spacing:.12em;
  font-size:.82rem;color:var(--acciaio);margin:0 0 1.8rem}
.partner-loghi{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2rem 3.5rem}
.partner-loghi img{max-height:52px;max-width:160px;width:auto;object-fit:contain}

/* Pulsante WhatsApp */
.bottone-whatsapp{background:#25d366;border-color:#25d366;color:#fff}
.bottone-whatsapp:hover{background:#1ebe5b;border-color:#1ebe5b;color:#fff}
/* Pulsante WhatsApp fisso, sempre a portata */
.wa-fisso{position:fixed;right:18px;bottom:18px;z-index:80;width:56px;height:56px;border-radius:50%;
  background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.28);transition:transform .18s}
.wa-fisso:hover{transform:scale(1.08);color:#fff}

/* Avviso cookie */
.cookie{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:90;max-width:560px;margin-inline:auto;
  background:#fff;color:var(--nero);border:1px solid var(--bordo);border-radius:var(--raggio);
  box-shadow:var(--ombra-alta);padding:1.1rem 1.3rem;display:none;gap:1rem;align-items:center;flex-wrap:wrap}
.cookie.visibile{display:flex}
.cookie p{margin:0;flex:1;min-width:200px;font-size:.9rem;color:var(--grigio)}
/* pagina testuale (privacy) */
.testo-legale{max-width:80ch}
.testo-legale h2{margin-top:2rem}
.testo-legale p,.testo-legale li{color:var(--nero);font-size:1rem}