/* AfterVisitAI Pioneer Standard UI Alignment */

@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&family=Open+Sans:wght@400;500;600&display=swap");

:root{
  --ava-navy:#003366;
  --ava-teal:#0099cc;
  --ava-bg:#f4f9fa;
  --ava-text:#0c2747;      /* readable navy text */
  --ava-muted:#496a8f;     /* subtle secondary */
  --ava-ring:#00a6da;      /* focus ring */

  --fs-h1: clamp(40px, 5vw, 48px);
  --fs-h2: clamp(28px, 3vw, 32px);
  --fs-h3: clamp(22px, 2.4vw, 26px);
  --fs-body: 17px;
}

html{ background:var(--ava-bg); }
body{
  font-family:"Open Sans",system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--ava-text);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

h1,h2,h3{ font-family:"Montserrat",system-ui,sans-serif; color:var(--ava-navy); letter-spacing:.02em; }
h1{ font-weight:700; font-size:var(--fs-h1); line-height:1.2; }
h2{ font-weight:600; font-size:var(--fs-h2); line-height:1.25; }
h3{ font-weight:600; font-size:var(--fs-h3); line-height:1.3; }
p,a,li{ font-size:var(--fs-body); line-height:1.6; }

.container{ width:min(1200px,92%); margin:0 auto; }

/* ===== Sticky Header (uniform on ALL pages) ===== */
.ava-header{
  position:sticky; top:0; z-index:1000;
  background:var(--ava-bg);
  border-bottom:1px solid rgba(0,0,0,.06);
  backdrop-filter:saturate(140%) blur(6px);
}
.ava-header-inner{
  display:flex; align-items:center; justify-content:space-between;
  height:64px;
}
.nav{ display:flex; align-items:center; gap:8px; }
.nav a{
  color:var(--ava-navy); text-decoration:none;
  padding:10px 12px; font-weight:500; letter-spacing:.03em; border-radius:6px;
}
.nav a:hover{ text-decoration:underline; text-underline-offset:3px; }
.nav a:focus-visible{ outline:2px solid var(--ava-ring); outline-offset:2px; }

