/* About A (batch 49, 2026-10-06). Handoff R2 rows AB-01 to AB-04, AB-06 to AB-18, AB-32; About Edit-Prompt sections 04 to 08 and 13.
   Loads after about-batch15, site-batch33 and the batch 41 background, so it owns the arrival, the vision area, the first market chapter, the line photographs and
   the lesson. Nothing here touches the later About chapters (batch 50).
   1 base  2 arrival  3 photo stage  4 vision  5 first market  6 line photographs  7 lesson  8 photo edge and labels  9 entrance  10 smaller screens
   One art family for the page: ornament-wall-a, as the batch 41 tree plate (feathered, drawn behind the copy, never an opaque rectangle). Plaid portrait cards are
   not used in these regions: story photographs take a thin 2px red edge and an external label. */

/* 1 base ----------------------------------------------------------------------------------------------------------- */
/* The plate reaches the page gutters, so the About wrapper itself no longer clips sideways; every later chapter (batch 50) keeps the clip it always had, one level down. */
.ab23{overflow-x:visible}
.ab23>:not(.ab49-tree):not(.ab49-tail){overflow-x:clip}
.ab23 .ab49-tail>:not(.ab49-first){overflow-x:clip}
.ab23 .ab49-tree{--om41-tree-bleed-bottom:80px;--om41-tree-in:46%;--om41-tree-out:22%}
.ab23 .ab49-tree--b{--om41-tree-bleed-bottom:56px;--om41-tree-in:16%;--om41-tree-out:26%}
.ab23 .ab49-plate img{object-fit:cover;filter:brightness(.58) saturate(1.05)}
.ab23 .ab49-tail{margin-top:0}

/* 2 arrival: stage left, arch right, actions below ------------------------------------------------------------------ */
.ab23 .ab49-arrival{display:grid;grid-template-columns:minmax(0,48fr) minmax(0,52fr);column-gap:clamp(20px,2.4vw,34px);row-gap:clamp(14px,1.6vw,22px);align-items:center;margin:0 0 clamp(36px,4vw,56px)}
.ab23 .ab49-stage-col{min-width:0}
.ab23 .ab49-arch.ab23-arch{width:100%;max-width:660px;justify-self:center;aspect-ratio:1448/1086}
#editorial-main .ab23 .ab49-arch h1{top:43%;width:50%;left:50%;font-size:7.3cqw;line-height:1.02}
body.om-mvp #editorial-main .ab23 .ab49-arch h1{font-size:clamp(24px,8.2cqw,62px)!important;line-height:1.02!important}
.ab49-h1.om41-support::before{--om41-support-a:.8;--om41-support-b:.7;--om41-support-angle:180deg;--om41-support-a:.84;--om41-support-b:.74;--om41-support-inset-x:-16%;--om41-support-inset-y:-24%;--om41-support-fx:12%;--om41-support-fy:12%;--om41-support-radius:24px}
.ab23 .ab49-arrival .editorial-actions{grid-column:1/-1;justify-content:center;margin:0}

