body{
    margin:0;
    background:#fff;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

img{
    display:block;
    max-width:100%;
}



::selection{
    background:#b08d57;
    color:#fff;
}

/*==================================================
HEADER
==================================================*/

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: grid;
    align-items: center;
    padding: 18px 55px;
    background: transparent; /* Trasparente nella Hero */
    transition: background 0.3s ease, padding 0.3s ease;
    z-index: 1000;
}

header.scrolled {
    background: #b08d57; /* Appare la barra marrone */
    padding: 10px 55px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

header .logo-scroll {
    width: 58px;
    height: 58px;
    margin-right: 28px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .55s ease, transform .55s ease;
}

header.scrolled .logo-scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}


/*==================================================
LOGO
==================================================*/

.logo{

    width:120px;
    height:105px;

    display:flex;
    justify-content:center;
    align-items:center;

    background:white;

    border-radius:22px;

    box-shadow:0 8px 24px rgba(0,0,0,.12);

}

.logo img{

    width:84%;

}

/* nella home il logo NON si vede */

header .logo-scroll{

    width:58px;
    height:58px;

    margin-right:28px;

    opacity:0;

    visibility:hidden;

    transform:translateY(-8px);

    transition:
        opacity .55s ease,
        transform .55s ease;

}

header.scrolled .logo-scroll{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

.logo-scroll img{

    width:100%;
    height:100%;

    border-radius:5%;

}


/*==================================================
MENU
==================================================*/

nav{

    display:flex;
    justify-content:center;
    align-items:center;
    gap:34px;

}

nav a{

    color:#ffffff;

    text-decoration:none;

    font-size:17px;
    font-weight:500;

    padding:11px 32px;

    border-radius:16px;

background:
radial-gradient(
ellipse at center,
rgba(32,58,92,.34) 0%,
rgba(42,74,112,.22) 42%,
rgba(70,108,152,.10) 72%,
rgba(255,255,255,.03) 100%
),
rgba(190,215,240,.08);

    border:1px solid rgba(255,255,255,.30);

    backdrop-filter:blur(30px);
    -webkit-backdrop-filter:blur(30px);

box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    inset 0 -1px 0 rgba(255,255,255,.08),
    0 4px 12px -2px rgba(15, 32, 67, 0.50); /* <--- NUOVA OMBRA ESTERNA */


}


nav a:hover{

    transform:translateY(-2px);

    background:

        linear-gradient(

            180deg,

            rgba(255,255,255,.28),

            rgba(185,205,220,.22)

        );

    border-color:rgba(255,255,255,.60);

 box-shadow:

    inset 0 1px 0 rgba(255,255,255,.40),

    inset 0 0 90px rgba(0,0,0,.90),

    0 8px 24px rgba(0,0,0,.12);
}



header.scrolled nav a{

   background:

linear-gradient(
180deg,
rgba(255,255,255,.17) 0%,
rgba(220,225,230,.10) 45%,
rgba(175,185,195,.14) 100%
);
    border:1px solid rgba(255,255,255,.18);

    color:white;

}

header.scrolled nav a:hover{

    background:#111;

    border-color:#b08d57;

}

/*==================================================
HERO
==================================================*/

.hero{

    position:relative;

    min-height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    overflow:hidden;

}

.hero{
    position:relative;
}

.hero::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        linear-gradient(rgba(25,35,55,.22), rgba(15,15,15,.18)),
        url("../img/locarnese.jpg") center/cover no-repeat;

   filter:

brightness(1.12)

saturate(1.75)

contrast(1.15);

    z-index:0;
}

.hero>*{

    position:relative;
    z-index:2;

}

.hero-divider{

    display:flex;
    align-items:center;
    justify-content:center;

    gap:18px;

    margin:26px auto 34px;

}



.hero-divider i{

    color:#b08d57;

    font-size:15px;

}

/*==================================================
GLASS CARD
==================================================*/

.hero-content{

    width:min(1200px,92%);

    text-align:center;

    padding-top: 40px;

}

/*==================================================
TITOLO
==================================================*/



.hero-content h1 {
    font-family: "Bodoni Moda", serif;
    font-weight: 300;
    font-size: 92px;
    letter-spacing: -3px;
    line-height: 0.92;
    margin-top: 55px;
    margin-bottom: 20px;

    /* AGGIUNGI QUESTE DUE RIGHE PER ALLUNGARE LE LETTERE VERTICALMENTE */
    display: inline-block;       /* Permette l'applicazione delle trasformazioni */
    transform: scaleY(1.15);     /* Aumenta l'altezza del 15%. Usa 1.20 per il 20%, ecc. */
}


