/* ==================================================================
   GLOBAL GLASS — stylesheet globale
   Misure prese dall'artboard XD "Global Glass" (1920px).
   I numeri nei commenti sono i valori letti dal bozzetto a 1920px.
   ================================================================== */

:root{
    --blu:        #005ab2;   /* blu principale: hero, card, bottoni */
    --navy:       #00395a;   /* barra menu, sezione servizi, riga legale */
    --nero:       #0f1010;   /* testo su bianco */
    --white-color:#fff;

    --font-display:"Schibsted Grotesk", sans-serif;
    --font-body:   "Inter", sans-serif;
    --font-legale: "Work Sans", "Inter", sans-serif;

    /* corpi: valore @1920 -> vw */
    --t75: clamp(2.25rem, 4.2vw, 86px);
    --t70: clamp(2rem, 3.875vw, 65px);
    --t65: clamp(1.875rem, 3.65vw, 60px);
    --t30: clamp(1.35rem,1.56vw, 28px);
    --t27: clamp(1.15rem, 1.53vw, 24px);
    --t26: clamp(1rem, 1.5vw, 24px);
    --t25: clamp(.92rem, 1.30vw, 22px);
    --t24: clamp(.9rem,  1.25vw, 20px);
    --t20: clamp(.72rem, 1.04vw, 16px);

    --r10: 15px;
}

*{
    transition: .3s !important;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
    font-family:var(--font-body);
    font-weight:400;
    color:var(--nero);
    background-color:var(--white-color);
    overflow-x:hidden;
}

h1,h2,h3,h4,h5,h6{
    font-family:var(--font-display);
    font-style:italic;
    font-weight:700;
    margin:0;
}
p{ margin:0; }
a{ color:inherit; }
img{ max-width:100%; }
ul{ margin:0; padding:0; list-style:none; }

/* contenitori del bozzetto ------------------------------------------ */
.wrap     { width:min(1712px, 92vw); margin-inline:auto; }  /* 104..1816 */
.wrap-menu{ width:min(1775px, 95vw); margin-inline:auto; }  /*  61..1836 */
.wrap-int { width:min(1592px, 90vw); margin-inline:auto; }  /* 164..1756 */
.wrap-form{ width:min(1535px, 88vw); margin-inline:auto; }  /* 169..1704 */

/* accessibilita' ---------------------------------------------------- */
.skip-link{
    position:absolute; left:-9999px; top:0; z-index:2000;
    background:var(--white-color); color:var(--blu);
    padding:.75rem 1.25rem; border-radius:0 0 12px 0; font-weight:600;
}
.skip-link:focus{ left:0; }
:focus-visible{ outline:3px solid var(--blu); outline-offset:3px; }

.ico{ display:inline-block; width:1em; height:1em; vertical-align:middle; flex:0 0 auto; }
.ico-svg{ display:block; width:100%; height:100%; }

/* bottoni ----------------------------------------------------------- */
.btn-bianco,
.btn-blu{                                   /* 164x60 / 220x60, r10 */
    display: inline-flex; align-items:center; justify-content:center;
    padding: .5rem 1.5rem;
    border-radius:var(--r10);
    font-family:var(--font-body);
    font-weight:700;
    font-size:var(--t27);
    text-decoration:none;
    font-style: normal;
    white-space:nowrap;
    transition:background-color .25s ease, color .25s ease;
    border: 2px solid transparent;
    line-height: 1.5;
}

.btn-invia, .btn-404{
    color: var(--blu) !important;
}

@media (max-width: 1200px){
    .btn-invia{
        padding: .5rem 2.5rem;
    }
}


.btn-bianco{ background-color:var(--white-color); color:var(--navy); }
.btn-bianco:hover,.btn-bianco:focus{ background-color: transparent; color:var(--white-color) !important; border-color: var(--white-color); transform: scale(1.05); }
.btn-blu{ background-color:var(--blu); color:var(--white-color) !important; }
.btn-blu:hover,.btn-blu:focus{ background-color:var(--navy); color:var(--white-color) !important; border-color: var(--navy); transform: scale(1.05); }

