/* About — composition: a cinematic arrival, then an institutional dossier that alternates
   statement, story, belief and structure. Prefix: .ab- */

/* Hero */
.ab-hero { min-height: min(94vh, 920px); display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 0; }
.ab-hero__media { position: absolute; inset: 0 0 0 auto; width: min(70%, 1300px); z-index: -2; overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.55) 22%, #000 48%); mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.55) 22%, #000 48%); }
.ab-hero__media img { width: 100%; height: 112%; object-fit: cover; object-position: 78% 35%; margin-top: -6%; }
.ab-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 45%; z-index: -1; background: linear-gradient(to top, var(--navy-900) 12%, transparent); pointer-events: none; }
/* QA: the transparent header sat over the pale sky of the photo (ivory nav text ≈1.3:1). A top scrim keeps it legible. */
.ab-hero::before { content: ""; position: absolute; inset: 0 0 auto; height: calc(var(--header-h, 72px) + 48px); z-index: -1; background: linear-gradient(to bottom, color-mix(in srgb, var(--navy-950) 82%, transparent) 55%, transparent); pointer-events: none; }
.ab-hero__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: var(--space-6); align-items: end; }
.ab-hero__grid > * { min-width: 0; }
.ab-hero__title { grid-column: 1 / span 7; }
.ab-hero__title .display { max-width: 13ch; }
.ab-hero__aside { grid-column: 9 / span 4; display: grid; gap: 1.1rem; padding: 1.5rem 1.5rem 1.6rem; border-top: 1px solid var(--gold); background: color-mix(in srgb, var(--navy-950) 72%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.ab-hero__aside .muted { color: var(--fog); }
.ab-motto { display: grid; font-family: var(--font-serif); font-size: clamp(1.7rem, 1.2rem + 1.4vw, 2.5rem); line-height: 1.05; }
.ab-motto span:last-child { font-style: italic; color: var(--gold-soft); }
.ab-index { margin-top: clamp(3rem, 6vw, 5.5rem); }
.ab-index ol { display: flex; gap: 0; margin: 0; padding: 0; border-top: 1px solid var(--line-on-dark); overflow-x: auto; scrollbar-width: none; }
.ab-index ol::-webkit-scrollbar { display: none; }
.ab-index li { flex: 1 0 auto; }
.ab-index a { display: flex; gap: .55rem; align-items: baseline; padding: 1.1rem 1.25rem 1.2rem 0; white-space: nowrap; text-decoration: none; font-size: .875rem; font-weight: 600; color: var(--fog); transition: color var(--dur-2); }
.ab-index a .mono { color: var(--gold); }
.ab-index a:hover { color: var(--ivory); }
@media (max-width: 960px) {
  .ab-hero__media { width: 100%; opacity: .45; -webkit-mask-image: linear-gradient(to bottom, #000 30%, transparent 85%); mask-image: linear-gradient(to bottom, #000 30%, transparent 85%); }
  .ab-hero__title, .ab-hero__aside { grid-column: 1 / -1; }
}

/* 01 Promise */
.ab-promise__statement { margin-top: var(--space-6); font-family: var(--font-serif); font-size: clamp(2.2rem, 1.1rem + 4.4vw, 5.4rem); line-height: 1.06; letter-spacing: -.018em; max-width: 19ch; text-wrap: balance; }
.ab-chain { position: relative; white-space: nowrap; background: linear-gradient(var(--gold-deep), var(--gold-deep)) 0 92% / 100% 1px no-repeat; }
.ab-chain--end { font-style: italic; color: var(--gold-ink); background: none; white-space: normal; }
.ab-promise__foot { margin-top: clamp(3rem, 6vw, 5rem); }
.ab-promise__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--col-gap) clamp(2rem, 5vw, 6rem); margin-top: var(--space-6); max-width: 1100px; color: var(--slate); }
@media (max-width: 760px) { .ab-promise__cols { grid-template-columns: 1fr; } .ab-chain { white-space: normal; } }

/* 02 Story chapters */
.ab-chapters { --num: clamp(2.8rem, 3.4vw, 3.4rem); list-style: none; margin: 0; padding: 0; position: relative; }
.ab-chapters::before { content: ""; position: absolute; left: calc(var(--num) / 2); top: 2.5rem; bottom: 2.5rem; width: 1px; background: linear-gradient(var(--gold-deep), var(--line-on-light-strong)); }
.ab-chapter { display: grid; grid-template-columns: var(--num) minmax(0, 1fr); column-gap: clamp(1.25rem, 9vw, 11rem); padding-block: clamp(2rem, 3.5vw, 3rem); }
.ab-chapter > * { min-width: 0; }
.ab-chapter__num { position: relative; z-index: 1; display: grid; place-items: center; width: var(--num); aspect-ratio: 1; border-radius: 50%; background: var(--ivory); border: 1px solid var(--gold-deep); font-family: var(--font-serif); font-size: clamp(1.1rem, 1rem + .5vw, 1.5rem); color: var(--gold-ink); }
.ab-chapter:first-child .ab-chapter__num { background: var(--gold-deep); color: var(--ivory); }
.ab-chapter__body { display: grid; gap: .9rem; padding-bottom: clamp(1.5rem, 3vw, 2.5rem); border-bottom: 1px solid var(--line-on-light); max-width: 860px; }
.ab-chapter:last-child .ab-chapter__body { border-bottom: 0; }
.ab-chapter__body .h3 { max-width: 24ch; }
.ab-chapter__body p:not(.h3):not(.eyebrow) { max-width: 66ch; }
.ab-chapter__note { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }

/* 03 Direction */
.ab-direction { overflow: hidden; }
.ab-direction__arcs { position: absolute; top: 0; right: 0; width: min(62vw, 820px); height: auto; color: var(--gold); opacity: .32; z-index: -1; pointer-events: none; }
.ab-direction__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--col-gap) clamp(2rem, 6vw, 7rem); margin-top: clamp(2.5rem, 5vw, 4.5rem); }
.ab-direction__item { display: grid; gap: 1.1rem; padding-top: 1.4rem; border-top: 1px solid var(--line-on-dark-strong); }
.ab-direction__text { font-family: var(--font-serif); font-size: clamp(1.5rem, 1.15rem + 1.25vw, 2.35rem); line-height: 1.2; letter-spacing: -.008em; }
.ab-culture { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: var(--col-gap); align-items: baseline; margin-top: clamp(3rem, 6vw, 5.5rem); padding-top: 1.4rem; border-top: 1px solid var(--line-on-dark); }
.ab-culture__def { font-size: var(--fs-lead); line-height: 1.55; color: var(--fog); max-width: 60ch; }
@media (max-width: 760px) { .ab-direction__grid, .ab-culture { grid-template-columns: 1fr; } }

