/* ==========================================================
   ABDELZAHER LEGAL
   Custom Header v2
   Graphite Luxury System
   ========================================================== */


/* ----------------------------------------------------------
   HEADER ROOT
---------------------------------------------------------- */

.az-site-header {
    --az-header-border: rgba(255,255,255,.13);
    --az-header-soft-border: rgba(255,255,255,.075);
    --az-header-highlight: rgba(255,255,255,.22);

    position: relative;
    z-index: 9990;

    width: 100%;

    color: var(--az-ivory);

    background:
        linear-gradient(
            180deg,
            #30363d 0%,
            #272d33 42%,
            #20252a 72%,
            #1a1e22 100%
        );

    border-bottom: 1px solid var(--az-header-border);

    box-shadow:
        0 12px 38px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.035);

    transition:
        background var(--az-transition),
        box-shadow var(--az-transition),
        transform var(--az-transition);
}


/* Metallic lower edge */

.az-site-header::after {
    content: "";

    position: absolute;

    bottom: -1px;
    right: 0;

    width: 100%;
    height: 1px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(199,203,208,.20) 16%,
            rgba(255,255,255,.72) 50%,
            rgba(199,203,208,.20) 84%,
            transparent 100%
        );
}


/* ----------------------------------------------------------
   STICKY STATE
---------------------------------------------------------- */

.az-site-header.az-is-sticky {
    position: fixed;

    top: 0;
    left: 0;
    right: 0;

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

    background:
        linear-gradient(
            180deg,
            rgba(47,53,60,.97) 0%,
            rgba(32,37,42,.97) 100%
        );

    box-shadow:
        0 16px 48px rgba(0,0,0,.40),
        inset 0 1px 0 rgba(255,255,255,.04);
}


/* WordPress admin bar */

body.admin-bar .az-site-header.az-is-sticky {
    top: 32px;
}


/* ----------------------------------------------------------
   TOP BAR
---------------------------------------------------------- */

.az-topbar {
    min-height: 36px;

    display: flex;
    align-items: center;

    background:
        linear-gradient(
            90deg,
            #20252a 0%,
            #2b3137 50%,
            #20252a 100%
        );

    border-bottom: 1px solid var(--az-header-soft-border);

    box-shadow:
        inset 0 -1px 0 rgba(255,255,255,.025);

    font-size: 12px;
}


.az-topbar-inner {
    min-height: 36px;

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

    gap: 26px;
}


.az-topbar-contact {
    display: flex;
    align-items: center;

    gap: 13px;
}


.az-topbar-link {
    display: inline-flex;
    align-items: center;

    gap: 7px;

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

    text-decoration: none;

    transition:
        color var(--az-transition-fast),
        opacity var(--az-transition-fast);
}


.az-topbar-link:hover {
    color: #ffffff;
}


.az-contact-icon {
    color: #dbe0e5;
}


.az-topbar-separator {
    width: 1px;
    height: 13px;

    background:
        rgba(255,255,255,.22);
}


.az-topbar-location {
    display: flex;
    align-items: center;

    gap: 8px;

    color: rgba(255,255,255,.76);
}


.az-location-icon {
    font-size: 7px;

    color: #caa777;
}


/* ----------------------------------------------------------
   MAIN HEADER
---------------------------------------------------------- */

.az-header-main {
    position: relative;

    min-height: 108px;

    display: flex;
    align-items: center;
}


.az-header-inner {
    display: grid;

    grid-template-columns:
        minmax(360px, 1.25fr)
        minmax(500px, 2fr)
        auto;

    align-items: center;

    gap: 34px;
}


/* ----------------------------------------------------------
   BRAND
---------------------------------------------------------- */

.az-brand {
    min-width: 0;

    display: flex;
    align-items: center;

    gap: 17px;

    color: inherit;

    text-decoration: none;
}


.az-brand:hover {
    color: inherit;
}