/* ==================================================================
   HEADER  (barra navy 1920x127 · logo x61 210x55 · link 26px Inter)
   ================================================================== */
#header{
    background-color:var(--navy);
    padding:1.35rem 2rem;
}
.img-logo{ width:clamp(140px, 10.94vw, 210px); height:auto; }

.img-logo:hover{
    transform: scale(1.05);
}

#header .nav-link{
    color:var(--white-color);
    font-weight:500;
    font-size:var(--t27);
    padding:.4rem clamp(1.25rem, 1.875vw, 45px);
}
#header .nav-link:hover,#header .nav-link:focus{ color:#bcd8ef; transform: scale(1.05) }

.navbar-toggler{ border-color:rgba(255,255,255,.6); padding:.35rem .6rem; }
.navbar-toggler:focus{ box-shadow:none; }
.navbar-toggler-icon{
    background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
@media(max-width:767.98px){
    #navMain{
        background-color:var(--navy);
        border-radius:var(--r10);
        margin: 1.15rem 0 .5rem;
    }
}

#chi-siamo, #servizi, #dove-siamo, #contatti{
    scroll-margin-top: calc(90px - 2rem);
}

/* ==================================================================
   HERO  (fascia blu fino a 1109 · h1 70px centrato · auto + parentesi)
   ================================================================== */
