/*
=========================================================
NEURORDER GLOBAL SHELL
Header + navigation + footer only.
This file is loaded LAST so every webpage uses one shell.
=========================================================
*/

:root{
    --global-header-height: 76px;
    --global-page-width: 1440px;
    --global-blue: #8fdfff;
    --global-bg: #02050a;
}

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

html{
    overflow-x:hidden;
}

body{
    overflow-x:hidden;
}

.site-header[data-global-shell="header"]{
    position:fixed !important;
    inset:0 0 auto 0 !important;
    z-index:10000 !important;
    width:100% !important;
    height:var(--global-header-height) !important;
    margin:0 !important;
    padding:0 clamp(22px,4.5vw,72px) !important;
    display:block !important;
    background:rgba(2,5,10,.82) !important;
    border:0 !important;
    border-bottom:1px solid rgba(255,255,255,.065) !important;
    box-shadow:0 12px 40px rgba(0,0,0,.12) !important;
    backdrop-filter:blur(24px) saturate(130%) !important;
    -webkit-backdrop-filter:blur(24px) saturate(130%) !important;
}

.site-header[data-global-shell="header"]::after{
    content:"" !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:-1px !important;
    height:1px !important;
    background:linear-gradient(
        90deg,
        transparent 0%,
        rgba(143,223,255,.10) 20%,
        rgba(143,223,255,.36) 50%,
        rgba(143,223,255,.10) 80%,
        transparent 100%
    ) !important;
    pointer-events:none !important;
}

.site-header[data-global-shell="header"] .header-inner{
    position:relative !important;
    width:100% !important;
    max-width:var(--global-page-width) !important;
    height:100% !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
}

.site-header[data-global-shell="header"] .brand{
    display:inline-flex !important;
    width:auto !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    align-items:center !important;
    flex:0 0 auto !important;
    border:0 !important;
    background:transparent !important;
}

.site-header[data-global-shell="header"] .brand img,
.site-header[data-global-shell="header"] .nav-logo{
    display:block !important;
    width:auto !important;
    height:43px !important;
    max-width:155px !important;
    object-fit:contain !important;
    margin:0 !important;
    opacity:1 !important;
    visibility:visible !important;
    filter:brightness(1.08) drop-shadow(0 0 13px rgba(91,194,255,.24)) !important;
    transform:none !important;
}

.site-header[data-global-shell="header"] .brand span{
    display:none !important;
}

/* ---------- FOUR-DOT CONTROL ---------- */

.site-header[data-global-shell="header"] .mobile-menu-button,
.site-header[data-global-shell="header"] .mobile-menu-btn{
    display:grid !important;
    width:46px !important;
    height:46px !important;
    margin:0 !important;
    padding:0 !important;
    flex:0 0 46px !important;
    place-items:center !important;
    align-content:center !important;
    justify-content:center !important;
    grid-template-columns:repeat(2,5px) !important;
    grid-template-rows:repeat(2,5px) !important;
    gap:6px !important;
    border:1px solid rgba(143,223,255,.22) !important;
    border-radius:50% !important;
    background:rgba(8,17,28,.58) !important;
    box-shadow:
        inset 0 0 18px rgba(143,223,255,.035),
        0 0 0 1px rgba(255,255,255,.018),
        0 0 22px rgba(91,194,255,.07) !important;
    cursor:pointer !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease !important;
}

.site-header[data-global-shell="header"] .mobile-menu-button:hover,
.site-header[data-global-shell="header"] .mobile-menu-btn:hover{
    border-color:rgba(143,223,255,.52) !important;
    box-shadow:
        inset 0 0 18px rgba(143,223,255,.05),
        0 0 28px rgba(91,194,255,.14) !important;
    transform:translateY(-1px) !important;
}

.site-header[data-global-shell="header"] .mobile-menu-grid{
    display:grid !important;
    grid-template-columns:repeat(2,5px) !important;
    grid-template-rows:repeat(2,5px) !important;
    gap:6px !important;
    width:16px !important;
    height:16px !important;
}

