:root {
  --primary-bg:#000000; --text-color:#FFFFFF; --accent-color:#cc0a2f; --gray-light:#B0B0B0; --gray-dark:#333333;
}
html, body { margin:0; padding:0; font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; }

/* Home (index) scoped styles */
body.qdef { background-color:var(--primary-bg); color:var(--text-color); line-height:1.6; overflow-x:hidden; scroll-behavior:smooth; }
body.qdef h1,body.qdef h2,body.qdef h3,body.qdef h4,body.qdef h5,body.qdef h6{font-weight:800;color:var(--text-color);margin-top:0;margin-bottom:.5em}
body.qdef a{color:var(--accent-color);text-decoration:none;transition:color .3s ease}
body.qdef a:hover{color:var(--text-color)}
body.qdef .container{max-width:1200px;margin:0 auto;padding:40px 20px}
body.qdef .text-center{text-align:center}

/* Navbar */
body.qdef .navbar{position:fixed;top:0;left:0;width:100%;background:transparent;backdrop-filter:blur(10px);z-index:1000;padding:10px 0;border:none;border-bottom:1px solid rgba(255,255,255,.85);transition:background .3s ease, border-color .3s ease}
@media (hover:hover){
  body.qdef .navbar:hover, body.qdef .navbar:focus-within, body.qdef .navbar.menu-open{background:rgba(0,0,0,.7);border-bottom-color:rgba(255,255,255,.85)}
}
@media (hover:none){
  body.qdef .navbar{background:rgba(0,0,0,.7);border-bottom-color:rgba(255,255,255,.85)}
}
body.qdef .navbar .container{display:flex;align-items:center;justify-content:space-between;padding:0 24px;gap:16px;flex-wrap:nowrap;max-width:none;width:100%;margin:0;position:relative}
body.qdef .navbar .brand-box{display:flex;align-items:center;padding:6px 16px 6px 12px;margin-right:16px;border:0;min-height:64px;position:relative}
body.qdef .navbar .brand-box::after{content:"";position:absolute;right:-32px;top:-10px;bottom:-10px;width:1px;background:rgba(255,255,255,.85);pointer-events:none}
body.qdef .navbar-brand{font-size:1.4em;font-weight:800;color:var(--text-color);display:flex;align-items:center}
body.qdef .navbar-brand img.logo{height:64px;width:auto;margin-right:10px}
body.qdef .navbar-brand .brand-title{line-height:1;text-transform:uppercase;font-weight:600}
/* Small separator between logo and brand text */
body.qdef .navbar-brand .brand-sep{display:inline-block;align-self:center;width:0;height:32px;border-left:1px solid rgba(255,255,255,.65);margin:0 16px 0 12px}
body.qdef .nav-links{list-style:none;margin:0;padding:0 72px 0 0;display:flex;flex:1 1 auto;justify-content:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;position:relative;z-index:1}
body.qdef .nav-links::-webkit-scrollbar{display:none}
body.qdef .nav-links li{margin-left:20px;flex:0 0 auto}
body.qdef .nav-links a{color:var(--gray-light);font-weight:500;font-size:1.02em;transition:color .3s ease,transform .2s ease;position:relative;padding-bottom:6px;white-space:nowrap;display:inline-block}
/* Hover and click animations */
body.qdef .nav-links a{padding:6px 8px 5px;border-radius:6px;transition:color .25s ease}
body.qdef .nav-links a:hover{color:var(--text-color);background:transparent;transform:none}
/* Remove click box highlight */
body.qdef .nav-links a:active, body.qdef .nav-links a.clicked{background:transparent;color:inherit;transform:none}
body.qdef .nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent-color);transform:scaleX(0);transform-origin:left;transition:transform .25s ease;z-index:2;pointer-events:none}
body.qdef .nav-links a:hover{color:var(--text-color)}
body.qdef .nav-links a:hover::after{transform:scaleX(1)}
/* Active/current page state */
body.qdef .nav-links a.active, body.qdef .nav-links a[aria-current="page"]{color:var(--text-color)}
body.qdef .nav-links a.active::after, body.qdef .nav-links a[aria-current="page"]::after{transform:scaleX(1)}

