/*==================================================
STUDIO LEGALE DELLAMANO
VERSIONE 2.0
==================================================*/

/*==========================
RESET
==========================*/
html,
body{
    margin:0;
    padding:0;
    width:100%;
    overflow-x:hidden;
}
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Inter',sans-serif;
    color:#28313b;
    background:#fbfaf6;
    line-height:1.7;
    overflow-x:hidden;
}

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

a{
    text-decoration:none;
    color:inherit;
}

ul{
    list-style:none;
}

/*==========================
COLORI
==========================*/

:root{

   --primary:#1E3050;

    --secondary:#c7a55b;

    --text:#374151;
    --title:#10243f;

    --light:#f8f9fb;
    --paper:#fbfaf6;
    --border:#e8e8e8;

    --shadow:0 12px 35px rgba(0,0,0,.08);

    --radius:20px;

    --transition:.35s ease;

}

/*==========================
CONTAINER
==========================*/

.container{

    width:min(1220px,92%);
    margin:auto;

}

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

h1,h2,h3{

    font-family:'Cormorant Garamond',serif;
    color:var(--title);
    font-weight:600;
    line-height:1.1;

}

.section-header{

    text-align:center;
    margin-bottom:70px;

}

.section-header span{

    display:block;

    color:var(--secondary);

    letter-spacing:3px;

    text-transform:uppercase;

    font-size:.85rem;

    margin-bottom:12px;

}

.section-header h2{

    font-size:3rem;

}

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

header{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:1000;

    background:#1E3050;

    border-bottom:1px solid #c7a55b;

}

.header-wrapper{

    display:flex;

    justify-content:space-between;

    align-items:center;

    height:95px;

}

.logo{

    display:flex;

    align-items:center;

    gap:10px;

}

.logo img{

    width:58px;

    height:58px;

    object-fit:contain;

}

.logo-text{

    display:flex;

    flex-direction:column;

    align-items:center;

    text-align:center;

    gap:0px;

}

.logo-text span{

    font-size:.9rem;

    color:var(--secondary);

    line-height:1.1;

    margin-bottom:0px;
}

.logo-text strong{

    font-family:'Cormorant Garamond', serif;

    color:#fff;

    letter-spacing:2px;

    font-size:1.4rem;

    font-weight:600;

}

nav ul{

    display:flex;

    gap:42px;

}
nav a{

    color:white;

    text-decoration:none;

    font-weight:500;

    transition:.3s;

}

nav a:hover{

    color:var(--secondary);

}

nav a::after{

    display:none;

}

nav a:hover::after{

    display:none;

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

.hero{

    position:relative;

    height:calc(100vh - 95px);

    margin-top:95px;

    padding:0;

    box-sizing:border-box;

}

.hero .container{

    height:100%;

}

.hero-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:40px;

    align-items:center;

    width:100%;

    height:100%;

    box-sizing:border-box;

}

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

.hero-left{

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    justify-content:center;

    height:100%;

    padding-right:40px;

    box-sizing:border-box;

}

.hero-logo{

    width:160px;

    margin-right:0;

    flex-shrink:0;

    height:auto;

    display:block;

    margin-bottom:30px;

}

.hero-brand{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:35px;

    width:100%;

}

.hero-title{

    display:flex;

    flex-direction:column;

}

.hero-small{

    font-size:1rem;

    letter-spacing:3px;

    text-transform:uppercase;

    color:var(--secondary);

    margin-bottom:2px;

}

.hero h1{

    font-family:'Cormorant Garamond', serif;

    font-size:4.2rem;

    font-weight:600;

    line-height:1;

    color:var(--primary);

    margin:0;

}

.hero-description{

    width:calc(100% - 25px);

    max-width:none;

    margin:0 0 0 20px;

    padding:0;

    text-align:justify;

    line-height:1.8;

}

.hero-button{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    margin-top:20px;

    margin-left:20px;

    padding:16px 34px;

    border:2px solid var(--secondary);

    border-radius:50px;

    background:transparent;

    color:var(--primary);

    text-decoration:none;

    font-size:1rem;

    font-weight:600;

    letter-spacing:.5px;

    transition:.35s ease;

}

.hero-button:hover{

    background:var(--secondary);

    color:white;

    transform:translateY(-2px);

    box-shadow:0 12px 30px rgba(0,0,0,.15);

}

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

.hero-right{

    position:relative;

    height:100%;

    display:flex;

    align-items:stretch;

    justify-content:flex-end;

    min-width:0;

}

.hero-slider{

    position:relative;

    width:calc(100% + 120px);

    height:100%;

    overflow:hidden;

    border-radius:0;

    box-shadow:none;

    margin-right:-120px;

}

.hero-slide{

    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    object-fit:cover;

    opacity:0;

    transition:opacity 1.2s ease;

   -webkit-mask-image:linear-gradient(
    to right,
    transparent 0%,
    rgba(0,0,0,.55) 8%,
    rgba(0,0,0,.85) 18%,
    #000 28%
);

mask-image:linear-gradient(
    to right,
    transparent 0%,
    rgba(0,0,0,.55) 8%,
    rgba(0,0,0,.85) 18%,
    #000 28%
);
}

.hero-slide.active{

    opacity:1;

}

/* ==========================================================
   NAVIGAZIONE RESPONSIVE E CONSENSO COOKIE
========================================================== */

.nav-toggle{
    display:none;
    width:44px;
    height:44px;
    border:0;
    background:transparent;
    cursor:pointer;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
}

.nav-toggle span{
    display:block;
    width:25px;
    height:1px;
    background:#fff;
    transition:transform .25s ease, opacity .25s ease;
}

.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

.map iframe:not([src]){
    display:none;
}

.map-consent{
    min-height:360px;
    padding:36px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:20px;
    text-align:center;
    color:#fff;
    background:linear-gradient(135deg, #1e3050, #31496f);
}

.map-consent p{
    max-width:360px;
    line-height:1.6;
}

.map-consent[hidden]{ display:none; }

.map-consent-button,
.cookie-button{
    border:1px solid var(--secondary);
    border-radius:0;
    padding:11px 18px;
    font:600 .76rem 'Inter', sans-serif;
    letter-spacing:1.1px;
    text-transform:uppercase;
    cursor:pointer;
    transition:background .25s ease, color .25s ease, transform .25s ease;
}

.map-consent-button{
    color:#fff;
    background:transparent;
}

.map-consent-button:hover,
.map-consent-button:focus-visible{
    background:#ffffff;
    color:var(--primary);
    transform:translateY(-2px);
}

.cookie-banner{
    position:fixed;
    right:24px;
    bottom:24px;
    z-index:2000;
    display:flex;
    align-items:flex-end;
    gap:26px;
    width:min(650px, calc(100% - 48px));
    padding:24px 26px;
    color:var(--text);
    background:var(--paper);
    border-top:3px solid var(--secondary);
    box-shadow:0 18px 50px rgba(16,36,63,.25);
}

.cookie-banner[hidden]{ display:none; }

.cookie-banner-content{ flex:1; }

.cookie-banner-eyebrow{
    margin-bottom:3px;
    color:var(--secondary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:2px;
}

.cookie-banner h2{
    margin-bottom:7px;
    font-size:1.55rem;
}

.cookie-banner p{
    font-size:.84rem;
    line-height:1.55;
}

.cookie-banner a{
    color:var(--primary);
    text-decoration:underline;
    text-underline-offset:3px;
}

.cookie-banner-actions{
    display:flex;
    flex-direction:column;
    gap:8px;
    flex-shrink:0;
}

.cookie-button--primary{
    color:#fff;
    background:var(--primary);
}

.cookie-button--secondary{
    color:var(--primary);
    background:transparent;
}

.cookie-button:hover,
.cookie-button:focus-visible{
    background:var(--secondary);
    color:var(--primary);
    transform:translateY(-2px);
}

.cookie-settings-link{
    padding:0;
    border:0;
    color:rgba(255,255,255,.60);
    background:transparent;
    font:inherit;
    font-size:.82rem;
    cursor:pointer;
    transition:color .25s ease;
}

.cookie-settings-link:hover,
.cookie-settings-link:focus-visible{
    color:var(--secondary);
}

@media (max-width:1100px){
    header .container{ width:min(100% - 32px, 1220px); }

    .header-wrapper{ height:78px; }

    .logo img{
        width:44px;
        height:44px;
    }

    .logo-text span{ font-size:.72rem; }

    .logo-text strong{
        font-size:1.14rem;
        letter-spacing:1.6px;
    }

    .nav-toggle{ display:flex; }

    #site-navigation{
        position:absolute;
        top:78px;
        left:0;
        width:100%;
        max-height:0;
        overflow:hidden;
        background:var(--primary);
        border-top:1px solid rgba(199,165,91,.55);
        box-shadow:0 14px 25px rgba(16,36,63,.18);
        transition:max-height .35s ease;
    }

    #site-navigation.is-open{ max-height:420px; }

    #site-navigation ul{
        flex-direction:column;
        align-items:center;
        gap:0;
        padding:10px 0 16px;
    }

    #site-navigation li{ width:100%; }

    #site-navigation a{
        display:block;
        padding:11px 24px;
        text-align:center;
    }

    .hero{
        height:calc(100vh - 78px);
        margin-top:78px;
    }
}

