:root {
  --aoa-navy: #0B2D5B;
  --aoa-blue: #114B8E;
  --aoa-orange: #FF8A00;
  --aoa-cream: #F8F4EB;
  --aoa-paper: #fffdf8;
  --aoa-ink: #0A376F;
  --aoa-muted: #50657a;
  --aoa-line: rgba(11, 45, 91, .16);
  --radius: 10px;
}

* { box-sizing: border-box; }
body {
  color: var(--aoa-ink);
  background: var(--aoa-cream);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

h1, h2, h3,
.principles-intro strong,
.quote-card p,
.research-cta strong,
.model-panel h3,
.grade-card strong,
.curriculum-item strong,
.year strong,
.person strong,
.closing h2 {
  font-family: "Arial Narrow", "Roboto Condensed", "Helvetica Neue", Arial, sans-serif;
  font-weight: 900;
  letter-spacing: -.035em;
}

.wrap { width: min(1440px, calc(100% - 72px)); }
.eyebrow { color: var(--aoa-orange); font-weight: 900; letter-spacing: .18em; }

/* Homepage: the supplied reference hero is the visual authority. */
body:has(.hero) > .site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 10;
  background: transparent;
  border-bottom: 0;
}
body:has(.hero) .nav { min-height: 112px; }body:has(.hero) .nav-links a { color: #fff; opacity: .96; }
body:has(.hero) .nav-links a:hover { color: #ffd1a0; }
body:has(.hero) .nav-links .nav-cta {
  padding: 16px 23px;
  color: #fff;
  background: var(--aoa-orange);
  border-radius: var(--radius);
}
body:has(.hero) .menu-button {
  color: #fff;
  border-color: rgba(255,255,255,.65);
  background: rgba(4,39,83,.30);
}

.hero {
  position: relative;
  min-height: 720px;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(3,32,73,.88) 0%, rgba(3,39,84,.72) 48%, rgba(5,45,90,.12) 100%),
    url("./AOA_Hero.webp") center center / cover no-repeat;
}
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  height: auto;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(10,59,115,.06), rgba(0,26,60,.22));
  box-shadow: none;
}
.hero-grid {
  position: relative;
  z-index: 2;
  display: block;
  min-height: 720px;
  padding: 174px 0 42px;
}
.hero-grid > :first-child {
  position: relative;
  z-index: 3;
  width: min(62%, 930px);
}
.opening-note {
  display: inline-flex;
  margin-bottom: 14px;
  padding: 0;
  color: var(--aoa-orange);
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 18px;
  letter-spacing: .18em;
}
.opening-note::before { display: none; }
.hero h1 {
  max-width: 950px;
  color: #fff;
  font-size: clamp(58px, 5.15vw, 90px);
  line-height: .96;
  text-transform: uppercase;
}
.hero h1 em { color: var(--aoa-orange); font-style: normal; }
.hero-copy {
  max-width: 760px;
  margin-top: 22px;
  color: rgba(255,255,255,.96);
  font-size: 22px;
  line-height: 1.55;
}
.hero-actions { gap: 22px; margin-top: 28px; }
.button {
  min-width: 268px;
  min-height: 64px;
  padding: 16px 23px;
  border: 2px solid rgba(255,255,255,.92);
  border-radius: var(--radius);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.button.primary,
.hero .button.primary { color: #fff; background: var(--aoa-orange); border-color: var(--aoa-orange); }
.button.secondary,
.hero .button.secondary { color: #fff; background: rgba(4,39,83,.36); border-color: rgba(255,255,255,.92); }
.hero-visual { position: static; min-height: 0; }
.hero-photo {
  position: absolute;
  z-index: 1;
  top: -2%;
  right: -2%;
  width: min(49vw, 760px);
  height: auto;
  max-width: none !important;
  object-fit: contain;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: .38;
  filter: saturate(.72) brightness(.86);
  pointer-events: none;
}
.hero-photo { display: none !important; }
.field-note {
  position: relative;
  z-index: 4;
  width: min(620px, 100%);
  margin: 26px 0 0;
  padding: 18px 22px;
  color: #fff;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 12px;
  transform: none;
  box-shadow: none;
}
.field-note small { display: block; margin-bottom: .35rem; font-size: .72rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.field-note strong { font-size: 1.22rem; line-height: 1.25; }
.learning .field-note {
  margin: 0 auto 3rem;
  color: var(--aoa-navy);
  background: var(--aoa-orange);
  border-color: transparent;
}

/* Existing principles become the reference-style feature band without changing their content. */
.principles { position: relative; z-index: 3; color: #fff; background: var(--aoa-navy); }
.principles-grid { grid-template-columns: 1.15fr repeat(3, 1fr); }
.principles-intro, .principle { min-height: 176px; padding: 2rem; }
.principles-intro { padding-left: max(2rem, calc((100vw - 1440px) / 2)); background: rgba(4,35,76,.42); }
.principles-intro p:first-child, .principle span { color: var(--aoa-orange); }
.principles-intro strong { max-width: 280px; font-size: 1.55rem; line-height: 1.08; }
.principle { border-left-color: rgba(255,255,255,.22); }
.principle span { margin-bottom: 1.6rem; }
.principle p { color: rgba(255,255,255,.72); }

section { padding: clamp(4.5rem, 7vw, 6.5rem) 0; }
.section-heading { margin-bottom: 3rem; }
.section-heading .lead { color: var(--aoa-muted); }
.learning, .progression, .leadership, .sources, .evidence { background: var(--aoa-paper); }
.subject-model, .growth { background: var(--aoa-cream); background-image: none; }
.supports, .interpretation { background: #e8f0f4; }
.programs, .model { color: #fff; background: var(--aoa-navy); }
.programs {
  background:
    linear-gradient(rgba(4,37,82,.50), rgba(4,37,82,.50)),
    url("./AOA_Section_Pathways.jpg") center center / cover no-repeat;
}
.programs .section-heading .lead, .model .section-heading .lead { color: rgba(255,255,255,.72); }
.programs .eyebrow, .model .eyebrow { color: var(--aoa-orange); }
.learning-card, .evidence-card, .person, .subject-table-wrap, .research-cta { border-color: var(--aoa-line); }
.learning-card { background: var(--aoa-cream); }
.learning-card .number, .curriculum-item small, .grade-card .grade, .year .school-year, .person .role, .support-card .support-label { color: var(--aoa-blue); }
.model-panel:first-child { background: #062653; }
.model-panel:last-child, .east-panel { background: var(--aoa-orange); }
.pathway-card { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.045); }
.pathway-card .pathway-number, .quote-card small { color: var(--aoa-orange); }
.subject-table th { color: var(--aoa-navy); background: rgba(17,75,142,.10); }
.closing { background: #062653; }
.closing {
  background:
    linear-gradient(90deg, rgba(4,37,82,.86), rgba(4,37,82,.48)),
    url("./AOA_Section_FinalCTA.webp") center center / cover no-repeat;
}
.closing .button { color: #062653; background: var(--aoa-orange); border-color: var(--aoa-orange); }
footer { background: #061b36; }

/* Research keeps its complete content but uses the same reference color/typography system. */
body:has(.research-hero) > .site-header { background: var(--aoa-navy); border-bottom-color: rgba(255,255,255,.12); }
body:has(.research-hero) .nav-links a { color: #fff; }
body:has(.research-hero) .nav-links a:hover, body:has(.research-hero) .nav-links a[aria-current="page"] { color: #ffd1a0; }
.research-hero { background: linear-gradient(90deg, rgba(248,244,235,.98) 0%, rgba(248,244,235,.88) 60%, rgba(218,232,241,.92) 100%); }
.research-hero h1 em { color: var(--aoa-orange); }
.research-hero .hero-copy { color: var(--aoa-muted); }
.quick-findings, .model { background: var(--aoa-navy); }
.quick-findings::before, .quick-findings::after { display: none !important; content: none !important; }
.finding .number, .hero-note strong { color: var(--aoa-orange); }
.place { background: var(--aoa-cream); }
.place-panel:first-child { background: #062653; }
.place-panel:last-child { background: var(--aoa-orange); }
.interpretation { background: #e8f0f4; }

@media (max-width: 1100px) {
  .wrap { width: min(100% - 42px, 1440px); }
  .hero-grid > :first-child { width: 66%; }
  .hero-photo { width: 52vw; right: -9%; }
  .field-note { right: 2rem; width: min(270px, 28vw); }
}

@media (max-width: 767px) {
  body:has(.hero) > .site-header { position: relative; background: var(--aoa-navy); }
  body:has(.hero) .nav { min-height: 84px; }
  .wrap { width: calc(100% - 40px); }.nav-links { top: 84px; }
  .hero { min-height: 0; background-position: center center; }
  .hero-grid { min-height: 0; padding: 42px 0 0; }
  .hero-grid > :first-child { width: 100%; }
  .opening-note { font-size: 13px; letter-spacing: .14em; }
  .hero h1 { max-width: 560px; font-size: clamp(43px, 12vw, 56px); line-height: .96; }
  .hero-copy { max-width: 34rem; font-size: 18px; line-height: 1.5; margin-top: 20px; }
  .hero-actions { display: grid; grid-template-columns: 1fr; gap: 12px; }
  .button { width: 100%; min-width: 0; min-height: 56px; }
  .hero-photo { display: none !important; }
  .hero-visual { display: block; min-height: 0; }
  .field-note { position: relative; right: auto; bottom: auto; width: 100%; margin: 22px 0 24px; transform: none; }
  .learning .field-note { margin: 0 0 24px; }
  .principles-grid { grid-template-columns: 1fr; }
  .principles-intro, .principle { min-height: 0; padding: 1.6rem 1.25rem; }
  .principle { border-top: 1px solid rgba(255,255,255,.18); border-left: 0; }
  .principle span { margin-bottom: .8rem; }
  section { padding: 4.5rem 0; }
  .section-heading { margin-bottom: 2.3rem; }
  .section-heading h2 { font-size: clamp(34px, 10.7vw, 50px); }
  .subject-model, .growth { background-image: none; }
  .light-mountains { display: none !important; }
  .footer-grid { flex-direction: column; }
}

/* Desktop-only scale adjustment for the supplied upper-right bobcat/logo artwork. */
@media (min-width: 768px) {
  .hero-photo { width: min(71vw, 1100px); }
}

/* The supplied composite backgrounds already contain their decorative artwork. */
body:has(.hero) .hero::before,
body:has(.hero) .hero-grid::before,
body:has(.hero) .hero-grid::after,
body:has(.hero) .principles::after,
body:has(.hero) .programs::after,
body:has(.hero) .learning::after,
body:has(.hero) .growth::after,
body:has(.hero) .subject-model::after,
body:has(.hero) .supports::after,
body:has(.hero) .closing::after,
body:has(.research-hero) .research-hero::before,
body:has(.research-hero) .research-hero::after,
body:has(.research-hero) .place::before,
body:has(.research-hero) .sources::before,
body:has(.research-hero) .model::after,
body:has(.research-hero) .evidence::after,
body:has(.research-hero) .quick-findings::before,
body:has(.research-hero) .quick-findings::after {
  display: none !important;
  content: none !important;
  background: none !important;
}

/* Header and hero alignment polish for the review mockup. */
body:has(.hero) .nav,
body:has(.research-hero) .nav {
  gap: 2.4rem;
}body:has(.hero) .nav-links,
body:has(.research-hero) .nav-links {
  gap: clamp(1.25rem, 1.8vw, 2.15rem);
  margin-left: auto;
}

@media (min-width: 1024px) {
  body:has(.hero) .hero-grid {
    padding-left: clamp(48px, 6vw, 96px);
    padding-right: clamp(24px, 3vw, 48px);
  }

  body:has(.hero) .hero-grid > :first-child {
    padding-left: 0;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  body:has(.hero) .hero-grid {
    padding-left: clamp(32px, 5.5vw, 64px);
    padding-right: clamp(24px, 3vw, 42px);
  }
}

/* Research page alignment with the approved homepage system. */
@media (min-width: 768px) {
  body:has(.research-hero) .research-hero {
    min-height: 720px;
    background: linear-gradient(115deg, #0B2D5B 0%, #114B8E 100%);
  }

  body:has(.research-hero) .research-hero .hero-grid {
    min-height: 720px;
    padding: 10rem clamp(24px, 2.5vw, 40px) 7rem;
  }

  body:has(.research-hero) .research-hero .hero-grid > :first-child {
    width: min(62%, 930px);
    max-width: 860px;
  }

  body:has(.research-hero) .research-hero h1 {
    color: #fff;
    font-size: clamp(58px, 5.15vw, 90px);
    line-height: .96;
  }

  body:has(.research-hero) .research-hero .hero-copy {
    max-width: 720px;
    color: rgba(255,255,255,.86);
  }

  body:has(.research-hero) .quick-findings > .finding-grid,
  body:has(.research-hero) section > .wrap {
    padding-left: clamp(24px, 2.5vw, 40px);
    padding-right: clamp(24px, 2.5vw, 40px);
  }

  body:has(.research-hero) .quick-findings {
    background: var(--aoa-navy);
  }

  body:has(.research-hero) .evidence,
  body:has(.research-hero) .sources {
    background: var(--aoa-cream);
  }

  body:has(.research-hero) .model {
    color: #fff;
    background: var(--aoa-navy);
  }

  body:has(.research-hero) .section-heading h2 {
    color: var(--aoa-navy);
  }

  body:has(.research-hero) .model .section-heading h2 {
    color: #fff;
  }
}

@media (max-width: 767px) {
  body:has(.research-hero) .research-hero {
    min-height: 0;
    background: linear-gradient(155deg, #0B2D5B 0%, #114B8E 100%);
  }

  body:has(.research-hero) .research-hero .hero-grid,
  body:has(.research-hero) .quick-findings > .finding-grid,
  body:has(.research-hero) section > .wrap {
    padding-left: 0;
    padding-right: 0;
  }

  body:has(.research-hero) .research-hero h1 {
    font-size: clamp(43px, 12vw, 56px);
  }
}

@media (max-width: 767px) {body:has(.hero) .nav-links,
  body:has(.research-hero) .nav-links {
    left: 20px;
    right: 20px;
    gap: .35rem;
    padding: .8rem;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 12px;
    box-shadow: 0 18px 40px rgba(0,0,0,.24);
  }

  body:has(.hero) .nav-links a,
  body:has(.research-hero) .nav-links a {
    min-height: 48px;
    padding: .75rem 1rem;
    border-radius: 8px;
  }

  body:has(.hero) .nav-links a:hover,
body:has(.research-hero) .nav-links a:hover {
  background: rgba(255,255,255,.08);
}

  body:has(.hero) .hero-grid {
    padding-left: 0;
    padding-right: 0;
  }
}

/* Header visibility and spacing are controlled by the shared AOA header stylesheet. */