.hero-divider{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:18px;

    margin:24px auto 34px;

}

.hero-divider span{

    width:320px;

    height:2px;

    background:#b08d57;

}

.divider-ornament{

    color:#b08d57;

    font-size:26px;

    line-height:1;

}




/*==================================================
TESTO
==================================================*/

.hero-content p{

    max-width:900px;

    margin:auto;

    font-size:23px;

    line-height:1.9;

    color:#332c56f0;

    font-weight:300;

    text-shadow:
0 2px 10px rgba(255,255,255,.35),
0 1px 2px rgba(255,255,255,.45);

}

/*==================================================
PULSANTI
==================================================*/

.hero-buttons{

    margin-top:38px;

}

.hero-button{

    display:inline-block;

    padding:17px 38px;

    border:none;

    border-radius:12px;

    background:#b08d57;

    color:#fff;

    text-decoration:none;

    font-weight:600;

    transition:.30s;

    box-shadow:0 10px 25px rgba(176,141,87,.25);

}

.hero-button:hover{

    background:#987548;

    transform:translateY(-3px);

    box-shadow:0 18px 40px rgba(176,141,87,.35);

}
/*==================================================
FRECCIA
==================================================*/

.scroll-down{

    position:absolute;

    left:50%;
    bottom:34px;

    transform:translateX(-50%);

    color:#fff;

    font-size:42px;

    text-decoration:none;

    z-index:20;

    animation:bounce 2s infinite;

    transition:.30s;

}

.scroll-down:hover{

    color:#d8bb8b;

}

@keyframes bounce{

    0%,20%,50%,80%,100%{
        transform:translate(-50%,0);
    }

    40%{
        transform:translate(-50%,-12px);
    }

    60%{
        transform:translate(-50%,-6px);
    }

}

/*==================================================
SEZIONE LO STUDIO
==================================================*/

.studio{

    background:#ffffff;
    padding:120px 8%;

}

.studio-container{

    max-width:1400px;
    margin:auto;

    display:grid;

    grid-template-columns:480px 1fr;

    gap:70px;

    align-items:center;

}

/* FOTO */

.studio-image img{

    width:100%;
    display:block;

    border-radius:22px;

    box-shadow:0 25px 60px rgba(0,0,0,.14);

}

/* TESTO */

.studio-content h2{

    display:inline-block;
    position:relative;

    font-family:"Cormorant Garamond",serif;
    font-size:48px;

    margin-bottom:35px;
    padding-bottom:14px;

}

.studio-content h2::after{

    content:"";

    position:absolute;

    left:0;
    bottom:0;

    width:100%;
    height:3px;

    background:#b08d57;

}

.title-line{

    width:90px;

    height:3px;

    background:#b08d57;

    margin-bottom:35px;

}

.studio-content p{

    font-size:18px;

    line-height:1.95;

    color:#555;

    margin-bottom:22px;

}

/*==================================================
TEAM
==================================================*/

.team{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:28px;

    align-items:stretch;

}

.team-card{

    background:#fff;

    border-radius:18px;

    padding:24px;

    text-align:center;

    display:flex;

    flex-direction:column;

    border:1px solid #ececec;

    box-shadow:0 14px 34px rgba(0,0,0,.06);

    transition:.35s;

    height:100%;

}

.team-card:hover{

    transform:translateY(-10px);

    box-shadow:0 28px 60px rgba(0,0,0,.12);

    border-color:#b08d57;

}

.team-card h3{

    font-size:22px;

    color:#222;

    margin-bottom:8px;

    height:85px;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

}

.team-card p{

    color:#777;

    font-size:16px;

    line-height:1.5;

    height:34px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:18px;

}

/* bandiere */

.team-card span{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:8px;

    font-size:24px;

    min-height:34px;

}

/*======================================================
PROFESSIONISTI
======================================================*/

.professionals{

    padding:120px 8%;
    background:#fff;

}

.professionals-container{

    max-width:1400px;
    margin:auto;

}

.professional-card{

    display:grid;
    grid-template-columns:280px 1fr;
    gap:60px;
    align-items:center;

    margin-bottom:90px;

}

.professional-card:last-child{

    margin-bottom:0;

}