@media (max-width:768px){
    .map-consent{ min-height:300px; }

    .cookie-banner{
        right:16px;
        bottom:16px;
        width:calc(100% - 32px);
        align-items:stretch;
        flex-direction:column;
        gap:18px;
        padding:21px;
    }

    .cookie-banner-actions{
        flex-direction:row;
    }

    .cookie-button{ flex:1; }
}

@media (max-width:600px){
    .container{ width:min(100% - 36px, 1220px); }

    .hero--split .hero-left{
        min-height:440px;
        padding:54px 30px 48px;
    }

    .hero--split .hero-right{
        display:block;
        height:auto;
        min-height:0;
    }

    .hero--split .hero-right::before{
        display:none;
    }

    .hero--split .hero-right img{
        height:auto;
        aspect-ratio:7 / 5;
        object-fit:contain;
    }

    .hero--split .hero-logo{ width:180px; }

    .hero-description{
        font-size:.98rem;
        line-height:1.65;
    }

    .hero--split .hero-button{
        width:100%;
        max-width:300px;
        padding:13px 18px;
    }

    .cookie-banner-actions{ flex-direction:column; }
}

/* Alleggerimenti per tablet e telefono */
@media (max-width:1024px){
    .area-feature-image img,
    .professional-image img,
    .studio-gallery-item img{
        transition:none;
    }
}

@media (max-width:768px){
    .consultation{
        padding:44px 0 52px;
    }

    .consultation .section-header{
        margin-bottom:12px;
    }

    .consultation-card{
        padding:14px 18px;
    }

    .consultation-form{
        gap:9px;
    }

    .form-group input,
    .form-group textarea{
        font-size:16px;
    }
}

@media (max-width:480px){
    .consultation-card{
        padding:13px 16px;
    }

    .consultation-button{
        width:100%;
    }
}

/* Prestazioni e dispositivi touch */
@media (max-width:1024px){
    /* L'effetto fotografico fisso resta sul desktop: sui dispositivi touch
       lo sfondo scorre normalmente, evitando rallentamenti. */
    .quote-banner{
        background-attachment:scroll;
    }
}

@media (hover:none), (pointer:coarse){
    .area-feature:hover .area-feature-image img,
    .professional:hover .professional-image img{
        transform:none;
    }
}

@media (prefers-reduced-motion:reduce){
    html{
        scroll-behavior:auto;
    }

    *,
    *::before,
    *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        scroll-behavior:auto !important;
        transition-duration:.01ms !important;
    }
}

/* Hero a fotografia unica */
.hero--full-image{

    background-image:
        linear-gradient(90deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.57) 42%, rgba(255,255,255,.12) 72%, rgba(255,255,255,.04) 100%),
        url('assets/images/foto-iniziale-1440w.webp?v=2');

    background-position:center;

    background-size:cover;

}

.hero--full-image .hero-grid{

    display:flex;

    align-items:center;

}

.hero--full-image .hero-left{

    width:min(100%, 650px);

    padding:0 40px;

}

.hero--full-image .hero-right{

    display:none;

}

.hero--full-image .hero-brand{

    margin-bottom:28px;

}

.hero--full-image .hero-logo{

    filter:none;

}

.hero--full-image .hero-small{

    color:var(--secondary);

    margin-bottom:0;

    line-height:1;

    text-shadow:0 1px 3px rgba(30,48,80,.58);

}

.hero--full-image h1{

    color:var(--primary);

    font-size:3.55rem;

}

.hero--full-image .hero-description{

    color:#4b5563;

}

.hero--full-image .hero-description{

    margin-left:0;

    max-width:590px;

    text-align:left;

    text-shadow:none;

}

.hero--full-image .hero-button{

    margin-left:0;

    background:#ffffff;

    color:var(--primary);

}

.hero--full-image .hero-button:hover{

    background:var(--secondary);

    color:var(--primary);

    border-color:var(--secondary);

    box-shadow:0 8px 22px rgba(199,165,91,.22);

}
/*==================================================
BANNER FOTOGRAFICO
==================================================*/

/*==================================================
   BANNER
==================================================*/

.studio-quote{

    background:var(--primary);

    padding:40px 0;

    text-align:center;

    position:relative;

    border-top:1px solid var(--secondary);

    border-bottom:1px solid var(--secondary);

}

.studio-quote::before,
.studio-quote::after{

    display:none;

}

.studio-quote blockquote{

    max-width:1100px;

    margin:0 auto;

    color:#ffffff;

    font-family:'Cormorant Garamond', serif;

    font-size:clamp(1.45rem, 2.1vw, 2rem);

    font-weight:500;

    line-height:1.3;

    font-style:italic;

}

.studio-quote cite{

    display:block;

    max-width:1180px;

    margin:16px auto 0;

    color:rgba(255,255,255,.8);

    font-family:"Cormorant Garamond", serif;

    font-size:1.1rem;

    font-style:normal;

    letter-spacing:.7px;

    text-align:right;

}

.quote-banner{

    position:relative;

    width:100%;

    height:460px;

    background-image:
        linear-gradient(rgba(15,35,60,.16), rgba(15,35,60,.16)),
        url('assets/images/banner.jpg');

    background-size:cover;

    background-position:center;

    background-attachment:fixed;

}

.quote-banner::before{

    content:"";

    position:absolute;

    inset:0;

    background:rgba(15,35,60,.18);

}

.banner-consultation-content{

    position:absolute;

    top:50%;

    left:50%;

    transform:translate(-50%, -50%);

    z-index:1;

    width:min(90%, 650px);

    text-align:center;

}

.banner-consultation-content p{

    margin:0 0 22px;

    color:#ffffff;

    font-family:"Cormorant Garamond", serif;

    font-size:clamp(1.8rem, 3vw, 2.7rem);

    font-weight:500;

    line-height:1.15;

    text-shadow:0 2px 12px rgba(15,35,60,.55);

}

.banner-consultation-link{

    display:inline-block;

    padding:16px 30px;

    border:1px solid var(--secondary);

    border-radius:4px;

    background:#ffffff;

    color:var(--primary);

    font-size:.9rem;

    font-weight:700;

    letter-spacing:1.2px;

    text-decoration:none;

    text-transform:uppercase;

    white-space:nowrap;

    transition:background .3s ease, color .3s ease, transform .3s ease;

}