/* Portrait housing */

.az-brand-photo-shell {
    position: relative;

    flex: 0 0 76px;

    width: 76px;
    height: 76px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #f4f5f6 0%,
            #c7ccd1 23%,
            #8f979f 42%,
            #59616a 56%,
            #bfc5cb 76%,
            #ffffff 100%
        );

    padding: 3px;

    box-shadow:
        0 8px 28px rgba(0,0,0,.36),
        0 0 0 1px rgba(255,255,255,.06),
        inset 0 1px 1px rgba(255,255,255,.88);
}


.az-brand-photo-shell::before {
    content: "";

    position: absolute;

    inset: -5px;

    border-radius: inherit;

    border: 1px solid rgba(220,225,230,.28);

    transition:
        transform var(--az-transition),
        border-color var(--az-transition),
        box-shadow var(--az-transition);
}


.az-brand:hover .az-brand-photo-shell::before {
    transform: scale(1.045);

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

    box-shadow:
        0 0 20px rgba(255,255,255,.08);
}


.az-brand-photo {
    position: relative;

    z-index: 2;

    display: block;

    width: 100%;
    height: 100%;

    border-radius: 50%;

    object-fit: cover;
    object-position: center top;

    background: #22272c;
}


.az-brand-photo-placeholder {
    position: relative;

    z-index: 2;

    width: 100%;
    height: 100%;

    display: grid;
    place-items: center;

    border-radius: 50%;

    color: #ffffff;

    background:
        radial-gradient(
            circle at 35% 25%,
            #69727b,
            #30363d 55%,
            #1e2328 100%
        );

    font-size: 20px;
    font-weight: 800;

    text-shadow:
        0 1px 3px rgba(0,0,0,.40);
}


.az-photo-metal-ring {
    position: absolute;

    inset: 0;

    z-index: 3;

    border-radius: inherit;

    pointer-events: none;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.44),
        inset 0 0 12px rgba(255,255,255,.08);
}


/* ----------------------------------------------------------
   BRAND TYPOGRAPHY
---------------------------------------------------------- */

.az-brand-copy {
    min-width: 0;

    display: flex;
    flex-direction: column;

    line-height: 1.28;
}


.az-brand-kicker {
    margin-bottom: 2px;

    color: #d7dce1;

    font-size: 11px;

    font-weight: 600;

    letter-spacing: .035em;
}


.az-brand-name {
    color: #ffffff;

    font-size: clamp(20px, 1.4vw, 25px);

    font-weight: 800;

    white-space: nowrap;

    text-shadow:
        0 1px 3px rgba(0,0,0,.26);
}


.az-brand-academic {
    margin-top: 5px;

    color: #f2f3f4;

    font-size: 12.5px;

    font-weight: 700;
}


.az-brand-university {
    margin-top: 2px;

    color: #c8cdd2;

    font-size: 11px;

    font-weight: 500;
}


.az-brand-legal {
    width: fit-content;

    margin-top: 5px;

    padding-bottom: 1px;

    color: #e2c79d;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: .01em;
}


/* ----------------------------------------------------------
   DESKTOP NAV
---------------------------------------------------------- */

.az-desktop-nav {
    display: flex;
    justify-content: center;
}


.az-nav-list {
    margin: 0;
    padding: 0;

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

    gap: 5px;

    list-style: none;
}


.az-nav-list > li {
    position: relative;

    margin: 0;
}


.az-nav-list > li > a {
    position: relative;

    display: flex;
    align-items: center;

    min-height: 44px;

    padding: 8px 11px;

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

    text-decoration: none;

    white-space: nowrap;

    font-size: 12px;

    font-weight: 700;

    text-shadow:
        0 1px 2px rgba(0,0,0,.18);

    transition:
        color var(--az-transition-fast),
        background var(--az-transition-fast),
        transform var(--az-transition-fast);
}


