/* about — the lineage page (data-hero="lineage"). Only what chrome.css lacks.
   Timeline hero, story grid, credentials badges, team strip, field pair, coverage cards.
   Badge + team styles restated here because they live in home.css, which about.html never loads. */

/* ---------- hero: the lineage strip ---------- */
.ahero{position:relative;overflow:clip;padding:72px 0 88px;background:
  radial-gradient(820px 480px at 72% 18%,rgba(29,130,198,.15),transparent 62%),
  radial-gradient(640px 420px at 6% 88%,rgba(34,75,133,.13),transparent 60%),
  var(--bg)}
.ahero::before{content:"";position:absolute;inset:0;background-image:
  linear-gradient(rgba(96,168,232,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(96,168,232,.05) 1px,transparent 1px);
  background-size:56px 56px;mask-image:radial-gradient(720px 480px at 70% 30%,#000 30%,transparent 72%)}
.ahero .wrap{position:relative}
.ahero .kicker{margin-bottom:20px}
.ahero h1{max-width:18ch}
.ahero .lede{margin:22px 0 0;color:var(--mut);font-size:15.5px;line-height:1.7;max-width:68ch}

.lineage{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--g3);margin-top:60px;list-style:none}
.lineage::before{content:"";position:absolute;top:5px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,var(--line2),var(--line-strong) 50%,var(--line2))}
.lineage li{position:relative;padding-top:28px}
.lineage li::before{content:"";position:absolute;top:0;left:0;width:11px;height:11px;border-radius:50%;
  background:var(--bg);border:2px solid var(--cyan);box-shadow:0 0 16px rgba(41,170,227,.55)}
.lineage b{display:block;font:500 15px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--cyan2)}
.lineage span{display:block;margin-top:12px;font-size:13.5px;line-height:1.55;color:var(--mut);max-width:26ch}
@media (max-width:700px){
  .lineage{grid-template-columns:1fr;gap:var(--g4);margin-top:44px}
  .lineage::before{top:0;bottom:0;left:5px;right:auto;width:1px;height:auto;
    background:linear-gradient(180deg,var(--line2),var(--line-strong) 50%,var(--line2))}
  .lineage li{padding-top:0;padding-left:30px}
  .lineage li::before{top:4px}
}

/* ---------- story ---------- */
.storygrid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--g5);align-items:stretch}
.prose{max-width:65ch}
.prose p{margin-top:18px;color:var(--prose)}
.sph{max-height:560px}
.sph img{height:100%;object-fit:cover}
@media (max-width:900px){.storygrid{grid-template-columns:1fr}.sph img{aspect-ratio:4/3;height:auto}}

/* ---------- band alternation (chapter rhythm) ---------- */
.aband{background:var(--bg2);border-block:1px solid var(--line)}

/* ---------- credentials (badge vocabulary, from the design's cert block) ---------- */

/* ---------- team strip (from the design's team block) ---------- */

/* ---------- field pair ---------- */
.fieldpair{display:grid;grid-template-columns:1fr 1fr;gap:var(--g3)}
.fieldpair img{aspect-ratio:16/10}
.fieldpair figcaption{font:500 13px var(--disp);letter-spacing:0;text-transform:none;padding:46px 18px 16px}
.fieldpair figcaption span{display:block;font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-top:3px}
@media (max-width:700px){.fieldpair{grid-template-columns:1fr}}

/* ---------- coverage & services ---------- */
.covergrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--g3)}
.covercard{padding:30px 28px}
.covercard h3{font:600 17px/1.3 var(--disp);margin-bottom:12px}
.covercard p{font-size:14.5px;color:var(--mut)}
.covercard p a{color:var(--cyan2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(76,196,255,.4)}
.covercard p a:hover{text-decoration-color:var(--cyan2)}
.pillrow{display:flex;flex-wrap:wrap;gap:var(--g1);margin-top:18px}
@media (max-width:900px){.covergrid{grid-template-columns:1fr}}

/* ---------- closing ---------- */
.closing .shead{margin-bottom:34px}

/* about's only difference from the shared component: three across, not stacked */
.badges{grid-template-columns:repeat(3,1fr);margin-top:0}
@media (max-width:900px){.badges{grid-template-columns:1fr}}