.banner-consultation-link:hover{

    background:#ffffff;

    color:var(--primary);

    transform:translateY(-3px);

    box-shadow:0 10px 24px rgba(15,35,60,.22);

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

.areas{

    margin-top:0;

    height:calc(100vh - 95px);

    padding:40px 0 30px;

    background:#fff;

    box-sizing:border-box;

}

.areas-grid{

    display:grid;

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

    gap:35px;

    align-items:start;

}

.areas-intro{

    display:none;

}

.areas .section-header{

    margin-bottom:40px;

}

.areas .section-header h2{

    color:var(--primary);

    margin-bottom:0;

}

#attivita{

    scroll-margin-top:95px;

}

#professionisti{

    scroll-margin-top:95px;

}

@media (max-width:1200px){

    .areas{

        height:auto;

        padding:40px 0 60px;

    }

}
/*==================================================*
* CARD
*==================================================*/

.area-card{

    background:#fcfbf8;

    border:1px solid #e8e8e8;

    border-radius:18px;

    overflow:hidden;

    display:flex;

    flex-direction:column;

    padding:0;

    box-shadow:0 5px 20px rgba(0,0,0,.04);

    transition:.35s ease;

    position:relative;

}

.area-card::before{

    display:none;

}

.area-card:hover{

    transform:translateY(-6px);

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

}

/*==================================================*
* PARTE BLU
*==================================================*/

.area-icon,
.area-card h3,
.area-description{

    background:var(--secondary);

}

.area-icon{

    display:flex;

    justify-content:center;

    align-items:center;

    padding:17px 0 8px;

}

.area-icon img{

    width:66px;

    height:auto;

    display:block;

}

.area-card h3{

    font-family:"Cormorant Garamond",serif;

    font-size:1.5rem;

    font-weight:500;

    color:#fff;

    text-align:center;

    line-height:1.12;

    letter-spacing:.5px;

    margin:0;

    padding:0 22px 15px;

}

.area-card h3::after{

    display:none;

}

.area-description{

    position:relative;

    color:rgba(255,255,255,.90);

    text-align:center;

    font-size:.97rem;

    line-height:1.7;

    margin:0;

    padding:0 32px 29px;

    border-bottom:none;

}

.area-description::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:4px;

    background:var(--secondary);

}

/*==================================================*
* ELENCO
*==================================================*/

.area-card ul{

    list-style:none;

    margin:0;

    padding:24px 34px 21px;

}

.area-card li{

    position:relative;

    padding-left:21px;

    margin-bottom:13px;

    color:#444;

    font-size:.96rem;

    line-height:1.6;

}

.area-card li:last-child{

    margin-bottom:0;

}

.area-card li::before{

    content:"";

    position:absolute;

    left:0;

    top:10px;

    width:6px;

    height:6px;

    border-radius:50%;

    background:var(--secondary);

}

/* ==========================================================
   AREE DI ATTIVITÀ — SCHEDE ILLUSTRATE
========================================================== */

.areas{

    height:auto;

    padding:32px 0 85px;

}

.areas-intro{

    display:block;

    max-width:1050px;

    margin:14px auto 0;

    color:#5f6772;

    font-size:1.15rem;

    line-height:1.7;

}

.areas .section-header{

    margin-bottom:0;

}

.areas-grid{

    display:flex;

    flex-direction:column;

    gap:72px;

}

.area-feature{

    display:grid;

    grid-template-columns:minmax(0, 1fr) minmax(360px, .95fr);

    align-items:start;

    min-height:0;

    border:none;

    position:relative;

}

.area-feature:not(:last-child)::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-36px;

    width:100%;

    height:2px;

    background:var(--secondary);

}

.area-feature:not(:last-child)::before{

    content:"";

    position:absolute;

    left:50%;

    bottom:-41px;

    width:10px;

    height:10px;

    background:var(--primary);

    border:2px solid #ffffff;

    transform:translateX(-50%) rotate(45deg);

    z-index:1;

}