.az-nav-list > li > a::before {
    content: "";

    position: absolute;

    inset: 4px 2px;

    z-index: -1;

    border-radius: 6px;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.065),
            rgba(255,255,255,.018)
        );

    opacity: 0;

    transition:
        opacity var(--az-transition-fast);
}


.az-nav-list > li > a::after {
    content: "";

    position: absolute;

    right: 50%;
    bottom: 3px;

    width: 0;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #eef1f4,
            transparent
        );

    transform:
        translateX(50%);

    transition:
        width var(--az-transition);
}


.az-nav-list > li > a:hover,
.az-nav-list > li.current-menu-item > a {
    color: #ffffff;
}


.az-nav-list > li > a:hover::before,
.az-nav-list > li.current-menu-item > a::before {
    opacity: 1;
}


.az-nav-list > li > a:hover::after,
.az-nav-list > li.current-menu-item > a::after {
    width: calc(100% - 18px);
}


/* ----------------------------------------------------------
   DESKTOP HEADER ACTIONS
---------------------------------------------------------- */

.az-header-actions {
    display: flex;
    align-items: center;

    gap: 11px;
}


.az-whatsapp-button {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    min-height: 46px;

    padding: 8px 13px;

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

    border-radius: 7px;

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

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.075),
            rgba(255,255,255,.028)
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06);

    text-decoration: none;

    font-size: 11px;

    font-weight: 700;

    transition:
        border-color var(--az-transition-fast),
        background var(--az-transition-fast),
        transform var(--az-transition-fast),
        box-shadow var(--az-transition-fast);
}


.az-whatsapp-button:hover {
    color: #ffffff;

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

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.11),
            rgba(255,255,255,.045)
        );

    transform:
        translateY(-1px);

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


.az-wa-dot {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #69bf88;

    box-shadow:
        0 0 0 3px rgba(105,191,136,.12),
        0 0 9px rgba(105,191,136,.18);
}


.az-site-header .az-consultation-button {
    min-height: 46px;

    padding-inline: 17px;

    font-size: 12px;
}


.az-button-arrow {
    transition:
        transform var(--az-transition);
}


.az-site-header .az-consultation-button:hover .az-button-arrow {
    transform:
        translateX(-3px);
}


/* ----------------------------------------------------------
   MOBILE TOGGLE
---------------------------------------------------------- */

.az-mobile-toggle {
    width: 46px;
    height: 46px;

    display: none;

    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 5px;

    padding: 0;

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

    border-radius: 8px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.11),
            rgba(255,255,255,.025)
        );

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

    cursor: pointer;
}


.az-mobile-toggle span {
    width: 20px;
    height: 1.5px;

    display: block;

    background: #ffffff;

    transition:
        transform var(--az-transition),
        opacity var(--az-transition);
}


/* ----------------------------------------------------------
   MOBILE OVERLAY
---------------------------------------------------------- */

.az-mobile-overlay {
    position: fixed;

    inset: 0;

    z-index: 9997;

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

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

    opacity: 0;

    transition:
        opacity var(--az-transition);
}


.az-mobile-overlay.az-visible {
    opacity: 1;
}


/* ----------------------------------------------------------
   MOBILE OFFCANVAS PANEL
---------------------------------------------------------- */

.az-mobile-panel {
    position: fixed;

    z-index: 9999;

    top: 0;
    right: 0;

    width: min(90vw, 390px);
    height: 100dvh;

    padding: 26px;

    overflow-y: auto;

    color: var(--az-ivory);

    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(115,125,135,.20),
            transparent 38%
        ),
        linear-gradient(
            160deg,
            #343a41 0%,
            #262c31 38%,
            #181c20 100%
        );

    border-left:
        1px solid rgba(255,255,255,.16);

    box-shadow:
        -20px 0 60px rgba(0,0,0,.46),
        inset 1px 0 0 rgba(255,255,255,.035);

    transform:
        translateX(105%);

    visibility: hidden;

    transition:
        transform 420ms cubic-bezier(.2,.8,.2,1),
        visibility 420ms;
}


