.elementor-26 .elementor-element.elementor-element-2330f76{--display:flex;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-9960c1c */@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

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

:root{

    --header-bg:rgba(0,0,0,.18);
    --header-overlay:rgba(90,42,12,.18);

    --border:rgba(255,255,255,.12);

    --text:#ffffff;
    --muted:rgba(255,255,255,.72);

    --accent:#ff5c1a;

}

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

.glass-header{

    position:fixed;

    top:18px;
    left:50%;

    transform:translate(-50%,-80px);
    opacity:0;

    width:min(640px,calc(100vw - 30px));
    height:46px;

    padding:0 18px;

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

    border-radius:999px;

    overflow:hidden;
    isolation:isolate;

    z-index:99999;

    background:var(--header-bg);

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

    backdrop-filter:
        blur(24px)
        saturate(220%);

    -webkit-backdrop-filter:
        blur(24px)
        saturate(220%);

    box-shadow:
        0 14px 40px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.10);

    transition:
        transform .8s cubic-bezier(.22,1,.36,1),
        opacity .8s cubic-bezier(.22,1,.36,1);

}

/* =====================================================
SHOW
===================================================== */

.glass-header.show{

    transform:translate(-50%,0);
    opacity:1;

}

/* =====================================================
UNIFORM BROWN GLASS TINT
(No White Gradient)
===================================================== */
.glass-header::before{

    content:"";

    position:absolute;

    inset:0;

    border-radius:inherit;

    pointer-events:none;

    z-index:-1;

    background:rgba(78,48,28,.18);

}


/* =====================================================
VERY SOFT LIQUID HIGHLIGHT
===================================================== */

.glass-header::after{

    content:"";

    position:absolute;
    inset:0;

    border-radius:inherit;

    background:

        radial-gradient(
            circle at 50% -60%,
            rgba(255,255,255,.08),
            transparent 65%
        );

    opacity:.45;

    pointer-events:none;

    z-index:-1;

}
/* =====================================================
APPLE LIQUID GLASS HEADER
PART 2 — LOGO • NAVIGATION • CTA
===================================================== */

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

.glass-brand{

    display:flex;

    align-items:center;

    gap:16px;

    flex-shrink:0;

}

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

.glass-logo{

    display:flex;

    align-items:center;

    gap:10px;

    color:var(--text);

    text-decoration:none;

    font-family:"Space Grotesk",sans-serif;

    font-size:16px;

    font-weight:700;

    letter-spacing:-0.04em;

    white-space:nowrap;

    transition:.3s ease;

}

.glass-logo::before{

    content:"";

    width:8px;

    height:8px;

    border-radius:50%;

    background:var(--accent);

    flex-shrink:0;

    box-shadow:
        0 0 10px rgba(255,92,26,.35);

}

/* ==========================================
DIVIDER
========================================== */

.glass-divider{

    width:1px;

    height:18px;

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

    flex-shrink:0;

}

/* ==========================================
NAVIGATION
========================================== */

.glass-nav{

    flex:1;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:34px;

    min-width:0;

}

.glass-nav a{

    position:relative;

    color:var(--muted);

    text-decoration:none;

    font-family:"Space Grotesk",sans-serif;

    font-size:13px;

    font-weight:500;

    letter-spacing:-.01em;

    transition:
        color .3s ease,
        opacity .3s ease;

}

.glass-nav a:hover{

    color:#fff;

}

.glass-nav a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-7px;

    width:0;

    height:2px;

    border-radius:999px;

    background:var(--accent);

    transition:width .3s ease;

}

.glass-nav a:hover::after{

    width:100%;

}

/* ==========================================
CTA BUTTON
========================================== */

.glass-btn{

    width:100px;

    height:28px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:999px;

    text-decoration:none;

    background:var(--accent);

    color:#fff;

    font-family:"Space Grotesk",sans-serif;

    font-size:12px;

    font-weight:700;

    letter-spacing:.02em;

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

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.15),
        0 10px 24px rgba(255,92,26,.28);

}

.glass-btn:hover{

    background:#ff6d2f;

    transform:translateY(-1px);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.18),
        0 14px 28px rgba(255,92,26,.38);

}

/* =====================================================
LOGO HOVER
CLEAN APPLE MICRO INTERACTION
===================================================== */

.glass-logo{

    transition:
    transform .35s cubic-bezier(.22,1,.36,1);

}


.glass-logo:hover{

    transform:scale(1.04);

}



/* Keep logo color same */

.glass-logo:hover,
.glass-logo:hover::before{

    color:var(--text);

}



/* =====================================================
CTA WHITE APPLE BUTTON
===================================================== */


.glass-btn{


    background:#ff5c1a;

    color:#ffffff;


    box-shadow:

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

    0 10px 25px rgba(0,0,0,.18);


}