/* 04 Convictions */
.ab-conv { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--line-on-light-strong); }
.ab-conv li { padding: 1.5rem 1.4rem 1.75rem 0; display: grid; gap: .75rem; align-content: start; border-right: 1px solid var(--line-on-light); }
.ab-conv li + li { padding-left: 1.4rem; }
.ab-conv li:last-child { border-right: 0; }
.ab-conv__key { font-family: var(--font-serif); font-size: 1.55rem; line-height: 1.12; }
.ab-conv li p:last-child { color: var(--slate); font-size: var(--fs-small); }
@media (max-width: 1100px) { .ab-conv { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ab-conv li, .ab-conv li + li { padding: 1.5rem 1.25rem 1.5rem 0; border-right: 0; border-bottom: 1px solid var(--line-on-light); } .ab-conv li:nth-child(even) { padding-left: 1.25rem; border-left: 1px solid var(--line-on-light); } }
@media (max-width: 600px) { .ab-conv { grid-template-columns: 1fr; } .ab-conv li:nth-child(even) { padding-left: 0; border-left: 0; } }

.ab-values { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--col-gap) clamp(2rem, 6vw, 7rem); margin-top: clamp(4rem, 8vw, 7.5rem); align-items: start; }
.ab-values__intro { position: sticky; top: calc(var(--header-h) + 2rem); }
.ab-values__figure { margin-top: 2rem; max-width: 380px; }
.ab-rays { width: 100%; height: auto; overflow: visible; }
.ab-rays line { stroke: var(--stone); stroke-width: 1; transition: stroke var(--dur-2), stroke-width var(--dur-2); }
.ab-rays line.is-on { stroke: var(--gold-deep); stroke-width: 2; }
.ab-rays text { font-family: var(--font-mono); font-size: 13px; fill: var(--slate); transition: fill var(--dur-2); }
.ab-rays text.is-on { fill: var(--gold-ink); }
.ab-rays .origin { fill: var(--gold-deep); }
.ab-values__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-on-light); }
.ab-values__list li { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 1rem; padding: 1.25rem .75rem 1.25rem 0; border-bottom: 1px solid var(--line-on-light); transition: background-color var(--dur-2), padding var(--dur-2) var(--ease-out); cursor: default; }
.ab-values__list li .mono { color: var(--gold-ink); padding-top: .25rem; }
.ab-values__list li .h5 { font-size: 1.15rem; }
.ab-values__list li.is-on { background: color-mix(in srgb, var(--ivory) 70%, transparent); padding-left: .75rem; }
@media (max-width: 900px) { .ab-values { grid-template-columns: 1fr; } .ab-values__intro { position: static; } .ab-values__figure { max-width: 260px; } }