.az-mobile-panel.az-open {
    transform:
        translateX(0);

    visibility:
        visible;
}


.az-mobile-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 18px;
}


.az-mobile-identity {
    display: flex;
    flex-direction: column;

    gap: 5px;
}


.az-mobile-title {
    color: #ffffff;

    font-size: 18px;

    font-weight: 800;
}


.az-mobile-identity strong {
    color: #e8ebee;

    font-size: 13px;

    font-weight: 700;
}


.az-mobile-identity > span:last-child {
    color: #e1c69d;

    font-size: 12px;

    font-weight: 700;
}


.az-mobile-close {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    display: grid;
    place-items: center;

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

    border-radius: 50%;

    color: #ffffff;

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

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06);

    cursor: pointer;

    font-size: 25px;

    line-height: 1;
}


.az-mobile-divider {
    width: 100%;
    height: 1px;

    margin:
        24px 0 16px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.28),
            transparent
        );
}


/* ----------------------------------------------------------
   MOBILE NAV
---------------------------------------------------------- */

.az-mobile-nav-list,
.az-mobile-nav .az-nav-list {
    margin: 0;
    padding: 0;

    display: flex;
    flex-direction: column;

    list-style: none;
}


.az-mobile-nav-list li,
.az-mobile-nav .az-nav-list li {
    margin: 0;

    border-bottom:
        1px solid rgba(255,255,255,.09);
}


.az-mobile-nav-list a,
.az-mobile-nav .az-nav-list a {
    display: flex;

    padding: 14px 3px;

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

    text-decoration: none;

    font-size: 14px;

    font-weight: 700;

    transition:
        color var(--az-transition-fast),
        padding-right var(--az-transition-fast);
}


.az-mobile-nav-list a:hover,
.az-mobile-nav .az-nav-list a:hover {
    color: #ffffff;

    padding-right: 7px;
}


/* ----------------------------------------------------------
   MOBILE ACTIONS
---------------------------------------------------------- */

.az-mobile-actions {
    margin-top: 26px;

    display: grid;

    gap: 10px;
}


.az-mobile-consultation {
    width: 100%;
}


.az-mobile-whatsapp {
    min-height: 50px;

    display: grid;
    place-items: center;

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

    border-radius: 7px;

    color: #ffffff;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.075),
            rgba(255,255,255,.03)
        );

    text-decoration: none;

    font-size: 13px;

    font-weight: 700;
}


/* ----------------------------------------------------------
   MOBILE CONTACT
---------------------------------------------------------- */

.az-mobile-contact {
    margin-top: 28px;

    display: flex;
    flex-direction: column;

    gap: 7px;

    color: #c2c8ce;

    font-size: 12px;
}


.az-mobile-contact a {
    width: fit-content;

    color: #f0f2f4;

    text-decoration: none;

    font-weight: 700;
}


/* Lock document when menu open */

body.az-menu-open {
    overflow: hidden;
}


/* ----------------------------------------------------------
   HEADER SPACER
---------------------------------------------------------- */

.az-header-spacer {
    display: none;
}


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

@media (max-width: 1280px) {

    .az-header-inner {
        grid-template-columns:
            minmax(320px, 1.2fr)
            1.7fr
            auto;

        gap: 20px;
    }


    .az-nav-list > li > a {
        padding-inline: 8px;

        font-size: 11.5px;
    }


    .az-whatsapp-button {
        display: none;
    }
}



@media (max-width: 1080px) {

    .az-header-main {
        min-height: 94px;
    }


    .az-header-inner {
        grid-template-columns:
            1fr auto auto;
    }


    .az-desktop-nav {
        display: none;
    }


    .az-whatsapp-button {
        display: none;
    }


    .az-mobile-toggle {
        display: flex;
    }


    .az-brand-photo-shell {
        flex-basis: 64px;

        width: 64px;
        height: 64px;
    }
}



