/* Brillí site styles */
:root{--text:#0c2d48;--muted:#6c7a89;--accent:#00AEEF;--accent2:#00C853;--line:#e6edf3}
*{box-sizing:border-box}
html,body{margin:0;background:#fff;color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
a{color:var(--accent);text-decoration:none}
img{max-width:100%;display:block}

header,footer{padding:1rem;background:#f5f5f5;border-bottom:1px solid var(--line)}
header .wrap, footer .wrap{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:0 1rem}
nav a{margin-left:.75rem;font-weight:700}
.nav-btn{padding:.55rem .9rem;border-radius:10px;border:2px solid var(--accent);}
.nav-btn:hover{background:var(--accent);color:#fff}

.main{max-width:1120px;margin:0 auto;padding:0 1rem}
.hero{padding:2rem 0;text-align:center}
.hero img{max-width:480px;margin:1rem auto 0;border-radius:10px}

.section{padding:2.25rem 0}
.section.muted{background:#f7fafc}
.h1{font-size:clamp(28px, 5vw, 42px);line-height:1.1}
.p{color:var(--muted)}

.btn{display:inline-block;margin:.5em;padding:.7em 1em;border-radius:10px;border:2px solid transparent;font-weight:700}
.btn.primary{background:linear-gradient(90deg,var(--accent),var(--accent2));color:#fff}
.btn.outline{border-color:var(--accent);color:var(--accent)}

.before-after{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:1rem}
.before-after img{max-width:480px;height:auto;border-radius:10px}
figure{margin:0;text-align:center}
figcaption{color:var(--muted);margin-top:.5rem}

.footer-note{color:var(--muted);font-size:14px}
/* Solo il logo tondo */
.logo-round {
  width: 90px;         /* puoi cambiare la dimensione */
  height: 90px;
  border-radius: 50%;  /* <-- questo lo rende tondo */
  object-fit: cover;   /* adatta l’immagine nel cerchio */
  display: block;
}
/* === FIX mobile: evita sovrapposizione bottoni in header === */
@media (max-width: 700px){
  header .wrap{
    display:flex;        /* già così, lo ribadiamo */
    flex-wrap: wrap;     /* <-- permette di andare a capo */
    row-gap: .6rem;      /* spazio verticale fra righe */
  }
  header nav{
    display:flex;        /* assicura flex anche su iOS */
    flex-wrap: wrap;     /* bottoni su più righe se serve */
    gap: .6rem;          /* spazio orizzontale/verticale */
  }
  header nav a,
  header nav .nav-btn{
    display: inline-block;
    white-space: nowrap; /* non spezzare “Come funziona” */
    line-height: 1;
    padding: .55rem .9rem;  /* leggermente più compatti */
    border-radius: 10px;
    border: 2px solid var(--accent); /* bordo stile “cerchiato” */
  @media (max-width: 700px){
  header nav{ font-size: 15px; }
}
.linea-tricolore {
  width: 100%;
  height: 5px; /* puoi cambiare lo spessore */
  background: linear-gradient(to right, #008000 33.3%, #ffffff 33.3% 66.6%, #ff0000 66.6%);
}


}