.glass-btn:hover{


    background:#ffffff;

    color:#000000;


    transform:translateY(-1px);


    box-shadow:

    0 12px 30px rgba(255,92,26,.35);


}

/* =====================================================
MOBILE HAMBURGER + EXPANDING MENU
CLEAN FINAL
===================================================== */


/* HAMBURGER BUTTON */

.glass-menu-btn{

    display:none;

    width:32px;
    height:32px;

    border:0;
    background:transparent;

    position:relative;

    padding:0;

    flex-shrink:0;

    cursor:pointer;

}


.glass-menu-btn span{

    position:absolute;

    left:50%;

    width:14px;

    height:1.5px;

    background:#fff;

    border-radius:999px;

    transform:translateX(-50%);

    transition:.35s cubic-bezier(.22,1,.36,1);

}


.glass-menu-btn span:first-child{

    top:11px;

}


.glass-menu-btn span:last-child{

    top:17px;

}



/* HAMBURGER → X */

.glass-header.active 
.glass-menu-btn span:first-child{

    top:14px;

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

}


.glass-header.active 
.glass-menu-btn span:last-child{

    top:14px;

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

}





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


.glass-mobile{


    position:absolute;


    top:64px;


    left:14px;

    right:14px;



    display:flex;

    flex-direction:column;

    gap:8px;



    opacity:0;

    transform:translateY(-20px);



    pointer-events:none;



    transition:

    opacity .35s ease,

    transform .45s cubic-bezier(.22,1,.36,1);


}





/* OPEN STATE */


.glass-header.active .glass-mobile{


    opacity:1;

    transform:translateY(0);

    pointer-events:auto;


}






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


.glass-header.active{


    height:325px;

    border-radius:28px;


}






/* =====================================================
MOBILE MENU FONT
PREMIUM APPLE STYLE
===================================================== */

.glass-mobile a{

    height:42px;

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


    border-radius:14px;


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

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



    color:#ffffff;

    text-decoration:none;


    font-family:"Space Grotesk",sans-serif;


    font-size:13px;

    font-weight:500;


    letter-spacing:-0.02em;


    line-height:1;



    opacity:0;

    transform:translateY(-12px);



    transition:

    opacity .35s ease,

    transform .35s cubic-bezier(.22,1,.36,1);

}





/* LINK ANIMATION */


.glass-header.active .glass-mobile a{


    opacity:1;

    transform:translateY(0);


}





.glass-header.active .glass-mobile a:nth-child(1){

    transition-delay:.05s;

}


.glass-header.active .glass-mobile a:nth-child(2){

    transition-delay:.10s;

}


.glass-header.active .glass-mobile a:nth-child(3){

    transition-delay:.15s;

}


.glass-header.active .glass-mobile a:nth-child(4){

    transition-delay:.20s;

}






/* =====================================================
MOBILE CTA
===================================================== */


.glass-mobile-btn{


    height:42px !important;


    margin-top:10px;


    display:flex !important;


    align-items:center;

    justify-content:center;



    border-radius:999px !important;



    background:#fff !important;


    color:#000 !important;



    font-family:"Space Grotesk",sans-serif;


    font-size:11px !important;


    font-weight:700 !important;


}





.glass-mobile-btn:hover{


    background:#ff5c1a !important;


    color:#fff !important;


}


/* =====================================================
MOBILE HEADER LAYOUT FIX
===================================================== */

@media(max-width:768px){


    .glass-header{

        width:calc(100% - 28px);

        height:46px;

        padding:0;

        overflow:hidden;

        display:block;

    }



    /* =====================
    FIX LOGO POSITION
    ===================== */


    .glass-brand{

        position:absolute;

        left:14px;

        top:0;

        height:46px;

        display:flex;

        align-items:center;

        z-index:10;

    }





    .glass-logo{

        font-size:13px;

    }



    .glass-logo::before{

        width:6px;

        height:6px;

    }





    /* =====================
    FIX HAMBURGER POSITION
    ===================== */


    .glass-menu-btn{display:block;
    position:absolute;
    right:14px;
    top:7px;
    width:32px;
    height:32px;
    z-index:10;}





    /* =====================
    HIDE DESKTOP
    ===================== */


    .glass-nav,

    .glass-btn{

        display:none;

    }





    /* =====================
    MOBILE MENU BELOW TOP BAR
    ===================== */


    .glass-mobile{

        position:absolute;

        top:64px;

        left:14px;

        right:14px;

    }


}

/*==================================================
REMOVE MOBILE BUTTON TAP EFFECT
==================================================*/

.glass-menu-btn,
.glass-menu-btn:focus,
.glass-menu-btn:active,
.glass-menu-btn:hover,
.glass-menu-btn:focus-visible{

    background:transparent !important;

    outline:none !important;

    box-shadow:none !important;

    border:none !important;

    -webkit-tap-highlight-color:transparent;

}

.glass-menu-btn::-moz-focus-inner{

    border:0;

}/* End custom CSS */