@media (max-width: 767px) {

    .az-topbar {
        display: none;
    }


    .az-header-main {
        min-height: 84px;
    }


    .az-header-inner {
        grid-template-columns:
            minmax(0,1fr) auto;

        gap: 11px;
    }


    .az-header-actions {
        display: none;
    }


    .az-brand {
        gap: 10px;
    }


    .az-brand-photo-shell {
        flex-basis: 55px;

        width: 55px;
        height: 55px;
    }


    .az-brand-kicker,
    .az-brand-university {
        display: none;
    }


    .az-brand-name {
        font-size: 15px;

        white-space: normal;
    }


    .az-brand-academic {
        margin-top: 3px;

        display: block;

        color: #f3f4f5;

        font-size: 10px;
    }


    .az-brand-legal {
        margin-top: 3px;

        color: #e4caa2;

        font-size: 10px;
    }


    .az-mobile-toggle {
        width: 42px;
        height: 42px;
    }
}



@media (max-width: 420px) {

    .az-brand-photo-shell {
        flex-basis: 49px;

        width: 49px;
        height: 49px;
    }


    .az-brand-name {
        font-size: 13px;
    }


    .az-brand-academic,
    .az-brand-legal {
        font-size: 9px;
    }
}



@media (max-width: 782px) {

    body.admin-bar .az-site-header.az-is-sticky {
        top: 46px;
    }
}


/* ----------------------------------------------------------
   REDUCED MOTION
---------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

    .az-site-header,
    .az-brand-photo-shell::before,
    .az-nav-list > li > a,
    .az-whatsapp-button,
    .az-button-arrow,
    .az-mobile-panel,
    .az-mobile-overlay,
    .az-mobile-nav-list a,
    .az-mobile-nav .az-nav-list a {
        transition: none !important;
    }
}

/* ==========================================================
   ABDELZAHER LEGAL
   HEADER V3 — DARK TITANIUM 3D OVERRIDES
   ========================================================== */


/* ==========================================================
   1. MAIN HEADER — 3D TITANIUM SURFACE
   ========================================================== */

.az-site-header {
    position: relative;

    background:
        radial-gradient(
            ellipse at 50% -40%,
            rgba(255,255,255,.15) 0%,
            rgba(255,255,255,.045) 28%,
            transparent 55%
        ),
        linear-gradient(
            180deg,
            #555d65 0%,
            #3b4249 8%,
            #292f35 30%,
            #20252a 58%,
            #171b1f 82%,
            #111417 100%
        ) !important;

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

    border-bottom:
        1px solid rgba(0,0,0,.85);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.20),
        inset 0 -1px 0 rgba(255,255,255,.05),
        inset 0 -14px 26px rgba(0,0,0,.18),
        0 8px 22px rgba(0,0,0,.30) !important;
}


/* metallic highlight line */

.az-site-header::before {
    content: "";

    position: absolute;

    top: 0;
    right: 0;

    width: 100%;
    height: 1px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(255,255,255,.18) 15%,
            rgba(255,255,255,.68) 50%,
            rgba(255,255,255,.18) 85%,
            transparent 100%
        );
}


/* lower metallic rim */

.az-site-header::after {
    content: "";

    position: absolute;

    right: 0;
    bottom: -2px;

    width: 100%;
    height: 2px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            #111417 0%,
            #7b858e 17%,
            #d4d9dd 50%,
            #7b858e 83%,
            #111417 100%
        );

    opacity: .65;

    box-shadow:
        0 2px 8px rgba(0,0,0,.40);
}


/* ==========================================================
   2. TOP BAR — MATCH THE METAL
   ========================================================== */

