/* =========================================================
   STYLE.CSS — Soluzione2R
   File condiviso da TUTTE le pagine del sito.
   Qui dentro: colori del brand, font, bottoni, header, footer,
   animazioni. Modifica qui per cambiare l'aspetto ovunque,
   senza dover toccare ogni singola pagina HTML.
   ========================================================= */

:root{
  --bianco:#F7F7F5;
  --petrolio:#0B2E3C;
  --petrolio-2:#082430;
  --petrolio-chiaro:#2F5561;
  --bluegrigio:#2F5561;
  --rame:#B87333;
  --grafite:#2B2E30;
  --bordo: rgba(11,46,60,0.12);
  --radius: 2px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bianco);
  color:var(--grafite);
  font-family:'Manrope', sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
b, strong{font-weight:600;}
.eyebrow{
  font-family:'Manrope', sans-serif;
  font-weight:500;
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--bluegrigio);
}
h1,h2,h3,.display{
  font-family:'Manrope', sans-serif;
  font-weight:600;
  letter-spacing:-0.01em;
  color:var(--petrolio);
}
.accent{
  color:var(--rame);
  font-weight:600;
}
.container{
  max-width:1180px;
  margin:0 auto;
  padding:0 32px;
}
section{padding:104px 0;}
@media(max-width:760px){ section{padding:64px 0;} }

/* ---------- reveal on scroll ---------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .8s ease, transform .8s ease;}
.reveal.is-visible{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

/* ---------- header ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:var(--bianco);
  border-bottom:1px solid var(--bordo);
}
.nav-inner{
  max-width:1180px; margin:0 auto; padding:12px 32px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.logo{display:flex; align-items:center;}
.logo img{height:64px; width:auto; display:block;}
nav.links{display:flex; gap:28px;}
nav.links a{
  font-size:0.88rem; color:var(--grafite); font-weight:500; position:relative; white-space:nowrap;
}
nav.links a::after{
  content:''; position:absolute; left:0; bottom:-5px; width:0; height:1px; background:var(--rame);
  transition:width .25s ease;
}
nav.links a:hover::after{width:100%;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 24px; font-size:0.86rem; font-weight:600;
  border-radius:var(--radius); white-space:nowrap; cursor:pointer;
  border:1px solid transparent;
}
.btn-primary{background:var(--petrolio); color:var(--bianco);}
.btn-primary:hover{background:var(--petrolio-2);}
.btn-accent{background:var(--rame); color:var(--bianco);}
.btn-accent:hover{opacity:0.9;}
.btn-ghost{border-color:var(--petrolio); color:var(--petrolio);}
.btn-ghost:hover{background:var(--petrolio); color:var(--bianco);}
.menu-toggle{display:none; background:none; border:none; cursor:pointer;}
.menu-toggle span{display:block; width:22px; height:2px; background:var(--petrolio); margin:5px 0;}

@media(max-width:920px){
  .logo img{height:48px;}
  nav.links{
    position:fixed; top:65px; left:0; right:0; bottom:0;
    background:var(--bianco); opacity:1;
    flex-direction:column; padding:32px; z-index:99;
    transform:translateX(100%); transition:transform .3s ease;
    overflow-y:auto;
  }
  nav.links.open{transform:translateX(0);}
  nav.links a{font-size:1.1rem; padding:10px 0; border-bottom:1px solid var(--bordo);}
  .menu-toggle{display:block;}
  .header-cta{display:none;}
}

/* ---------- footer ---------- */
footer{background:var(--grafite); color:rgba(247,247,245,0.75);}
.footer-cards{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:64px;
}
.foot-card{
  border:1px solid rgba(247,247,245,0.12); border-radius:var(--radius); padding:26px;
}
.foot-card .eyebrow{color:#8A9BA0;}
.foot-card h4{font-family:'Manrope', sans-serif; color:var(--bianco); font-size:1.2rem; margin:8px 0 10px;}
.foot-card p{font-size:0.92rem; color:rgba(247,247,245,0.6); margin-bottom:14px;}
.foot-card a.link{color:#D9B98C; font-size:0.88rem; font-weight:600;}
@media(max-width:820px){ .footer-cards{grid-template-columns:1fr;} }
.footer-bottom{
  border-top:1px solid rgba(247,247,245,0.12); padding-top:32px; padding-bottom:40px;
  display:flex; flex-wrap:wrap; gap:24px; align-items:center; justify-content:space-between;
}
.footer-logo{font-family:'Manrope', sans-serif; color:var(--bianco); font-size:1.15rem;}
.footer-nav{display:flex; gap:22px; flex-wrap:wrap;}
.footer-nav a{font-size:0.86rem; color:rgba(247,247,245,0.65);}
.footer-nav a:hover{color:var(--bianco);}
.socials{display:flex; gap:14px;}
.socials a{
  width:36px; height:36px; border-radius:50%; border:1px solid rgba(247,247,245,0.2);
  display:flex; align-items:center; justify-content:center;
}
.socials svg{width:16px; height:16px; stroke:rgba(247,247,245,0.8);}
.copyright{font-size:0.78rem; color:rgba(247,247,245,0.35); margin-top:20px; text-align:center;}

/* ---------- cookie banner ---------- */
#cookieBanner{
  position:fixed; left:0; right:0; bottom:0; z-index:200;
  background:var(--petrolio); color:var(--bianco);
  padding:20px 32px; display:flex; align-items:center; justify-content:space-between;
  gap:24px; flex-wrap:wrap; box-shadow:0 -4px 24px rgba(0,0,0,0.15);
}
#cookieBanner p{font-size:0.9rem; color:rgba(247,247,245,0.85); max-width:760px; line-height:1.5;}
#cookieBanner a{color:#D9B98C; text-decoration:underline; font-weight:600;}
#cookieBanner .cookie-actions{display:flex; gap:12px; flex-shrink:0;}
#cookieBanner button{
  padding:11px 22px; font-size:0.85rem; font-weight:600; border-radius:var(--radius);
  cursor:pointer; border:1px solid transparent;
}
#cookieAccept{background:var(--rame); color:var(--bianco);}
#cookieAccept:hover{opacity:0.9;}
@media(max-width:640px){
  #cookieBanner{padding:18px 20px;}
  #cookieBanner .cookie-actions{width:100%;}
  #cookieAccept{width:100%; text-align:center;}
}

/* ---------- pagine legali (privacy / cookie policy) ---------- */
.legal-page{padding-top:150px; padding-bottom:80px;}
.legal-page h1{font-size:clamp(1.9rem,4vw,2.6rem); margin-bottom:8px;}
.legal-page .updated{color:var(--bluegrigio); font-size:0.9rem; margin-bottom:44px;}
.legal-page h2{font-size:1.3rem; margin:40px 0 14px;}
.legal-page p{color:var(--grafite); font-size:1rem; margin-bottom:14px; max-width:760px;}
.legal-page ul{margin:0 0 14px 20px; max-width:760px;}
.legal-page li{color:var(--grafite); font-size:1rem; margin-bottom:8px;}
.legal-page table{border-collapse:collapse; width:100%; max-width:760px; margin:16px 0 28px;}
.legal-page th, .legal-page td{border:1px solid var(--bordo); padding:10px 14px; font-size:0.92rem; text-align:left;}
.legal-page th{background:rgba(11,46,60,0.04); color:var(--petrolio);}
.legal-page .box{background:rgba(11,46,60,0.03); border-left:3px solid var(--rame); padding:18px 22px; max-width:760px; margin-bottom:28px;}
.legal-page .box p{margin-bottom:0; font-size:0.92rem; color:var(--bluegrigio);}