/* 05 Operating model */
.ab-engines { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px; background: var(--line-on-light); border: 1px solid var(--line-on-light); }
.ab-engine { position: relative; display: grid; grid-template-rows: auto auto auto 1fr; gap: .7rem; min-height: 300px; padding: 1.5rem 1.35rem 1.6rem; background: var(--ivory); text-decoration: none; transition: background-color var(--dur-2); }
.ab-engine::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--gold-deep); transform: scaleX(0); transform-origin: left; transition: transform var(--dur-3) var(--ease-out); }
.ab-engine:hover { background: var(--paper); }
.ab-engine:hover::before, .ab-engine:focus-visible::before { transform: scaleX(1); }
.ab-engine__num { color: var(--gold-ink); }
.ab-engine__name { font-family: var(--font-serif); font-size: clamp(1.45rem, 1.2rem + .6vw, 1.8rem); line-height: 1.08; }
.ab-engine__role { font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .08em; text-transform: uppercase; color: var(--slate); }
.ab-engine__desc { align-self: end; font-size: var(--fs-small); color: var(--slate); line-height: 1.5; }
.ab-engines__flow { margin-top: 1.1rem; color: var(--slate); letter-spacing: .06em; text-transform: uppercase; font-size: var(--fs-micro); }
.ab-engines__flow span { color: var(--gold-ink); margin-inline: .35rem; }
@media (max-width: 1100px) { .ab-engines { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ab-engine { min-height: 220px; } .ab-engine:last-child { grid-column: 1 / -1; } }
@media (max-width: 560px) { .ab-engines { grid-template-columns: 1fr; } .ab-engine { min-height: 0; } }

.ab-flywheel { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--col-gap) clamp(2rem, 6vw, 6rem); align-items: center; margin-top: clamp(4.5rem, 9vw, 8rem); }
.ab-fly-steps { list-style: none; margin: 1.5rem 0 0; padding: 0; border-top: 1px solid var(--line-on-light); }
.ab-fly-steps button { width: 100%; display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: .75rem; align-items: baseline; padding: 1rem .5rem 1rem 0; border: 0; border-bottom: 1px solid var(--line-on-light); background: none; text-align: left; font-size: 1rem; font-weight: 500; color: var(--slate); transition: color var(--dur-2), padding var(--dur-2) var(--ease-out); }
.ab-fly-steps button .mono { color: var(--gold-ink); }
.ab-fly-steps button:hover { color: var(--ink); }
.ab-fly-steps button[aria-pressed="true"] { color: var(--ink); font-weight: 650; padding-left: .5rem; }
.ab-flywheel__note { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-top: 1.25rem; }
.ab-flywheel__fig { margin: 0; }
.ab-flywheel__fig svg { width: 100%; max-width: 520px; height: auto; margin-inline: auto; overflow: visible; }
.fw-seg { fill: none; stroke: var(--stone); stroke-width: 10; stroke-linecap: butt; transition: stroke var(--dur-3) var(--ease-out); cursor: pointer; }
.fw-seg.is-on { stroke: var(--gold); }
.fw-arrow { fill: var(--stone); transition: fill var(--dur-3); }
.fw-arrow.is-on { fill: var(--gold); }
.fw-num { font-family: var(--font-mono); font-size: 14px; fill: var(--slate); text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.fw-num.is-on { fill: var(--gold-ink); font-weight: 600; }
.fw-dot { fill: var(--ivory); stroke: var(--stone); stroke-width: 1; transition: stroke var(--dur-2); }
.fw-dot.is-on { stroke: var(--gold-deep); fill: var(--paper); }
.fw-inner { fill: none; stroke: var(--line-on-light); }
.fw-center { font-family: var(--font-serif); fill: var(--ink); text-anchor: middle; }
.fw-center-sub { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; fill: var(--gold-ink); text-anchor: middle; text-transform: uppercase; }
@media (max-width: 900px) { .ab-flywheel { grid-template-columns: 1fr; } .ab-flywheel__fig { order: -1; } .ab-flywheel__fig svg { max-width: 380px; } }

.ab-streams { margin-top: clamp(3.5rem, 6vw, 5rem); padding-top: 1.5rem; border-top: 1px solid var(--line-on-light-strong); }
.ab-streams__list { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: .75rem; }
.ab-streams__list li { display: grid; gap: .3rem; padding: 1rem 1.1rem; border: 1px solid var(--line-on-light); background: var(--paper); font-weight: 600; font-size: .95rem; }
.ab-streams__list .mono { font-size: var(--fs-micro); font-weight: 400; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-ink); }

