/* ==========================================================================
   AHBHub — shared design system
   Tokens and components derived from the AHBHub Brand Guide (Edition 01).
   Loaded on every page; page-specific sections stay in each page's own
   <style> block.

   Theme model: --bg/--surface/--panel-bg/--ink/--ink-soft/--brand-ink/--line
   flip between light and dark via [data-theme]. --coral / --coral-wash are
   fixed brand accents and never change. Default (no attribute) follows
   prefers-color-scheme; an explicit toggle (assets/js/site.js) sets
   [data-theme="light|dark"] on <html> and persists it to localStorage.
   ========================================================================== */

:root{
  /* fixed brand accent — never theme-flipped */
  --coral:#D85A30;
  --coral-wash:#F3DCCE;

  /* theme-aware tokens — light values (default) */
  --bg:#F1EFE8;
  --surface:#F1EFE8;
  --panel-bg:#0C2D4A;
  --panel-text:#F1EFE8;
  --panel-text-soft:rgba(241,239,232,.68);
  --ink:#2C2C2A;
  --ink-soft:rgba(44,44,42,.62);
  --brand-ink:#0C2D4A;
  --line:rgba(44,44,42,.14);
  --line-invert:rgba(241,239,232,.2);
  --btn-primary-bg:#0C2D4A;
  --btn-primary-text:#F1EFE8;

  --radius:24px;
  --radius-sm:14px;
  --maxw:1280px;
  --pad:64px;
  --ease:cubic-bezier(.22,1,.36,1);

  /* legacy aliases — older inline page styles reference these names */
  --paper:var(--bg);
  --navy:#0C2D4A;
  --on-navy:#F1EFE8;
}

@media(prefers-color-scheme:dark){
  html:not([data-theme="light"]){
    --bg:#0C2D4A;
    --surface:#173F63;
    --panel-bg:#173F63;
    --panel-text:#F1EFE8;
    --panel-text-soft:rgba(241,239,232,.68);
    --ink:#F1EFE8;
    --ink-soft:rgba(241,239,232,.64);
    --brand-ink:#F1EFE8;
    --line:rgba(241,239,232,.16);
    --line-invert:rgba(241,239,232,.24);
    --btn-primary-bg:#F1EFE8;
    --btn-primary-text:#0C2D4A;
  }
}
html[data-theme="dark"]{
  --bg:#0C2D4A;
  --surface:#173F63;
  --panel-bg:#173F63;
  --panel-text:#F1EFE8;
  --panel-text-soft:rgba(241,239,232,.68);
  --ink:#F1EFE8;
  --ink-soft:rgba(241,239,232,.64);
  --brand-ink:#F1EFE8;
  --line:rgba(241,239,232,.16);
  --line-invert:rgba(241,239,232,.24);
  --btn-primary-bg:#F1EFE8;
  --btn-primary-text:#0C2D4A;
}

html{
  scroll-behavior:smooth;
  color-scheme:light;
}
html[data-theme="dark"]{color-scheme:dark;}
@media(prefers-color-scheme:dark){ html:not([data-theme="light"]){color-scheme:dark;} }

*{margin:0;padding:0;box-sizing:border-box;}

body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  font-size:16px;
  line-height:1.5;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  transition:background .4s var(--ease), color .4s var(--ease);
}
body.modal-lock{overflow:hidden;}

h1,h2,h3,h4,.display{
  font-family:'Space Grotesk',sans-serif;
  font-weight:700;
  line-height:0.95;
  letter-spacing:-0.02em;
  color:var(--brand-ink);
}

a{color:inherit;text-decoration:none;}
ul{list-style:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
img{max-width:100%;display:block;}

.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);}
section{position:relative;}
.section-pad{padding-top:140px;padding-bottom:140px;}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:'Space Grotesk',sans-serif;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.eyebrow::before{
  content:"";
  width:6px;height:6px;border-radius:50%;
  background:var(--coral);
  display:inline-block;
}
section.dark{background:var(--panel-bg);color:var(--panel-text);}
section.dark h1,section.dark h2,section.dark h3,section.dark h4{color:var(--panel-text);}
section.dark .eyebrow{color:var(--panel-text-soft);}
section.dark .ink-soft-invert{color:var(--panel-text-soft);}