/* 3 photo stage: one generous 4:3 box, the photographs stacked, the label and count outside it ---------------------- */
.ab49-stage{position:relative;display:block;outline-offset:6px}
.ab49-stage:focus-visible{outline:3px solid #65f4b9}
.ab49-viewport{position:relative;aspect-ratio:4/3;overflow:hidden;background:#0b0b0b}
.ab49-slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity var(--om41-crossfade-ms,450ms) ease}
.ab49-slide.is-current{opacity:1}
.ab49-slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.ab49-bar{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:12px;min-height:48px}
.ab49-meta{display:flex;align-items:center;gap:14px;margin:0;padding:0 14px;min-height:44px;background:rgba(5,5,5,.88);border-radius:10px;font:700 14px/1 "OMHM Tomorrow",system-ui,sans-serif;letter-spacing:.12em;color:#fff}
.ab49-year{color:#65f4b9}
.ab49-count{font-variant-numeric:tabular-nums}
.ab49-btn{display:inline-grid;place-items:center;width:44px;height:44px;padding:0;border:3px solid #000;box-shadow:inset 0 0 0 1px rgba(255,255,255,.85);border-radius:10px;background:rgba(5,5,5,.88);color:#fff;cursor:pointer}
.ab49-btn[hidden]{display:none!important}
.ab49-btn:hover{background:#ef2435}
.ab49-btn:focus-visible{outline:3px solid #65f4b9;outline-offset:3px}
.ab49-btn>span{display:block;width:11px;height:11px;border:solid currentColor;border-width:0 0 3px 3px}
.ab49-prev>span{transform:translateX(2px) rotate(45deg)}
.ab49-next>span{transform:translateX(-2px) rotate(-135deg)}
@media(prefers-reduced-motion:reduce){.ab49-slide{transition:none}}

/* 4 vision: one composed section on the tree plate; the copy sits on one calm reading pool ------------------------- */
.ab23 .ab49-vision{margin:0}
#editorial-main .ab23 .ab49-vision .ab49-vgrid>.ab23-head{grid-column:1/-1;grid-row:1;margin:0}
#editorial-main .ab23 .ab49-vision .ab23-head h2{font-size:clamp(1.55rem,3.3vw,2.8rem)}
.ab23 .ab49-vgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,260px);gap:clamp(18px,2.2vw,30px) clamp(24px,3vw,44px);align-items:start;font-size:clamp(16px,1.15vw,17px);line-height:1.55;color:#f1f1f1}
.ab23 .ab49-vcopy{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:clamp(12px,1.2vw,18px)}
.ab23 .ab49-vcopy .ab23-lead{max-width:34ch;font-size:clamp(19px,1.7vw,24px)}
.ab23 .ab49-vcopy .ab23-turn{padding-block:2px}
.ab23 .ab49-vcopy .ab23-nots p{font-size:clamp(20px,2vw,28px);color:#cfcfcf}
.ab23 .ab49-vportrait{grid-column:2;grid-row:2;width:min(100%,220px);justify-self:end;align-self:center}
.ab23 .ab49-videa{grid-column:1/-1;display:flex;flex-direction:column;gap:8px}
.ab23 .ab49-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,3vw,44px);border-bottom:1px solid var(--ab-rule)}
.ab23 .ab49-rows li{font-size:clamp(16px,1.2vw,17px);max-width:36em}
.ab23 .ab49-rows li:last-child{border-bottom:0}
.ab23 .ab49-vpay{grid-column:1/-1;display:grid;justify-items:center;gap:clamp(8px,1vw,14px);text-align:center}
.ab23 .ab49-vpay .ab23-prose{max-width:36em;text-wrap:balance}
.ab23 .ab49-vpay .ab49-display{grid-auto-flow:column;column-gap:clamp(18px,2.4vw,40px);justify-content:center}
.ab23 .ab49-display--xl p,.ab23 .ab49-vpay .ab23-display--xl p{font-size:clamp(28px,3.4vw,50px)}
.ab23 .ab49-vpay .ab23-prose:first-child{color:#d6d6d6}

/* 5 first market: 45 narrative, 55 media; one chapter, no card inside a card ----------------------------------------- */
.ab23 .ab49-first{margin-bottom:max(64px,var(--om41-tree-bleed-bottom))}
.ab23 .ab49-first-grid{display:grid;grid-template-columns:minmax(0,45fr) minmax(0,55fr);gap:clamp(24px,2.2vw,32px);align-items:start}
.ab23 .ab49-first-copy{align-self:center;display:flex;flex-direction:column;gap:clamp(12px,1.2vw,18px);font-size:clamp(16px,1.2vw,17px);line-height:1.55;color:#f1f1f1}
.ab23 .ab49-first-copy .ab23-prose{max-width:36em;color:#f1f1f1}
.ab23 .ab49-ident{margin:0;font-size:13px}
#editorial-main .ab23 .ab49-first-title{margin:0;max-width:26ch;font:800 clamp(22px,1.95vw,29px)/1.2 "OMHM Tomorrow",system-ui,sans-serif;letter-spacing:0;text-transform:none;color:#fff;-webkit-text-stroke:0;text-shadow:none;text-wrap:balance}
.ab23 .ab49-first-turn{margin:0;font-size:clamp(17px,1.3vw,19px);line-height:1.35;font-weight:700;color:#fff;max-width:36ch}
.ab23 .ab49-showed{color:var(--ab-mint);font-size:clamp(20px,1.8vw,26px)}
.ab23 .ab49-first-media{display:flex;flex-direction:column;gap:clamp(14px,1.6vw,22px)}
.ab23 .ab49-first-minis{display:flex;align-items:flex-start;gap:clamp(14px,1.6vw,22px)}
.ab23 .ab49-photo--mini{flex:0 0 min(31%,210px)}

/* 6 line photographs: both at a true 4:3 crop of the 2016 originals, paired, captions outside the photographs ------- */
.ab23 .ab49-lines{display:flex;flex-direction:column;gap:clamp(16px,1.8vw,24px)}
.ab23 .ab49-linehead.ab23-twist-b{margin:0;padding:0}
.ab23 .ab49-linehead .ab23-display{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:.05em .5em;text-align:center}
.ab23 .ab49-linehead .ab23-display p{font-size:clamp(26px,3.3vw,48px)}
.ab23 .ab49-linehead.om41-support::before{--om41-support-a:.84;--om41-support-b:.74;--om41-support-angle:180deg;--om41-support-inset-x:calc(min(26px,(100vw - 100%) / 2) * -1);--om41-support-inset-y:-14px;--om41-support-fx:5%;--om41-support-fy:16%;--om41-support-radius:14px}
/* The one pool behind the whole headline replaces the interim pool the batch 41 sheet gave the mint "All day." line. */
.ab23 .ab49-linehead .ab23-display p.ab23-mint::before{content:none}
.ab23 .ab49-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,28px)}

/* 7 lesson: one block beside (under) the line photographs ------------------------------------------------------------ */
.ab23 .ab49-lesson{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(22px,3vw,44px);align-items:start;margin-top:clamp(10px,1.4vw,20px);font-size:clamp(16px,1.2vw,17px);line-height:1.55;color:#f1f1f1}
.ab23 .ab49-lesson-a{display:flex;flex-direction:column;gap:clamp(10px,1.1vw,16px)}
.ab23 .ab49-lesson-a .ab23-pair p{font-size:clamp(20px,2vw,28px)}
.ab23 .ab49-lesson .ab23-prose{max-width:36em;color:#f1f1f1}
.ab23 .ab49-lesson-b{display:flex;flex-direction:column;gap:clamp(10px,1.1vw,16px);padding-left:clamp(18px,2.2vw,30px);border-left:3px solid #000}

/* 8 photo edge and external labels ----------------------------------------------------------------------------------- */
.ab49-photo{position:relative;margin:0;min-width:0}
.ab49-photo img{display:block;width:100%;height:auto;background:#0b0b0b}
.ab49-photo figcaption{display:inline-block;margin-top:8px;padding:5px 10px;border-radius:8px;background:rgba(5,5,5,.88);font-size:15px;line-height:1.3;font-weight:600;color:#fff}
.ab49-yr{margin-right:6px;font:700 13px/1 "OMHM Tomorrow",system-ui,sans-serif;letter-spacing:.14em;color:#65f4b9}
.ab49-photo--lead img{aspect-ratio:4/3;object-fit:cover}

/* 9 entrance: the chapter groups rise once (the batch 41 entrance tokens); static and reduced motion show everything ---- */
.ab23--anim [data-ab-cascade]:not(.is-in){opacity:0;translate:0 var(--om41-enter-y,16px)}
.ab23--anim [data-ab-cascade]{transition:opacity var(--om41-enter-ms,550ms) var(--om41-enter-ease,ease),translate var(--om41-enter-ms,550ms) var(--om41-enter-ease,ease)}
@media(prefers-reduced-motion:reduce){.ab23--anim [data-ab-cascade]:not(.is-in){opacity:1;translate:none}}

/* 10 smaller screens ----------------------------------------------------------------------------------------------- */
@media(max-width:1100px){
  .ab23 .ab49-vgrid{grid-template-columns:minmax(0,1fr) minmax(0,200px)}
  .ab23 .ab49-first-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media(max-width:900px){
  .ab23 .ab49-arrival{grid-template-columns:minmax(0,1fr);justify-items:center}
  .ab23 .ab49-arch.ab23-arch{order:-1;max-width:560px}
  .ab23 .ab49-stage-col{width:100%;max-width:640px}
  #editorial-main .ab23 .ab49-arch h1{top:41%;width:56%}
  .ab23 .ab49-first-grid{grid-template-columns:minmax(0,1fr)}
  .ab23 .ab49-lesson{grid-template-columns:minmax(0,1fr)}
  .ab23 .ab49-lesson-b{padding-left:0;border-left:0;padding-top:clamp(10px,2vw,16px);border-top:3px solid #000}
  .ab23 .ab49-first-media{max-width:640px}
}
@media(max-width:780px){
  .ab23 .ab49-vgrid{grid-template-columns:minmax(0,1fr)}
  .ab23 .ab49-vportrait{grid-column:1;grid-row:auto;justify-self:center;width:min(60%,200px);order:2}
  .ab23 .ab49-vcopy{grid-row:auto}
  .ab49-vgrid>.ab23-head{order:0}
  .ab23 .ab49-vcopy{order:1}
  .ab23 .ab49-videa{order:3}
  .ab23 .ab49-vpay{order:4}
  .ab23 .ab49-rows{grid-template-columns:minmax(0,1fr)}
  .ab23 .ab49-vpay .ab49-display{grid-auto-flow:row;row-gap:4px}
  .ab23 .ab49-pair{grid-template-columns:minmax(0,1fr)}
  .ab23 .ab49-first{--om41-tree-bleed-bottom:40px}
}
@media(max-width:480px){
  .ab49-meta{padding:0 10px;gap:10px;letter-spacing:.08em}
  .ab23 .ab49-photo--mini{flex-basis:min(44%,170px)}
}