.area-feature-content{

    padding:50px 70px 48px 14px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.area-feature-heading{

    display:flex;

    align-items:center;

    gap:3px;

    margin-bottom:9px;

}

.area-feature-icon{

    width:108px;

    height:108px;

    padding:0;

    display:flex;

    align-items:center;

    justify-content:center;

    box-sizing:border-box;

    flex-shrink:0;

    position:relative;

}

.area-feature-icon img{

    width:108px;

    height:108px;

    object-fit:contain;

    filter:drop-shadow(0 6px 10px rgba(199,165,91,.22));

}

.area-feature h3{

    margin:0;

    display:inline-block;

    position:relative;

    padding-bottom:14px;

    color:var(--primary);

    font-family:"Cormorant Garamond", serif;

    font-size:2.5rem;

    font-weight:600;

    line-height:1.05;

    letter-spacing:.2px;

}

.area-feature h3::after{

    content:"";

    position:absolute;

    bottom:0;

    left:0;

    width:118px;

    height:2px;

    margin:0;

    background:rgba(30,48,80,.55);

    flex-shrink:0;

}

.area-feature-description{

    margin:0 0 22px 22px;

    color:#4b5563;

    font-size:1.06rem;

    line-height:1.65;

    max-width:510px;

}

.area-feature ul{

    list-style:none;

    margin:4px 0 0 46px;

    padding:0;

}

.area-feature li{

    position:relative;

    padding-left:20px;

    margin-bottom:8px;

    color:#374151;

    font-size:1.06rem;

    line-height:1.45;

}

.area-feature li::before{

    content:"";

    position:absolute;

    left:0;

    top:.55em;

    width:7px;

    height:7px;

    border-radius:50%;

    background:var(--secondary);

}

.civil-more-toggle{

    display:inline-flex;

    align-items:center;

    width:max-content;

    margin:18px 0 0 46px;

    padding:9px 20px;

    border:1px solid var(--secondary);

    border-radius:4px;

    background:#ffffff;

    color:var(--primary);

    cursor:pointer;

    font-size:.82rem;

    font-weight:600;

    letter-spacing:1.5px;

    text-transform:uppercase;

    transition:background .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;

}

.civil-more-toggle:hover{

    background:var(--secondary);

    color:var(--primary);

    transform:translateY(-3px);

    box-shadow:0 10px 24px rgba(15,35,60,.22);

}

.civil-more-details{

    display:none;

}

.civil-more-details.is-open{

    display:block;

}

.civil-more-details .civil-more-group:first-child{

    margin-top:20px;

}

.civil-more-group{

    margin-top:20px;

}

.civil-more-group:first-child{

    margin-top:0;

}

.civil-more-group h4{

    margin:0 0 8px 46px;

    color:var(--secondary);

    font-family:"Cormorant Garamond", serif;

    font-size:1.08rem;

    font-weight:600;

    letter-spacing:.4px;

}

.civil-more-group ul{

    padding-top:0;

}

.area-feature-image{

    width:100%;

    max-width:100%;

    aspect-ratio:7 / 5;

    height:auto;

    margin:0;

    margin-left:auto;

    margin-right:auto;

    align-self:center;

    min-height:0;

    overflow:hidden;

}

.area-feature-image img{

    display:block;

    width:100%;

    height:100%;

    object-fit:cover;

    transition:transform .6s ease;

}

.area-feature:hover .area-feature-image img{

    transform:scale(1.04);

}

.area-feature--reverse{

    grid-template-columns:minmax(360px, .95fr) minmax(0, 1fr);

}

.area-feature--reverse .area-feature-image{

    order:1;

}

.area-feature--reverse.civil-expanded .area-feature-image{

    align-self:start;

}

.area-feature--reverse .area-feature-content{

    order:2;

    padding:10px 14px 48px 70px;

}

/* Mantiene insieme titolo, elenco e foto della sezione famiglia. */
.areas-grid > .area-feature:last-child{

    margin-top:35px;

}

/* Su tablet e telefono la presentazione segue la larghezza disponibile. */
@media (max-width:1100px){
    .areas-intro{
        text-align:justify;
        text-align-last:left;
        hyphens:none;
        word-break:normal;
        overflow-wrap:normal;
    }

    .areas-intro br{
        display:none;
    }
}

/* Piccolo allineamento ottico dell'icona di diritto civile. */
.area-feature--reverse .area-feature-icon{

    transform:translateY(2px);

}

@media (min-width:769px){

    .areas-grid > .area-feature:first-child .area-feature-content{

        padding-top:30px;

    }

    .areas-grid > .area-feature:first-child .area-feature-image{

        transform:none;

        margin-top:22px;

    }

}

@media (max-width:768px){

    .areas{

        padding:47px 0 60px;

    }

    .areas .section-header{

        margin-bottom:12px;

    }

    .areas-grid > .area-feature:first-child .area-feature-content{

        padding-top:18px;

    }

    .area-feature,
    .area-feature--reverse{

        display:flex;

        flex-direction:column;

        min-height:0;

    }

    .area-feature-content,
    .area-feature--reverse .area-feature-content{

        order:1;

        padding:38px 0 34px;

    }

    .area-feature-image,
    .area-feature--reverse .area-feature-image{

        order:2;

        width:100%;

        height:auto;

        aspect-ratio:4 / 3;

        margin-top:0;

        min-height:0;

    }

    .area-feature h3{

        font-size:2.1rem;

    }

    .area-feature ul{

        margin-left:22px;

    }

    .civil-more-toggle{

        margin-left:22px;

    }

    .civil-more-group h4{

        margin-left:22px;

    }

}

@media (max-width:576px){
    .areas-intro{
        width:100%;
        text-align:justify;
        text-align-last:left;
    }

    .areas-grid{
        gap:48px;
    }

    .area-feature-content,
    .area-feature--reverse .area-feature-content{
        padding-top:18px;
    }

    .areas-grid > .area-feature:last-child{
        margin-top:0;
    }

    .area-feature:not(:last-child)::after{
        bottom:-24px;
    }

    .area-feature:not(:last-child)::before{
        bottom:-29px;
    }
}
/* ==========================================================
PROFESSIONISTI
========================================================== */

.professionals{

    background:#ffffff;

    padding:32px 0 40px;

    position:relative;

}

.professionals .container{

    max-width:1300px;

    margin:0 auto;

    padding:0 50px;

}

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

.professionals .section-header{

    max-width:760px;

    margin:0 auto 45px;

    text-align:center;

}

.professionals .section-eyebrow{

    display:none;

}

.professionals .section-header h2{

    color:var(--primary);

    font-family:"Cormorant Garamond", serif;

    font-size:3rem;

    font-weight:600;

    line-height:1.1;

    margin-bottom:12px;

}

.professionals .section-description{

    display:block;

    color:#5f6772;

    font-size:1.4rem;

    line-height:1.6;

    margin:0;

}
/* ==========================================================
SCHEDE PROFESSIONISTI
========================================================== */

.professional{

    display:grid;

    grid-template-columns:350px 1fr;

    gap:80px;

    align-items:start;

    margin-bottom:62px;

}

.professional:last-child{

    margin-bottom:0;

}

/* Alessandra */

.professional-reverse{

    grid-template-columns:1fr 350px;

    gap:80px;

}

.professional-reverse .professional-image{

    order:2;

}

.professional-reverse .professional-content{

    order:1;

}

/* ===========================
IMMAGINE
=========================== */

.professional-image{

    width:320px;

    height:420px;

    margin-top:32px;

    position:relative;

    overflow:hidden;

    border-radius:10px;

    display:flex;

    align-items:center;

    justify-content:center;

}

.professional-image::before{

    display:none;

    position:absolute;

    inset:-9px;

    border:1px solid var(--primary);

    border-radius:2px;

}

.professional-image::after{

    display:none;

    position:absolute;

    inset:-15px;

    border:1px solid rgba(30,48,80,.45);

    border-radius:2px;

}

.professional-image img{

    width:320px;

    height:420px;

    object-fit:cover;

    display:block;

    border-radius:10px;

    transition:transform .7s ease;

}

.professional-image:hover img{

    transform:scale(1.04);

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

.professional-content{

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.professional-role{

    display:inline-block;

    margin-bottom:14px;

    color:#c7a55b;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:.78rem;

    font-weight:600;

}

.professional-name{

    color:var(--primary);

    font-family:"Cormorant Garamond", serif;

    font-size:2.5rem;

    font-weight:500;

    line-height:1.1;

    margin-bottom:18px;

}

.professional-divider{

    width:70px;

    height:2px;

    background:#c7a55b;

    margin-bottom:28px;

}

.professional-text{

    color:#4b5563;

    font-size:1.05rem;

    line-height:1.6;

    margin-bottom:10px;

    text-align:justify;

}
/* ==========================================================
CONTENUTO ESPANDIBILE
========================================================== */

.professional-hidden{

    display:none;

    margin-top:10px;

    animation:fadeProfessional .35s ease;

}

.professional.active .professional-hidden{

    display:block;

}

@keyframes fadeProfessional{

    from{

        opacity:0;

        transform:translateY(-8px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

.professional-hidden p{

    color:#4b5563;

    font-size:1.05rem;

    line-height:1.6;

    margin-bottom:14px;

    text-align:justify;

}
/* ===========================
   RECAPITI
=========================== */

.professional-contacts{

    margin-top:35px;

    padding-top:25px;

    border-top:1px solid rgba(199,165,91,.30);

}

.professional-contacts p{

    margin-bottom:24px;

    line-height:1.15;

}

.professional-contacts strong{

    display:block;

    margin-bottom:0;

    color:#c7a55b;

    font-size:.82rem;

    line-height:1.05;

    text-transform:uppercase;

    letter-spacing:1px;

}

.professional-contacts a{

    color:var(--primary);

    text-decoration:none;

    transition:.30s;

}

.professional-contacts a:hover{

    color:#c7a55b;

}
/* ===========================
   PULSANTE
=========================== */

.professional-toggle{

    align-self:flex-start;

    margin-top:18px;

    padding:9px 20px;

    background:transparent;

    border:1px solid var(--secondary);

    border-radius:4px;

    color:var(--secondary);

    cursor:pointer;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:.82rem;

    font-weight:600;

    transition:.35s;

}

.professional-toggle:hover{

    background:var(--secondary);

    color:var(--primary);

}

/* ===========================
   LINK
=========================== */

.professional-content a{

    word-break:break-word;

}/* ==========================================================
   RIFINITURE
========================================================== */

.professional{
    position:relative;
    scroll-margin-top:120px;
}

.professional::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-31px;

    width:100%;

    height:2px;

    background:var(--primary);

}

.professional::before{

    content:"";

    position:absolute;

    left:50%;

    bottom:-34px;

    width:8px;

    height:8px;

    background:var(--secondary);

    border:2px solid #ffffff;

    transform:translateX(-50%) rotate(45deg);

    z-index:1;

}

.professional:last-child::after{

    display:none;

}

.professional:last-child::before{

    display:none;

}

.professional-image img{

    transition:transform .7s ease;

}

.professional:hover .professional-image img{

    transform:scale(1.03);

}

.professional-content{

    max-width:640px;

}

.professional-reverse .professional-content{

    margin-left:auto;

}

.professional-content p:last-child{

    margin-bottom:0;

}

/* ==========================================================
   INTESTAZIONE E CONTATTI PROFESSIONISTI
========================================================== */

.professional-heading{

    padding:0;

    margin-bottom:20px;

}

.professional-heading .professional-role{

    margin:0 0 7px;

    color:var(--secondary);

}

.professional-heading .professional-name{

    margin:0;

    color:var(--primary);

}

.professional-heading .professional-divider{

    margin:16px 0 0;

    width:54px;

}

.professional-contacts{

    display:block;

    margin:0 0 28px;

    padding:0;

    background:transparent;

    border:0;

}

.professional-contacts h4{

    width:100%;

    margin:0;

    padding:0 0 8px;

    background:transparent;

    color:var(--secondary);

    font-family:inherit;

    font-size:.82rem;

    font-weight:600;

    letter-spacing:1.8px;

    text-transform:uppercase;

}

.professional-contacts p{

    display:flex;

    flex-direction:row;

    align-items:baseline;

    gap:18px;

    margin:0 0 8px;

    padding:0;

    min-width:0;

}

.professional-contacts p + p{

    border-top:0;

}

.professional-contacts strong{

    width:82px;

    flex-shrink:0;

    margin:0;

    color:var(--primary);

    font-size:.75rem;

    letter-spacing:1px;

}

/* Separatore tra consulenza e sede. */
.section-divider{

    position:relative;

    width:min(1200px, calc(100% - 48px));

    height:2px;

    margin:0 auto;

}

.section-divider--blue{

    background:var(--secondary);

}

.section-divider span{

    position:absolute;

    top:50%;

    left:50%;

    width:10px;

    height:10px;

    background:var(--primary);

    border:2px solid var(--paper);

    transform:translate(-50%, -50%) rotate(45deg);

}

.professional-contacts a{

    display:inline-block;

    color:var(--primary);

    font-size:.84rem;

    line-height:1.3;

    white-space:nowrap;

}

.professional-linkedin a{

    display:inline-flex;

    align-items:center;

    gap:7px;

    width:max-content;

}

.professional-linkedin svg{

    width:18px;

    height:18px;

    fill:currentColor;

    flex-shrink:0;

}

.professional-experience-title{

    margin:0 0 10px;

    color:var(--secondary);

    font-family:inherit;

    font-size:.82rem;

    font-weight:600;

    letter-spacing:1.8px;

    text-transform:uppercase;

}

@media (max-width:768px){

    .professional-heading{

        padding:20px 22px 17px;

    }

    .professional-contacts{

        overflow-x:auto;

    }

}

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

@media (max-width:1200px){

    .professional,
    .professional-reverse{

        grid-template-columns:1fr;

        gap:55px;

    }

    .professional-image,
    .professional-content{

        order:initial !important;

    }

    .professional-image{

        margin-top:0;

    }

    .professional-content{

        max-width:100%;

        margin:0;

    }

}

@media (max-width:768px){

    .professionals{

        padding:82px 0 90px;

    }

    .professionals .container{

        padding:0 24px;

    }

    .section-header{

        margin-bottom:70px;

    }

    .section-header h2{

        font-size:2.5rem;

    }

    .section-description{

        font-size:1rem;

        line-height:1.8;

    }

    .professional{

        gap:35px;

        margin-bottom:62px;

    }

    .professional-image{

    width:100%;

    max-width:380px;

    height:470px;

    margin:0 auto;

}

.professional-image img{

    height:100%;

}

    .professional-name{

        font-size:2.3rem;

    }

}

@media (max-width:576px){

    .professional,
    .professional-content,
    .professional-heading,
    .professional-contacts{
        width:100%;
        min-width:0;
        max-width:100%;
    }

    .professional-contacts{
        overflow-x:visible;
    }

    .professional-contacts p{
        width:100%;
        min-width:0;
        align-items:flex-start;
        gap:12px;
    }

    .professional-contacts a{
        display:block;
        min-width:0;
        white-space:normal;
        overflow-wrap:anywhere;
        word-break:break-word;
    }

    .professional-name,
    .professional-text,
    .professional-hidden p{
        max-width:100%;
        overflow-wrap:break-word;
    }

    .professional-image{

    max-width:320px;

    height:410px;

}

    .professional-name{

        font-size:2rem;

    }

    .professional-toggle{

        width:100%;

        text-align:center;

    }

}
/* ==========================================================
   RICHIEDI UNA CONSULENZA
========================================================== */

.consultation{

    padding:44px 0 52px;

    background:#ffffff;

    scroll-margin-top:0;

}

.consultation .section-header{

    max-width:700px;

    margin:0 auto 14px;

    text-align:center;

}

.consultation .section-header h2{

    color:var(--primary);

    font-size:3.1rem;

    margin:0 0 8px;

}

.consultation-intro{

    margin-top:8px;

    font-size:1.05rem;

    line-height:1.6;

    color:#4b5563;

}

.consultation-intro strong{

    color:var(--secondary);

    font-weight:600;

}

.consultation-card{

    max-width:680px;

    margin:0 auto;

    background:#e7eef5;

    border:1px solid rgba(30,48,80,.18);

    border-radius:0;

    padding:14px 26px;

    box-shadow:0 14px 34px rgba(15,35,60,.10);

}

.consultation-form{

    display:flex;

    flex-direction:column;

    gap:9px;

}

.form-group{

    display:flex;

    flex-direction:column;

}

.form-group label{

    margin-bottom:4px;

    color:var(--primary);

    font-weight:600;

}

.form-group label span{

    color:#7b8794;

    font-weight:400;

}

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

    width:100%;

    padding:8px 12px;

    border:1px solid #d9dde3;

    border-radius:10px;

    font-family:inherit;

    font-size:1rem;

    transition:.30s;

    background:#fff;

    box-sizing:border-box;

}

.form-group textarea{

    resize:vertical;

    min-height:72px;

    height:72px;

}

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

    outline:none;

    border-color:var(--secondary);

    box-shadow:0 0 0 3px rgba(199,165,91,.15);

}

.privacy-check{

    font-size:.86rem;

    color:#5f6772;

}

.privacy-check label{

    display:flex;

    align-items:flex-start;

    gap:8px;

    line-height:1.4;

}

.privacy-check input{

    margin-top:3px;

}

.privacy-check a{

    color:var(--primary);

    text-decoration:none;

    font-weight:600;

}

.privacy-check a:hover{

    color:var(--secondary);

}

.consultation-button{

    align-self:center;

    margin-top:10px;

    padding:10px 26px;

    border:1px solid var(--secondary);

    border-radius:4px;

    background:#ffffff;

    color:var(--primary);

    font-weight:700;

    letter-spacing:1px;

    cursor:pointer;

    transition:.35s;

}

.consultation-button:hover{

    background:var(--secondary);

    color:var(--primary);

}

.privacy-consent-error{

    margin:8px 0 0 26px;

    color:#b42318;

    font-size:.82rem;

    font-weight:500;

}

/* ==========================================================
   LO STUDIO
========================================================== */
.studio-gallery{

    padding:32px 0 52px;

    background:var(--primary);

    scroll-margin-top:95px;

}

.studio-gallery .section-header{

    margin-bottom:34px;

    text-align:center;

}

.studio-gallery .section-header h2{

    margin:0;

    color:#ffffff;

    font-size:3.1rem;

}

.studio-gallery-grid{

    display:grid;

    grid-template-columns:minmax(0, 1fr) minmax(0, .87fr) minmax(0, 1fr);

    gap:12px;

    align-items:center;

}

.studio-gallery-item{

    height:auto;

    margin:0;

    overflow:visible;

    background:transparent;

    align-self:center;

}

.studio-gallery-middle{

    display:flex;

    flex-direction:column;

    gap:18px;

    justify-content:center;

}

.studio-gallery-item img{

    display:block;

    width:100%;

    height:auto;

    object-fit:contain;

}

.studio-gallery-item:hover img{

    transform:none;

}

@media (max-width:768px){

    .studio-gallery{

        padding:46px 0 54px;

    }

    .studio-gallery .section-header h2{

        font-size:2.6rem;

    }

    .studio-gallery-grid{

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

        gap:12px;

    }

    .studio-gallery-item{

        align-self:start;

    }

}

@media (max-width:480px){

    .studio-gallery-grid{

        grid-template-columns:1fr;

    }

    .studio-gallery-item{

        grid-column:auto !important;

    }

}

/* ==========================================================
   DOVE TROVARCI
========================================================== */

.contacts{

    background:#ffffff;

    padding:44px 0 80px;

}

#dove-trovarci{

    scroll-margin-top:95px;

}

.contacts-grid{
    display:grid;
    grid-template-columns:330px 1fr;
    gap:60px;
    align-items:center;
    margin-top:0;
}

.contacts-grid--map-only{
    grid-template-columns:1fr;
    justify-items:center;
}

.contacts-grid--map-only .map{
    justify-self:center;
}

.map-wrapper{
    width:100%;
    max-width:620px;
    justify-self:end;
    align-self:start;
}

.contacts-info{

    display:flex;

    flex-direction:column;

    justify-content:center;

    gap:30px;

    align-self:center;

    transform:none;

}

.contact-item h4{

    color:#1E3050;

    font-size:1.1rem;

    margin-bottom:8px;

}

.contact-item p,
.contact-item a{

    color:#4b5563;

    text-decoration:none;

    line-height:1.7;

    font-size:.96rem;

}

.contact-item a:hover{

    color:#c7a55b;

}

.contact-location{

    padding-top:14px;

    border-top:1px solid rgba(199,165,91,.55);

}

.contact-location span{

    color:var(--secondary);

    font-size:.82rem;

    font-weight:600;

    letter-spacing:2px;

}

/* ==========================================================
   MAPPA
========================================================== */

.map{

    position:relative;

    justify-self:end;

    align-self:center;

    width:100%;

    max-width:620px;

    border-radius:0;

    overflow:hidden;

    box-shadow:0 15px 45px rgba(0,0,0,.12);

    transform:none;

    margin-bottom:0;

}

.contacts-exterior{

    width:100%;

    height:360px;

    margin:0;

    overflow:hidden;

    box-shadow:0 15px 45px rgba(0,0,0,.12);

    align-self:start;

}

.contacts-exterior img{

    display:block;

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center;

}

.map iframe{

    width:100%;

    height:360px;

    border:0;

    display:block;

}

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

@media(max-width:992px){

    .contacts-grid{

        grid-template-columns:1fr;

        gap:45px;

    }

    .map-wrapper{
        max-width:100%;
        justify-self:center;
    }

    .map{

        max-width:100%;

        transform:none;

        margin-bottom:0;

    }

}

@media(max-width:768px){

    .contacts{

        padding:44px 0 72px;

    }

    .contacts-grid{

        gap:35px;

    }

    .map iframe{

        height:300px;

    }

    .contacts-exterior{

        height:300px;

    }

}

/* Proporzioni identiche per i due marchi */
.logo-text span,
.footer-brand-name span{

    line-height:1.1;

    margin:0;

}

.logo-text strong,
.footer-brand-name strong{

    line-height:1.15;

    margin-top:0;

    transform:none;

    align-items:center;

    text-align:center;

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

.footer{

    background:var(--primary);

    color:#ffffff;

    padding:70px 0 0;

}

#contatti{

    scroll-margin-top:95px;

}

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

.footer-content{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    align-items:center;

}

/* ==========================================================
   BRAND
========================================================== */

.footer-brand{

    display:flex;

    align-items:center;

    gap:10px;

}

.footer-home-logo{

    width:250px;

    height:auto;

    display:block;

}

.map-directions{
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:0;
    padding:13px 18px;
    border:1px solid var(--secondary);
    border-radius:4px;
    color:var(--primary);
    background:#ffffff;
    font-family:"Inter", sans-serif;
    font-size:.78rem;
    font-weight:600;
    letter-spacing:1.1px;
    text-decoration:none;
    text-transform:uppercase;
    transition:background .25s ease, color .25s ease, transform .25s ease;
}

.map-directions:hover{
    background:var(--secondary);
    color:var(--primary);
    transform:translateY(-2px);
}

/* ==========================================================
   PRIVACY POLICY
========================================================== */
.privacy-page{
    min-height:100vh;
    margin:0;
    background:#eef1f4;
    color:#354052;
    font-family:"Inter", Arial, sans-serif;
}

.privacy-header{
    border-bottom:1px solid rgba(199,165,91,.72);
    background:var(--primary);
}

.privacy-header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:min(1120px, calc(100% - 48px));
    min-height:86px;
    margin:0 auto;
}

.privacy-brand{
    color:#fff;
    text-decoration:none;
}

.privacy-back,
.privacy-footer a{
    color:#fff;
    font-size:.78rem;
    font-weight:600;
    letter-spacing:.9px;
    text-decoration:none;
    text-transform:uppercase;
}

.privacy-back:hover,
.privacy-footer a:hover{
    color:var(--secondary);
}

.privacy-main{
    width:min(940px, calc(100% - 40px));
    margin:0 auto;
    padding:68px 0 54px;
}

.privacy-document{
    box-sizing:border-box;
    padding:56px 72px 66px;
    background:#fff;
    box-shadow:0 18px 42px rgba(15,35,60,.11);
}

.privacy-document-heading{
    margin-bottom:46px;
    padding-bottom:29px;
    border-bottom:1px solid rgba(199,165,91,.72);
}

.privacy-eyebrow{
    margin:0 0 13px;
    color:var(--secondary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:1.65px;
}

.privacy-document h1{
    margin:0 0 11px;
    color:var(--primary);
    font-family:"Cormorant Garamond", serif;
    font-size:3.55rem;
    font-weight:600;
    line-height:.95;
}

.privacy-document-heading > p:not(.privacy-eyebrow):not(.privacy-updated){
    margin:0;
    color:var(--primary);
    font-size:1rem;
}

.privacy-updated{
    margin:19px 0 0;
    color:var(--primary);
    font-size:.78rem;
}

.privacy-document section{
    margin:0 0 34px;
}

.privacy-document section:last-child{
    margin-bottom:0;
}

.privacy-document h2{
    margin:0 0 13px;
    padding-left:15px;
    border-left:3px solid var(--secondary);
    color:var(--primary);
    font-family:"Cormorant Garamond", serif;
    font-size:1.72rem;
    font-weight:600;
    line-height:1.05;
}

.privacy-document p,
.privacy-document li{
    color:var(--primary);
    font-size:.96rem;
    line-height:1.75;
}

.privacy-document p{
    margin:0 0 12px;
}

.privacy-document p:last-child{
    margin-bottom:0;
}

.privacy-document ul{
    margin:0 0 13px;
    padding-left:20px;
}

.privacy-document li{
    margin:0 0 7px;
    padding-left:5px;
}

.privacy-document a{
    color:var(--primary);
    font-weight:600;
    text-decoration-color:rgba(199,165,91,.85);
    text-underline-offset:3px;
}

.privacy-document a:hover{
    color:var(--secondary);
}

.privacy-footer{
    display:flex;
    justify-content:space-between;
    width:min(1120px, calc(100% - 48px));
    margin:0 auto;
    padding:0 0 30px;
    color:#617083;
    font-size:.78rem;
}

.privacy-footer a{
    color:var(--primary);
}

@media(max-width:680px){
    .privacy-header-inner{
        width:min(100% - 32px, 1120px);
        min-height:74px;
    }

    .privacy-back{
        font-size:.66rem;
    }

    .privacy-main{
        width:min(100% - 26px, 940px);
        padding:46px 0 30px;
    }

    .privacy-document{
        padding:35px 25px 40px;
    }

    .privacy-document-heading{
        margin-bottom:35px;
    }

    .privacy-eyebrow{
        max-width:100%;
        font-size:.68rem;
        line-height:1.5;
        letter-spacing:1.2px;
        white-space:normal;
        word-break:normal;
        overflow-wrap:break-word;
    }

    .privacy-document h1{
        font-size:2.75rem;
    }

    .privacy-document h2{
        font-size:1.52rem;
    }

    .privacy-document p,
    .privacy-document li{
        font-size:.91rem;
    }

    .privacy-footer{
        width:min(100% - 32px, 1120px);
        gap:15px;
        padding-bottom:24px;
    }
}

/* L'indirizzo occupa la stessa altezza della mappa: il suo centro
   resta quindi esattamente a meta' della mappa, senza spostamenti ottici. */
@media (min-width:993px){

    .contacts-grid{
        grid-template-columns:220px minmax(0, 410px) minmax(0, 410px);
        justify-content:center;
        gap:30px;
        align-items:stretch;
    }

    .contacts-grid--map-only{
        grid-template-columns:1fr;
        justify-items:center;
    }

    .contacts-info{
        grid-column:auto;
        height:360px;
        align-self:start;
        justify-content:center;
        gap:18px;
    }

    .map-wrapper{
        max-width:410px;
        justify-self:stretch;
    }

    .map{
        height:360px;
        align-self:stretch;
    }

    .map iframe{
        height:100%;
    }

}

.contacts-info .map-directions{
    white-space:nowrap;
    padding:11px 8px;
    font-size:.68rem;
    letter-spacing:.8px;
}

.footer-logo{

    width:58px;

    height:auto;

    display:block;

    flex-shrink:0;

    object-fit:contain;

}
.footer-brand-name{

    display:flex;

    flex-direction:column;

    align-items:center;

    text-align:center;

    gap:0;

}

.footer-brand-name span{

    color:#c7a55b;

    font-size:.9rem;

    line-height:1.1;

    margin-bottom:0;

}

.footer-brand-name strong{

    color:#ffffff;

    font-family:'Cormorant Garamond', serif;

    font-size:1.4rem;

    font-weight:600;

    line-height:1.7;

    letter-spacing:2px;

}

/* ==========================================================
   CONTATTI
========================================================== */

.footer-contacts{

    min-width:0;

}

.footer-contacts h3{

    color:#c7a55b;

    font-family:'Cormorant Garamond', serif;

    font-size:1.8rem;

    font-weight:500;

    margin:0 0 20px;

}

.footer-contact,
.footer-address{

    display:flex;

    align-items:flex-start;

    gap:14px;

    margin-bottom:14px;

    color:rgba(255,255,255,.88);

    text-decoration:none;

    font-size:.98rem;

    line-height:1.6;

}

.footer-contact{

    transition:.3s ease;

}

.footer-contact:hover{

    color:#c7a55b;

}

.footer-icon{

    width:22px;

    flex-shrink:0;

    color:#c7a55b;

    font-size:1.15rem;

    line-height:1.5;

    text-align:center;

}

/* ==========================================================
   PARTE INFERIORE
========================================================== */

.footer-bottom{

    margin-top:55px;

    padding:18px 0;

    border-top:1px solid rgba(199,165,91,.25);

}

.footer-bottom .container{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:30px;

}

.footer-bottom span,
.footer-bottom a{

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

    font-size:.82rem;

    text-decoration:none;

}

.footer-bottom a{

    transition:.3s ease;

}

.footer-bottom a:hover{

    color:#c7a55b;

}

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

@media(max-width:768px){

    .footer{

        padding:55px 0 0;

    }

    .footer-content{

        grid-template-columns:1fr;

        gap:45px;

    }

    .footer-bottom .container{

        flex-direction:column;

        align-items:flex-start;

        gap:0;

    }

}

/* Regolazioni finali dei marchi */
.logo-text strong{

    line-height:1.08;

    margin-top:2px;

}

.footer-brand-name span{

    line-height:1.1;

    margin:0;

}

.footer-brand-name strong{

    line-height:1.08;

    margin-top:6px;

    transform:none;

}

/* ==========================================================
   HERO DIVISA E FONDO AVORIO
========================================================== */

.areas,
.professionals,
.consultation,
.contacts{

    background:var(--paper);

}

.contacts .section-header{

    margin-bottom:36px;

}

.hero--split{

    background:var(--paper);

    overflow:hidden;

}

.hero--split .container{

    width:100%;

    max-width:none;

}

.hero--split .hero-grid{

    grid-template-columns:40% 60%;

    gap:0;

}

.hero--split .hero-left{

    padding:0 clamp(30px, 4.5vw, 78px);

    background:var(--paper);

    position:relative;

    z-index:2;

    align-items:center;

    text-align:center;

}

.hero--split .hero-brand{

    margin-bottom:28px;

    justify-content:center;

}

.hero--split .hero-small{

    color:var(--secondary);

    text-shadow:none;

}

.hero--split .hero-logo{

    width:230px;

    margin:0;

}

.hero--split h1{

    color:var(--primary);

    font-size:clamp(2.8rem, 4vw, 3.55rem);

}

.hero--split .hero-description{

    width:100%;

    max-width:500px;

    margin-left:0;

    color:#4b5563;

    text-align:center;

}

.hero--split .hero-button{

    margin-left:0;

    background:transparent;

}

.hero--split .hero-button:hover{

    background:var(--secondary);

    color:var(--primary);

}

/* Pulsanti consulenza coordinati */
.hero--split .hero-button,
.banner-consultation-link{

    padding:16px 32px;

    border:1px solid var(--secondary);

    border-radius:4px;

    background:#ffffff;

    color:var(--primary);

    font-size:.9rem;

    font-weight:700;

    letter-spacing:1.2px;

    text-transform:uppercase;

    transform:translateY(0);

    transition:background .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;

}

.hero--split .hero-button{

    padding:14px 28px;

    font-size:.84rem;

}

.hero--split .hero-button:hover,
.banner-consultation-link:hover{

    background:var(--secondary);

    color:var(--primary);

    transform:translateY(-3px);

    box-shadow:0 10px 24px rgba(15,35,60,.22);

}

.hero--split .hero-right{

    display:block;

    overflow:hidden;

}

.hero--split .hero-right::before{

    content:"";

    position:absolute;

    inset:0 auto 0 0;

    width:72px;

    background:var(--paper);

    clip-path:polygon(0 0, 0 100%, 100% 100%);

    z-index:1;

    pointer-events:none;

}

.hero--split .hero-right img{

    width:100%;

    height:100%;

    max-width:none;

    object-fit:cover;

    object-position:center;

}

@media (max-width:1100px){

    .hero--split .hero-grid{

        grid-template-columns:43% 57%;

    }

    .hero--split .hero-logo{

        width:190px;

    }

    .hero--split .hero-brand{

        gap:11px;

    }

}

/* Evita la sottile giunzione verticale tra fondo e foto sui tablet. */
@media (min-width:769px) and (max-width:1100px){
    .hero--split .hero-left{
        box-shadow:2px 0 0 var(--paper);
    }
}

@media (max-width:768px){

    .hero--split{

        height:auto;

        min-height:0;

    }

    .hero--split .hero-grid{

        grid-template-columns:1fr;

    }

    .hero--split .hero-left{

        min-height:500px;

        padding:70px 34px 56px;

    }

    .hero--split .hero-right{

        height:48vh;

        min-height:300px;

    }

    .hero--split .hero-logo{

        width:205px;

    }

    .hero--split .hero-right::before{

        inset:0 0 auto 0;

        width:auto;

        height:46px;

        clip-path:polygon(0 0, 100% 0, 0 100%);

    }

}

/* ==========================================================
   PROFESSIONISTI — LAYOUT EDITORIALE
========================================================== */

@media (min-width:1201px){

    .professional,
    .professional-reverse{

        grid-template-columns:360px minmax(0, 1fr);

        gap:0;

        align-items:center;

        margin-bottom:62px;

    }

    .professional-reverse{

        grid-template-columns:minmax(0, 1fr) 360px;

    }

    .professional-image{

        width:330px;

        height:445px;

        align-self:start;

        margin:54px 0 0;

        overflow:hidden;

        border-radius:0;

        box-shadow:none;

        z-index:2;

    }

    /* Le schede con foto a sinistra sovrappongono il riquadro come Alessandra. */
    .professional:not(.professional-reverse) .professional-image{
        justify-self:end;
    }

    .professional-image::before{

        display:none;

    }

    .professional-image::after{

        display:none;

    }

    .professional-image img{

        width:100%;

        height:100%;

        border-radius:inherit;

        object-position:center top;

    }

    .professional-content{

        max-width:690px;

        margin-left:-36px;

        padding:54px 58px 54px 94px;

        background:#e7eef5;

        position:relative;

        z-index:1;

    }

    .professional-content::before{

        display:none;

    }

    .professional-reverse .professional-content{

        margin:0 -36px 0 auto;

        padding:54px 94px 54px 58px;

    }

    .professional:hover .professional-image img{

        transform:scale(1.04);

    }

}

/* ==========================================================
   PROVA NUOVO LOGO — SOLO HOME
========================================================== */

.hero--split .hero-brand{
    align-items:center;
    gap:8px;
}

.hero--split .hero-logo--new{
    width:148px;
    height:148px;
    margin:0;
    object-fit:contain;
}

.hero-brand-text{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    margin:0;
}

.hero-brand-text span{
    color:var(--secondary);
    font-family:'Inter', sans-serif;
    font-size:.88rem;
    font-weight:600;
    letter-spacing:2.2px;
    line-height:1.1;
}

.hero-brand-text strong{
    margin-top:5px;
    color:var(--primary);
    font-family:'Cormorant Garamond', serif;
    font-size:2.15rem;
    font-weight:600;
    letter-spacing:2px;
    line-height:1;
}

@media (max-width:600px){
    .quote-banner{
        background-position:19% center;
    }

    .hero--split .hero-brand{
        gap:8px;
        margin-bottom:14px;
    }

    .hero--split .hero-logo--new{
        width:112px;
        height:112px;
    }

    .hero-brand-text span{
        font-size:.67rem;
        letter-spacing:1.6px;
    }

    .hero-brand-text strong{
        margin-top:3px;
        font-size:1.58rem;
        letter-spacing:1.3px;
    }

    .hero--split .hero-left{
        min-height:0;
        height:auto;
        padding:18px 20px 16px;
    }

    .hero--split .hero-description{
        max-width:340px;
        font-size:.92rem;
        line-height:1.55;
    }

    .hero--split .hero-button{
        margin-top:14px;
        padding:11px 20px;
    }

    .hero--split{
        height:calc(100vh - 78px);
        height:calc(100svh - 78px);
        min-height:0;
    }

    .hero--split .hero-grid{
        height:100%;
        grid-template-rows:auto minmax(0, 1fr);
    }

    .hero--split .hero-right{
        height:auto;
        min-height:0;
    }

    .hero--split .hero-right img{
        height:100%;
        aspect-ratio:auto;
        object-fit:cover;
    }

    .area-feature-heading{
        gap:12px;
    }

    .area-feature-icon{
        width:65px;
        height:55px;
        padding:0;
        border-radius:0;
        background:transparent;
        box-shadow:none;
    }

    .area-feature-icon img{
        width:55px;
        height:55px;
        filter:drop-shadow(0 6px 10px rgba(199,165,91,.22));
    }
}

/* Mantiene coerente l'altezza delle schede con le fotografie. */
@media (min-width:1201px){
    .professional-content{
        box-sizing:border-box;
        min-height:500px;
    }
}

/* ==========================================================
   MONITOR DESKTOP AMPI
   Mantiene il sito proporzionato sui monitor Full HD e superiori.
========================================================== */
@media (min-width:1440px){
    .container{
        width:min(1440px, calc(100% - 96px));
    }

    header .container{
        width:calc(100% - clamp(64px, 6vw, 128px));
        max-width:none;
    }

    #site-navigation{
        margin-left:auto;
    }

    #site-navigation ul{
        justify-content:flex-end;
        gap:clamp(34px, 2.2vw, 52px);
    }
}