.professional-card img{

    width:280px;
    height:360px;

    object-fit:cover;

    border-radius:18px;
    
    box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.professional-card h2{

    font-family:"Cormorant Garamond",serif;

    font-size:42px;

    margin-bottom:8px;

    color:#222;

}

.professional-card h4{

    font-size:20px;

    font-weight:600;

    color:#b08d57;

    min-height:28px;

    display:flex;

    align-items:center;

    margin-bottom:22px;

}

.professional-card p{

    font-size:18px;

    line-height:1.9;

    color:#555;

    margin-bottom:18px;

}


/*==================================================
DOVE SIAMO
==================================================*/

.location{

    padding:120px 8%;
    background:#fafafa;

}

.location-container{

    max-width:1400px;
    margin:auto;

    display:grid;
    grid-template-columns:470px 1fr;

    gap:70px;

    align-items:stretch;

}

.location-text{

    background:#fff;

    padding:34px;

    border-radius:22px;

    box-shadow:0 18px 40px rgba(0,0,0,.08);

    display:flex;
    flex-direction:column;

    height:100%;

}

.location-text h2{

    display:inline-block;
    position:relative;

    font-family:"Cormorant Garamond",serif;
    font-size:46px;

    padding-bottom:14px;

    margin-bottom:24px;

}

.location-text h2::after{

    content:"";

    position:absolute;

    left:0;
    bottom:0;

    width:100%;
    height:3px;

    background:#b08d57;

}

.location-intro{

    font-size:18px;

    line-height:1.75;

    color:#555;

    margin-bottom:22px;

}

.location-item{

    display:flex;

    gap:18px;

    padding:10px 0;

    border-bottom:1px solid #ececec;

}

.location-item:last-of-type{

    border-bottom:none;

}

.location-item i{

    width:46px;
    height:46px;

    font-size:18px;
    
    display:flex;
    justify-content:center;
    align-items:center;

    flex-shrink:0;

    border-radius:50%;

    background:#f7f2e8;

    color:#b08d57;



}

.location-item h4{

    font-family:"Cormorant Garamond",serif;

    font-size:24px;

    margin-bottom:4px;

}

.location-item p{

    color:#555;

    line-height:1.55;

}

.location-note{

    margin-top:auto;

    padding-top:24px;

    color:#666;

    font-style:italic;

    line-height:1.75;

}

.location-map{

    height:100%;

}

.location-map iframe{

    width:100%;
    height:100%;

    min-height:100%;

    border:none;

    border-radius:22px;

    box-shadow:0 18px 40px rgba(0,0,0,.10);

}

/*==================================================
FOOTER
==================================================*/

.footer{

    background:#1f1f1f;

    color:#fff;

    padding:80px 8% 35px;

}

.footer-container{

    max-width:1400px;

    margin:auto;

    display:grid;

    grid-template-columns:2fr 1fr 1fr;

    gap:60px;

}

.footer-logo{

    width:130px;
    height:130px;

    background:white;

    border-radius:1%;

    border:1px solid rgb(255, 255, 255);

    padding:0;

    object-fit:cover;

    overflow:hidden;

    display:block;

    box-shadow:
        0 18px 45px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.45);

    margin-bottom:22px;

}

.footer-column h3{

    margin-bottom:20px;

    font-size:22px;

}

.footer-column p{

    color:#d5d5d5;

    line-height:1.9;

}

.footer-column a{

    display:block;

    margin-bottom:12px;

    color:#d5d5d5;

    text-decoration:none;

    transition:.25s;

}

.footer-column a:hover{

    color:#fff;

    padding-left:8px;

}

.footer-bottom{

    margin-top:55px;

    padding-top:24px;

    border-top:1px solid rgba(255,255,255,.15);

    text-align:center;

    color:#bdbdbd;

}

/*==================================================
ANIMAZIONI
==================================================*/

.fade-in{

    opacity:0;

    transform:translateY(40px);

    transition:.8s;

}

.fade-in.visible{

    opacity:1;

    transform:translateY(0);

}

/*==================================================
EFFETTI GENERALI
==================================================*/



iframe{

   max-width:100%;
   display:block;

}

::selection{

    background:#b08d57;

    color:white;

}

body{

    -webkit-font-smoothing:antialiased;

    text-rendering:optimizeLegibility;

}

.team-card,
.location-text,
.service-card,
.why-card{

    transition:.35s;

}

.team-card:hover,
.location-text:hover{

    transform:translateY(-8px);

    box-shadow:0 28px 65px rgba(0,0,0,.12);

}

.studio-image img,
.professional-card img{

    transition:.35s;

}

