/* Scroll-driven recipe sections: sticky native-scroll enhancement, fail-open static fallback. */
.apb-rx-scroll{
  --apb-rx-scroll-h:320vh;
  min-height:var(--apb-rx-scroll-h);
  padding:0;
  position:relative;
  background:var(--apb-rx-ink,#0b0d12);
  color:#fff;
  overflow:clip;
}
.apb-rx-scroll--pinned{--apb-rx-scroll-h:300vh}
.apb-rx-scroll--parallax{--apb-rx-scroll-h:280vh}
.apb-rx-scroll-stage{
  position:sticky;
  top:0;
  min-height:100vh;
  overflow:hidden;
  display:grid;
  place-items:center;
  isolation:isolate;
}
.apb-rx-scroll-poster,
.apb-rx-scroll-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.apb-rx-scroll-video{z-index:1}
.apb-rx-scroll-poster{z-index:0}
.apb-rx-scroll-poster--solid{background:var(--apb-rx-surface-muted,#eef2f7)}
.apb-rx-scroll-shade{
  position:absolute;
  inset:0;
  z-index:2;
  background:rgba(5,7,12,.42);
}
.apb-rx-scroll-copy{
  position:relative;
  z-index:4;
  width:min(780px,calc(100% - 40px));
  text-align:center;
  display:grid;
  gap:14px;
  justify-items:center;
  text-wrap:balance;
}
.apb-rx-scroll-copy h2{
  margin:0;
  color:#fff;
  font-size:clamp(42px,7vw,86px);
  line-height:.95;
  letter-spacing:0;
}
.apb-rx-scroll-copy .apb-rx-eyebrow{color:rgba(255,255,255,.78);margin:0}
.apb-rx-scroll-sub{max-width:620px;margin:0;color:rgba(255,255,255,.82);font-size:18px;line-height:1.6}
.apb-rx-scroll-copy .apb-rx-btn{margin-top:8px;background:#fff;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-scroll-beats{position:absolute;inset:0;z-index:5;pointer-events:none}
.apb-rx-scroll-beat{
  position:absolute;
  width:min(270px,calc(100vw - 40px));
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--apb-rx-radius,16px);
  background:rgba(255,255,255,.12);
  box-shadow:0 18px 45px -26px rgba(0,0,0,.65);
  opacity:1;
  transform:translateY(0);
  transition:opacity .32s ease,transform .32s ease;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat{opacity:0;transform:translateY(14px)}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat.is-active{opacity:1;transform:translateY(0)}
.apb-rx-scroll-beat span{
  display:block;
  color:rgba(255,255,255,.7);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.apb-rx-scroll-beat strong{display:block;color:#fff;font-size:20px;line-height:1.2;margin-top:5px}
.apb-rx-scroll-beat--tl{left:7vw;top:24vh}
.apb-rx-scroll-beat--rr{right:7vw;top:38vh}
.apb-rx-scroll-beat--bl{left:7vw;bottom:17vh}
.apb-rx-scroll-beat--br{right:7vw;bottom:26vh}
.apb-rx-scroll-beat--bc{left:50%;bottom:12vh;transform:translateX(-50%)}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat--bc{transform:translateX(-50%) translateY(14px)}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat--bc.is-active{transform:translateX(-50%) translateY(0)}
.apb-rx-scroll-layer{position:absolute;inset:-12vh -8vw;z-index:1;will-change:transform}
.apb-rx-scroll-layer--back{filter:saturate(.85);opacity:.65}
.apb-rx-scroll-layer--front{inset:-6vh -4vw;z-index:2;clip-path:inset(14% 11% 14% 52% round var(--apb-rx-radius,16px))}
.apb-rx-scroll-layer .apb-rx-scroll-poster{position:absolute;inset:0}
@media(max-width:720px){
  .apb-rx-scroll{min-height:220vh}
  .apb-rx-scroll-copy{align-self:start;margin-top:18vh}
  .apb-rx-scroll-copy h2{font-size:42px;line-height:1}
  .apb-rx-scroll-sub{font-size:16px}
  .apb-rx-scroll-beats{position:relative;inset:auto;z-index:6;display:grid;gap:10px;width:calc(100% - 32px);margin:0 auto 22px;align-self:end}
  .apb-rx-scroll-beat,
  .apb-rx-scroll-beat--tl,
  .apb-rx-scroll-beat--rr,
  .apb-rx-scroll-beat--bl,
  .apb-rx-scroll-beat--br,
  .apb-rx-scroll-beat--bc{
    position:relative;
    inset:auto;
    width:100%;
    transform:none;
  }
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat--bc,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat--bc.is-active{transform:none}
}
.apb-rx-scroll-shade--soft{background:linear-gradient(180deg,transparent 38%,rgba(5,7,12,.72))}

/* --- scroll_gallery: pinned horizontal track driven by var(--apb-p) --- */
.apb-rx-scroll--gallery .apb-rx-scroll-stage{display:block}
.apb-rx-sg-head{position:absolute;top:6vh;left:7vw;z-index:5}
.apb-rx-sg-head h2{margin:0;color:#fff;font-size:clamp(28px,4vw,52px);line-height:1.05}
.apb-rx-sg-head .apb-rx-eyebrow{color:rgba(255,255,255,.78);margin:0 0 6px}
.apb-rx-sg-track{
  position:absolute;top:50%;left:0;display:flex;gap:24px;padding:0 7vw;align-items:center;
  transform:translateY(-50%) translateX(calc((100vw - 100%) * var(--apb-p,0)));will-change:transform;
}
.apb-rx-sg-card{flex:0 0 min(34vw,440px);height:60vh;border-radius:var(--apb-rx-radius,16px);overflow:hidden;position:relative;background:rgba(255,255,255,.06)}
.apb-rx-sg-card img{width:100%;height:100%;object-fit:cover}
.apb-rx-sg-cap{position:absolute;left:18px;bottom:16px;z-index:2;text-shadow:0 2px 14px rgba(0,0,0,.7)}
.apb-rx-sg-cap .apb-rx-sg-t{display:block;color:#fff;font-size:22px;font-weight:700}
.apb-rx-sg-cap .apb-rx-sg-s{display:block;color:#e4e4e7;font-size:13px;margin-top:2px}

/* --- scroll_split: BEFORE pane width driven by var(--apb-p) --- */
.apb-rx-scroll--split .apb-rx-scroll-stage{display:block}
.apb-rx-sp-pane{position:absolute;inset:0;overflow:hidden}
.apb-rx-sp-pane img{position:absolute;top:0;left:0;width:100vw;height:100%;object-fit:cover}
.apb-rx-sp-after{z-index:1}
.apb-rx-sp-before{z-index:2;width:calc((1 - var(--apb-p,0)) * 100%);border-right:2px solid rgba(255,255,255,.7)}
.apb-rx-sp-tag{position:absolute;top:24px;z-index:3}
.apb-rx-sp-before .apb-rx-sp-tag{left:24px}
.apb-rx-sp-after .apb-rx-sp-tag{right:24px}
.apb-rx-scroll--split .apb-rx-scroll-copy{align-self:end;margin-bottom:8vh}

/* --- scroll_chapters: full-bleed crossfade (reuses the beat is-active toggle) --- */
.apb-rx-scroll--chapters .apb-rx-scroll-stage{display:block}
.apb-rx-sc-chapter{position:absolute;inset:0;opacity:0;transition:opacity .6s ease}
.apb-rx-sc-chapter:first-child{opacity:1} /* no-JS fail-open: first chapter shown */
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-sc-chapter{opacity:0}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-sc-chapter.is-active{opacity:1}
.apb-rx-sc-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.apb-rx-sc-text{position:absolute;left:7vw;bottom:14vh;z-index:3;max-width:680px;color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.6)}
.apb-rx-sc-text h2{margin:6px 0 0;color:#fff;font-size:clamp(32px,5vw,64px);line-height:1.02}
.apb-rx-sc-text p{margin:10px 0 0;color:rgba(255,255,255,.86);font-size:18px}
.apb-rx-sc-i{font-size:12px;font-weight:700;letter-spacing:.14em;color:rgba(255,255,255,.7)}

@media(max-width:720px){
  .apb-rx-sg-track{position:static;transform:none;overflow-x:auto;height:100%;align-items:center;padding-top:14vh}
  .apb-rx-sg-card{flex-basis:74vw;height:50vh}
}
@media(prefers-reduced-motion:reduce){
  .apb-rx-scroll{min-height:auto}
  .apb-rx-scroll-stage{position:relative;min-height:720px}
  .apb-rx-scroll-video{display:none}
  .apb-rx-scroll-layer{transform:none}
  .apb-rx-scroll-beat,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-scroll-beat{
    opacity:1;
    transform:none;
    transition:none;
  }
  /* gallery -> native horizontal scroll; split -> stacked; chapters -> stacked list */
  .apb-rx-sg-track{position:static;transform:none;overflow-x:auto;height:100%;align-items:center}
  .apb-rx-scroll--split .apb-rx-scroll-stage,
  .apb-rx-scroll--chapters .apb-rx-scroll-stage{min-height:auto}
  .apb-rx-sp-pane{position:relative;inset:auto;width:100%;height:52vh}
  .apb-rx-sp-pane img{width:100%}
  .apb-rx-sp-before{border-right:0}
  .apb-rx-sc-chapter,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-sc-chapter{position:relative;inset:auto;opacity:1;height:70vh;transition:none}
}

/* ===== batch 2: morph / deck / explode / draw / text / mesh (all driven by var(--apb-p)) ===== */
/* morph: hero shrinks + docks to corner */
.apb-rx-scroll--morph .apb-rx-scroll-stage{display:block}
.apb-rx-sm-hero{position:absolute;inset:0;z-index:1;overflow:hidden;transform-origin:top right;border-radius:calc(var(--apb-p,0)*22px);transform:scale(calc(1 - var(--apb-p,0)*0.74)) translate(calc(var(--apb-p,0)*36vw),calc(var(--apb-p,0)*38vh));will-change:transform}
.apb-rx-sm-hero img{width:100%;height:100%;object-fit:cover}
.apb-rx-sm-copy{z-index:4}

/* deck: sticky stack, cards slide up over each other */
.apb-rx-scroll--deck .apb-rx-scroll-stage{display:block}
.apb-rx-sk-head{position:absolute;top:6vh;left:7vw;z-index:6}
.apb-rx-sk-head h2{margin:0;color:#fff;font-size:clamp(28px,4vw,48px)}
.apb-rx-sk-wrap{position:absolute;inset:0;display:grid;place-items:center}
.apb-rx-sk-card{position:absolute;z-index:var(--i,1);width:min(820px,86vw);height:60vh;border-radius:var(--apb-rx-radius,16px);overflow:hidden;display:flex;background:#15171d;box-shadow:0 30px 80px rgba(0,0,0,.55);transform:translateY(calc((1 - clamp(0,calc(var(--apb-p,0)*(var(--n) - 1) - (var(--i) - 1)),1)) * 104%));will-change:transform}
.apb-rx-sk-media{width:44%;overflow:hidden}
.apb-rx-sk-media img{width:100%;height:100%;object-fit:cover}
.apb-rx-sk-body{flex:1;padding:34px;display:flex;flex-direction:column;justify-content:center;gap:8px;color:#fff}
.apb-rx-sk-step{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.apb-rx-sk-body h3{margin:0;font-size:clamp(24px,3vw,32px)}
.apb-rx-sk-body p{margin:0;color:rgba(255,255,255,.78);line-height:1.55}
/* mobile: stack the deck card (image on top, copy below) so the 44% media doesn't cramp */
@media(max-width:720px){
  .apb-rx-sk-card{flex-direction:column}
  .apb-rx-sk-media{width:100%;height:42%}
  .apb-rx-sk-body{padding:20px 22px}
}

/* explode: layered images converge as p->1 */
.apb-rx-scroll--explode .apb-rx-scroll-stage{perspective:1200px}
.apb-rx-sx-stage{position:relative;width:min(360px,72vw);height:min(360px,72vw);transform-style:preserve-3d}
.apb-rx-sx-layer{position:absolute;inset:0;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.5);transform:translateY(calc((1 - var(--apb-p,0)) * var(--i,0) * 120px)) translateZ(calc((1 - var(--apb-p,0)) * 60px));will-change:transform}
.apb-rx-sx-layer img{width:100%;height:100%;object-fit:cover}

/* draw: SVG line draws itself via stroke-dashoffset (path pathLength=1) */
.apb-rx-scroll--draw .apb-rx-scroll-stage{display:flex;flex-direction:column;gap:26px;align-items:center;justify-content:center}
.apb-rx-dr-head h2{margin:0;color:#fff;font-size:clamp(28px,4vw,48px)}
.apb-rx-dr-svg{width:min(680px,90vw)}
.apb-rx-dr-svg path{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--apb-p,0))}
.apb-rx-dr-steps{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.apb-rx-dr-step{opacity:1;transform:translateY(0);transition:opacity .4s,transform .4s;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:8px 16px;color:#fff;font-size:13px;font-weight:600}
.apb-rx-dr-step span{display:block}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-dr-step{opacity:0;transform:translateY(10px)}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-dr-step.is-active{opacity:1;transform:none}

/* text: large lines revealed one-by-one */
.apb-rx-scroll--text .apb-rx-scroll-stage{display:block}
.apb-rx-tx-wrap{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 8vw;gap:6px}
.apb-rx-scroll--text-wipe .apb-rx-tx-wrap{align-items:center;text-align:center}
.apb-rx-tx-line{overflow:hidden;margin:0}
.apb-rx-tx-line span{display:inline-block;color:#fff;font-weight:800;letter-spacing:-.02em;transform:translateY(0);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.apb-rx-scroll--text-wipe .apb-rx-tx-line span{font-size:clamp(40px,9vw,118px);line-height:.98}
.apb-rx-scroll--text-manifesto .apb-rx-tx-line span{font-size:clamp(26px,4vw,46px);line-height:1.22;font-weight:700}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-tx-line span{transform:translateY(112%)}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-tx-line.is-active span{transform:translateY(0)}

/* mesh: ambient gradient hue-shifts with p; words cross-fade */
.apb-rx-scroll--mesh .apb-rx-scroll-stage{display:block;background:var(--apb-rx-stage,#0a0a12)}
.apb-rx-mesh-bg{position:absolute;inset:-15%;opacity:.7;filter:blur(60px) hue-rotate(calc(var(--apb-p,0)*300deg));transform:rotate(calc(var(--apb-p,0)*40deg));will-change:filter,transform}
.apb-rx-mesh-bg i{position:absolute;width:48%;height:48%;border-radius:50%;background:var(--c,#6d28d9);left:var(--x,10%);top:var(--y,10%)}
.apb-rx-mesh-words{position:absolute;inset:0;display:grid;place-items:center;z-index:2}
.apb-rx-mesh-word{grid-area:1/1;color:#fff;font-size:clamp(48px,11vw,150px);font-weight:800;letter-spacing:-.04em;opacity:1;transition:opacity .5s}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-mesh-word{opacity:0}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-mesh-word.is-active{opacity:1}

@media(prefers-reduced-motion:reduce){
  .apb-rx-scroll--morph .apb-rx-sm-hero{position:relative;transform:none;height:56vh;border-radius:0}
  .apb-rx-scroll--deck .apb-rx-sk-wrap{position:relative;display:block;padding:12vh 5vw}
  .apb-rx-sk-card{position:relative;transform:none;width:100%;height:auto;min-height:220px;margin:0 auto 18px}
  .apb-rx-sx-layer{transform:none}
  .apb-rx-dr-svg path{stroke-dashoffset:0}
  .apb-rx-dr-step,.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-dr-step{opacity:1;transform:none}
  .apb-rx-tx-line span,.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-tx-line span{transform:none}
  .apb-rx-mesh-bg{filter:none;transform:none}
  .apb-rx-mesh-words{position:relative;display:block;padding:16vh 8vw}
  .apb-rx-mesh-word,.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-mesh-word{grid-area:auto;opacity:1;display:block;font-size:clamp(36px,8vw,90px)}
}

/* ===== batch 3: reveal-on-scroll (features / cascade / bento / flip / blur) =====
   All driven by var(--apb-p) with per-item --i / container --n / diagonal --d.
   Animated initial state is scoped under [data-apb-scroll-ready] so the section is
   fully visible without JS (fail-open). Per-item local progress --e in [0..1]. */
.apb-rx-scroll--rv-features,
.apb-rx-scroll--rv-cascade,
.apb-rx-scroll--rv-flip,
.apb-rx-scroll--rv-bento{--apb-rx-scroll-h:380vh}
.apb-rx-scroll--rv-blur{--apb-rx-scroll-h:320vh}
.apb-rx-scroll--rv-features .apb-rx-scroll-stage,
.apb-rx-scroll--rv-cascade .apb-rx-scroll-stage,
.apb-rx-scroll--rv-flip .apb-rx-scroll-stage,
.apb-rx-scroll--rv-bento .apb-rx-scroll-stage,
.apb-rx-scroll--rv-blur .apb-rx-scroll-stage{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:clamp(20px,4vh,44px);padding:9vh 6vw}
.apb-rx-rv-head{text-align:center;max-width:760px}
.apb-rx-rv-head h2{margin:0;color:#fff;font-size:clamp(28px,4.4vw,52px);line-height:1.05}
.apb-rx-rv-head .apb-rx-eyebrow{color:rgba(255,255,255,.78);margin:0 0 8px}

/* features: cards fade + rise, staggered */
.apb-rx-rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;width:min(960px,92vw)}
.apb-rx-rv-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--apb-rx-radius,16px);padding:22px;opacity:1;transform:none}
.apb-rx-rv-card h3{margin:0 0 6px;color:#fff;font-size:19px}
.apb-rx-rv-card p{margin:0;color:rgba(255,255,255,.78);font-size:14px;line-height:1.55}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-card{--e:clamp(0,calc(var(--apb-p,0)*var(--n,1) - (var(--i,1) - 1)),1);opacity:var(--e);transform:translateY(calc((1 - var(--e))*32px)) scale(calc(.96 + .04*var(--e)));will-change:transform,opacity}

/* cascade: rows slide in from alternating sides */
.apb-rx-rv-rows{display:flex;flex-direction:column;gap:10px;width:min(760px,92vw)}
.apb-rx-rv-row{display:flex;align-items:baseline;gap:14px;padding:13px 16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--apb-rx-radius,16px);opacity:1;transform:none}
.apb-rx-rv-rt{color:#fff;font-weight:600}
.apb-rx-rv-rs{color:rgba(255,255,255,.7);font-size:13px;margin-left:auto}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-row{--e:clamp(0,calc(var(--apb-p,0)*var(--n,1) - (var(--i,1) - 1)),1);opacity:var(--e);transform:translate(calc((1 - var(--e))*var(--dx,0)*60px),calc((1 - var(--e))*var(--dy,0)*40px));will-change:transform,opacity}

/* bento: tiles pop in on a diagonal wave */
.apb-rx-rv-bento{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;width:min(900px,92vw)}
.apb-rx-rv-tile{display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:13vh;padding:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--apb-rx-radius,16px);opacity:1;transform:none}
.apb-rx-rv-tk{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.6)}
.apb-rx-rv-tv{font-size:17px;font-weight:700;color:#fff}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-tile{--e:clamp(0,calc(var(--apb-p,0)*6 - var(--d,0)),1);opacity:var(--e);transform:translateY(calc((1 - var(--e))*26px)) scale(calc(.8 + .2*var(--e)));will-change:transform,opacity}

/* flip: cards rotate up into place */
.apb-rx-rv-flipgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;width:min(900px,92vw);perspective:1400px}
.apb-rx-rv-flip{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--apb-rx-radius,16px);padding:22px;transform-origin:bottom;opacity:1;transform:none}
.apb-rx-rv-flip h3{margin:0 0 6px;color:#fff;font-size:18px}
.apb-rx-rv-flip p{margin:0;color:rgba(255,255,255,.78);font-size:14px;line-height:1.5}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-flip{--e:clamp(0,calc(var(--apb-p,0)*var(--n,1) - (var(--i,1) - 1)),1);opacity:var(--e);transform:rotateX(calc((1 - var(--e))*90deg)) translateY(calc((1 - var(--e))*20px));will-change:transform,opacity}

/* blur: statement lines un-blur + rise line by line */
.apb-rx-rv-blur-wrap{width:min(820px,90vw);text-align:left}
.apb-rx-rv-blur-wrap .apb-rx-eyebrow{color:rgba(255,255,255,.78);margin:0 0 14px}
.apb-rx-rv-bline{display:block;color:#fff;font-weight:700;font-size:clamp(26px,4.6vw,52px);line-height:1.18;letter-spacing:-.02em}
.apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-bline{--e:clamp(0,calc(var(--apb-p,0)*var(--n,1) - (var(--i,1) - 1)),1);opacity:var(--e);filter:blur(calc((1 - var(--e))*14px));transform:translateY(calc((1 - var(--e))*22px));will-change:filter,transform,opacity}

@media(max-width:720px){
  .apb-rx-rv-grid,.apb-rx-rv-flipgrid{grid-template-columns:1fr}
  .apb-rx-rv-bento{grid-template-columns:repeat(2,1fr)}
}
@media(prefers-reduced-motion:reduce){
  .apb-rx-scroll--rv-features .apb-rx-scroll-stage,
  .apb-rx-scroll--rv-cascade .apb-rx-scroll-stage,
  .apb-rx-scroll--rv-flip .apb-rx-scroll-stage,
  .apb-rx-scroll--rv-bento .apb-rx-scroll-stage,
  .apb-rx-scroll--rv-blur .apb-rx-scroll-stage{min-height:auto;padding:14vh 6vw}
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-card,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-row,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-tile,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-flip,
  .apb-rx-scroll[data-apb-scroll-ready] .apb-rx-rv-bline{opacity:1;filter:none;transform:none}
}

/* ======================================================================
   scroll_duet — pinned two-column swap (image column + details column).
   Both halves swap in lockstep per scroll band. Light editorial surface.
   Base is BARE; the --card modifier ADDS the surface card (matches the
   apb-rx-share--card idiom). Fail-open: without [data-apb-scroll-ready]
   every step shows in normal flow.
   ====================================================================== */
.apb-rx-scroll--duet{--apb-rx-scroll-h:360vh;background:var(--apb-rx-soft,#f4f5f7);color:var(--apb-rx-ink,#0b0d12);overflow:clip}
.apb-rx-scroll--duet .apb-rx-scroll-stage{display:block;place-items:unset;min-height:100vh;overflow:visible}
.apb-rx-duet{box-sizing:border-box;position:relative;max-width:1180px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;justify-content:center;gap:clamp(20px,3vh,34px);padding:clamp(52px,8vh,100px) clamp(32px,6vw,104px)}
.apb-rx-duet-head{max-width:640px}
.apb-rx-duet-head .apb-rx-eyebrow{margin:0;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--apb-rx-accent-text,var(--apb-rx-brand,#111827))}
.apb-rx-duet-head h2{margin:10px 0 0;font-size:clamp(28px,4.2vw,46px);letter-spacing:-.028em;line-height:1.05;color:var(--apb-rx-ink,#0b0d12);text-wrap:balance}
.apb-rx-duet-stack{position:relative;flex:1;min-height:min(70vh,600px)}
.apb-rx-duet-step{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;margin-bottom:48px}
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step{position:absolute;inset:0;margin:0;opacity:0;pointer-events:none;transition:opacity calc(.6s / var(--apb-rx-dur,1)) ease}
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step.is-active{opacity:1;pointer-events:auto}
/* fail-safe guard: if the engine's 2.5s revealAll marks ALL beats active, show only the first
   (no-op in normal single-active operation; bands never overlap so the cross-fade is unaffected) */
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step.is-active ~ .apb-rx-duet-step.is-active{opacity:0;pointer-events:none}
.apb-rx-duet-media{position:relative;border-radius:calc(var(--apb-rx-radius,16px) * 1.25);overflow:hidden;height:min(58vh,540px);background:var(--apb-rx-line,#e5e7eb);box-shadow:var(--apb-rx-shadow-3,0 30px 70px -28px rgba(11,13,18,.30))}
.apb-rx-duet-media img{width:100%;height:100%;object-fit:cover;display:block}
.apb-rx-duet-media figcaption{position:absolute;left:14px;bottom:14px;padding:7px 13px;border-radius:999px;font-size:12.5px;font-weight:700;background:var(--apb-rx-surface,#fff);color:var(--apb-rx-ink,#0b0d12);box-shadow:0 6px 18px -6px rgba(0,0,0,.35)}
.apb-rx-duet-step--imgright .apb-rx-duet-media{order:2}
/* base bare -> --card adds chrome */
.apb-rx-duet-card{padding:0}
.apb-rx-duet--card .apb-rx-duet-card{background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line,#e5e7eb);border-radius:calc(var(--apb-rx-radius,16px) * 1.15);padding:clamp(24px,3vw,40px);box-shadow:var(--apb-rx-shadow-3,0 30px 70px -28px rgba(11,13,18,.30))}
.apb-rx-duet-card .num{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;font-size:14px;font-weight:800;border:1.5px solid var(--apb-rx-line,#e5e7eb);color:var(--apb-rx-muted,#6b7280);background:none}
.apb-rx-duet--card .apb-rx-duet-card .num{background:var(--apb-rx-soft,#f4f5f7)}
.apb-rx-duet-card .ey{display:block;margin:16px 0 0;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--apb-rx-accent-text,var(--apb-rx-brand,#111827))}
.apb-rx-duet-card h3{margin:8px 0 0;font-size:clamp(22px,2.6vw,30px);letter-spacing:-.02em;line-height:1.12;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-duet-card p{margin:12px 0 0;color:var(--apb-rx-muted,#6b7280);font-size:15.5px;line-height:1.6}
.apb-rx-duet-card ul{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:11px}
.apb-rx-duet-card li{position:relative;padding-left:26px;font-size:14.5px;line-height:1.5;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-duet-card li::before{content:"";position:absolute;left:0;top:6px;width:15px;height:15px;border-radius:999px;background:var(--apb-rx-check,var(--apb-rx-brand,#111827));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23fff' d='M8 13.2 4.8 10l-1.4 1.4L8 16 17 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23fff' d='M8 13.2 4.8 10l-1.4 1.4L8 16 17 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}
/* transition fx (author-chosen) applied to both cells on enter */
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-media,
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-card{transition:transform calc(.72s / var(--apb-rx-dur,1)) cubic-bezier(.22,1,.36,1),opacity calc(.5s / var(--apb-rx-dur,1)) ease}
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-card{transition-delay:calc(.07s / var(--apb-rx-dur,1))}
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step:not(.is-active) .apb-rx-duet-media,
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step:not(.is-active) .apb-rx-duet-card{transform:var(--apb-rx-fx-t,none)}
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step.is-active .apb-rx-duet-media,
.apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step.is-active .apb-rx-duet-card{transform:none}

/* ======================================================================
   scroll_spotlight — pinned CENTER image + card BELOW, swapping together.
   ====================================================================== */
.apb-rx-scroll--spot{--apb-rx-scroll-h:340vh;background:var(--apb-rx-soft,#f4f5f7);color:var(--apb-rx-ink,#0b0d12);overflow:clip}
.apb-rx-scroll--spot .apb-rx-scroll-stage{display:block;place-items:unset;min-height:100vh;overflow:visible}
.apb-rx-spot{box-sizing:border-box;position:relative;max-width:860px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;justify-content:center;gap:clamp(18px,3vh,30px);padding:clamp(52px,8vh,100px) clamp(28px,6vw,72px)}
.apb-rx-spot-head{text-align:center;max-width:640px;margin:0 auto}
.apb-rx-spot-head .apb-rx-eyebrow{margin:0;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--apb-rx-accent-text,var(--apb-rx-brand,#111827))}
.apb-rx-spot-head h2{margin:10px 0 0;font-size:clamp(28px,4.2vw,46px);letter-spacing:-.028em;line-height:1.05;color:var(--apb-rx-ink,#0b0d12);text-wrap:balance}
.apb-rx-spot-stack{position:relative;flex:1;min-height:min(72vh,640px)}
.apb-rx-spot-step{display:flex;flex-direction:column;align-items:center;gap:clamp(18px,2.6vw,28px);margin-bottom:56px}
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step{position:absolute;inset:0;margin:0;opacity:0;pointer-events:none;justify-content:center;transition:opacity calc(.6s / var(--apb-rx-dur,1)) ease}
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step.is-active{opacity:1;pointer-events:auto}
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step.is-active ~ .apb-rx-spot-step.is-active{opacity:0;pointer-events:none}
.apb-rx-spot-media{width:100%;height:min(50vh,460px);border-radius:calc(var(--apb-rx-radius,16px) * 1.25);overflow:hidden;background:var(--apb-rx-line,#e5e7eb);box-shadow:var(--apb-rx-shadow-3,0 30px 70px -28px rgba(11,13,18,.30))}
.apb-rx-spot-media img{width:100%;height:100%;object-fit:cover;display:block}
.apb-rx-spot-card{width:min(600px,100%);text-align:center;padding:0}
.apb-rx-spot--card .apb-rx-spot-card{background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line,#e5e7eb);border-radius:calc(var(--apb-rx-radius,16px) * 1.15);padding:clamp(22px,3vw,34px);box-shadow:var(--apb-rx-shadow-3,0 30px 70px -28px rgba(11,13,18,.30))}
.apb-rx-spot-card .ey{display:block;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--apb-rx-accent-text,var(--apb-rx-brand,#111827))}
.apb-rx-spot-card h3{margin:8px 0 0;font-size:clamp(21px,2.6vw,28px);letter-spacing:-.02em;line-height:1.14;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-spot-card p{margin:11px 0 0;color:var(--apb-rx-muted,#6b7280);font-size:15.5px;line-height:1.6}
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-media,
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-card{transition:transform calc(.72s / var(--apb-rx-dur,1)) cubic-bezier(.22,1,.36,1),opacity calc(.5s / var(--apb-rx-dur,1)) ease}
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-card{transition-delay:calc(.08s / var(--apb-rx-dur,1))}
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step:not(.is-active) .apb-rx-spot-media,
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step:not(.is-active) .apb-rx-spot-card{transform:var(--apb-rx-fx-t,none)}
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step.is-active .apb-rx-spot-media,
.apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step.is-active .apb-rx-spot-card{transform:none}

/* shared transition tokens (set by data-fx on the recipe root) */
.apb-rx-duet[data-fx="fade"],.apb-rx-spot[data-fx="fade"],.apb-rx-shero[data-fx="fade"]{--apb-rx-fx-t:none}
.apb-rx-duet[data-fx="fade-up"],.apb-rx-spot[data-fx="fade-up"],.apb-rx-shero[data-fx="fade-up"]{--apb-rx-fx-t:translateY(34px)}
.apb-rx-duet[data-fx="fade-down"],.apb-rx-spot[data-fx="fade-down"],.apb-rx-shero[data-fx="fade-down"]{--apb-rx-fx-t:translateY(-34px)}
.apb-rx-duet[data-fx="fade-scale"],.apb-rx-spot[data-fx="fade-scale"],.apb-rx-shero[data-fx="fade-scale"]{--apb-rx-fx-t:scale(.955)}

@media(max-width:760px){
  .apb-rx-scroll--duet,.apb-rx-scroll--spot{--apb-rx-scroll-h:300vh}
  .apb-rx-duet-step{grid-template-columns:1fr;gap:16px}
  .apb-rx-duet-step--imgright .apb-rx-duet-media{order:0}
  .apb-rx-duet-media{height:min(40vh,320px)}
  .apb-rx-spot-media{height:min(38vh,320px)}
}
@media(prefers-reduced-motion:reduce){
  .apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step,
  .apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step{position:relative;inset:auto;opacity:1;margin-bottom:48px;pointer-events:auto}
  /* neutralize the all-active sibling guard so reduced-motion shows EVERY step in flow (not just the first) */
  .apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-step.is-active ~ .apb-rx-duet-step.is-active,
  .apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-step.is-active ~ .apb-rx-spot-step.is-active{opacity:1;pointer-events:auto}
  .apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-media,
  .apb-rx-scroll--duet[data-apb-scroll-ready] .apb-rx-duet-card,
  .apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-media,
  .apb-rx-scroll--spot[data-apb-scroll-ready] .apb-rx-spot-card{transition:none;transform:none}
}

/* ======================================================================
   scroll_hero — pinned hero: headline holds on top; the image below (and an
   optional lead line) SWAP per scroll step. Locked to one viewport (100vh);
   the media flexes to fill the space under the title so it never overflows.
   Fail-open: without [data-apb-scroll-ready] the FIRST slide/lead shows.
   ====================================================================== */
.apb-rx-scroll--shero{--apb-rx-scroll-h:320vh;background:var(--apb-rx-soft,#f4f5f7);color:var(--apb-rx-ink,#0b0d12);overflow:clip}
.apb-rx-scroll--shero .apb-rx-scroll-stage{display:block;place-items:unset;min-height:100vh;overflow:visible}
.apb-rx-shero{box-sizing:border-box;position:relative;max-width:1240px;margin:0 auto;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:clamp(12px,2vh,24px);overflow:hidden;padding:clamp(24px,4vh,52px) clamp(20px,5vw,56px) clamp(18px,3.4vh,40px)}
.apb-rx-shero-head{flex:0 0 auto;max-width:940px;position:relative;z-index:2}
.apb-rx-shero-head .apb-rx-eyebrow{margin:0;font-size:12.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--apb-rx-accent-text,var(--apb-rx-brand,#111827))}
.apb-rx-shero-head h1{margin:12px 0 0;font-size:clamp(32px,5.2vw,64px);letter-spacing:-.032em;line-height:1;color:var(--apb-rx-ink,#0b0d12);text-wrap:balance}
.apb-rx-shero-leads{position:relative;width:min(62ch,100%);min-height:calc(1.5em * 2);margin:12px auto 0}
.apb-rx-shero-lead{position:absolute;inset:0;margin:0;font-size:clamp(16px,1.7vw,20px);line-height:1.5;color:var(--apb-rx-muted,#6b7280);opacity:0}
.apb-rx-shero-lead:first-child{opacity:1}
.apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-lead{opacity:0;transition:opacity calc(.5s / var(--apb-rx-dur,1)) ease,transform calc(.6s / var(--apb-rx-dur,1)) cubic-bezier(.22,1,.36,1);transform:var(--apb-rx-fx-t,none)}
.apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-lead.is-active{opacity:1;transform:none}
.apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-lead.is-active ~ .apb-rx-shero-lead.is-active{opacity:0}
.apb-rx-shero .apb-rx-cta-row{margin-top:14px;justify-content:center}
.apb-rx-shero-media{position:relative;flex:1 1 auto;min-height:0;width:100%;max-width:1180px;border-radius:calc(var(--apb-rx-radius,16px) * 1.35);overflow:hidden;background:var(--apb-rx-line,#e5e7eb);box-shadow:var(--apb-rx-shadow-3,0 40px 90px -35px rgba(11,13,18,.42))}
.apb-rx-shero-slide{position:absolute;inset:0;opacity:0}
.apb-rx-shero-slide:first-child{opacity:1}
.apb-rx-shero-slide img{width:100%;height:100%;object-fit:cover;display:block}
.apb-rx-shero-cap{position:absolute;left:16px;bottom:16px;padding:8px 15px;border-radius:999px;font-size:13px;font-weight:700;background:var(--apb-rx-surface,#fff);color:var(--apb-rx-ink,#0b0d12);box-shadow:0 8px 22px -8px rgba(0,0,0,.4)}
.apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-slide{opacity:0;transition:opacity calc(.55s / var(--apb-rx-dur,1)) ease,transform calc(.7s / var(--apb-rx-dur,1)) cubic-bezier(.22,1,.36,1);transform:var(--apb-rx-fx-t,none)}
.apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-slide.is-active{opacity:1;transform:none}
.apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-slide.is-active ~ .apb-rx-shero-slide.is-active{opacity:0}
.apb-rx-shero-cue{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--apb-rx-muted,#6b7280)}
.apb-rx-shero-cue i{width:22px;height:34px;border:2px solid var(--apb-rx-line,#e5e7eb);border-radius:12px;position:relative}
.apb-rx-shero-cue i::after{content:"";position:absolute;left:50%;top:6px;width:3px;height:7px;border-radius:2px;background:var(--apb-rx-muted,#6b7280);transform:translateX(-50%);animation:apb-rx-shero-dot 1.5s ease-in-out infinite}
@keyframes apb-rx-shero-dot{0%,100%{opacity:.3;transform:translate(-50%,0)}50%{opacity:1;transform:translate(-50%,7px)}}
.apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-cue{opacity:calc(1 - var(--apb-p,0) * 3.2)}
@media(max-width:760px){ .apb-rx-scroll--shero{--apb-rx-scroll-h:260vh} }
@media(prefers-reduced-motion:reduce){
  .apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-slide,
  .apb-rx-scroll--shero[data-apb-scroll-ready] .apb-rx-shero-lead{transition:none;transform:none}
  .apb-rx-shero-cue i::after{animation:none}
}

/* ===== scroll_expand — a small media card grows to a FULL-BLEED video on scroll (crisp clip-path reveal,
   driven off the shared --apb-p pin engine). Rest state (--apb-p:0, no/idle JS) = a legible 2-col hero:
   a side/centre media card + copy — the graceful fail-open. Variants: --left / --right / --curtain. ===== */
.apb-rx-scroll--xp{background:var(--apb-rx-surface,#fff);color:var(--apb-rx-ink,#0b0d12);
  --xe:calc(var(--apb-p,0)*var(--apb-p,0)*(3 - 2*var(--apb-p,0)))}       /* smoothstep of scroll progress */
.apb-rx-scroll--xp .apb-rx-scroll-stage{display:block;place-items:unset;position:sticky;top:0;height:100vh;overflow:hidden}
.apb-rx-xp-media{position:absolute;inset:0;z-index:1;overflow:hidden;background:var(--apb-rx-soft,#f4f5f7);will-change:clip-path}
.apb-rx-xp-media>video,.apb-rx-xp-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.apb-rx-xp-badge{position:absolute;top:18px;left:18px;z-index:3;display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;color:#fff;background:rgba(9,11,16,.42);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:var(--apb-rx-radius-pill,999px);padding:5px 11px;opacity:calc(1 - var(--xe,0)*1.6)}
.apb-rx-xp-dot{width:6px;height:6px;border-radius:50%;background:#fff}
.apb-rx-xp-wrap{position:relative;z-index:2;height:100%;max-width:1240px;margin:0 auto;padding:0 clamp(20px,5vw,56px);pointer-events:none}
.apb-rx-xp-copy{position:absolute;z-index:2;top:50%;transform:translateY(-50%);width:min(42%,460px);opacity:calc(1 - var(--xe,0)*2.2)}
.apb-rx-xp-copy h2{font-size:clamp(24px,3.4vw,42px);line-height:1.06;letter-spacing:-.03em;margin:0 0 14px;color:var(--apb-rx-ink,#0b0d12)}
.apb-rx-xp-ey{font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--apb-rx-accent-text,var(--apb-rx-brand,#4f46e5));margin:0 0 12px}
.apb-rx-xp-lead{font-size:16px;line-height:1.55;color:var(--apb-rx-muted,#6b7280);margin:0}
.apb-rx-xp-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:3;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--apb-rx-muted,#6b7280);opacity:calc(1 - var(--xe,0)*3)}
/* variant A — left card, copy right */
.apb-rx-xp--left .apb-rx-xp-media{clip-path:inset(calc(26% - var(--xe,0)*26%) calc(55% - var(--xe,0)*55%) calc(26% - var(--xe,0)*26%) calc(6% - var(--xe,0)*6%) round calc(20px - var(--xe,0)*20px))}
.apb-rx-xp--left .apb-rx-xp-copy{right:0;left:auto}
/* variant B — right card, copy left */
.apb-rx-xp--right .apb-rx-xp-media{clip-path:inset(calc(26% - var(--xe,0)*26%) calc(6% - var(--xe,0)*6%) calc(26% - var(--xe,0)*26%) calc(55% - var(--xe,0)*55%) round calc(20px - var(--xe,0)*20px))}
.apb-rx-xp--right .apb-rx-xp-copy{left:0;right:auto}
/* variant C — centre curtain that widens; copy sits over the media (white) and lifts out */
.apb-rx-xp--curtain .apb-rx-xp-media{clip-path:inset(calc(28% - var(--xe,0)*28%) calc(40% - var(--xe,0)*40%) calc(28% - var(--xe,0)*28%) calc(40% - var(--xe,0)*40%) round calc(22px - var(--xe,0)*22px))}
.apb-rx-xp--curtain .apb-rx-xp-copy{left:50%;right:auto;width:min(600px,86%);text-align:center;top:calc(50% - var(--xe,0)*42vh);transform:translate(-50%,-50%)}
/* curtain copy stays ink: at rest (--apb-p:0, no-JS, reduced-motion) it sits over the white surface beside
   the narrow centre media strip and must read; it fully fades (opacity) before the media ever covers it.
   A white glow halo is invisible on the surface but lifts the ink off the darker centre media strip. */
.apb-rx-xp--curtain .apb-rx-xp-copy h2{text-shadow:0 1px 16px var(--apb-rx-surface,#fff),0 0 6px var(--apb-rx-surface,#fff)}
/* reduced motion: no scroll-driven expand (--apb-p stays 0) — the rest 2-col card hero is the static state */
@media(prefers-reduced-motion:reduce){.apb-rx-scroll--xp{--apb-rx-scroll-h:auto;min-height:auto;--xe:0}.apb-rx-scroll--xp .apb-rx-scroll-stage{position:relative;height:auto;min-height:64vh}}