/* Arrivo uniforme dei collegamenti interni sotto l'intestazione fissa. */
#home,
#attivita,
#professionisti,
#studio,
#consulenza,
#dove-trovarci,
#contatti{
    scroll-margin-top:95px;
}

/* Su computer l'arrivo salta il divisorio e mostra subito i contenuti. */
@media (min-width:1101px){
    #dove-trovarci,
    #contatti{
        scroll-margin-top:72px;
    }
}

@media (max-width:1100px){
    #home,
    #attivita,
    #professionisti,
    #studio,
    #consulenza,
    #dove-trovarci,
    #contatti{
        scroll-margin-top:78px;
    }

    #dove-trovarci,
    #contatti{
        scroll-margin-top:42px;
    }

}

/* Correzioni finali per Safari/iPhone. Lo sfondo fisso del banner viene
   disattivato per evitare l'ingrandimento sfocato tipico di iOS. */
@media (max-width:600px){
    .studio-quote{
        padding:24px 0;
    }

    .studio-quote .container{
        width:min(88%, 520px);
    }

    .studio-quote blockquote{
        font-size:1.28rem;
        line-height:1.22;
    }

    .studio-quote cite{
        margin-top:10px;
        font-size:.95rem;
    }

    .quote-banner{
        --banner-parallax-y:0px;
        background-attachment:scroll;
        background-position:center, 19% calc(50% + var(--banner-parallax-y));
        background-size:cover, auto calc(100% + 130px);
    }

    /* L'intera prima vista resta occupata da intestazione e home. */
    .hero--split{
        height:calc(100vh - 78px + 80px);
        height:calc(100svh - 78px + 80px);
        min-height:calc(100svh - 78px + 80px);
    }

    .hero--split .hero-grid{
        grid-template-rows:clamp(275px, 34svh, 300px) minmax(0, 1fr);
    }

    .hero--split .hero-left{
        height:100%;
        padding:14px 18px 12px;
    }

    .hero--split .hero-brand{
        margin-bottom:8px;
    }

    .hero--split .hero-description{
        display:block;
        max-width:330px;
        margin:0 auto;
        font-size:.82rem;
        line-height:1.42;
        text-align:center;
    }

    .hero--split .hero-button{
        display:inline-flex;
        margin-top:10px;
        padding:9px 15px;
        font-size:.7rem;
    }

    .areas-intro{
        text-align:center;
        text-align-last:center;
    }

    .area-feature-heading{
        gap:0;
    }

    .area-feature-icon{
        width:88px;
        height:80px;
    }

    .area-feature-icon img{
        width:80px;
        height:80px;
    }

    .professional-toggle,
    .civil-more-toggle{
        border-color:var(--secondary);
        background:var(--secondary);
        color:var(--primary);
    }

    .professional-toggle:hover,
    .professional-toggle:focus-visible,
    .civil-more-toggle:hover,
    .civil-more-toggle:focus-visible{
        border-color:var(--secondary);
        background:var(--secondary);
        color:var(--primary);
    }
}
/* Mantiene nitide le fotografie dei professionisti durante l'interazione. */
.professional .professional-image img,
.professional:hover .professional-image img{
    transform:none !important;
    transition:none;
}

/* Stato accessibile del modulo di consulenza e campo antispam invisibile. */
.form-honeypot{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
    clip-path:inset(50%) !important;
    white-space:nowrap !important;
}

.consultation-button:disabled{
    cursor:wait;
    opacity:.68;
}

.consultation-form-status{
    margin:18px 0 0;
    padding:12px 14px;
    border-left:3px solid var(--primary);
    background:rgba(30,48,80,.07);
    color:var(--primary);
    line-height:1.5;
}

.consultation-form-status.is-success{
    border-left-color:#287a4b;
    background:#edf8f1;
    color:#185c36;
}

.consultation-form-status.is-error{
    border-left-color:#a53a32;
    background:#fff1ef;
    color:#7f2923;
}