.studio-image img:hover,
.professional-card img:hover{

    transform:scale(1.02);

}

/*==================================================
SCROLLBAR
==================================================*/

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-track{

    background:#efefef;

}

::-webkit-scrollbar-thumb{

    background:#b08d57;

    border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

    background:#987548;

}





/*==================================================
PREMIUM DESIGN
==================================================*/

/* Titoli */

h1,h2,h3{

    letter-spacing:.2px;

}

.section-title h2,
.studio-content h2,
.location-text h2,
.appointment-container h2{
    display:inline-block;
    position:relative;
    padding-bottom:14px;
}

.section-title h2::after,
.studio-content h2::after,
.location-text h2::after,
.appointment-container h2::after{

    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:3px;
    background:#b08d57;

}


/*==================================================
CARDS
==================================================*/



.team-card{

    height:auto;

}


.value-item,
.location-text{

    transition:
        transform .35s,
        box-shadow .35s,
        border-color .35s;

}

.team-card:hover,
.value-item:hover,
.location-text:hover{

    transform:translateY(-8px);

    box-shadow:0 28px 65px rgba(0,0,0,.12);

}

/*==================================================
BOTTONI
==================================================*/

.button-primary,
.button-secondary,
.hero-button{

    box-shadow:0 10px 25px rgba(176,141,87,.22);

}

.button-primary:hover,
.hero-button:hover{

    box-shadow:0 18px 40px rgba(176,141,87,.35);

}



/*==================================================
IMMAGINI
==================================================*/

.studio-image img,
.professional-card img,
.location-map iframe{

    transition:.4s;

}

.studio-image img:hover,
.professional-card img:hover{

    transform:scale(1.02);

}

/*==================================================
AREE DI ATTIVITÀ
==================================================*/

.services{
    padding:120px 8%;
    background:#f8f8f8;
}

.section-title{
    max-width:900px;
    margin:0 auto 70px;
    text-align:center;
}

.section-title h2{
    display:inline-block;
    position:relative;
    padding-bottom:14px;
    font-family:"Cormorant Garamond",serif;
    font-size:48px;
}

.section-title h2::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:3px;
    background:#b08d57;
}

.section-title p{
    margin-top:28px;
    font-size:18px;
    line-height:1.8;
    color:#555;
}

.services-grid{
    max-width:1120px;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(3,320px);
    justify-content:center;
    gap:40px;
}

.service-card{
    width:100%;
    height:440px;
    perspective:1200px;
}

.service-card-inner{
    position:relative;
    width:100%;
    height:100%;
    transition:transform .8s;
    transform-style:preserve-3d;
}

.service-card:hover .service-card-inner{
    transform:rotateY(180deg);
}

.service-card.flipped .service-card-inner{
    transform:rotateY(180deg);
}

.service-card-front,
.service-card-back{
    position:absolute;
    inset:0;

    border-radius:22px;
    overflow:hidden;

    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;

    display:flex;
    justify-content:center;
    align-items:center;
}

.service-card-front{
    background:#fff;
    border:1px solid rgba(176,141,87,.18);
    box-shadow:0 18px 45px rgba(0,0,0,.10);
    flex-direction:column;
}

