/* ==========================================================================
   Quits Aviation Group — Corporate Theme (Phase 2)
   Aesthetic: bright, confident, conglomerate. Coral-red + deep navy + blue.
   Light surfaces, bold geometric display type. Matches the corporate profile.
   ========================================================================== */
:root{
  --bg:#f6f8fc; --surface:#ffffff; --surface-2:#eef2f9; --text:#101a30;
  --muted:#566178; --border:rgba(16,26,48,.10);
  --accent:#ee3b33; --accent-2:#2547e6; --accent-ink:#ffffff;
  --header-bg:rgba(255,255,255,.86); --nav-link:#101a30;
  --hero-overlay:linear-gradient(100deg,rgba(9,16,34,.86) 6%,rgba(9,16,34,.55) 52%,rgba(9,16,34,.22) 100%);
  --hero-lead:rgba(255,255,255,.9);
  --input-bg:#f4f6fb; --input-bg-focus:#ffffff;
  --cta-bg:linear-gradient(120deg,#101a30,#1c2b4d);
  --footer-bg:#0c1526;
  --shadow-sm:0 2px 12px rgba(16,26,48,.08);
  --shadow:0 24px 60px -24px rgba(16,26,48,.28);
  --shadow-lg:0 50px 100px -34px rgba(16,26,48,.34);
  --font-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-display:"Sora","Inter",system-ui,sans-serif;
  --header-h:84px;
}
h1,.h1,h2,.h2,.display{font-weight:800;letter-spacing:-.025em}
h3,.h3{font-weight:700}

/* header sits on light hero — keep text readable before scroll on media heroes */
.site-header .brand{color:#fff}
.site-header .nav-links a{color:rgba(255,255,255,.9)}
.site-header .nav-toggle{border-color:rgba(255,255,255,.35)}
.site-header .nav-toggle span{background:#fff}
.site-header.is-scrolled .brand{color:var(--text)}
.site-header.is-scrolled .nav-links a{color:var(--text)}
.site-header.is-scrolled .nav-toggle{border-color:var(--border)}
.site-header.is-scrolled .nav-toggle span{background:var(--text)}
/* pages without a media hero use the solid header from the start */
body.header-solid .site-header{background:var(--header-bg);backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);border-bottom-color:var(--border);box-shadow:var(--shadow-sm)}
body.header-solid .site-header .brand{color:var(--text)}
body.header-solid .site-header .nav-links a{color:var(--text)}
body.header-solid .site-header .nav-toggle{border-color:var(--border)}
body.header-solid .site-header .nav-toggle span{background:var(--text)}
@media (max-width:960px){.nav .nav-links a{color:var(--text)!important}}

/* media heroes sit on dark photography — force light text inside them */
.hero .display,.hero h1,.hero .h1,
.page-hero--media h1,.page-hero--media .h1{color:#fff}
.hero .hero-stats .stat__num{color:#fff}
.hero .hero-stats .stat__label{color:rgba(255,255,255,.78)}
.hero .btn-outline,.page-hero--media .btn-outline{border-color:rgba(255,255,255,.45);color:#fff}
.hero .btn-outline:hover,.page-hero--media .btn-outline:hover{border-color:#fff;color:#fff}
.page-hero--media .breadcrumb{color:rgba(255,255,255,.75)}
.page-hero--media .lead{color:rgba(255,255,255,.88)}

/* light-theme recolored icons (tick + accordion) to coral */
.ticks li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ee3b33' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")}
.acc__q::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ee3b33' stroke-width='2.5' stroke-linecap='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E")}

/* non-media interior page hero: light with navy text */
.page-hero--plain{background:radial-gradient(1100px 520px at 88% -20%,rgba(37,71,230,.10),transparent 60%),
  radial-gradient(760px 420px at -6% 8%,rgba(238,59,51,.08),transparent 60%),var(--surface-2)}
.page-hero--plain .breadcrumb,.page-hero--plain h1,.page-hero--plain .lead{color:var(--text)}
.page-hero--plain .breadcrumb{color:var(--muted)}
.page-hero--plain .lead{color:var(--muted)}

/* alternating section shading */
.section--alt{background:var(--surface-2)}
.section--dark{background:var(--footer-bg);color:#eaf0fb;--text:#eaf0fb;--muted:#9fb0c9;--border:rgba(255,255,255,.10);--surface:#132038;--surface-2:#182848}
.section--dark .eyebrow{color:#ff7a6b}
.section--dark .card{background:#132038}

/* CTA band sits on the navy gradient — force light text */
.cta{color:#eaf0fb}
.cta h2{color:#fff}
.cta .lead{color:rgba(255,255,255,.82)}
.cta .btn-outline{border-color:rgba(255,255,255,.45);color:#fff}
.cta .btn-outline:hover{border-color:#fff;color:#fff}
.cta .eyebrow{color:#ff8d7f}
.cta__glow{opacity:.35}

/* sector cards get a coral top-edge on hover */
.sector{position:relative}
.sector::before{content:"";position:absolute;left:0;top:0;height:4px;width:0;background:var(--accent);
  border-radius:4px 4px 0 0;transition:width .5s var(--ease)}
.sector:hover::before{width:100%}

/* red accent number */
.stat__num .suffix{color:var(--accent)}
.text-accent{color:var(--accent)}

/* pill on light */
.pill{background:var(--surface);box-shadow:var(--shadow-sm)}

/* big red quote mark */
.quote{font-family:var(--font-display);font-weight:600;font-size:clamp(1.35rem,2.6vw,2rem);line-height:1.4;letter-spacing:-.015em}

/* timeline dot on light */
.tl::before{background:var(--bg)}

/* selection */
::selection{background:var(--accent);color:#fff}

/* value badge */
.kbadge{display:inline-grid;place-items:center;min-width:60px;height:60px;padding:0 14px;border-radius:16px;
  background:linear-gradient(135deg,var(--accent),#c62b28);color:#fff;font-family:var(--font-display);font-weight:800;font-size:1.4rem;box-shadow:var(--shadow-sm)}

/* ==========================================================================
   Dark theme — "Night operations": deep navy, luminous coral.
   Activated via <html data-theme="dark">. Light remains the brand default.
   ========================================================================== */
html[data-theme="dark"]{
  --bg:#0b1424; --surface:#12203a; --surface-2:#182a4c; --text:#e9effb;
  --muted:#9db0cd; --border:rgba(255,255,255,.11);
  --accent:#f0483f; --accent-2:#5b78ff; --accent-ink:#ffffff;
  --header-bg:rgba(10,17,32,.86); --nav-link:#e9effb;
  --input-bg:rgba(255,255,255,.05); --input-bg-focus:rgba(255,255,255,.08);
  --footer-bg:#081120;
  --shadow-sm:0 2px 12px rgba(2,8,23,.3);
  --shadow:0 24px 60px -24px rgba(2,8,23,.55);
  --shadow-lg:0 50px 100px -34px rgba(2,8,23,.6);
}
html[data-theme="dark"] body{background:
  radial-gradient(1100px 520px at 88% -20%,rgba(91,120,255,.09),transparent 60%),
  radial-gradient(760px 420px at -6% 8%,rgba(240,72,63,.07),transparent 60%),
  var(--bg)}
html[data-theme="dark"] .page-hero--plain{background:
  radial-gradient(1100px 520px at 88% -20%,rgba(91,120,255,.12),transparent 60%),
  radial-gradient(760px 420px at -6% 8%,rgba(240,72,63,.1),transparent 60%),var(--surface-2)}
html[data-theme="dark"] .section--dark{background:#060d1a}
html[data-theme="dark"] .pill{background:var(--surface);box-shadow:none}
html[data-theme="dark"] .person{box-shadow:none}
html[data-theme="dark"] .tl::before{background:var(--bg)}
html[data-theme="dark"] ::selection{background:var(--accent);color:#fff}

/* theme toggle icons: light default shows the moon (switch to dark) */
.theme-toggle .i-sun{display:none}
html[data-theme="dark"] .theme-toggle .i-moon{display:none}
html[data-theme="dark"] .theme-toggle .i-sun{display:block}

/* toggle follows the header's on-media / scrolled colour states */
.site-header .theme-toggle{color:#fff;border-color:rgba(255,255,255,.35)}
.site-header.is-scrolled .theme-toggle,
body.header-solid .site-header .theme-toggle{color:var(--text);border-color:var(--border)}
.site-header .theme-toggle:hover{color:var(--accent);border-color:var(--accent)}

/* leadership card */
.person{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow-sm);transition:transform var(--t),box-shadow var(--t)}
.person:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.person__avatar{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-display);
  font-weight:800;font-size:1.4rem;color:#fff;background:linear-gradient(135deg,var(--accent),#b62521);margin-bottom:18px}
.person h3{font-size:1.15rem}
.person .role{color:var(--accent);font-weight:600;font-size:.9rem;margin:2px 0 12px}
.person p{color:var(--muted);font-size:.94rem}