/* 06 Governance */
.ab-gov__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--col-gap) clamp(2rem, 6vw, 6rem); }
.ab-functions { margin: 1.25rem 0 0; border-top: 1px solid var(--line-on-dark-strong); }
.ab-functions > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 1.5rem; padding: 1.1rem 0; border-bottom: 1px solid var(--line-on-dark); }
.ab-functions dt { font-family: var(--font-serif); font-size: 1.35rem; line-height: 1.15; }
.ab-functions dd { margin: 0; color: var(--fog); font-size: var(--fs-small); }
.ab-controls { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: 1rem; }
.ab-controls li { display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); gap: .85rem; font-size: var(--fs-small); color: var(--fog); }
.ab-controls .icon { color: var(--gold); margin-top: .15rem; }
.ab-gov .link-arrow { color: var(--gold-soft); }
.ab-accountability { margin: clamp(3.5rem, 7vw, 6rem) 0 0; padding: clamp(1.75rem, 3vw, 2.75rem) 0 0; border-top: 1px solid var(--gold); display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: var(--col-gap); }
.ab-accountability__text { font-family: var(--font-serif); font-size: clamp(1.7rem, 1.1rem + 2.1vw, 3.1rem); line-height: 1.12; letter-spacing: -.01em; max-width: 26ch; }
@media (max-width: 900px) { .ab-gov__grid, .ab-accountability { grid-template-columns: 1fr; } .ab-functions > div { grid-template-columns: 1fr; gap: .35rem; } }

/* 07 Roadmap */
.ab-horizons { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--col-gap); position: relative; }
.ab-horizon { position: relative; display: grid; align-content: start; gap: .6rem; padding: 2.4rem 0 0; border-top: 1px solid var(--line-on-light-strong); }
.ab-horizon::before { content: ""; position: absolute; top: -6px; left: 0; width: 11px; height: 11px; border-radius: 50%; background: var(--paper); border: 1.5px solid var(--gold-deep); }
.ab-horizon:first-child::before { background: var(--gold-deep); }
.ab-horizon__head { display: grid; gap: .35rem; margin-bottom: .75rem; }
.ab-horizon__head .mono { color: var(--gold-ink); }
.ab-horizon__head .h3 { font-size: clamp(2rem, 1.5rem + 1.6vw, 3rem); }
.ab-horizon__label { font-size: var(--fs-label); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-top: .6rem; }
.ab-horizon p:not(.ab-horizon__label):not(.h3) { font-size: var(--fs-small); }
.ab-choices { margin-top: clamp(3.5rem, 6vw, 5rem); display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--col-gap); padding-top: 1.5rem; border-top: 1px solid var(--line-on-light); }
.ab-choices__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 2rem; }
.ab-choices__list li { position: relative; padding-left: 1.35rem; color: var(--slate); }
.ab-choices__list li::before { content: ""; position: absolute; left: 0; top: .7em; width: .7rem; height: 1px; background: var(--gold-deep); }
@media (max-width: 900px) { .ab-horizons { grid-template-columns: 1fr; gap: 2.5rem; } .ab-choices { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .ab-choices__list { grid-template-columns: 1fr; } }

/* 08 Leadership */
.ab-people { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--col-gap); }
.ab-person { display: grid; align-content: start; gap: .7rem; padding: 1.5rem; border: 1px dashed var(--line-on-light-strong); justify-items: start; }
.ab-person__mark { display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 9; margin-bottom: .5rem; background: repeating-linear-gradient(135deg, transparent 0 9px, rgba(20,24,29,.04) 9px 10px), var(--paper); border: 1px solid var(--line-on-light); }
.ab-person .placeholder-note { margin-top: .4rem; }
@media (max-width: 1100px) { .ab-people { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .ab-people { grid-template-columns: 1fr; } }

/* Closing band */
.ab-close { overflow: hidden; }
.ab-close canvas.rays { opacity: .38; }
.ab-close__logo { width: clamp(150px, 16vw, 210px); margin-inline: auto; }
.ab-close .lead { max-width: 52ch; color: var(--fog); }