/* ===== Buttons (shared + accessible) ===== */
.btn{ display:inline-block; padding:10px 18px; border-radius:12px; font-weight:600; letter-spacing:.03em; border:1px solid transparent; }
.btn-primary{ background:var(--ava-teal); color:#fff; box-shadow:0 2px 0 rgba(0,0,0,.12); }
.btn-primary:hover{ filter:brightness(.96); }
.btn-primary:focus-visible{ outline:2px solid var(--ava-navy); outline-offset:2px; }
.btn-secondary{ background:transparent; color:var(--ava-navy); border-color:rgba(0,51,102,.25); }
.btn-secondary:hover{ background:rgba(0,153,204,.08); border-color:var(--ava-teal); }

/* ===== Heroes (consistent) ===== */
.ava-hero{ padding:clamp(56px,9vw,110px) 0; text-align:center; }
.ava-hero-gradient{
  background:linear-gradient(135deg, var(--ava-navy) 0%, #03417d 40%, var(--ava-teal) 100%);
  color:#fff;
}
.ava-hero-gradient h1, .ava-hero-gradient p{ color:#fff; }
.ava-hero-gradient p{ color:#eaf6fb; }
.ava-hero *{ filter:none !important; opacity:1 !important; mix-blend-mode:normal !important; }

/* ===== Cards / feature sections ===== */
.card{
  background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:14px;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}

/* ===== Footer (legal links) ===== */
footer{ padding:32px 0; text-align:center; color:rgba(0,51,102,.9); }
footer a{ color:var(--ava-navy); }
footer a:focus-visible{ outline:2px solid var(--ava-ring); outline-offset:2px; }

/* ===== Remove legacy per-page tints/overlays ===== */
.hero, .banner, .cover{ background-image:none !important; }
.overlay, .tint { display:none !important; opacity:0 !important; }

/* ===== Brand elements ===== */
.brand{ display:flex; align-items:center; text-decoration:none; }
.brand img{ height:28px; width:auto; }

/* ===== Responsive adjustments ===== */
@media (max-width: 768px) {
  .ava-header-inner{ height:56px; }
  .nav{ gap:4px; }
  .nav a{ padding:8px 10px; font-size:15px; }
  .btn{ padding:8px 16px; font-size:15px; }
  .ava-hero{ padding:clamp(40px,8vw,80px) 0; }
}

@media (max-width: 480px) {
  .nav{ flex-direction:column; gap:2px; }
  .ava-header-inner{ height:auto; padding:8px 0; }
}

/* Header layout improvements */
.ava-header-inner{
  display:flex; align-items:center; justify-content:space-between;
  height:64px;
}
.brand-area{
  display:flex; align-items:center; gap:10px;
}
.brand-wordmark{
  font-family:"Montserrat", system-ui, sans-serif;
  font-weight:700; letter-spacing:.02em;
  color:var(--ava-navy);
  font-size:18px;
  line-height:1;
}

.nav{ margin-left:auto; display:flex; align-items:center; gap:8px; } /* pushes nav to RIGHT */
.nav a{
  color:var(--ava-navy); text-decoration:none;
  padding:10px 12px; font-weight:500; letter-spacing:.03em; border-radius:6px;
}
.nav a:hover{ text-decoration:underline; text-underline-offset:3px; }
.nav a:focus-visible{ outline:2px solid var(--ava-ring); outline-offset:2px; }

/* Right-side action area (optional CTA on non-home pages) */
.header-actions{ margin-left:12px; }

/* Optional: keep header CTA hidden on Home only */
.page-home .header-actions{ display:none; }   /* remove header CTA only on Home */

/* === No-underlines for header/nav/buttons === */
.nav a,
.brand-wordmark,
.btn,
.btn-primary,
.btn-secondary {
  text-decoration: none !important;
}

.nav a:hover,
.nav a:focus-visible,
.brand-wordmark:hover,
.brand-wordmark:focus-visible,
.btn:hover,
.btn:focus-visible {
  text-decoration: none !important;
}

/* Optional polish: subtle color change instead of underline for feedback */
.nav a:hover { color: var(--ava-teal); }
.nav a:focus-visible { outline: 2px solid var(--ava-ring); outline-offset: 2px; }

.btn:hover { filter: brightness(0.96); }
.btn:focus-visible { outline: 2px solid var(--ava-navy); outline-offset: 2px; }

.brand-wordmark:hover { color: var(--ava-teal); }
.brand-wordmark:focus-visible { outline: 2px solid var(--ava-ring); outline-offset: 2px; }

/* ---------------------------
   A) Header wordmark = same as nav
   --------------------------- */
.brand-area{ display:flex; align-items:center; gap:10px; }
.brand-area img{ height:28px; }

.brand-wordmark{
  font-family:"Montserrat", system-ui, sans-serif;
  /* Match nav sizing */
  font-size: var(--fs-body);     /* same as .nav a text */
  font-weight: 500;              /* same as .nav a weight */
  letter-spacing: .03em;
  line-height: 1;
  color: var(--ava-navy);
  text-decoration: none !important;
}

/* Hover/focus feedback (no underline) */
.brand-wordmark:hover{ color: var(--ava-teal); text-decoration: none !important; }
.brand-wordmark:focus-visible{ outline: 2px solid var(--ava-ring); outline-offset: 2px; }

/* Ensure ALL header links + buttons never underline */
.nav a,
.nav a:hover,
.nav a:focus-visible,
.btn,
.btn:hover,
.btn:focus-visible{
  text-decoration: none !important;
}

/* ---------------------------
   B) Fix yellow banner / hero tint
   --------------------------- */
/* Force all light heroes/banners to use brand background (no yellow) */
.ava-hero{ background: var(--ava-bg) !important; }

/* Neutralize legacy "yellow-ish" classes some exports use */
.hero, .banner, .cover, .strip, .band, .page-hero, .hero--light{
  background: var(--ava-bg) !important;
  background-image: none !important;
  filter: none !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}

/* If the DEI page uses the gradient hero, keep it blue there only */
.dei .ava-hero.ava-hero-gradient{
  background: linear-gradient(135deg, var(--ava-navy) 0%, #03417d 40%, var(--ava-teal) 100%) !important;
  color: #fff;
}

/* ---------------------------
   C) Keep nav RIGHT-aligned
   --------------------------- */
.ava-header-inner{ display:flex; align-items:center; justify-content:space-between; height:64px; }
.nav{ margin-left:auto; display:flex; align-items:center; gap:8px; }
.nav a{
  color:var(--ava-navy);
  padding:10px 12px;
  font-weight:500;
  letter-spacing:.03em;
  border-radius:6px;
}
.nav a:hover{ color: var(--ava-teal); }
.nav a:focus-visible{ outline:2px solid var(--ava-ring); outline-offset:2px; }

/* Optional: hide header CTA on Home only (to avoid duplicate) */
.page-home .header-actions{ display:none; }
