/* ap_layout_v1 · ALLPROGRAMS_SPEC_v1 §Order re-layout (rows 1–12). CSS only + ap_layout.js (keys for swipe rows).
   DOM order and every word unchanged. Loaded after ap_fix_v1. Rollback: remove its <link>/<script> lines. */

/* 1 · Hero: 5/7 split (heading + switch left, demo card right as a frosted card); switch = 2-segment pill */
@media (min-width:1021px){
  #top.ap-hero{grid-template-columns:minmax(0,5fr) minmax(0,7fr)!important;column-gap:24px!important;padding-top:56px!important;padding-bottom:56px!important;align-items:center}
  #top .hb.hb-js{background:rgba(255,255,255,.66);-webkit-backdrop-filter:saturate(160%) blur(18px);backdrop-filter:saturate(160%) blur(18px);border:1px solid #D6DCE8;border-radius:22px;box-shadow:0 8px 24px rgba(20,32,74,.08);padding:12px}
}
#top ul.ap-fmtbox{display:grid!important;grid-template-columns:1fr 1fr;gap:0!important;padding:4px!important;border:1px solid #D6DCE8;border-radius:999px;background:rgba(255,255,255,.66);max-width:540px;box-sizing:border-box}
#top ul.ap-fmtbox>li{min-height:44px;border-radius:999px!important;border:0!important;box-shadow:none!important;padding:8px 18px!important;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}
#top ul.ap-fmtbox>li.ap-fmtbox-sp{background:#E6F7F3!important}
#top ul.ap-fmtbox>li.ap-fmtbox-tl{background:#FBF1E6!important}
@supports not (backdrop-filter:blur(1px)){#top .hb.hb-js{background:#fff}}
@media (max-width:1020px){#top.ap-hero{padding-top:32px!important;padding-bottom:24px!important}#top ul.ap-fmtbox{max-width:none;width:100%}}

/* 2 · Shelf: each course card gets its course "window" strip (decoration, aria-hidden via pseudo-element) */
.ap-shelf .ap-book>.ap-cover{position:relative}
.ap-shelf .ap-book>.ap-cover::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;z-index:3;border-radius:6px 6px 0 0;pointer-events:none}
.ap-shelf .ap-book:nth-child(1)>.ap-cover::before{background:repeating-linear-gradient(90deg,#253679 0 8px,#4DBAE5 8px 16px)}               /* Programming Lab: navy pixel strip */
.ap-shelf .ap-book:nth-child(2)>.ap-cover::before{background:radial-gradient(circle,#E2701F 1.5px,transparent 2px) 0 0/8px 8px,#FBF8F2}     /* Graphic Design: paper dots */
.ap-shelf .ap-book:nth-child(3)>.ap-cover::before{background:linear-gradient(90deg,#5B3FD0,#B27BE8)}                                    /* Music Studio: warm violet */
.ap-shelf .ap-book:nth-child(4)>.ap-cover::before,.ap-shelf .ap-book:nth-child(5)>.ap-cover::before{background:#5B6478}               /* coming soon: grey */
.ap-shelf .ap-book:nth-child(4)>.ap-cover img,.ap-shelf .ap-book:nth-child(5)>.ap-cover img{filter:grayscale(.85)}
.ap-shelf .pp-ribbon>span{background:#5B6478!important;color:#fff!important}

/* 3–4 · Course scenes: 6/6 (book stage | listing). Coming-soon scenes greyed except their live link/button */
@media (min-width:1021px){
  .nr-rack .scene .scene-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;column-gap:24px!important;max-width:1112px;margin-inline:auto}
}
.nr-rack .scene.is-dev .listing h2::after{background:#5B6478!important;color:#fff!important}
.nr-rack .scene.is-dev .listing .rk-facts,.nr-rack .scene.is-dev .listing .ap-dev li,.nr-rack .scene.is-dev .listing .ap-eyebrow{color:#5B6478!important}
.nr-rack .scene.is-dev .listing .rk-facts b,.nr-rack .scene.is-dev .listing .rk-facts span{color:#5B6478!important}

/* 5 · What every course includes: 4/8 (heading left, list right) */
@media (min-width:1021px){
  #about-programs>.ap-wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:24px;align-items:start}
  #about-programs>.ap-wrap>h2{grid-column:1;grid-row:1 / span 4;margin:0!important}
  #about-programs>.ap-wrap>:not(h2){grid-column:2}
  #about-programs .ap-mini{margin-top:0!important}
}
/* 6 · Bundles: 6/6 pair, stacked on phones (pricing, never swiped) */
@media (min-width:1021px){#bundles .ap-grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px}}
/* 8 · Class times: 8-col centred note card */
#class-times>.wrap{max-width:776px;margin-inline:auto;background:rgba(255,255,255,.66);border:1px solid #D6DCE8;border-radius:22px;box-shadow:0 8px 24px rgba(20,32,74,.08);padding:32px!important;box-sizing:border-box}
#class-times>.wrap>*{max-width:none!important}
#class-times>.wrap>:last-child{margin-bottom:0!important}
@media (max-width:640px){#class-times>.wrap{margin-inline:20px;padding:20px!important}}
/* 9 · Six pathways: chips as a 3×2 grid at 1280 */
@media (min-width:1021px){#six-pathways .pw-list{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:560px}
  #six-pathways .pw-list>li{text-align:center;justify-content:center}}
/* 11 · FAQ: 5/7 (heading left, list right) */
@media (min-width:1021px){
  #before-you-begin>.wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:24px;align-items:start}
  #before-you-begin>.wrap>.sec-head{margin:0!important;max-width:none}
  #before-you-begin .faq{margin:0!important;max-width:none!important}
}
#before-you-begin .faq summary{min-height:56px;box-sizing:border-box}
@media (max-width:640px){#before-you-begin .faq summary{min-height:52px}}
@media (prefers-reduced-motion:reduce){#before-you-begin details *{transition:none!important;animation:none!important}}
/* 12 · Contact: mist band, 6/6 */
@media (min-width:1021px){
  #contact>.wrap{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);column-gap:24px;align-items:start}
  #contact>.wrap>.sec-head{margin:0!important;max-width:none}
  #contact>.wrap>.intro{max-width:none!important;margin:0!important}
}

/* band caps (tools/gaps.py): 1280/1440 ≤ 144, 390/360 ≤ 96 */
main > section#class-times{padding-top:32px!important;padding-bottom:32px!important}
.nr-rack .scene{padding-bottom:16px!important}
@media (max-width:640px){
  main > section#class-times{padding-top:24px!important;padding-bottom:24px!important}
  main > section.hl-band{padding-top:24px!important;padding-bottom:24px!important}
  main > section#shelf,#shelf{padding-bottom:8px!important}
  #shelf .ap-shelfnote{margin-bottom:0!important}
  .nr-rack .scene{padding-top:0!important;padding-bottom:8px!important}
  .nr-rack .scene .stage{margin-top:-16px!important}     /* the stage's own top air above the book (37px) */
  .nr-rack .scene .listing{padding-bottom:16px!important}
  main > section.ap-band,main > section.band,main > section#before-you-begin,main > section#six-pathways,main > section#contact{padding-top:28px!important;padding-bottom:28px!important}
}
@media (max-width:640px){
  .nr-rack .scene.is-dev .stage{height:280px!important}   /* no Enroll strip under coming-soon books */
  main > section#contact{padding-bottom:16px!important}
}