.accent{color:var(--panel-text);background:var(--coral);padding:0 .1em;border-radius:.12em;}
.accent-text{color:var(--coral);}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:16px 26px;
  border-radius:100px;
  font-family:'Space Grotesk',sans-serif;
  font-size:13.5px;
  font-weight:600;
  letter-spacing:0.04em;
  transition:transform .3s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
  white-space:nowrap;
}
.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text);}
.btn-primary:hover{background:var(--coral);color:#F1EFE8;transform:translateY(-2px);}
.btn-ghost{border:1px solid var(--line);color:var(--ink);}
.btn-ghost:hover{border-color:var(--coral);color:var(--coral);transform:translateY(-2px);}
section.dark .btn-ghost{border-color:var(--line-invert);color:var(--panel-text);}
section.dark .btn-ghost:hover{border-color:var(--coral);color:var(--coral);}
.btn-arrow{transition:transform .3s var(--ease);}
.btn:hover .btn-arrow{transform:translateX(4px);}
.btn:disabled,.btn[disabled]{opacity:.5;cursor:not-allowed;}
.btn:disabled:hover,.btn[disabled]:hover{transform:none;}
.btn-sm{padding:11px 20px;font-size:12.5px;}

/* ---------- LOGO / WORDMARK ---------- */
.logo{
  font-family:'Archivo Black',sans-serif;
  display:inline-flex;
  flex-direction:column;
  line-height:.86;
  letter-spacing:-.01em;
  text-transform:uppercase;
  font-size:14px;
}
.logo span{display:block;}
.logo .l-top{color:var(--coral);}
.logo .l-bottom{color:var(--brand-ink);}
.logo.on-navy .l-bottom{color:#F1EFE8;}

/* ---------- NAV ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  padding:20px var(--pad);
  display:flex;align-items:center;justify-content:space-between;
  background:color-mix(in srgb, var(--bg) 72%, transparent);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  transition:padding .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease);
}
header.scrolled{padding:13px var(--pad);background:color-mix(in srgb, var(--bg) 94%, transparent);}
header .logo{font-size:15px;}

nav.primary-nav{display:flex;gap:32px;}
nav.primary-nav a{
  font-size:14px;font-weight:500;position:relative;padding:4px 0;
}
nav.primary-nav a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--coral);
  transition:width .3s var(--ease);
}
nav.primary-nav a:hover::after{width:100%;}
nav.primary-nav a.current{color:var(--coral);}
nav.primary-nav a.current::after{width:100%;}

.nav-right{display:flex;align-items:center;gap:16px;}
.hamburger{display:none;flex-direction:column;gap:5px;padding:8px;}
.hamburger span{width:22px;height:2px;background:var(--ink);display:block;transition:.3s var(--ease);}

/* ---------- THEME TOGGLE ---------- */
.theme-toggle{
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  color:var(--ink);flex-shrink:0;
  transition:border-color .3s var(--ease), color .3s var(--ease);
}
.theme-toggle:hover{border-color:var(--coral);color:var(--coral);}
.theme-toggle svg{width:17px;height:17px;overflow:visible;}
.theme-toggle .tt-rays{transition:opacity .3s var(--ease);}
.theme-toggle .tt-mask{opacity:0;transform:translate(0,0);transition:transform .45s var(--ease), opacity .3s var(--ease);fill:var(--bg);}
html[data-theme="dark"] .theme-toggle .tt-mask{opacity:1;transform:translate(-7px,3px);}
html[data-theme="dark"] .theme-toggle .tt-rays{opacity:0;}
@media(prefers-color-scheme:dark){
  html:not([data-theme="light"]) .theme-toggle .tt-mask{opacity:1;transform:translate(-7px,3px);}
  html:not([data-theme="light"]) .theme-toggle .tt-rays{opacity:0;}
}

.mobile-nav{
  position:fixed;inset:0;background:var(--panel-bg);z-index:1100;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  padding:0 32px;
  transform:translateY(-100%);
  transition:transform .5s var(--ease), background .4s var(--ease);
}
.mobile-nav.open{transform:translateY(0);}
.mobile-nav a{color:var(--panel-text);font-size:34px;font-family:'Space Grotesk';font-weight:600;padding:9px 0;}
.mobile-nav a.current{color:var(--coral);}
.mobile-nav .close-btn{position:absolute;top:24px;right:28px;color:var(--panel-text);font-size:14px;letter-spacing:.1em;text-transform:uppercase;}
.mobile-nav .mob-cta{margin-top:26px;}
.mobile-nav .mob-foot{position:absolute;bottom:32px;left:32px;display:flex;align-items:center;gap:12px;}
.mobile-nav .mob-foot .theme-toggle{border-color:var(--line-invert);color:var(--panel-text);}
.mobile-nav .mob-foot .theme-toggle .tt-mask{fill:var(--panel-bg);}
.mobile-nav .mob-foot span{color:var(--panel-text-soft);font-size:12px;letter-spacing:.06em;text-transform:uppercase;}

/* ---------- BREADCRUMB ---------- */
.breadcrumb{font-size:12.5px;color:var(--ink-soft);display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.breadcrumb a{color:var(--ink-soft);transition:color .25s var(--ease);}
.breadcrumb a:hover{color:var(--coral);}
.breadcrumb span[aria-current]{color:var(--ink);font-weight:600;}

/* ---------- PAGE HERO (shared across interior pages) ---------- */
.page-hero{min-height:56vh;display:flex;align-items:center;padding-top:150px;padding-bottom:60px;}
.page-hero h1{font-size:clamp(40px,6.6vw,84px);margin-top:18px;}
.page-hero .sub{margin-top:24px;max-width:560px;font-size:16.5px;color:var(--ink-soft);}
.page-hero-ctas{display:flex;gap:16px;margin-top:36px;flex-wrap:wrap;}

/* ---------- SCROLL PROGRESS ---------- */
.scroll-progress{position:fixed;top:0;left:0;height:2px;background:var(--coral);z-index:1200;width:0%;}

/* ---------- REVEAL ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.in{opacity:1;transform:translateY(0);}
.reveal-stagger.in > *{transition-delay:calc(var(--i, 0) * 70ms);}

/* ---------- SHARED FORM FIELDS ---------- */
.field label{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);}
.field input,.field select,.field textarea{
  background:transparent;border:none;border-bottom:1px solid var(--line);
  padding:12px 2px;font-size:15px;font-family:inherit;color:var(--ink);
  transition:border-color .3s var(--ease);
  appearance:none;-webkit-appearance:none;
  width:100%;
}
.field select{cursor:pointer;}
.field select option{color:#2C2C2A;background:#F1EFE8;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--coral);}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:2px solid var(--coral);outline-offset:2px;}
.field textarea{resize:vertical;min-height:80px;}

.fs-badge{
  width:52px;height:52px;border-radius:50%;background:var(--coral);color:#F1EFE8;
  display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:24px;
}

/* ---------- GENERIC ACCESSIBLE FOCUS ---------- */
a:focus-visible,button:focus-visible{outline:2px solid var(--coral);outline-offset:3px;border-radius:4px;}
.skip-link{
  position:absolute;left:16px;top:-60px;z-index:2000;
  background:var(--btn-primary-bg);color:var(--btn-primary-text);
  padding:12px 20px;border-radius:100px;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;
  transition:top .3s var(--ease);
}
.skip-link:focus{top:16px;}

/* ---------- FOOTER ---------- */
footer{background:var(--panel-bg);color:var(--panel-text);padding:100px 0 40px;transition:background .4s var(--ease);}
.footer-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:40px;}
.footer-logo{font-size:26px;}
.footer-tag{margin-top:16px;color:var(--panel-text-soft);font-size:14px;max-width:280px;letter-spacing:.01em;}
.footer-cols{display:flex;gap:70px;flex-wrap:wrap;}
.f-col h5{font-family:'Space Grotesk',sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(241,239,232,.45);margin-bottom:18px;}
.f-col a,.f-col li{font-size:14px;color:var(--panel-text-soft);display:block;margin-bottom:12px;transition:color .25s var(--ease);}
.f-col a:hover{color:var(--coral);}
.footer-bottom{
  margin-top:90px;padding-top:26px;border-top:1px solid var(--line-invert);
  display:flex;justify-content:space-between;font-size:12.5px;color:rgba(241,239,232,.5);flex-wrap:wrap;gap:10px;
}

.count{font-variant-numeric:tabular-nums;}

/* ================= SHARED RESPONSIVE ================= */
@media(max-width:1024px){
  :root{--pad:32px;}
  nav.primary-nav{display:none;}
  .hamburger{display:flex;}
  .nav-right .btn-primary{display:none;}
}
@media(max-width:680px){
  :root{--pad:20px;}
  .section-pad{padding-top:90px;padding-bottom:90px;}
  .footer-cols{gap:36px;}
  .page-hero{padding-top:120px;}
  .page-hero-ctas{flex-direction:column;align-items:stretch;}
  .page-hero-ctas .btn{justify-content:center;}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}
