/* =========================================================
   VETERAN FORUM FINAL HEADER CSS
   Goal:
   - Desktop: full institutional header, clean single-line menu.
   - Mobile: compact header only: logo, brand, search, call, WhatsApp, menu.
   - Mega menu never cuts from left/right; JS also constrains it.
   ========================================================= */
:root{
  --navy:#0A2342;--deep:#071A33;--royal:#123B63;--gold:#D4AF37;--soft-gold:#F2D27A;--off:#F8F6F0;--white:#fff;--olive:#4B5D3A;--steel:#5F6B7A;--header-gradient:linear-gradient(135deg,#071A33 0%,#0A2342 55%,#123B63 100%);--gold-gradient:linear-gradient(135deg,#D4AF37 0%,#F2D27A 100%);--shadow:0 18px 45px rgba(7,26,51,.18);--radius:14px;--container:1320px;--base-font-size:16px
  --vf-navy: #0A2342;
    --vf-deep-blue: #071A33;
    --vf-royal-blue: #123B63;
    --vf-gold: #D4AF37;
    --vf-soft-gold: #F2D27A;
    --vf-off-white: #F8F6F0;
    --vf-white: #FFFFFF;
    --vf-steel: #B8C0CC;
    --vf-muted: rgba(255, 255, 255, 0.76);
    --vf-footer-gradient: linear-gradient(135deg, #071A33 0%, #0A2342 55%, #123B63 100%);
    --vf-gold-gradient: linear-gradient(135deg, #D4AF37 0%, #F2D27A 100%);
    --vf-footer-shadow: 0 -18px 50px rgba(7, 26, 51, 0.20);
    --vf-radius: 18px;
    --vf-container: 1240px;
}



  *{box-sizing:border-box}html{font-size:var(--base-font-size);scroll-behavior:smooth}body{margin:0;font-family:Inter,Poppins,Arial,system-ui,sans-serif;color:#172033;background:var(--off)}a{text-decoration:none;color:inherit}button,input{font:inherit}button{cursor:pointer}.vf-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.vf-skip-link{position:absolute;left:12px;top:-80px;background:var(--gold);color:var(--deep);padding:10px 14px;z-index:9999;border-radius:8px;font-weight:900}.vf-skip-link:focus{top:12px}.vf-container{max-width:var(--container);margin:0 auto;padding:0 18px}.vf-site-header{position:sticky;top:0;z-index:1000;box-shadow:0 8px 30px rgba(7,26,51,.16)}
/* Top bar */
.vf-topbar{background:var(--header-gradient);color:rgba(255,255,255,.92);font-size:.78rem;border-bottom:1px solid rgba(212,175,55,.25)}.vf-topbar-inner{min-height:34px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px}.vf-topbar-left strong{color:var(--soft-gold)}.vf-separator{display:inline-block;width:1px;height:14px;background:rgba(255,255,255,.35);margin:0 8px;vertical-align:middle}.vf-topbar-center,.vf-topbar-right{display:flex;align-items:center;gap:8px}.vf-topbar-center{justify-content:center;white-space:nowrap;color:rgba(255,255,255,.82)}.vf-topbar-right{justify-content:flex-end;flex-wrap:wrap}.vf-topbar a:hover{color:var(--soft-gold)}.vf-font-btn{border:1px solid rgba(242,210,122,.65);background:rgba(255,255,255,.07);color:var(--white);padding:2px 7px;border-radius:999px;font-weight:900}
/* Compact brand header */
.vf-brand-header{background:var(--white);border-bottom:1px solid rgba(10,35,66,.09)}.vf-brand-inner{min-height:74px;display:grid;grid-template-columns:minmax(250px,330px) minmax(260px,380px) auto;align-items:center;gap:18px}.vf-brand-link{display:flex;align-items:center;gap:12px;min-width:0}.vf-logo{width:60px;height:60px;object-fit:contain;flex:0 0 60px;transition:transform .18s ease}.vf-logo:hover{transform:scale(1.02)}.vf-logo-fallback{width:60px;height:60px;flex:0 0 60px;border-radius:50%;background:radial-gradient(circle,#123B63 0%,#0A2342 64%,#071A33 100%);border:3px solid var(--gold);display:none;place-items:center;position:relative;color:var(--gold);box-shadow:0 10px 25px rgba(7,26,51,.25)}.vf-logo-fallback:before{content:"";position:absolute;inset:8px;border:1px solid rgba(242,210,122,.55);border-radius:50%}.vf-logo-star{position:absolute;top:7px;font-size:.65rem}.vf-logo-text{font-family:Georgia,serif;font-weight:900;font-size:1.35rem;z-index:1}.vf-brand-copy{display:grid;gap:3px;min-width:0}.vf-brand-copy strong{font-family:Merriweather,Georgia,serif;color:var(--navy);font-size:1.32rem;letter-spacing:.06em;line-height:1.05;white-space:nowrap}.vf-brand-copy em{color:var(--olive);font-style:normal;font-weight:900;font-size:.82rem;line-height:1.25}.vf-search-desktop{display:flex;align-items:center;border:1px solid rgba(10,35,66,.14);border-radius:999px;overflow:hidden;background:#fff;max-width:380px;width:100%}.vf-search-desktop input{width:100%;border:0;outline:0;padding:12px 15px;min-width:0;color:var(--navy)}.vf-search-desktop button{width:48px;align-self:stretch;border:0;background:var(--navy);color:var(--soft-gold);font-weight:900;font-size:1.12rem}.vf-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border-radius:999px;padding:10px 18px;font-weight:900;white-space:nowrap;border:1px solid transparent}.vf-btn-gold{color:var(--deep);background:var(--gold-gradient);box-shadow:0 12px 22px rgba(212,175,55,.28)}.vf-btn:hover{transform:translateY(-1px)}.vf-mobile-actions{display:none;align-items:center;gap:7px}.vf-icon-btn,.vf-menu-toggle{width:40px;height:40px;border-radius:12px;border:1px solid rgba(10,35,66,.14);background:var(--white);color:var(--navy);display:inline-grid;place-items:center;font-weight:900}.vf-menu-toggle span{width:20px;height:2px;background:var(--navy);display:block;margin:2px 0}
/* Desktop navigation */
.vf-main-nav{background:var(--navy);color:var(--white);border-top:1px solid rgba(212,175,55,.22)}.vf-nav-wrap{position:relative}.vf-nav-list{margin:0;padding:0;list-style:none;display:flex;align-items:center;justify-content:center;flex-wrap:nowrap}.vf-nav-item{position:relative}.vf-nav-item>a{display:flex;align-items:center;min-height:48px;padding:0 10px;font-size:.78rem;font-weight:900;letter-spacing:.02em;text-transform:uppercase;color:rgba(255,255,255,.94);white-space:nowrap}.vf-nav-item>a:hover{color:var(--soft-gold);background:rgba(255,255,255,.07)}.has-dropdown>a:after{content:"▾";font-size:.66rem;margin-left:5px;color:var(--soft-gold)}.vf-dropdown{position:absolute;top:100%;left:0;background:var(--white);color:var(--navy);box-shadow:var(--shadow);border:1px solid rgba(10,35,66,.08);border-radius:0 0 var(--radius) var(--radius);opacity:0;visibility:hidden;transform:translateY(8px);transition:.18s ease;z-index:1001;max-width:calc(100vw - 32px);overflow:hidden}.has-dropdown:hover>.vf-dropdown,.has-dropdown:focus-within>.vf-dropdown{opacity:1;visibility:visible;transform:translateY(0)}.vf-simple-dropdown{min-width:250px;padding:10px}.vf-simple-dropdown a{display:block;padding:9px 12px;border-radius:10px;font-weight:800;color:#22304a;white-space:nowrap}.vf-simple-dropdown a:hover{background:rgba(212,175,55,.14);color:var(--navy)}.vf-mega-menu{width:min(900px,calc(100vw - 44px));padding:16px;display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:10px}.services-mega{left:0;transform:translateY(8px)}.vf-services-menu:hover>.services-mega,.vf-services-menu:focus-within>.services-mega{transform:translateY(0)}.vf-mega-card{display:grid;grid-template-columns:34px 1fr;gap:7px 10px;padding:11px;border-radius:12px;border:1px solid rgba(10,35,66,.08);background:linear-gradient(135deg,#fff 0%,#fbf8ef 100%)}.vf-mega-card span{grid-row:1/span 2;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(10,35,66,.08)}.vf-mega-card strong{color:var(--navy);font-size:.88rem}.vf-mega-card small{color:var(--steel);line-height:1.35}.vf-mega-card:hover{border-color:rgba(212,175,55,.8);transform:translateY(-1px)}.vf-right-menu .vf-dropdown{left:auto;right:0}
/* Mobile menu */
.vf-mobile-menu{position:fixed;top:0;right:0;width:min(390px,92vw);height:100vh;background:var(--white);z-index:2000;transform:translateX(105%);transition:transform .25s ease;box-shadow:-22px 0 55px rgba(7,26,51,.25);overflow-y:auto;padding-bottom:86px}.vf-mobile-menu.is-open{transform:translateX(0)}.vf-mobile-menu-header{display:flex;align-items:center;justify-content:space-between;padding:15px;background:var(--header-gradient);color:var(--white)}.vf-mobile-brand-mini{display:flex;align-items:center;gap:10px}.vf-mobile-menu-logo{width:48px;height:48px;object-fit:contain}.vf-mobile-brand-mini strong{display:block;font-family:Georgia,serif;letter-spacing:.06em}.vf-mobile-brand-mini small{display:block;color:var(--soft-gold);font-weight:800;font-size:.75rem}.vf-close-btn{width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:var(--white);font-size:1.8rem;line-height:1}.vf-mobile-note{margin:14px;padding:12px;border-left:4px solid var(--gold);background:#fff8df;color:var(--navy);font-weight:800;line-height:1.5;border-radius:8px}.vf-mobile-nav-list{list-style:none;padding:0 14px;margin:0}.vf-mobile-nav-list a,.vf-mobile-accordion{width:100%;display:flex;justify-content:space-between;align-items:center;padding:13px 10px;border:0;border-bottom:1px solid rgba(10,35,66,.09);background:transparent;color:var(--navy);font-weight:900;text-align:left}.vf-mobile-panel{display:none;background:#f7f9fb;padding:6px 0}.vf-mobile-panel a{padding-left:24px;font-size:.94rem;font-weight:800;color:#34415b}.vf-mobile-accordion.is-active+.vf-mobile-panel{display:block}.vf-mobile-accordion.is-active span{transform:rotate(45deg)}.vf-overlay{position:fixed;inset:0;background:rgba(7,26,51,.56);z-index:1500}
/* Search overlay */
.vf-search-overlay{position:fixed;inset:0;background:rgba(7,26,51,.92);z-index:2200;display:none;align-items:center;justify-content:center;padding:20px}.vf-search-overlay.is-open{display:flex}.vf-search-box{width:min(720px,100%);background:var(--white);border-radius:20px;padding:24px;position:relative;box-shadow:var(--shadow)}.vf-search-close{position:absolute;right:16px;top:16px;background:var(--navy)}.vf-search-box h2{margin:0 48px 18px 0;color:var(--navy);font-family:Georgia,serif}.vf-search-box form{display:flex;gap:10px}.vf-search-box input{width:100%;border:1px solid rgba(10,35,66,.18);border-radius:999px;padding:14px 16px;outline:none}.vf-popular-searches{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;align-items:center}.vf-popular-searches a{padding:7px 10px;background:#f4f1e8;border-radius:999px;font-weight:900;color:var(--navy)}.vf-mobile-bottom-bar{display:none}
/* Demo hero */
.vf-demo-hero{min-height:470px;background:var(--header-gradient);color:var(--white);display:flex;align-items:center;text-align:center}.vf-demo-hero h1{max-width:900px;margin:12px auto;font-family:Georgia,serif;font-size:clamp(2rem,5vw,4rem);line-height:1.1}.vf-hero-kicker{color:var(--soft-gold);font-weight:900;letter-spacing:.05em}.vf-demo-hero p{color:rgba(255,255,255,.78)}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--soft-gold);outline-offset:3px}
/* Breakpoints: keep desktop clean, mobile compact */
/* =========================
   LARGE LAPTOP
========================= */
@media (max-width:1240px){

    .vf-topbar-center{
        display:none;
    }

    .vf-topbar-inner{
        grid-template-columns:1fr auto;
    }

    .vf-brand-inner{
        grid-template-columns:minmax(245px,310px) minmax(220px,340px) auto;
        gap:12px;
    }

    .vf-nav-item > a{
        font-size:.72rem;
        padding:0 7px;
    }

    .vf-mega-menu{
        width:min(820px,calc(100vw - 36px));
        grid-template-columns:repeat(2,minmax(240px,1fr));
    }
}


/* =========================
   SMALL LAPTOP
========================= */
@media (max-width:1080px){

    .vf-desktop-cta{
        display:none;
    }

    .vf-brand-inner{
        grid-template-columns:minmax(245px,320px) 1fr;
    }

    .vf-search-desktop{
        justify-self:end;
        max-width:340px;
    }

    .vf-nav-item > a{
        font-size:.7rem;
        padding:0 6px;
    }
}


/* =========================
   TABLET + MOBILE
========================= */
@media (max-width:980px){

    body{
        padding-bottom:58px;
    }

    /* Hide Desktop Elements */
    .vf-topbar,
    .vf-search-desktop,
    .vf-desktop-cta,
    .vf-main-nav,
    .vf-brand-inner > .vf-btn,
    .vf-brand-inner .vf-btn-gold{
        display:none !important;
    }

    /* Mobile Header */
    .vf-brand-header{
        background:var(--header-gradient);
        color:var(--white);
    }

    .vf-brand-inner{
        min-height:66px;
        display:flex;
        justify-content:space-between;
        align-items:center;
        gap:10px;
        padding-top:8px;
        padding-bottom:8px;
    }

    .vf-logo{
        width:50px;
        height:50px;
        flex-basis:50px;
    }

    .vf-logo-fallback{
        width:50px;
        height:50px;
        flex-basis:50px;
        border-width:2px;
    }

    .vf-brand-link{
        gap:9px;
    }

    .vf-brand-copy strong{
        color:var(--white);
        font-size:1rem;
        letter-spacing:.045em;
    }

    .vf-brand-copy em{
        color:var(--soft-gold);
        font-size:.7rem;
    }

    /* Mobile Action Buttons */
    .vf-mobile-actions{
        display:flex;
        gap:6px;
    }

    .vf-icon-btn,
    .vf-menu-toggle{
        width:38px;
        height:38px;
        background:rgba(255,255,255,.10);
        border:1px solid rgba(242,210,122,.32);
        color:var(--white);
    }

    .vf-menu-toggle span{
        background:var(--white);
    }

    /* Bottom Action Bar */
    .vf-mobile-bottom-bar{
        position:fixed;
        left:0;
        right:0;
        bottom:0;
        height:56px;
        display:grid;
        grid-template-columns:1fr 1fr 1.4fr;
        z-index:1200;
        box-shadow:0 -10px 25px rgba(7,26,51,.18);
    }

    .vf-mobile-bottom-bar a{
        display:grid;
        place-items:center;
        font-weight:900;
        background:var(--white);
        color:var(--navy);
        border-right:1px solid rgba(10,35,66,.09);
    }

    .vf-mobile-bottom-bar a:last-child{
        background:var(--gold-gradient);
        color:var(--deep);
    }
}


/* =========================
   SMALL MOBILE
========================= */
@media (max-width:520px){

    .vf-container{
        padding:0 12px;
    }

    .vf-brand-copy strong{
        font-size:.88rem;
    }

    .vf-brand-copy em{
        font-size:.64rem;
    }

    .vf-mobile-actions{
        gap:4px;
    }

    .vf-icon-btn,
    .vf-menu-toggle{
        width:35px;
        height:35px;
        border-radius:10px;
    }

    .vf-search-box form{
        flex-direction:column;
    }

    .vf-search-box .vf-btn{
        width:100%;
    }
}