/* Right-side menu toggle */
body.qdef .menu-box{margin-left:16px;flex:0 0 auto;display:flex;align-items:center;position:relative;min-height:64px;z-index:2}
body.qdef .menu-box::before{content:"";position:absolute;left:-32px;top:-10px;bottom:-10px;width:1px;background:rgba(255,255,255,.85);pointer-events:none}
body.qdef .menu-toggle{height:48px;min-width:48px;display:flex;align-items:center;justify-content:center;padding:0;background:transparent;color:#fff;border:0;border-radius:0;cursor:pointer;position:relative}
body.qdef .menu-toggle:hover{background:rgba(255,255,255,.06)}
body.qdef .menu-toggle[aria-expanded="true"]{background:var(--accent-color);color:#000;border-color:var(--accent-color)}

/* Global full-width menu */
body.qdef .global-menu{position:absolute;left:0;right:0;top:100%;background:rgba(0,0,0,.96);border-top:1px solid rgba(255,255,255,.12);box-shadow:0 20px 40px rgba(0,0,0,.6)}
body.qdef .global-menu[hidden]{display:none}
body.qdef .global-menu .menu-inner{padding:28px 20px 32px}
/* Center submenu content under the main nav */
body.qdef .global-menu .menu-inner{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
body.qdef .global-menu .menu-header{font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#e6e6e6;margin-bottom:14px;text-align:center}
/* Tighten vertical spacing between sections in submenu */
body.qdef .global-menu .menu-links + .menu-header{margin-top:8px}
body.qdef .global-menu .menu-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 16px;width:100%;justify-content:center}
body.qdef .global-menu .menu-links li{flex:0 1 auto}
body.qdef .global-menu .menu-links a{display:inline-flex;align-items:center;padding:10px 12px;border:1px solid rgba(255,255,255,.12);border-radius:8px;color:#d4d4d4;white-space:nowrap}
body.qdef .global-menu .menu-links a:hover{color:#000;background:var(--accent-color);border-color:var(--accent-color)}
body.qdef .global-menu .menu-links a.menu-highlight{background:var(--accent-color);color:#000;border-color:var(--accent-color);font-weight:800}
body.qdef .global-menu .menu-links a.menu-highlight:hover{filter:brightness(0.95)}

/* Header action buttons */
body.qdef .nav-actions{display:flex;gap:12px;margin-left:16px;position:relative;left:-64px;z-index:2}
body.qdef .nav-actions .btn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 14px;border:1px solid rgba(255,255,255,.85);border-radius:8px;color:#fff;background:transparent;font-weight:600;letter-spacing:.02em}
body.qdef .nav-actions .btn:hover{background:var(--accent-color);color:#000;border-color:var(--accent-color)}

/* Hero (reference overlay; staged media sit underneath) */
body.qdef .hero{height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden;background:url('/static/hero.png') center/cover no-repeat;background-color:#000}
body.qdef .hero .hero-stage{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
body.qdef .hero .hero-stage .layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;opacity:0;transition:opacity .6s ease}
body.qdef .hero .hero-stage .layer.active{opacity:1}
body.qdef .hero::after{content:"";position:absolute;left:0;right:0;top:0;bottom:0;z-index:1;background:
  linear-gradient(100deg, rgba(0,0,0,.84) 0%, rgba(0,0,0,.76) 55%, rgba(0,0,0,.66) 100%);pointer-events:none}
@keyframes pan-bg{0%{background-position:0% 0%}100%{background-position:100% 100%}}
body.qdef .hero-content{position:relative;z-index:2;max-width:800px;padding:0 20px}
body.qdef .hero h1{font-size:4em;margin-bottom:20px;line-height:1.1;letter-spacing:0;font-weight:900;text-shadow:0 0 10px rgba(0,0,0,.5)}
body.qdef .hero h1 .h1-static{display:block}
body.qdef .hero .eyebrow{letter-spacing:.12em;color:#ffb3b3;text-transform:uppercase;font-weight:700;font-size:.8rem;margin-bottom:12px}
body.qdef .hero .lead{font-size:1.15rem;max-width:850px;color:#c7d4e5;margin:0 auto 32px;font-weight:300}
/* Rotating phrase in hero */
body.qdef .hero .rotator{display:block;position:relative;margin-top:6px;white-space:nowrap;text-align:center;margin-left:auto;margin-right:auto;max-width:90vw;min-height:1.1em;line-height:1.1}
body.qdef .hero .rotator-item{display:inline-block;white-space:nowrap;position:relative;min-height:1.1em;line-height:1.1}
/* Caret stays attached to the typed phrase without affecting width */
body.qdef .hero .rotator-item::after{content:"";position:absolute;right:-2px;top:0;display:block;width:2px;height:1em;background:#fff;animation:blink 1s steps(1,end) infinite}

@keyframes blink{50%{opacity:0}}

/* Buttons and focus */
body.qdef .btn-primary{background-color:var(--accent-color);color:var(--primary-bg);padding:15px 30px;border-radius:5px;font-weight:700;letter-spacing:.5px;transition:background-color .3s ease,color .3s ease,transform .2s ease;display:inline-block;border:none}
/* Hero CTA: transparent with white stroke; hover red */
body.qdef .hero .btn-primary{background:transparent;color:#ffffff;border:2px solid #ffffff}
body.qdef .hero .btn-primary:hover{background:var(--accent-color);color:#000;transform:translateY(-3px);border-color:var(--accent-color)}
/* Equal-width hero CTAs with spacing */
body.qdef .hero .btn-primary{width:240px;max-width:100%;text-align:center}
body.qdef .hero .btn-primary + .btn-primary{margin-left:12px}
body.qdef a:focus-visible,body.qdef .btn-primary:focus-visible{outline:2px solid var(--accent-color);outline-offset:3px}
body.qdef .nav-links a:focus-visible{color:var(--text-color)}
body.qdef .skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
body.qdef .skip-link:focus{position:fixed;left:20px;top:20px;width:auto;height:auto;background:#111;color:#fff;padding:10px 14px;border:1px solid var(--accent-color);border-radius:6px;z-index:2000}
/* Accessibility helper */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Contact form + modal (shared) */
.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:720px){ .form-row{grid-template-columns:1fr} }
.form-field{display:flex;flex-direction:column;gap:6px}
.form-field label{font-weight:700}
.input{height:48px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.25);color:white;padding:0 12px;outline:none}
.input:focus{border-color:#88c0ff;box-shadow:0 0 0 3px rgba(136,192,255,.3)}
.validation{font-size:13px;color:#ffecec;display:none}
.invalid .validation{display:block}
.form-card{background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.22);border-radius:16px;padding:22px}
.btn.btn-outline{background:transparent;color:#f5f7fa;border:2px solid #f5f7fa}
.small{font-size:13px}
.hstack{display:flex;align-items:center;gap:12px}
/* Modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.66);display:flex;align-items:center;justify-content:center;z-index:2000;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease}
.modal-backdrop.open{opacity:1;visibility:visible;pointer-events:auto}
.modal{background:#050505;border:1px solid rgba(255,255,255,.14);border-radius:16px;max-width:640px;width:92%;box-shadow:0 20px 60px rgba(0,0,0,.5);transform:translateY(6px) scale(.98);opacity:0;transition:transform .25s cubic-bezier(.2,.7,.2,1), opacity .25s ease;will-change:transform,opacity}
.modal-backdrop.open .modal{transform:translateY(0) scale(1);opacity:1}
.modal header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.12);padding:14px 18px}
.modal header h3{margin:0}
.modal .modal-body{padding:18px}
.modal .close-btn{appearance:none;background:transparent;border:0;color:#e5e7eb;cursor:pointer;font-size:22px;line-height:1}
@media (prefers-reduced-motion: reduce){.modal-backdrop, .modal{transition:none !important}}

/* Page transition overlay */
.page-transition{position:fixed;inset:0;background:rgba(0,0,0,.9);opacity:0;pointer-events:none;transition:opacity .24s ease;z-index:3000}
.page-transition.visible{opacity:1}
@media (prefers-reduced-motion: reduce){
  .page-transition{transition:none}
}

/* Sections */
body.qdef section{padding:80px 0;position:relative}
body.qdef section h2{font-size:3em;text-align:center;margin-bottom:60px;position:relative;letter-spacing:.5px;font-weight:800}
body.qdef section h2::after{content:'';display:block;width:60px;height:3px;background:var(--accent-color);margin:15px auto 0}

/* Systems grid cards on home */
body.qdef .systems-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px}
body.qdef .system-card{background-color:var(--primary-bg);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:30px;text-align:center;box-shadow:0 5px 15px rgba(0,0,0,.3);transition:transform .3s ease,box-shadow .3s ease}
body.qdef .system-card:hover{transform:translateY(-10px);box-shadow:0 10px 25px rgba(0,0,0,.5);border-color:var(--accent-color)}
body.qdef .system-card .icon{font-size:3em;color:var(--accent-color);margin-bottom:20px}
body.qdef .system-card h3{font-size:1.8em;margin-bottom:15px;font-weight:700}
body.qdef .system-card p{color:var(--gray-light);font-weight:400}

/* Generic grid/card for home sections */
body.qdef .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
body.qdef .card{background-color:var(--primary-bg);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:24px;text-align:left;transition:transform .3s ease,box-shadow .3s ease}
body.qdef .card:hover{transform:translateY(-6px);box-shadow:0 8px 20px rgba(0,0,0,.45);border-color:var(--accent-color)}
/* Dark section variant */
body.qdef .section-dark{background-color:#050505;color:#f8f9fa}

/* Footer */
body.qdef .footer{background-color:#000000;color:var(--gray-light);padding:60px 0;border-top:1px solid rgba(255,255,255,.05);font-size:.9em;text-align:center}
body.qdef .footer .container{display:flex;justify-content:space-between;flex-wrap:wrap;text-align:left}
body.qdef .footer-col{flex:1;min-width:200px;margin-bottom:30px}
body.qdef .footer-col h4{font-size:1.2em;margin-bottom:20px;color:var(--text-color);font-weight:700}

/* Responsive */
@media (max-width:992px){body.qdef .capabilities-grid{grid-template-columns:1fr}body.qdef .capabilities-image{margin-top:40px}}
@media (max-width:768px){body.qdef .navbar .container{gap:12px}body.qdef .nav-links{margin-left:0;justify-content:flex-start}body.qdef .nav-links li{margin:0 12px 0 0}body.qdef .hero h1{font-size:2.4em}body.qdef .hero p{font-size:1.05em}body.qdef section h2{font-size:2.2em}body.qdef .footer .container{flex-direction:column;align-items:center}body.qdef .footer-col{text-align:center}}
@media (max-width:480px){body.qdef .hero h1{font-size:2em}body.qdef .btn-primary{padding:12px 25px}body.qdef section{padding:60px 0}body.qdef section h2{font-size:2em}body.qdef .system-card{padding:25px}body.qdef .system-card h3{font-size:1.5em}body.qdef .capability-item{flex-direction:column;text-align:center}body.qdef .capability-item .icon{margin:0 0 15px 0}}
/* Inset the menu button on home to avoid overlay scrollbars */
body.qdef.home .menu-toggle{margin-right:64px}
@supports (margin: calc(1px + env(safe-area-inset-right))){
  body.qdef.home .menu-toggle{margin-right:calc(64px + env(safe-area-inset-right))}
}