.hero{
    width:100%;
    height: 100vh;
    min-height: 750px;
    background-image: url("../images/hero-auto.webp");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;

    padding: calc(85px + 2.5rem) .75rem 2rem;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media (max-width: 992px){
    .hero{
        background-image: url("../images/hero-auto-mobile.webp");
        background-position: center;
        padding: calc(85px + 1rem) .75rem 1.5rem;
    }
}

@media (min-width: 576px){
    .hero .wrap-menu{
        padding: 0 1.5rem;
    }
}

.hero h1{
    color:var(--white-color);
    font-size:var(--t70);
    line-height:1.12;
    text-align:center;
    max-width:1068px;                             /* 1068 @1920 */
    margin-inline:auto;
}
.hero-sottotitolo{
    color:var(--white-color);
    font-family:var(--font-body);
    font-size:var(--t26);
    line-height:1.4;
    text-align:center;
    max-width:700px;                              /* 660 @1920 */
    margin:clamp(1rem, 1.6vw, 31px) auto 0;
}

.hero-servizi{
    display:flex; flex-wrap:wrap; align-items:center;
    gap:clamp(1rem, 2.5vw, 70px);
    width:min(1775px, 95%);
    margin-inline:auto;
}
.hero-servizi li{
    font-family:var(--font-display);
    font-style:italic;
    font-weight:400;
    font-size:var(--t26);
    color:var(--white-color);
    line-height:1.2;
}
.hero-servizi .hero-cta{ margin-left:auto; }

@media(max-width:991.98px){
    .hero-onda{ display:none; }
}

/* ==================================================================
   CHI SIAMO  (titolo 65px blu centrato · testo 24px · 3 card 374x327 r10)
   ================================================================== */

.sezione{ padding:clamp(2.5rem, 5vw, 96px) 0; }

.titolo-blu{
    color:var(--blu);
    font-size:var(--t65);
    line-height:1.15;
    text-align:center;
}
.testo-centrato{
    font-size:var(--t24);
    line-height:1.5;
    text-align:center;
    max-width:1190px;                             /* 1190 @1920 */
    margin:clamp(1.25rem, 2.3vw, 44px) auto 0;
}

.card-valori{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:clamp(1rem, 6.7vw, 129px);                /* 129 @1920 */
    max-width:1380px;
    width: 100%;
    margin:clamp(2rem, 4.3vw, 83px) auto 0;
}
.card-valore{
    background-color:var(--blu);
    border-radius:var(--r10);
    display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    gap:clamp(.8rem, 1.6vw, 30px);
    padding:2rem 1.5rem;
    text-align:center;
    color:var(--white-color);
}
.card-valore .ico{ width:clamp(87px, 7.75vw, 130px); height:clamp(87px, 7.75vw, 130px); }
.card-valore h3{ font-size:var(--t30); line-height:1.25; }

/* ==================================================================
   SERVIZI  (fascia navy · mosaico a 2 colonne 724px, gap 140)
   ================================================================== */
.servizi{
    background-color:var(--navy);
    padding:clamp(2.5rem, 4.3vw, 82px) 0 clamp(2.5rem, 5.5vw, 105px);
}
.titolo-bianco{
    color:var(--white-color);
    font-size:var(--t65);
    line-height:1.15;
    text-align:center;
}
.griglia-servizi{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:clamp(1rem, 2.2vw, 42px) clamp(1rem, 7.3vw, 140px);   /* 140 @1920 */
    align-items:start;
    margin-top: clamp(1.5rem, 3.3vw, 63px);
}
.card-servizio{
    border-radius:var(--r10);
    padding:clamp(1.25rem, 2.2vw, 42px) clamp(1.25rem, 2.6vw, 50px);
    height:100%;
}
.card-servizio-blu{ background-color:var(--blu); color:var(--white-color); }
.card-servizio-bianca{ background-color:var(--white-color); color:var(--navy); }
.card-servizio h3{
    font-size:var(--t30);
    line-height:1.25;
    margin-bottom:clamp(.8rem, 1.4vw, 27px);
}
.card-servizio p{ font-size:var(--t24); line-height:1.5; }
.card-servizio p + p{ margin-top:1em; }
.card-servizio a{ font-weight:600; }

.foto-servizio{
    width:100%;
    border-radius:var(--r10);
    object-fit:cover;
    display:block;
}

/* ==================================================================
   AFFILIATI
   ================================================================== */
.affiliati{ text-align:center; padding:clamp(2rem, 3.6vw, 69px) 0 clamp(2.25rem, 3.875vw, 75px); }
.affiliati p{ font-size:var(--t24); margin-bottom:clamp(1rem, 2vw, 40px); }
.logo-unipol{ width:min(662px, 78vw); height:auto; }   /* 662 @1920 */

/* ==================================================================
   DOVE SIAMO  (blocco navy 1715x1175 r10 · 2 mappe 548x479 · 2 barre 548x129)
   ================================================================== */
.dove-siamo{
    background-color:var(--navy);
    border-radius:var(--r10);
    color:var(--white-color);
    padding:clamp(1.75rem, 6vw, 115px) 1.25rem clamp(2rem, 5.6vw, 107px);
}
.dove-siamo h2{ font-size:var(--t65); line-height:1.15; }
.dove-siamo .intro{
    font-size:var(--t24);
    line-height:1.5;
    margin-top:clamp(1rem, 1.8vw, 35px);
}
.griglia-sedi{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:clamp(1.25rem, 7.5vw, 144px);            /* 1032-888 @1920 */
    max-width:1280px;                            /* 340..1580 @1920 */
    margin:clamp(1.5rem, 3.5vw, 67px) auto 0;
}

.box-sede-mappa {
    display: block;
    overflow: hidden;
    border-radius: var(--r10);
}

.sede-mappa {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    aspect-ratio: 548/479;
}

.box-sede-mappa:hover .sede-mappa {
    transform: scale(1.1);
}


.sede-barra{
    display:flex; align-items:center;
    gap:clamp(.8rem, 1.6vw, 31px);
    background-color:var(--blu);
    border-radius:var(--r10);
    min-height:clamp(74px, 6.72vw, 129px);
    padding:clamp(.75rem,1.2vw,23px) clamp(1.5rem, 5vw, 80px);
    margin-top:clamp(.8rem, 1.5vw, 28px);
    color:var(--white-color);
    text-decoration:none;
    transition:background-color .25s ease;
}
.sede-barra:hover,.sede-barra:focus{ background-color:#0070dd; color:var(--white-color); }
.sede-barra .ico{ width:clamp(26px, 2.08vw, 40px); height:clamp(34px, 2.83vw, 54px); }
.sede-barra span{
    font-family:var(--font-display);
    font-style:italic; font-weight:700;
    font-size:var(--t30);
    line-height:1.25;
}

/* ==================================================================
   CONTATTACI  (foto 1715x827 r10 con 2 card blu 450x493 r10 sopra)
   ================================================================== */
.contattaci-foto{
    position:relative;
    border-radius:var(--r10);
    overflow:hidden;
    background-size:cover; background-position:center; background-repeat:no-repeat;
    aspect-ratio:1715/827;
    display:flex; align-items:center;
    margin-top:clamp(1.5rem, 3.2vw, 61px);
}
.griglia-contatti{
    position:relative; z-index:2;
    width:100%;
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:clamp(1.5rem, 13vw, 263px);
    padding-left:14.48%;
    padding-right:14.48%;
}

@media (max-width: 991.98px){
    .griglia-contatti{
        padding-left:10%;
        padding-right:10%;
        gap:clamp(1.5rem, 7.5vw, 263px);
    }
}

.card-contatto{
    background-color:var(--blu);
    border-radius:var(--r10);
    color:var(--white-color);
    text-align:center;
    padding:clamp(1.25rem, 2.1vw, 40px) clamp(1.25rem,1.875vw,28px);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:clamp(.6rem, 1.9vw, 36px);
    min-height:clamp(260px, 25.7vw, 493px);      /* 493 @1920 */
    min-width: 220px;
}
.card-contatto h3{ font-size:var(--t65); line-height:1.15; }
.card-contatto a{
    display:flex; flex-direction:column; align-items:center;
    gap:clamp(.4rem,.8vw,15px);
    color:var(--white-color);
    text-decoration:none;
    font-family:var(--font-display);
    font-style:italic; font-weight:700;
    font-size:var(--t30);
    line-height:1.2;
    word-break:break-word;
    text-wrap: nowrap;
}
.card-contatto a:hover,.card-contatto a:focus{ text-decoration:underline; transform: scale(1.05); }
.card-contatto .ico{ width:clamp(28px,2.4vw,46px); height:clamp(28px,2.4vw,46px); }

@media(max-width:991.98px){
    .contattaci-foto{ aspect-ratio:auto; padding-block:2rem; }
}

/* ==================================================================
   FORM  (card blu 1535x1109 r10 · campi trasparenti bordo bianco 2px r10)
   ================================================================== */
/* onda navy dietro al form (Tracciato 247 del bozzetto):
   la curva risale sopra la foto dei contatti */
.sezione-form{
    position:relative;
    margin-top: -13.5vw;
    padding-top:14vw;
    padding-bottom:calc(clamp(2rem, 7.81vw, 150px) + var(--r10));   /* 150 = 7908-7758 */
    /* l'onda copre tutto il box (il tracciato riempie il viewBox e lo stira);
       il secondo layer tiene il navy pieno sotto la cresta, cosi' non puo'
       comparire nessuna striscia bianca per arrotondamenti */
    background-image:url('../images/svg/deco-onda.svg'),
                     linear-gradient(var(--navy), var(--navy));
    background-position:top center, bottom center;
    background-size:100% 100%, 100% 50%;
    background-repeat:no-repeat, no-repeat;
}
@media(max-width:767.98px){
    .sezione-form{ margin-top:0; padding-top:3rem; background:var(--navy); }
}

.box-form{
    background-color:var(--blu);
    border-radius:var(--r10);
    color:var(--white-color);
    padding:clamp(1.5rem, 4.6vw, 88px) clamp(1.25rem, 5.6vw, 108px) clamp(1.5rem, 4.2vw, 80px);
}
.box-form h2{ font-size:var(--t65); line-height:1.15; margin-bottom:clamp(1rem, 2.2vw, 42px); }
.box-form .form-label{
    font-family:var(--font-display);
    font-style:italic; font-weight:700;
    font-size:var(--t30);
    margin-bottom:clamp(.3rem,.8vw,15px);
}
.form-control-gg{                                 /* h79 r10 bordo 2px */
    background-color:transparent !important;
    border:2px solid var(--white-color) !important;
    border-radius:var(--r10) !important;
    padding:.75rem clamp(1rem, 2vw, 20px) !important;
    color:var(--white-color) !important;
    font-size:var(--t24);
    box-shadow:none !important;
}
textarea.form-control-gg{ min-height:clamp(120px, 8.91vw, 171px); }
.form-control-gg::placeholder{ color:rgba(255,255,255,.85); }
.form-control-gg:focus, .form-control-gg:hover{ background-color:rgba(255,255,255,.12) !important; border-color:#fff !important; color:#fff !important; }
.form-control-gg.is-invalid{ border-color:#ffd5d5 !important; background-color:rgba(255,120,120,.20) !important; background-image:none !important; }

.form-check-input-gg{
    width: 25px;
    height: 25px;
    margin:0 !important; flex:0 0 auto;
    background-color:var(--white-color);
    border:none;
    border-radius: .5rem !important;
    cursor: pointer;
}
.form-check-input-gg:checked{ background-color:var(--navy); border-color:var(--navy); }
.form-check-input-gg.is-invalid{ outline:2px solid #ffd5d5; }
.form-privacy{ font-size:var(--t24); line-height:1.4; }
.form-privacy a{ color:var(--white-color); text-decoration:underline; }
.captcha-input{ max-width:clamp(150px, 13vw, 250px); }
#myCanvas{ border-radius:var(--r10); }

/* ==================================================================
   FOOTER  (fascia blu 1920x425 r10 in alto + riga legale navy 52px)
   ================================================================== */
.footer{
    background-color:var(--blu);
    color:var(--white-color);
    border-radius:var(--r10) var(--r10) 0 0;
    padding:clamp(2rem, 3.5vw, 67px) 0 clamp(1.5rem, 2.5vw, 48px);
    text-align: center;
}
/* dove la pagina finisce con l'onda navy il footer ci sale sopra:
   nessuna striscia bianca e gli angoli arrotondati scoprono il navy */
main:has(.sezione-form) ~ .footer{
    margin-top:calc(-1 * var(--r10));
}
.footer-grid{
    display:grid;
    grid-template-columns:27% 26% 22% 25%;        /* 154 / 638 / 1114 / 1517 */
    gap:clamp(1.5rem,2.5vw,58px) 0;
    align-items:start;
}

.footer-logo:hover{
    transform: scale(1.05);
}

.footer-logo, .landing-logo{ width:clamp(240px, 27.9vw, 305px); height:auto; }
.footer h3{ font-size:var(--t30); line-height:1.2; margin-bottom:clamp(1rem,1.2vw,23px); }
.footer-col{ font-size:var(--t24); line-height:1.45; }
.footer-col a{ color:var(--white-color); text-decoration:none; }
.footer-col a:hover,.footer-col a:focus{ text-decoration:underline; font-weight: 700; }
.footer-col .blocco + .blocco{ margin-top:clamp(.8rem,1.4vw,27px); }
.footer-col strong{ display:block; font-weight:600; }

.riga-legale{
    background-color:var(--navy);
    color:var(--white-color);
    font-family:var(--font-legale);
    font-size:var(--t20);
    text-align:center;
    padding:clamp(.6rem,.7vw,13px) 1rem;
    line-height:1.4;
}
.riga-legale a{ color:var(--white-color); text-decoration:none; }
.riga-legale a:hover{ text-decoration:underline; }

/* ==================================================================
   LANDING
   ================================================================== */
.landing-hero{
    position:relative;
    background-size:cover; background-position:center; background-repeat:no-repeat;
    padding: 3rem 0 6rem;
    min-height: calc(780px - 6rem);
    max-height: 780px;
    height: 100vh;
    color:var(--white-color);
    z-index: 0;
}

@media (min-width: 1500px){
    .landing-hero{
        height: 780px;
    }
}

.landing-hero::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(90deg, rgba(0,57,90,.85) 0%, rgba(0,57,90,.55) 55%, rgba(0,57,90,.25) 100%);
}
.landing-hero > .wrap{ position:relative; z-index:2; }
.landing-hero h1{
    font-size:var(--t75);
    line-height:1.12;
    max-width:1068px;
}
.landing-hero .hero-sottotitolo{
    text-align:left;
    margin-inline:0;
    max-width:550px;
}

@media (min-width: 992px) {
    .landing-hero .hero-sottotitolo {
        max-width: 700px;
    }
}

.landing-numeri{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:clamp(1rem, 4vw, 77px);
    margin-top:clamp(2rem, 5.2vw, 100px);
}
.numero-sede{
    display:flex; align-items:center;
    gap:clamp(.8rem, 1.6vw, 31px);
    padding: 0 1.35rem;
    color:var(--white-color);
    text-decoration:none;
}
.numero-sede .ico{ width:clamp(46px, 5.47vw, 100px); height:clamp(46px, 5.47vw, 100px); }

.numero-sede:hover .ico{
    transform: scale(1.1) rotate(10deg);
}

.numero-sede:hover > span:nth-child(2){
    padding-left: 1rem;
    transform: scale(1.05);
}

.numero-sede .ns-citta{ display:block; font-family:var(--font-display); font-style:italic; font-weight:700; font-size:var(--t65); line-height:1.05; }
.numero-sede .ns-num{ display:block; font-family:var(--font-display); font-style:italic; font-weight:700; font-size:var(--t65); line-height:1.1; }
.numero-sede .ns-label{ display:block; font-family:var(--font-display); font-style:italic; font-weight:700; font-size:var(--t30); line-height:1.3; }
.numero-sede:hover,.numero-sede:focus{ color:var(--white-color); opacity:.8; }

/* barra blu con i 3 punti (1712x344 r10) */
.barra-punti{
    background-color:var(--blu);
    border-radius:var(--r10);
    color:var(--white-color);
    padding:clamp(1.5rem, 2.9vw, 55px) clamp(1.25rem, 2.6vw, 50px);
    margin-top: -4rem;
    z-index: 1;
    position: relative;
}
.barra-punti .row{ --bs-gutter-x:clamp(1rem,2vw,40px); }
.punto{ text-align:center; }
.punto .ico{ width:clamp(87px, 7.75vw, 130px); height:clamp(87px, 7.75vw, 130px); margin-bottom:clamp(.8rem, 1.7vw, 33px); }
.punto p{ font-size:var(--t25); line-height:1.4; }

/* blocco "perche' intervenire" */
.landing-testo{ padding:clamp(2.5rem, 5.2vw, 100px) 0 clamp(2rem, 4vw, 77px); }
.landing-testo h2{ color:var(--blu); font-size:var(--t65); line-height:1.15; max-width:930px; }
.landing-testo p{ font-size:var(--t24); line-height:1.5; margin-top:clamp(1rem, 2vw, 38px); max-width:851px; }
.landing-testo .img-dettaglio{
    width:100%;
    object-fit:cover;
    object-position: right;
    display:block;
    max-width: 600px;
    margin: 0 auto;
}

/* punti di forza (fascia navy con mosaico) */
.punti-forza{
    background-color:var(--navy);
    color:var(--white-color);
    padding:clamp(2rem, 3.3vw, 63px) 0 clamp(2.5rem, 5vw, 96px);
}
.punti-forza .sottotitolo{
    font-size:var(--t24);
    line-height:1.5;
    text-align:center;
    max-width:760px;
    margin:clamp(.8rem,1.6vw,31px) auto 0;
}
.griglia-forza{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:clamp(1rem, 2.9vw, 56px);
    margin-top:clamp(1.5rem, 3.3vw, 63px);
    align-items:start;
}
.card-forza{
    border-radius:var(--r10);
    padding:clamp(1.1rem, 2.6vw, 49px) clamp(1.1rem, 2.6vw, 49px);
}
.card-forza-blu{ background-color:var(--blu); color:var(--white-color); }
.card-forza-bianca{ background-color:var(--white-color); color:var(--nero); height: 100%; display: flex; flex-direction: column; justify-content: center }
.card-forza h3{ font-size:var(--t30); line-height:1.25; margin-bottom:clamp(.6rem,1.2vw,23px); }
.card-forza p{ font-size:var(--t24); line-height:1.5; }
.card-forza p + p{ margin-top:1em; }
.foto-forza{
    width:100%;
    aspect-ratio:525/271;
    object-fit:cover;
    border-radius:var(--r10);
    display:block;
    margin-top:clamp(1rem, 2.9vw, 56px);
}
.foto-forza-alta{ margin-top:0; margin-bottom:clamp(1rem, 3.5vw, 56px); }

/* ==================================================================
   404
   ================================================================== */
.pagina-404{
    position:relative;
    display:flex; align-items:center; justify-content:center; text-align:center;
    height: 100vh;
    padding:5rem 0;
    background-image: url("../images/404.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color:var(--white-color);
    margin-bottom: -15px;
}
.badge-404{
    display:inline-block;
    background-color:var(--white-color);
    color:var(--blu);
    border-radius:var(--r10);
    padding:.3rem clamp(1.5rem,3vw,58px);
    font-family:var(--font-display);
    font-style:italic; font-weight:700;
    font-size:var(--t75);
    line-height:1.3;
}
.pagina-404 h1{ font-size:var(--t70); margin:clamp(1.25rem,2.2vw,42px) 0 clamp(.8rem,1.5vw,28px); }
.pagina-404 p{ font-size:var(--t25); line-height:1.5; max-width:46em; margin:0 auto clamp(1.45rem,2.25vw,38px); }

/* ==================================================================
   RESPONSIVE
   ================================================================== */
@media(max-width:991.98px){
    .card-valori{ grid-template-columns:1fr; gap:1rem; max-width:420px; }
    .card-valore{ padding:2rem 1rem; }
    .griglia-servizi{ grid-template-columns:1fr; width: 100%; margin: clamp(1.5rem, 3.3vw, 63px) auto 0; }
    .griglia-sedi{ grid-template-columns:1fr; gap:2rem; max-width: 600px; width: 100%; }
    .griglia-forza{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr 1fr; }
    .landing-numeri{ gap:1.5rem; }
    .wrap-int{
        max-width: 650px;
    }
}

@media (max-width: 858px){
    .hero-servizi .hero-cta{ padding-top: 1.25rem; }
}

@media(max-width:767.98px){
    .hero-servizi .hero-cta{ margin-left:0; width:100%; display:flex; justify-content:end; }
    .footer-grid{ grid-template-columns:1fr; text-align:center; }
    .footer-logo-cell{ display:flex; justify-content:center; }
    .griglia-contatti{ grid-template-columns:1fr; gap:1rem; padding-inline:1rem; max-width: 350px; margin: 0 auto; }
    .landing-numeri{
        grid-template-columns:1fr;
        gap:2rem;
    }
    .barra-punti{
        max-width: 550px;
        margin-left: auto;
        margin-right: auto;
    }
}

.toast-container{ z-index:1080; }

@media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ transition:none !important; animation:none !important; }
}