.az-topbar {
    background:
        linear-gradient(
            180deg,
            #2b3136 0%,
            #1a1e22 100%
        ) !important;

    border-bottom:
        1px solid rgba(255,255,255,.09);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        inset 0 -1px 0 rgba(0,0,0,.38);
}


/* ==========================================================
   3. BRAND / DOCTOR IDENTITY
   ========================================================== */

.az-brand-kicker {
    color: #e5e8ea !important;
}


.az-brand-name {
    color: #ffffff !important;

    text-shadow:
        0 1px 2px rgba(0,0,0,.65),
        0 0 10px rgba(255,255,255,.035);
}


.az-brand-academic {
    color: #f2f3f4 !important;
}


.az-brand-university {
    color: #d2d6da !important;
}


.az-brand-legal {
    color: #e7c998 !important;

    text-shadow:
        0 1px 2px rgba(0,0,0,.55);
}


/* ==========================================================
   4. PORTRAIT / LOGO FRAME — TRUE METALLIC DEPTH
   ========================================================== */

.az-brand-photo-shell {
    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #aeb6be 13%,
            #555e66 28%,
            #d9dde1 43%,
            #6d767f 58%,
            #30363c 73%,
            #c7ccd1 87%,
            #ffffff 100%
        ) !important;

    box-shadow:
        0 8px 18px rgba(0,0,0,.48),
        inset 0 2px 1px rgba(255,255,255,.85),
        inset 0 -2px 3px rgba(0,0,0,.55),
        0 0 0 1px rgba(255,255,255,.20) !important;
}


/* ==========================================================
   5. NAVIGATION — BRIGHTER & CLEANER
   ========================================================== */

.az-nav-list > li > a {
    color: #eceeef !important;

    text-shadow:
        0 1px 2px rgba(0,0,0,.65);
}


.az-nav-list > li > a:hover,
.az-nav-list > li.current-menu-item > a {
    color: #ffffff !important;
}


/* ==========================================================
   6. 3D METALLIC CONSULTATION BUTTON
   Fixes the unwanted blue text too
   ========================================================== */

.az-site-header .az-btn-metal,
.az-site-header a.az-btn-metal,
.az-site-header .az-consultation-button {
    position: relative;

    color: #171a1d !important;

    border:
        1px solid rgba(255,255,255,.68) !important;

    background:
        linear-gradient(
            180deg,
            #f2f3f4 0%,
            #d4d8dc 9%,
            #a8afb6 36%,
            #737c84 51%,
            #aab1b7 67%,
            #e2e5e8 100%
        ) !important;

    text-shadow:
        0 1px 0 rgba(255,255,255,.65);

    box-shadow:
        inset 0 2px 1px rgba(255,255,255,.95),
        inset 0 -3px 3px rgba(37,43,48,.45),
        inset 1px 0 1px rgba(255,255,255,.35),
        0 5px 0 #454c53,
        0 8px 16px rgba(0,0,0,.38) !important;

    transform:
        translateY(-2px);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        filter .18s ease;
}


.az-site-header .az-btn-metal:hover,
.az-site-header .az-consultation-button:hover {
    color: #0b0d0f !important;

    filter:
        brightness(1.08);

    transform:
        translateY(-4px);

    box-shadow:
        inset 0 2px 1px rgba(255,255,255,1),
        inset 0 -3px 3px rgba(37,43,48,.40),
        0 7px 0 #41484f,
        0 12px 22px rgba(0,0,0,.44) !important;
}


.az-site-header .az-btn-metal:active,
.az-site-header .az-consultation-button:active {
    transform:
        translateY(2px);

    box-shadow:
        inset 0 3px 5px rgba(0,0,0,.34),
        0 1px 0 #41484f,
        0 3px 7px rgba(0,0,0,.32) !important;
}


/* ==========================================================
   7. WHATSAPP — DARK METAL, NOT GENERIC BOX
   ========================================================== */

