/* ========================================
   HEADER.CSS
   Header fisso + stati scroll (top/scrolled/hidden)
   ======================================== */

.site-header{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--nav-h);
    z-index: 1050;
    transform: translateY(0);
    transition: transform .25s ease, background-color .25s ease, box-shadow .25s ease;
}

.site-header.is-hidden{
    transform: translateY(-110%);
}

.site-header.is-top{
    background: transparent;
    box-shadow: none;
}

.site-header.is-scrolled{
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(0.5rem);
    box-shadow: var(--shadow-soft);
}

/* ========================================
   MOBILE: header sempre bianco
   ======================================== */
@media (max-width: 74.99875rem){
    .site-header{
        background: #fff;
    }

    .site-header.is-top{
        background: #fff;
    }
}

/* ========================================
   MOBILE: quando il menu offcanvas è aperto
   Estendi l'header a full viewport, ma SOLO temporaneamente
   ======================================== */
@media (max-width: 74.99875rem){
    .site-header.is-menu-open{
        height: 100dvh;
        background: #fff;
        box-shadow: none;
    }
}

/* ========================================
   Pulsante telefono
   Mobile: icona sempre visibile accanto al menu
   Desktop: numero per esteso nella navbar
   ======================================== */
.header-phone{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999rem;
    color: #fff;
    background: var(--c-primary);
    text-decoration: none;
    box-shadow: 0 0.125rem 0.5rem rgba(44,158,175,0.35);
    transition: transform .2s ease, box-shadow .2s ease;
}

.header-phone:hover,
.header-phone:focus-visible{
    color: #fff;
    transform: scale(1.05);
    box-shadow: 0 0.25rem 0.75rem rgba(44,158,175,0.45);
}

.header-phone .material-symbols-outlined{
    font-size: 1.375rem;
    line-height: 1;
}

.header-phone-link{
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    font-weight: 600;
    color: var(--c-primary);
    padding: 0.4rem 0.6rem;
    border-radius: 0.5rem;
    transition: background-color .2s ease, color .2s ease;
}

.header-phone-link:hover,
.header-phone-link:focus-visible{
    color: var(--c-primary);
    background-color: rgba(44, 158, 175, 0.08);
}

.btn-header-cta {
    padding: 0.55rem 1.25rem !important;
    font-size: 0.9375rem;
    font-weight: 600;
}

/* ========================================
   Offset contenuti sotto header fisso
   ======================================== */
.page-offset{
    padding-top: calc(var(--nav-h) + 1rem);
}