.site-header[data-global-shell="header"] .mobile-menu-grid span,
.site-header[data-global-shell="header"] .mobile-menu-btn .dot{
    display:block !important;
    width:5px !important;
    height:5px !important;
    margin:0 !important;
    border-radius:50% !important;
    background:#8fdfff !important;
    box-shadow:0 0 8px rgba(143,223,255,.78) !important;
    transition:transform .2s ease,box-shadow .2s ease !important;
}

.site-header[data-global-shell="header"] .mobile-menu-button:hover .mobile-menu-grid span,
.site-header[data-global-shell="header"] .mobile-menu-btn:hover .dot{
    transform:scale(1.25) !important;
    box-shadow:0 0 11px rgba(143,223,255,.95) !important;
}

/* ---------- MENU PANEL ---------- */

body.menu-open{
    overflow:hidden !important;
}

.site-header[data-global-shell="header"] .mobile-menu{
    position:fixed !important;
    top:var(--global-header-height) !important;
    right:0 !important;
    z-index:9999 !important;
    display:flex !important;
    width:min(390px,92vw) !important;
    height:calc(100dvh - var(--global-header-height)) !important;
    margin:0 !important;
    padding:28px 30px 42px !important;
    flex-direction:column !important;
    gap:0 !important;
    overflow-y:auto !important;
    border:0 !important;
    border-left:1px solid rgba(143,223,255,.18) !important;
    border-radius:0 !important;
    background:
        radial-gradient(circle at 20% 0%,rgba(80,190,255,.07),transparent 34%),
        rgba(2,5,10,.975) !important;
    box-shadow:-30px 0 80px rgba(0,0,0,.42) !important;
    backdrop-filter:blur(28px) saturate(135%) !important;
    -webkit-backdrop-filter:blur(28px) saturate(135%) !important;
    transform:translateX(105%) !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
    transition:transform .38s cubic-bezier(.2,.8,.2,1),opacity .25s ease,visibility .38s !important;
}

.site-header[data-global-shell="header"] .mobile-menu::before{
    content:"NAVIGATION" !important;
    display:block !important;
    margin:0 0 18px !important;
    padding:0 0 14px !important;
    border-bottom:1px solid rgba(255,255,255,.07) !important;
    color:rgba(143,223,255,.52) !important;
    font:600 .58rem/1 "Inter",Arial,sans-serif !important;
    letter-spacing:.22em !important;
}

.site-header[data-global-shell="header"] .mobile-menu.open{
    transform:translateX(0) !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
}

.site-header[data-global-shell="header"] .mobile-menu a{
    position:relative !important;
    display:flex !important;
    width:100% !important;
    min-height:62px !important;
    margin:0 !important;
    padding:0 4px !important;
    align-items:center !important;
    border:0 !important;
    border-bottom:1px solid rgba(255,255,255,.065) !important;
    border-radius:0 !important;
    background:transparent !important;
    color:rgba(255,255,255,.60) !important;
    font:500 .84rem/1 "Inter",Arial,sans-serif !important;
    letter-spacing:.075em !important;
    text-decoration:none !important;
    transition:color .25s ease,padding-left .25s ease !important;
}

.site-header[data-global-shell="header"] .mobile-menu a::before{
    content:"" !important;
    width:4px !important;
    height:4px !important;
    margin-right:13px !important;
    flex:0 0 4px !important;
    border-radius:50% !important;
    background:rgba(143,223,255,.28) !important;
    box-shadow:0 0 7px rgba(143,223,255,.18) !important;
    transition:background .25s ease,box-shadow .25s ease,transform .25s ease !important;
}

.site-header[data-global-shell="header"] .mobile-menu a:hover,
.site-header[data-global-shell="header"] .mobile-menu a.active{
    padding-left:9px !important;
    color:#fff !important;
}

.site-header[data-global-shell="header"] .mobile-menu a:hover::before,
.site-header[data-global-shell="header"] .mobile-menu a.active::before{
    background:var(--global-blue) !important;
    box-shadow:0 0 9px rgba(143,223,255,.8) !important;
    transform:scale(1.25) !important;
}