.az-whatsapp-button {
    color: #f4f5f6 !important;

    border:
        1px solid rgba(210,216,221,.27) !important;

    background:
        linear-gradient(
            180deg,
            rgba(112,121,130,.32) 0%,
            rgba(48,54,60,.50) 48%,
            rgba(25,29,33,.70) 100%
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.16),
        inset 0 -1px 0 rgba(0,0,0,.38),
        0 4px 10px rgba(0,0,0,.20) !important;
}


/* ==========================================================
   8. STICKY HEADER
   ========================================================== */

.az-site-header.az-is-sticky {
    background:
        radial-gradient(
            ellipse at 50% -50%,
            rgba(255,255,255,.11),
            transparent 55%
        ),
        linear-gradient(
            180deg,
            rgba(66,74,81,.97) 0%,
            rgba(38,44,49,.98) 32%,
            rgba(22,26,30,.99) 100%
        ) !important;

    backdrop-filter:
        blur(18px);

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

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 12px 30px rgba(0,0,0,.40) !important;
}


/* ==========================================================
   9. MOBILE
   ========================================================== */

@media (max-width: 767px) {

    /*
     * Critical:
     * Flex instead of the previous grid.
     *
     * RTL puts the brand at the right
     * and space-between fixes the menu button
     * physically at the far left.
     */

    .az-header-inner {
        display: flex !important;

        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;

        width: 100%;

        gap: 10px;
    }


    /*
     * Brand occupies available space only.
     */

    .az-brand {
        flex:
            1 1 auto;

        width: auto;
        min-width: 0;

        justify-content:
            flex-start;
    }


    /*
     * Menu button physically on the left.
     */

    .az-mobile-toggle {
        display: flex !important;

        flex:
            0 0 44px;

        width: 44px;
        height: 44px;

        margin: 0 !important;
        margin-right: auto !important;

        order: 2;

        border:
            1px solid rgba(255,255,255,.32) !important;

        background:
            linear-gradient(
                145deg,
                #5d666f 0%,
                #31373d 47%,
                #181c20 100%
            ) !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.25),
            inset 0 -2px 2px rgba(0,0,0,.50),
            0 5px 12px rgba(0,0,0,.30) !important;
    }


    .az-mobile-toggle span {
        background:
            #ffffff !important;

        height:
            2px;
    }


    /*
     * More refined mobile header height.
     */

    .az-header-main {
        min-height:
            96px !important;
    }


    /*
     * Portrait size.
     */

    .az-brand-photo-shell {
        flex:
            0 0 58px !important;

        width:
            58px !important;

        height:
            58px !important;
    }


    /*
     * Mobile typography:
     * Force proper contrast against Astra/global styles.
     */

    .az-brand-name {
        color: #ffffff !important;

        font-size:
            15px !important;

        font-weight:
            800 !important;

        line-height:
            1.25;

        white-space:
            normal !important;
    }


    .az-brand-academic {
        display:
            block !important;

        margin-top:
            4px !important;

        color:
            #eceff1 !important;

        font-size:
            10.5px !important;

        font-weight:
            700 !important;

        line-height:
            1.3;
    }


    .az-brand-legal {
        display:
            block !important;

        margin-top:
            4px !important;

        color:
            #e6ca9d !important;

        font-size:
            10.5px !important;

        font-weight:
            800 !important;
    }


    .az-brand-kicker,
    .az-brand-university {
        display:
            none !important;
    }
}


/* ==========================================================
   10. VERY SMALL PHONES
   ========================================================== */

@media (max-width: 420px) {

    .az-header-main {
        min-height:
            92px !important;
    }


    .az-brand {
        gap:
            9px;
    }


    .az-brand-photo-shell {
        flex-basis:
            53px !important;

        width:
            53px !important;

        height:
            53px !important;
    }


    .az-brand-name {
        font-size:
            13.5px !important;
    }


    .az-brand-academic {
        font-size:
            9.5px !important;
    }


    .az-brand-legal {
        font-size:
            9.5px !important;
    }


    .az-mobile-toggle {
        flex-basis:
            41px;

        width:
            41px;

        height:
            41px;
    }
}


