/* ap_fix_v1 · All Programs fixes for Growth QA-01 (ALLPROGRAMS_SPEC_v1 §0). Loaded last. No text, href or price changes.
   Rollback: remove the ap_fix_v1 <link> and <script> lines in programs.html. */

/* LP-02 taps ≥ 44 (HDR-01_TAP-44 §3 "All Programs") */
.ap-cf.pp-shelf .ap-book>a.ap-enroll,.ap-shelf a.ap-enroll,a.ap-enroll{display:inline-flex;align-items:center;justify-content:center;min-height:44px!important;min-width:88px;padding:0 20px!important;box-sizing:border-box;background:#BF5508!important;color:#fff!important}
a.ap-enroll:hover{background:#A64508!important}
a.ap-see{display:inline-flex;align-items:center;min-height:44px}
.hb-pill{min-height:44px!important;box-sizing:border-box}
.hb-chipx{min-width:44px!important;min-height:44px!important;width:44px!important;height:44px!important}
.hb-chipopen{min-width:44px!important;min-height:44px!important}
a.ap-gb,.ap-more a{display:inline-flex;align-items:center;min-height:44px}
.ap-wl{display:inline-flex;align-items:center;min-height:44px;vertical-align:middle}
a.skip:focus{min-height:44px;display:inline-flex;align-items:center}

/* LP-03 "What students learn" (open book right page): ink on its own white panel, full opacity once the scene is in view */
.nr-rack .scene .obook .pg:has(.rk-facts){background:#fff}
.nr-rack .scene.rk-in .obook .pg .rk-facts li[class^="ap-pg-"],
.nr-rack .scene.rk-open .obook .pg .rk-facts li[class^="ap-pg-"]{opacity:1!important;transform:none!important;color:#14204A!important}
.nr-rack .scene .obook .pg .rk-facts li[class^="ap-pg-"] b{color:#14204A!important}

/* LP-04 booked / unavailable: a real grey style in every state (C0.3). Text stays AA: slate #5B6478 on white = 5.93:1.
   The "Fully booked" words get a grey badge (white on #5B6478). Working links inside (Join the waitlist, Register interest) keep full colour and 44px. */
.is-booked,.is-booked b{color:#5B6478!important}
.is-booked{filter:none}
.ap-bk{display:inline-block;padding:1px 8px;border-radius:999px;background:#5B6478;color:#fff!important;font-weight:600;line-height:1.5;white-space:nowrap}
.is-booked a{color:#124A92!important}
.ap-sp-off .ap-oh,.ap-sp-off .ap-os,.ap-sp-off b{color:#5B6478!important}
.is-dev .ap-cover img,.ap-sp-off img{filter:grayscale(1)}

/* C8 no orphan words */
main h1,main h2,main h3,main h4,main summary{text-wrap:balance}
main p,main li{text-wrap:pretty}

/* LP-03 gaps: scenes stay shown once seen (the rack app removes .rk-in when a scene leaves the viewport, which left
   empty stage height in every scrolled/full-page view). ap_fix.js adds [data-ap-seen] on first .rk-in. The book still
   animates in the first time. Reduced motion: unchanged (already plain stacked). */
.nr-rack .scene[data-ap-seen] .listing{opacity:1;transform:none}
.nr-rack .scene[data-ap-seen] .obook{transform:translateX(calc(var(--w) / -2)) translateY(-14px) rotateX(6deg) rotateY(-8deg) scale(1);opacity:1}
.nr-rack .scene[data-ap-seen] .obook .pg .rk-facts li[class^="ap-pg-"]{opacity:1!important;transform:none!important}
/* section padding tokens (C2): 72/72 at 1280, 40/40 at 390; empty bands ≤ 144 / 96 */
/* 1280: tokens are 72/72, but two 72s plus heading leading measured 150–174 with tools/gaps.py, so same-tone sections use 56/56 (--s-8) to stay ≤ 144 */
main > section.ap-band,main > section.band,main > section#before-you-begin,main > section#class-times,main > section#six-pathways,main > section#contact{padding-top:56px!important;padding-bottom:56px!important}
main > section .sec-head{margin-bottom:32px}
main > section > .wrap > :last-child,main > section > .ap-wrap > :last-child{margin-bottom:0!important}
.nr-rack .scene{padding-top:24px!important;padding-bottom:24px!important}
.nr-rack .scene .listing{padding-bottom:28px!important}
@media (max-width:640px){
  main > section.ap-band,main > section.band,main > section#before-you-begin,main > section#class-times,main > section#six-pathways,main > section#contact{padding-top:32px!important;padding-bottom:32px!important}
  main > section .sec-head{margin-bottom:24px}
  .nr-rack .scene{padding-top:16px!important;padding-bottom:16px!important}
}
/* stats in the listing stay visible once seen; a book that has opened once stays open (same end state as .rk-open) */
html.pl-js .nr-rack .scene[data-ap-seen] .pg-stats3 .pg-st{opacity:1;translate:none}
.nr-rack .scene[data-ap-open] .obook{transform:translateX(0) translateY(-14px) rotateX(10deg) rotateY(0) scale(1.02);opacity:1}
.nr-rack .scene[data-ap-open] .obook .lid{transform:translateZ(3px) rotateY(-172deg)}
.nr-rack .scene[data-ap-open] .floor{transform:scaleX(1.25);opacity:1}
.nr-rack .scene[data-ap-open] .obook .pg .lbl{opacity:1;transform:none!important}
.nr-rack .scene[data-ap-open] .obook .pg .lbl-spine{transform:rotate(-2.2deg)!important}
.nr-rack .scene[data-ap-open] .obook .pg .lbl-card{transform:rotate(1.6deg) translateX(18px)!important}
.nr-rack .scene[data-ap-open] .obook .pg .lbl-tab{transform:rotate(-.8deg) translateX(6px)!important}
.nr-rack .scene[data-ap-open] .obook .pg .ap-or{opacity:1}
/* phones: scene stacks without the empty stage band (book stage starts at the top of the scene; listing follows) */
@media (max-width:760px){
  .nr-rack .scene .stage{top:0!important}           /* was a relative offset of 88px (the desktop sticky top) */
  .nr-rack .scene .scene-in > .listing{margin-top:24px!important}  /* was 86, which only compensated that offset */
}
main > section#contact{padding-bottom:48px!important}
@media (max-width:640px){main > section.ap-band,main > section.band,main > section#before-you-begin,main > section#class-times,main > section#six-pathways{padding-top:32px!important;padding-bottom:32px!important}main > section#contact{padding-bottom:32px!important}}

/* SEE-01 (Relay 02:07): once a scene book is open, the see-through .ap-bookbtn (allprograms.js, z-index 5, inset -10px) sat on top of the
   'See the course' link inside the open book (a.ex). The open book is lifted above the button but lets clicks fall through to it,
   except on the real link, so the book still opens the overlay and the link gets its own clicks (same href). v223 files untouched. */
.nr-rack .scene.rk-open .bookfig > .obook,.nr-rack .scene[data-ap-open] .bookfig > .obook{position:relative;z-index:6;pointer-events:none}
.nr-rack .scene.rk-open .bookfig > .obook a,.nr-rack .scene[data-ap-open] .bookfig > .obook a{pointer-events:auto}
/* SEE-01b: in 3D the lifted book doesn't always win the hit test (coming-soon books at 390/360), so once a book is open the
   see-through button also stops at the spine: it covers only the right-hand page, never the opened lid with the link. */
.nr-rack .scene.rk-open .bookfig > .ap-bookbtn,.nr-rack .scene[data-ap-open] .bookfig > .ap-bookbtn{left:50%}
/* SEE-01c: the open book is tilted (rotateX 10deg) and Chrome hit-tests the link a few px higher than it is drawn, so the lower half of
   'See the course' could miss on phones. A transparent ::after widens the link's own hit area (still the same <a>, same href). */
.nr-rack .scene .obook .lid .inner .ex{position:relative}
.nr-rack .scene.rk-open .obook .lid .inner .ex::after,.nr-rack .scene[data-ap-open] .obook .lid .inner .ex::after{content:"";position:absolute;inset:-6px -8px -18px -8px}
/* SEE-01d: root cause of the miss above: Chrome hit-tests the 10deg rotateX tilt of the open book about 25px off from where it paints
   (worst on the coming-soon books at 390/360). The open end state drops only the tilt (same position and scale), so taps land on the link. */
.nr-rack .scene.rk-open .bookfig > .obook,.nr-rack .scene[data-ap-open] .bookfig > .obook{transform:translateX(0) translateY(-14px) scale(1.02)!important}

/* ap4 · LF-06 (Arhal 2026-11-04, Web Designer direction). Below 768px only.
   The action panel (.ap-under) was absolutely placed over the stage bottom, so it overlapped every open book on phones
   (GD worst: it covered 18px of 'See the course'). It now sits in normal flow (static) under the book with a 16px gap.
   Text, links and order unchanged; 768px and up untouched; open/close timing untouched. */
@media (max-width:767px){
  .nr-rack .scene .stage{height:auto!important}
  .nr-rack .scene .stage .ap-under{position:static!important;margin-top:4px}   /* + the open book's 12px lift = 16px clear gap */
  .nr-rack .scene .listing{margin-top:16px!important}
  /* LF-03: 'See the course' box >= 44px */
  .nr-rack .scene .obook .lid .inner .ex{display:inline-flex;align-items:center;min-height:44px}
}
/* 761–767 (still below 768): the scene grid kept a 560px stage column and crushed the listing to ~54px; stack it as at <=760 */
@media (min-width:761px) and (max-width:767px){
  .nr-rack .scene .scene-in{grid-template-columns:minmax(0,1fr)!important}
  .nr-rack .scene .stage{position:relative!important;top:0!important;width:100%!important}
  .nr-rack .scene .stage .ap-under{margin-top:6px}   /* this range lifts the open book 14px: 6+... = 16px gap */
}

/* ap5 · LAYOUT_NOTE_v1_2 (a) (Arhal 2026-11-04). Layout only: no copy, link or DOM/Tab-order change; open/close timing untouched.
   768–1019: stack — open book centred (max 560), course details below (max 640, centred) 24px gap, unavailable box under the
   details 16px gap (visual order via grid; .stage becomes display:contents so its two children can be placed). */
@media (min-width:768px) and (max-width:1019px){
  .nr-rack .scene .scene-in{display:grid!important;grid-template-columns:minmax(0,1fr)!important;justify-items:center;row-gap:0!important}
  .nr-rack .scene .stage{display:contents!important}
  .nr-rack .scene .stage > .bookfig{order:1;justify-self:center;max-width:560px;margin:24px auto 0}
  .nr-rack .scene .stage > .floor{order:1;position:relative!important;inset:auto!important;justify-self:center;margin:27px 0 -67px}   /* shadow 27px under the book as live, takes no space */
  .nr-rack .scene .listing{order:2;width:100%!important;max-width:640px;margin:13px auto 0!important}   /* + the open book lift (11px) = 24px under the book */
  .nr-rack .scene .stage > .ap-under{order:3;position:static!important;width:100%;max-width:640px;margin:16px auto 0}
}
/* 1020+: side by side; details column min 320px; the book scales with clamp() instead of overflowing into the details;
   the unavailable box sits in flow 16px under the book instead of over its lower edge. */
@media (min-width:1020px){
  html body .nr-rack .scene .scene-in{grid-template-columns:calc(var(--ap5-w) * 2.04 + 16px) minmax(320px,1fr)!important;column-gap:24px!important}   /* book column sized to the scaled open book; details take the rest, never under 320px. html body = beats ap_layout.css at 1040+ */
  .nr-rack .scene .stage{width:auto!important;height:auto!important}
  .nr-rack .scene{--ap5-w:clamp(236px,calc((100vw - 170px) / 4),250px)}   /* 236 = smallest page that still shows "Ways to learn" (contents container must stay >200px) */
  .nr-rack .scene .obook{--w:var(--ap5-w);--h:calc(var(--ap5-w) * 1.4)}
  .nr-rack .scene .stage > .floor{top:calc(var(--ap5-w) * 1.4 + 27px)!important;bottom:auto!important}   /* shadow stays under the book */
  .nr-rack .scene .stage > .ap-under{position:static!important;margin-top:16px}
}
/* ap5: at 1020-1099 the details column is narrow; let a lone meta2 block span both columns so its line does not end on one word */
@media (min-width:1020px) and (max-width:1099px){
  .nr-rack .scene .listing .meta2 > :only-child{grid-column:1 / -1}
}
/* ap5b: at 768-1019 ap_fix.js moves .listing inside .stage (before .ap-under) so the Tab order is book -> details -> box. Same look as ap5. */
@media (min-width:768px) and (max-width:1019px){
  .nr-rack .scene .stage > .listing{order:2}
}