.site-header[data-global-shell="header"] .mobile-menu a:last-child{
    margin-top:18px !important;
    min-height:50px !important;
    padding:0 16px !important;
    border:1px solid rgba(143,223,255,.24) !important;
    background:rgba(143,223,255,.045) !important;
    color:var(--global-blue) !important;
}

.site-header[data-global-shell="header"] .mobile-menu a:last-child::before{
    display:none !important;
}

/* ---------- PAGE OFFSET ---------- */

main{
    padding-top:var(--global-header-height) !important;
}

/* ---------- FOOTER ---------- */

.site-footer[data-global-shell="footer"],
.futuristic-footer[data-global-shell="footer"]{
    position:relative !important;
    width:100% !important;
    margin-top:90px !important;
    padding:0 !important;
    overflow:hidden !important;
    background:#020409 !important;
    border:0 !important;
}

.footer-intelligence-field{
    position:relative !important;
    padding:64px clamp(24px,5vw,80px) 20px !important;
    overflow:hidden !important;
    border-top:1px solid rgba(255,255,255,.07) !important;
    isolation:isolate !important;
}

.footer-grid{
    position:absolute !important;
    inset:0 !important;
    opacity:.14 !important;
    background-image:
        linear-gradient(rgba(90,190,255,.055) 1px,transparent 1px),
        linear-gradient(90deg,rgba(90,190,255,.055) 1px,transparent 1px) !important;
    background-size:70px 70px !important;
    mask-image:radial-gradient(ellipse at 70% 50%,black,transparent 72%) !important;
    pointer-events:none !important;
}

.footer-intelligence-field::before{
    content:"" !important;
    position:absolute !important;
    width:420px !important;
    height:420px !important;
    right:7% !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    border-radius:50% !important;
    background:radial-gradient(circle,rgba(73,179,255,.10),transparent 68%) !important;
    filter:blur(25px) !important;
    z-index:-1 !important;
}

.footer-particle-field{
    position:absolute !important;
    inset:0 !important;
    pointer-events:none !important;
}

.footer-node{
    position:absolute !important;
    width:3px !important;
    height:3px !important;
    border-radius:50% !important;
    background:rgba(104,202,255,.55) !important;
    box-shadow:0 0 8px rgba(104,202,255,.65) !important;
}

.node-01{left:12% !important;top:28% !important}.node-02{left:24% !important;top:70% !important}
.node-03{left:37% !important;top:18% !important}.node-04{left:49% !important;top:78% !important}
.node-05{left:61% !important;top:23% !important}.node-06{left:72% !important;top:68% !important}
.node-07{left:83% !important;top:31% !important}.node-08{left:92% !important;top:58% !important}

.footer-main{
    position:relative !important;
    z-index:3 !important;
    display:grid !important;
    grid-template-columns:1.15fr 1.5fr .55fr !important;
    align-items:center !important;
    gap:clamp(35px,5vw,80px) !important;
    max-width:1380px !important;
    margin:0 auto !important;
    padding-bottom:48px !important;
}