/* ==========================================================
   11. MOBILE PANEL — MATCH NEW TITANIUM LANGUAGE
   ========================================================== */

.az-mobile-panel {
    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(255,255,255,.11),
            transparent 36%
        ),
        linear-gradient(
            160deg,
            #444c54 0%,
            #30363c 24%,
            #20252a 54%,
            #111417 100%
        ) !important;

    border-left:
        1px solid rgba(255,255,255,.20);

    box-shadow:
        inset 1px 0 0 rgba(255,255,255,.08),
        -22px 0 55px rgba(0,0,0,.52) !important;
}


.az-mobile-title {
    color:
        #ffffff !important;
}


.az-mobile-identity strong {
    color:
        #edf0f2 !important;
}


.az-mobile-identity > span:last-child {
    color:
        #e7cb9f !important;
}

/* ==========================================================
   MOBILE QUICK ACTION BAR
   ========================================================== */

.az-mobile-quick-actions {
    display: none;
}

@media (max-width: 767px) {

    .az-mobile-quick-actions {
        display: grid;

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

        gap: 7px;

        width: 100%;

        padding:
            8px 14px 10px;

        background:
            linear-gradient(
                180deg,
                rgba(28,33,38,.96) 0%,
                rgba(16,19,22,.98) 100%
            );

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

        border-bottom:
            1px solid rgba(0,0,0,.75);

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.04);
    }


    .az-mobile-quick-btn {
        min-height: 38px;

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

        gap: 6px;

        padding:
            7px 8px;

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

        border-radius:
            5px;

        color:
            #f5f6f7 !important;

        background:
            linear-gradient(
                180deg,
                #495159 0%,
                #30363c 46%,
                #1c2024 100%
            );

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.20),
            inset 0 -2px 2px rgba(0,0,0,.45),
            0 3px 7px rgba(0,0,0,.22);

        text-decoration:
            none !important;

        font-size:
            11px;

        font-weight:
            700;

        transition:
            transform .16s ease,
            filter .16s ease;
    }


    .az-mobile-quick-btn:active {
        transform:
            translateY(1px);

        box-shadow:
            inset 0 2px 3px rgba(0,0,0,.42),
            0 1px 3px rgba(0,0,0,.20);
    }


    .az-mobile-quick-whatsapp {
        background:
            linear-gradient(
                180deg,
                #47534f 0%,
                #303b37 50%,
                #1c2421 100%
            );
    }


    .az-mobile-quick-dot {
        width:
            6px;

        height:
            6px;

        border-radius:
            50%;

        background:
            #73c892;

        box-shadow:
            0 0 0 2px rgba(115,200,146,.12);
    }


    .az-mobile-quick-consultation {
        color:
            #171a1d !important;

        background:
            linear-gradient(
                180deg,
                #f2f3f4 0%,
                #cbd0d4 17%,
                #939ba2 50%,
                #c5cacf 76%,
                #e8eaec 100%
            );

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

        text-shadow:
            0 1px 0 rgba(255,255,255,.65);

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.92),
            inset 0 -2px 2px rgba(0,0,0,.32),
            0 3px 0 #454c53,
            0 5px 8px rgba(0,0,0,.28);
    }


    .az-mobile-quick-icon {
        font-size:
            12px;
    }
}
/* ==========================================================
   MOBILE HEADER STRUCTURE FIX
   Brand row + Quick Actions row
   ========================================================== */

@media (max-width: 767px) {

    .az-header-main {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100%;
    }

    .az-header-main > .az-header-inner {
        width: 100%;
        flex: 0 0 auto;
    }

    .az-header-main > .az-mobile-quick-actions {
        width: 100%;
        flex: 0 0 auto;
    }
}