.elementor-765 .elementor-element.elementor-element-12ab71c{--display:flex;}.elementor-765 .elementor-element.elementor-element-4bba9a0 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:1px 1px 1px 1px;}.elementor-765 .elementor-element.elementor-element-450fe4a{--display:flex;}.elementor-765 .elementor-element.elementor-element-f0d266a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;box-shadow:0px 0px 30px 0px rgba(0, 0, 0, 0);--padding-top:20px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;--z-index:950;}.elementor-765 .elementor-element.elementor-element-67e2843{--display:flex;--min-height:75px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;--border-radius:5px 5px 5px 5px;box-shadow:0px 16px 30px 0px rgba(46, 59.99999999999999, 70, 0.1);--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}.elementor-765 .elementor-element.elementor-element-67e2843:not(.elementor-motion-effects-element-type-background), .elementor-765 .elementor-element.elementor-element-67e2843 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFFC7;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-765 .elementor-element.elementor-element-26665be img{width:130px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-765 .elementor-element.elementor-element-e1e9568{text-align:end;}.elementor-765 .elementor-element.elementor-element-e1e9568 img{width:25%;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-765 .elementor-element.elementor-element-67e2843{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:23px;--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}}@media(max-width:767px){.elementor-765 .elementor-element.elementor-element-f0d266a{--padding-top:20px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-765 .elementor-element.elementor-element-67e2843{border-width:0px 0px 0px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;--border-radius:0px 0px 0px 0px;}.elementor-765 .elementor-element.elementor-element-e1e9568{text-align:end;}.elementor-765 .elementor-element.elementor-element-e1e9568 img{width:38px;}}/* Start custom CSS for html, class: .elementor-element-4bba9a0 *//* ==========================================
   LUMION HEADER CLONE
   PART 2 - CORE STYLES
========================================== */

:root{

    --blue:#355D91;
    --button:#BFD7EE;
    --buttonText:#244A75;
    --text:#ffffff;
    --dropdown:#ffffff;
    --shadow:0 18px 45px rgba(0,0,0,.12);
    --radius:16px;

}

.lumion-header{

    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:90px;
    background:var(--blue);
    z-index:9999;
    transition:.35s ease;

}

.header-inner{

    max-width:1440px;
    height:100%;
    margin:auto;

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

    padding:0px;

}

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

.left-nav{

    width:42%;

    display:flex;
    align-items:center;

    gap:34px;

}

.left-nav>a,
.product-trigger{

    color:#fff;
    text-decoration:none;

    font-size:15px;

    font-weight:500;

    line-height:80px;

    transition:.25s;

}

.left-nav>a:hover,
.product-trigger:hover{

    opacity:.8;

}

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

.logo{

    width:16%;
    display:flex;
    justify-content:center;

}

.logo img{

    width:170px;
    display:block;

}

/* ===============================
RIGHT
=============================== */

.right-nav{

    width:50%;

    display:flex;

    justify-content:flex-end;

    align-items:center;

    gap:0px;

}

.right-nav>a{

    color:#fff;

    text-decoration:none;

    font-size:15px;

    font-weight:500;

}

.start-btn{

    width:178px;

    height:80px;

    background:var(--button);

    color:var(--buttonText)!important;

    display:flex;

    justify-content:center;

    align-items:center;

    text-decoration:none;

    font-weight:600;

    transition:.25s;

}

.start-btn:hover{

    background:white;

}

/* ===============================
PRODUCT
=============================== */

.product-menu{

    position:relative;

}

.product-trigger{

    display:flex;

    align-items:center;

    gap:6px;

}

.arrow{

    transition:.25s;

}

/* Hover bridge */

.product-menu::after{

    content:'';

    position:absolute;

    left:0;

    top:100%;

    width:100%;

    height:22px;

}

/* ===============================
DROPDOWN
=============================== */

.mega-menu{

    position:absolute;

    top:calc(100% + 10px);

    left:50%;

    transform:translateX(-50%) translateY(12px);

    width:320px;

    background:#fff;

    border-radius:16px;

    box-shadow:var(--shadow);

    padding:12px;

    opacity:0;

    visibility:hidden;

    transition:.28s ease;

}

.product-menu:hover .mega-menu{

    opacity:1;

    visibility:visible;

    transform:translateX(-50%) translateY(0);

}

.product-menu:hover .arrow{

    transform:rotate(180deg);

}

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



.mega-title{

    color:#111;

    font-size:16px;

    font-weight:600;

}

.mega-description{

    margin-top:4px;

    color:#777;

    font-size:13px;

    line-height:1.45;

}

/* ==========================================
   MOBILE HEADER
   Add this at the bottom of your current CSS
========================================== */

@media screen and (max-width: 767px) {

    .lumion-header {
        height: auto;
        min-height: 128px;
    }

    .lumion-header .header-inner {
        width: 100%;
        max-width: none;
        min-height: 128px;
        padding: 12px 16px;

        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "logo button"
            "navigation navigation";

        align-items: center;
        gap: 12px 16px;
    }

    /* Logo — first row, left */
    .lumion-header .logo {
        grid-area: logo;

        width: auto;
        min-width: 0;

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

    .lumion-header .logo img {
        display: block;
        width: auto;
        max-width: 150px;
        max-height: 48px;
        object-fit: contain;
    }

    /* Start button — first row, right */
    .lumion-header .right-nav {
        grid-area: button;

        width: auto;

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

    .lumion-header .start-btn {
        width: auto;
        height: 42px;

        padding: 0 16px;

        font-size: 13px;
        line-height: 1;
        white-space: nowrap;
    }

    /* Navigation — second row */
    .lumion-header .left-nav {
        grid-area: navigation;

        width: 100%;

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

        gap: 12px;
    }

    .lumion-header .left-nav > a,
    .lumion-header .product-trigger {
        font-size: 13px;
        line-height: 38px;
        white-space: nowrap;
    }
}

/* Extra-small phones */
@media screen and (max-width: 380px) {

    .lumion-header .header-inner {
        padding-left: 12px;
        padding-right: 12px;
        gap: 10px;
    }

    .lumion-header .logo img {
        max-width: 125px;
        max-height: 42px;
    }

    .lumion-header .start-btn {
        height: 38px;
        padding: 0 12px;
        font-size: 12px;
    }

    .lumion-header .left-nav {
        gap: 8px;
    }

    .lumion-header .left-nav > a,
    .lumion-header .product-trigger {
        font-size: 12px;
        line-height: 34px;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-67e2843 */.header-container-blur {
    backdrop-filter: blur(5px) saturate(180%);
    -webkit-backdrop-filter: blur(5px) saturate(180%);


}/* End custom CSS */