.service-card-back{
    background:linear-gradient(145deg,#3a3631,#211f1d);
    color:#fff;
    border:1px solid rgba(176,141,87,.45);
    transform:rotateY(180deg);
    padding:35px;
}

.service-icon{
    position:absolute;
    top:35px;
    left:50%;
    transform:translateX(-50%);
    font-size:56px;
    color:#b08d57;
}

.service-card-front h3{
    margin-top:85px;
    font-family:"Cormorant Garamond",serif;
    font-size:34px;
    text-align:center;
    line-height:1.25;
}

.service-list{
    width:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.service-list p{
    padding:15px 0;
    margin:0;
    text-align:center;
    color:white;
    font-family:"Cormorant Garamond",serif;
    font-size:21px;
    border-bottom:1px solid rgba(176,141,87,.35);
}

.service-list p:last-child{
    border-bottom:none;
}

@media (max-width:1100px){
    .services-grid{
        grid-template-columns:repeat(2,320px);
    }
}

@media (max-width:768px){
    .services-grid{
        grid-template-columns:320px;
    }
}

/*==================================================
FOOTER
==================================================*/



.footer-column a{

    transition:.25s;

}

.footer-column a:hover{

    padding-left:8px;

}

/*==================================================
PERCHÉ SCEGLIERE NOI
==================================================*/

.why-us{

    padding:120px 8%;
    background:#fff;

}

.why-grid{

    max-width:1400px;
    margin:auto;

    display:grid;
    grid-template-columns:repeat(2,1fr);

    gap:30px;

}

.why-card{

    position:relative;

    height:340px;

    overflow:hidden;

    border-radius:20px;

    background-size:cover;
    background-position:center;

    transition:.35s;

}

.why-card:hover{

    transform:translateY(-8px);

    box-shadow:0 22px 50px rgba(0,0,0,.18);

}

.justice{
    background-image:url("../img/justice.jpg");
}

.library{
    background-image:url("../img/library.jpg");
}

.handshake{
    background-image:url("../img/handshake.jpg");
}

.courtroom{
    background-image:url("../img/courtroom.jpg");
}

.why-overlay{

    position:absolute;
    inset:0;

    display:flex;
    flex-direction:column;

    justify-content:center;
    align-items:center;

    padding:40px;

    text-align:center;

    background:rgba(0,0,0,.50);

    color:#fff;

}

.why-overlay h3{

    font-family:"Cormorant Garamond",serif;

    font-size:34px;

    margin-bottom:18px;

}

.why-overlay p{

    max-width:300px;

    font-size:18px;

    line-height:1.8;

}


/*==================================================
APPUNTAMENTO
==================================================*/

.appointment{

    padding:80px 8%;

    background:#f8f8f8;

}

.appointment-container{

    max-width:900px;

    margin:auto;

    text-align:center;

}

.appointment-container h2{

    display:inline-block;

    position:relative;

    font-family:"Cormorant Garamond",serif;

    font-size:46px;

    padding-bottom:14px;

    margin-bottom:12px;

}

.appointment-container h2::after{

    content:"";

    position:absolute;

    left:0;
    bottom:0;

    width:100%;

    height:3px;

    background:#b08d57;

}

.appointment-text{

    font-size:18px;

    color:#555;

    line-height:1.45;

    margin:0;

}

.appointment-text + .appointment-text{

    margin-top:0px;

}

.contact-form{

    max-width:900px;

    margin:24px auto 0;

}

.form-row{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:18px;

    margin-bottom:16px;

}

.form-group{

    display:flex;

    flex-direction:column;

}

.form-group label{

    margin-bottom:10px;

    font-weight:600;

    color:#444;

}

.form-group input,
.form-group textarea{

    width:100%;

    padding:13px 18px;

    border-radius:14px;

    border:1px solid #d8d8d8;

    font-size:17px;

    background:#fff;

    transition:.30s;

}

.form-group textarea{

    resize:vertical;

    min-height:170px;

}

.form-group input:focus,
.form-group textarea:focus{

    outline:none;

    border-color:#b08d57;

    box-shadow:0 0 0 5px rgba(176,141,87,.15);

}

.privacy{

    margin:18px 0;

}

.privacy label{

    display:flex;

    align-items:flex-start;

    gap:12px;

    color:#555;

    line-height:1.7;

    text-align:left;

}

.contact-form button{

    border:none;

    cursor:pointer;

}

/*==================================================
RESPONSIVE TABLET
==================================================*/

@media (max-width:1100px){

    header{
        padding:18px 30px;
    }

    .studio-container,
    .location-container,
    .professional-card{

        grid-template-columns:1fr;
        gap:45px;

    }

    .studio-image,
    .professional-card img{

        margin:auto;

    }

    .team{

        grid-template-columns:repeat(2,1fr);

    }

    .why-grid{

        grid-template-columns:1fr;

    }

    .footer-container{

        grid-template-columns:1fr;
        gap:45px;

    }

}


@media (max-width:1000px){

    header{

        padding:18px 22px;

    }

    .logo img{

        height:72px;

    }



    .menu-toggle{

        display:block;

        z-index:1200;

    }



    nav.open{

        right:0;

    }

    nav a{

        width:100%;

    }

}

/*==================================================
RESPONSIVE SERVIZI
==================================================*/

@media (max-width:768px){

    .services{

        padding:80px 20px;

    }

    .services-grid{

        grid-template-columns:1fr;

        max-width:380px;

        gap:28px;

    }

    .service-card{

        width:100%;

        height:400px;

    }

    .service-card-front h3{

        font-size:30px;

        margin-top:75px;

    }

    .service-icon{

        font-size:48px;

        top:28px;

    }

    .service-list p{

        font-size:19px;

        padding:12px 0;

    }

}

/*==================================================
RESPONSIVE - PERCHÉ SCEGLIERE NOI
==================================================*/

@media (max-width:768px){

    .why-us{

        padding:80px 20px;

    }

    .why-grid{

        grid-template-columns:1fr;

        gap:22px;

    }

    .why-card{

        height:260px;

        border-radius:18px;

    }

    .why-overlay{

        padding:28px;

    }

    .why-overlay h3{

        font-size:28px;

        margin-bottom:14px;

    }

    .why-overlay p{

        max-width:100%;

        font-size:16px;

        line-height:1.7;

    }

}

/*==================================================
RESPONSIVE - DOVE SIAMO
==================================================*/

@media (max-width:768px){

    .location{

        padding:80px 20px;

    }

    .location-container{

        grid-template-columns:1fr;

        gap:28px;

    }

    .location-text{

        height:auto;

        padding:28px;

    }

    .location-text h2{

        font-size:38px;

    }

    .location-intro{

        font-size:17px;

        line-height:1.7;

    }

    .location-item{

        gap:15px;

        padding:12px 0;

    }

    .location-item i{

        width:42px;
        height:42px;

        font-size:17px;

    }

    .location-item h4{

        font-size:21px;

    }

    .location-item p{

        font-size:16px;

    }

    .location-note{

        margin-top:20px;

        padding-top:20px;

        font-size:15px;

    }

    .location-map{

        height:320px;

    }

    .location-map iframe{

        height:320px;

        border-radius:18px;

    }

}

/*==================================================
RESPONSIVE - FOOTER
==================================================*/

@media (max-width:768px){

    .footer{

        padding:60px 20px 30px;

    }

    .footer-container{

        grid-template-columns:1fr;

        gap:40px;

        text-align:center;

    }


    .footer-logo{

        width:90px;
        height:90px;

        margin:0 auto 20px;

        object-fit:contain;

        overflow:visible;

    }

    .footer-column h3{

        font-size:22px;

        margin-bottom:16px;

    }

    .footer-column p{

        font-size:16px;

        line-height:1.8;

    }

    .footer-column a{

        display:inline-block;

        margin:6px 10px;

        padding:0;

    }

    .footer-column a:hover{

        padding-left:0;

    }

    .footer-bottom{

        margin-top:40px;

        padding-top:20px;

        font-size:14px;

        line-height:1.6;

    }

}

/*==================================================
NUOVA TIPOGRAFIA
==================================================*/

body{

    font-family:"Raleway",sans-serif;

}



/*==================================================
MENU MOBILE
==================================================*/

.menu-toggle{

    display:none;

    background:none;

    border:none;

    color:#fff;

    font-size:30px;

    cursor:pointer;

}

@media (max-width:900px){

    .menu-toggle{

        display:block;

        z-index:1002;

    }

    header{

        padding:18px 25px;

    }


  

    nav a{

        width:210px;

    }

    nav{

    display:none;

}

nav.open{

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

    align-items:center;

    position:fixed;

    top:0;
    right:0;

    width:300px;
    height:100vh;

    padding-top:120px;

    background:rgba(255,255,255,.97);

    backdrop-filter:blur(20px);

    gap:22px;

    z-index:1001;

}

nav.open a{

    color:#2b2b2b;

    width:220px;

}

    .menu-overlay{

    position:fixed;

    top:0;
    left:0;

    width:100%;
    height:100%;

    background:rgba(0,0,0,.45);

    opacity:0;

    visibility:hidden;

    transition:.35s;

    z-index:999;

}

.menu-overlay.active{

    opacity:1;

    visibility:visible;

}

.hero-content h1{

    font-size:64px;

    line-height:.95;

}

.hero-content p{

    max-width:90%;

    font-size:18px;

    line-height:1.75;

}

.hero-content{

    padding-bottom:40px;

}

}


@media (max-width:900px){

    header{

        padding:18px 22px;

    }

    .logo img{

        height:70px;

    }


    .menu-toggle{

        display:block;

        z-index:1100;

    }


nav.open{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}



}

.form-message{

    display:none;

    margin:0 auto 30px;

    max-width:900px;

    padding:22px 26px;

    border-radius:16px;

    text-align:center;

    font-size:17px;

    line-height:1.7;

    font-weight:500;

}

.form-message.success{

    background:#edf8f1;

    border:1px solid #6db488;

    color:#2b6e46;

}

.form-message.error{

    background:#fff3f3;

    border:1px solid #d77d7d;

    color:#8b2d2d;

}