.footer-intro{max-width:330px !important}
.footer-kicker{display:block !important;margin-bottom:13px !important;color:rgba(103,199,255,.62) !important;font-size:.58rem !important;font-weight:700 !important;letter-spacing:.22em !important;text-transform:uppercase !important}
.footer-intro h2{margin:0 !important;color:#fff !important;font-size:clamp(1.7rem,3vw,2.5rem) !important;font-weight:500 !important;line-height:1 !important;letter-spacing:-.045em !important}
.footer-intro h2 span{display:block !important;color:rgba(255,255,255,.32) !important}
.footer-intro p{max-width:290px !important;margin:17px 0 0 !important;color:rgba(255,255,255,.38) !important;font-size:.72rem !important;line-height:1.65 !important}

.footer-navigation{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:35px !important}
.footer-nav-group{display:flex !important;flex-direction:column !important}
.footer-nav-number{margin-bottom:8px !important;color:rgba(100,199,255,.45) !important;font-size:.52rem !important;letter-spacing:.15em !important}
.footer-nav-group h3{margin:0 0 13px !important;color:rgba(255,255,255,.78) !important;font-size:.68rem !important;font-weight:600 !important;letter-spacing:.14em !important;text-transform:uppercase !important}
.footer-nav-group a{position:relative !important;width:fit-content !important;margin:4px 0 !important;color:rgba(255,255,255,.38) !important;font-size:.71rem !important;text-decoration:none !important;transition:color .25s ease,transform .25s ease !important}
.footer-nav-group a:hover{color:#fff !important;transform:translateX(3px) !important}

.footer-identity{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    justify-self:center !important;
    width:100% !important;
    text-align:center !important;
}
.footer-logo-frame{
    position:relative !important;
    width:100px !important;
    height:80px !important;
    display:grid !important;
    place-items:center !important;
}
.footer-identity .footer-logo{
    width:58px !important;
    height:58px !important;
    object-fit:contain !important;
    margin:0 !important;
    filter:brightness(1.08) drop-shadow(0 0 14px rgba(91,194,255,.55)) !important;
    transform:none !important;
}
.footer-identity-name{margin-top:9px !important;color:#fff !important;font-size:.72rem !important;font-weight:600 !important;letter-spacing:.25em !important;padding-left:.25em !important}
.footer-identity-location{margin-top:6px !important;color:rgba(255,255,255,.25) !important;font-size:.51rem !important;letter-spacing:.16em !important}

.footer-bottom{
    position:relative !important;
    z-index:4 !important;
    display:grid !important;
    grid-template-columns:1fr auto 1fr !important;
    align-items:center !important;
    max-width:1380px !important;
    margin:0 auto !important;
    padding-top:15px !important;
    border-top:1px solid rgba(255,255,255,.07) !important;
    color:rgba(255,255,255,.23) !important;
    font-size:.52rem !important;
    letter-spacing:.09em !important;
    text-transform:uppercase !important;
}
.footer-bottom-left{text-align:left !important}
.footer-system-status{display:flex !important;align-items:center !important;justify-content:center !important;gap:7px !important}
.footer-system-status i{width:5px !important;height:5px !important;border-radius:50% !important;background:#5ed5a0 !important;box-shadow:0 0 8px rgba(94,213,160,.75) !important;animation:globalStatusPulse 2.5s ease-in-out infinite !important}
.footer-bottom-right{text-align:right !important}

@keyframes globalStatusPulse{
    0%,100%{opacity:.45}
    50%{opacity:1}
}

/* ---------- RESPONSIVE ---------- */

@media(max-width:850px){
    .footer-main{grid-template-columns:1fr 1fr !important}
    .footer-intro{max-width:100% !important}
}

@media(max-width:650px){
    .site-header[data-global-shell="header"]{
        height:70px !important;
        padding:0 18px !important;
    }
    :root{--global-header-height:70px}
    .site-header[data-global-shell="header"] .brand img{
        height:39px !important;
        max-width:140px !important;
    }
    .site-header[data-global-shell="header"] .mobile-menu-button{
        width:43px !important;
        height:43px !important;
        flex-basis:43px !important;
    }
    .site-header[data-global-shell="header"] .mobile-menu{
        top:70px !important;
        height:calc(100dvh - 70px) !important;
        width:min(390px,94vw) !important;
        padding:24px 24px 34px !important;
    }
    .footer-intelligence-field{padding:52px 22px 18px !important}
    .footer-main{grid-template-columns:1fr !important;gap:38px !important;padding-bottom:38px !important}
    .footer-navigation{grid-template-columns:repeat(3,1fr) !important;gap:18px !important}
    .footer-identity{align-items:flex-start !important;text-align:left !important;justify-self:start !important}
    .footer-bottom{display:flex !important;flex-direction:column !important;align-items:flex-start !important;gap:9px !important}
    .footer-bottom-left,.footer-bottom-right{text-align:left !important}
    .footer-system-status{justify-content:flex-start !important}
}

@media(prefers-reduced-motion:reduce){
    .footer-system-status i{animation:none !important}
}