/* Castbay — section styles for this showcase (Plumo DNA, tokens only).
   Four pastel fields for an independent-podcast brand: peach, pink, butter, lilac (the kit's --mint slot carries the peach,
   --lime the butter). One plum ink (the palette's accent) for every heading and button. */
:root {
  --lilac: #EBE1FA; --lilac-2: #B79BE6; --violet: #CDB8F0;
  --pink: #FCDCE8; --lime: #FFF0B8; --mint: #FFE3D2; --peach: #FFEADC;
  --grad-chip: linear-gradient(90deg, #FCDCE8 0%, #FFE3D2 32%, #FFF0B8 64%, #EBE1FA 100%);
  --btn-glint: #E9B3CF;
  --ink: var(--accent);
  --text: var(--accent);
  --glide: rgba(var(--accent-rgb), .06);
  --shadow-1: 0 4px 16px rgba(var(--accent-rgb), .05);
  --shadow-2: 0 24px 60px -24px rgba(var(--accent-rgb), .22);
}

/* plumo.css hard-codes the demo navy in a few rules: re-tint them with the plum ink */
.nav a { color: rgba(var(--accent-rgb), .8); }
.nav a:hover { color: var(--ink); }
.mk-post, .mk-confirm { box-shadow: 0 1em 2.4em -1em rgba(var(--accent-rgb), .25); }
.mk-ad__shade { background: linear-gradient(to bottom, rgba(var(--accent-rgb), .55), rgba(var(--accent-rgb), 0) 24%, rgba(var(--accent-rgb), 0) 44%, rgba(var(--accent-rgb), .6) 72%, rgba(var(--accent-rgb), .9)); }
.mk-ad__brand { background: rgba(var(--accent-rgb), .55); }
.mk-ad__brand i svg { fill: var(--ink); }

/* small text roles inside Castbay's mock-ups */
.cb-t { font: 500 15px/1.35 var(--font-display); color: var(--ink); letter-spacing: -.01em; }
.cb-s { font: 400 13px/1.45 var(--font); color: var(--text-2); }
.cb-l { font: 500 13px/1.3 var(--font-display); }
.cb-big { font: 600 44px/1.05 var(--font-display); letter-spacing: -.03em; color: var(--ink); }
.cb-big small { font: 400 14px/1 var(--font); letter-spacing: 0; color: var(--text-2); margin-left: 8px; }
.cb-ico { width: 36px; height: 36px; border-radius: 10px; background: var(--paper); display: grid; place-items: center; flex: none; color: var(--ink); }
.cb-ico .mk-ico { width: 18px; height: 18px; }

/* ── header C on the white page ── */
.cb-top { width: min(var(--band), 100% - 2 * var(--gutter)); margin: 13px auto 0; position: relative; z-index: 20; }
.cb-head { background: transparent; padding: 0 8px; }
.cb-head .logo { justify-self: center; }
.cb-head .logo__mark { background: var(--accent); }
.cb-head .logo__mark svg, .cb-foot .logo__mark svg { fill: #fff; }
.cb-top .mnav { position: absolute; left: 0; right: 0; }

/* ── HERO (hero-c rebuilt): peach field, the host fading in from the right ── */
.cb-hero { width: min(var(--band), 100% - 2 * var(--gutter)); margin: 8px auto 0; }
.cb-hero__frame { position: relative; height: 800px; border-radius: var(--r-xl); overflow: hidden; isolation: isolate; background: var(--mint); }
.cb-hero__img { position: absolute; z-index: -1; top: 0; right: 0; width: 60%; height: 100%; object-fit: cover; object-position: 46% 30%;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 24%); mask-image: linear-gradient(to right, transparent 0%, #000 24%); }
.cb-hero__copy { position: absolute; left: 64px; top: 56px; bottom: 56px; width: 600px; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; }
.cb-news { transition: background-color .3s var(--ease); }
.cb-news:hover { background: var(--paper-soft); }
.cb-hero__title { display: flex; flex-direction: column; font: 600 116px/.94 var(--font-display); letter-spacing: -.055em; color: var(--ink); }
.cb-hero__foot { margin-top: auto; display: flex; flex-direction: column; align-items: flex-start; gap: 28px; }
.cb-hero__foot .t-lead { max-width: 450px; }
.cb-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.cb-hcard { position: absolute; right: 40px; bottom: 40px; width: 304px; padding: 16px; border-radius: 18px; background: #fff; box-shadow: var(--shadow-2); }
.cb-hcard__top { display: flex; align-items: center; gap: 12px; }
.cb-hcard__top img { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; flex: none; }
.cb-hcard__top > div { flex: 1; min-width: 0; }
.cb-hcard__rows { display: grid; gap: 8px; margin-top: 14px; }
.cb-hcard__rows li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; background: var(--paper); font: 400 14px/1.3 var(--font-display); color: var(--ink); }
.cb-hcard__rows .mk-ico { width: 18px; height: 18px; }
.cb-hcard__rows b { margin-left: auto; font-weight: 600; }
.cb-plays { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 18px; margin-top: 36px; font: 500 18px/1.5 var(--font-display); color: var(--ink); letter-spacing: -.01em; }
.cb-plays span { color: var(--text-2); font-weight: 400; margin-right: 6px; }
.cb-plays i { width: 5px; height: 5px; border-radius: 50%; background: var(--lilac-2); }

/* ── where Saturday goes ── */
.cb-weekend { display: grid; grid-template-columns: 1fr 620px; gap: 80px; align-items: center; }
.cb-weekend__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.cb-weekend__copy .t-lead { color: var(--text-2); max-width: 520px; }
.cb-checks { display: grid; gap: 12px; margin-top: 16px; }
.cb-checks li { display: flex; align-items: center; gap: 12px; font: 500 16px/1.6 var(--font-display); color: var(--ink); }
.cb-checks svg { width: 22px; height: 22px; flex: none; fill: none; stroke: var(--ink); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cb-weekend__visual { position: relative; height: 620px; border-radius: var(--r-lg); background: var(--paper); overflow: hidden; }
.cb-photocard { position: absolute; left: 40px; top: 40px; width: 300px; margin: 0; padding: 10px 10px 16px; border-radius: 22px; background: #fff; }
.cb-photocard > img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 14px; }
.cb-photocard figcaption { display: flex; align-items: center; gap: 12px; margin: 14px 6px 0; }
.cb-photocard .mk-avatar { width: 40px; height: 40px; }
.cb-photocard figcaption > span { display: block; font: 400 13px/1.45 var(--font); color: var(--text-2); }
.cb-photocard figcaption b { display: block; font: 500 15px/1.35 var(--font-display); color: var(--ink); }
.cb-ledger { position: absolute; right: 36px; top: 150px; width: 330px; }
.cb-ledger__card { padding: 22px; border-radius: 18px; background: #fff; }
.cb-ledger__rows { display: grid; gap: 14px; margin-top: 18px; }
.cb-ledger__rows li { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; align-items: center; font: 400 14px/1.3 var(--font-display); color: var(--ink); }
.cb-ledger__rows b { font-weight: 600; }
.cb-ledger__rows i { grid-column: 1 / -1; position: relative; display: block; height: 8px; border-radius: 8px; background: var(--paper); overflow: hidden; }
.cb-ledger__rows i::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 8px; background: var(--pink); }
.cb-ledger__total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line-2); font: 400 14px/1.3 var(--font-display); color: var(--text-2); }
.cb-ledger__total b { font: 600 24px/1 var(--font-display); letter-spacing: -.02em; color: var(--ink); }
.cb-ledger__float { position: absolute; left: -96px; bottom: -150px; width: 210px; padding: 18px; border-radius: 18px; background: #fff; box-shadow: var(--shadow-2); }
.cb-ledger__float .cb-big { margin: 4px 0 6px; font-size: 40px; }

/* ── one upload: the waveform band ── */
.cb-flow { padding: var(--band-pad) 64px; }
.cb-flow__stage { margin-top: var(--head-gap); }
.cb-wave { padding: 24px 28px 20px; border-radius: 20px; background: #fff; }
.cb-wave__head { display: flex; align-items: center; gap: 12px; }
.cb-wave__head img { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; flex: none; }
.cb-wavechart { position: relative; height: 150px; margin-top: 52px; }
.cb-wave__bars { display: flex; align-items: center; gap: 3px; height: 100%; }
.cb-wave__bars i { flex: 1; min-width: 1px; height: var(--h); border-radius: 3px; background: var(--paper-2); }
.cb-wave__bars i.is-a { background: var(--pink); }
.cb-wave__bars i.is-b { background: var(--lime); }
.cb-wave__bars i.is-c { background: var(--lilac); }
.cb-wave__mark { position: absolute; top: -34px; left: var(--x); transform: translateX(-50%); padding: 6px 9px; border-radius: 7px; background: var(--ink); color: var(--on-accent); font: 500 12px/1 var(--font-display); white-space: nowrap; }
.cb-wave__axis { display: flex; justify-content: space-between; margin-top: 14px; font: 400 12px/1 var(--font); color: var(--text-2); }
.cb-flow__outs { display: grid; grid-template-columns: 300px 1fr 1fr; gap: 24px; margin-top: 24px; }
.cb-out { min-height: 380px; }
.cb-clip { height: 100%; min-height: 380px; font-size: 14px; }
.cb-clip__cap { margin-top: auto; font: 600 23px/1.2 var(--font-display); letter-spacing: -.02em; color: #fff; text-wrap: balance; }
.cb-clip__tag { align-self: flex-start; margin-top: 12px; padding: 6px 9px; border-radius: 7px; background: #fff; color: var(--ink); font: 500 12px/1 var(--font-display); }
.cb-card { display: flex; flex-direction: column; gap: 16px; padding: 24px; border-radius: 20px; background: #fff; }
.cb-chapters { display: grid; gap: 6px; }
.cb-chapters li { display: flex; align-items: center; gap: 14px; padding: 11px 12px; border-radius: 10px; font: 400 15px/1.3 var(--font-display); color: var(--ink); }
.cb-chapters time { min-width: 44px; font: 500 13px/1.3 var(--font); color: var(--text-2); }
.cb-chapters li.is-on { background: var(--lime); }
.cb-chapters li.is-on time { color: var(--ink); }
.cb-card > .cb-s { margin-top: auto; }
.cb-minibars { height: 180px; margin-top: auto; font-size: 13px; }

/* ── clips band + the notes / listeners pair ── */
.cb-bands { width: min(var(--band), 100% - 2 * var(--gutter)); margin-inline: auto; display: grid; gap: 32px; }
.cb-fband { min-height: 640px; }
.cb-editor { height: 540px; }
.cb-editor__win { position: absolute; left: 0; top: 0; width: 540px; padding: 16px; }
.cb-editor__body { display: grid; grid-template-columns: 250px 1fr; gap: 22px; }
.cb-editor__clip { aspect-ratio: 9 / 16; font-size: 13px; }
.cb-editor__side { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding-top: 6px; }
.cb-editor__side .cb-t { margin-top: 10px; }
.cb-trim { position: relative; width: 100%; height: 44px; border-radius: 10px; background: var(--paper); }
.cb-trim i { position: absolute; top: 0; bottom: 0; left: var(--a); width: calc(var(--b) - var(--a)); border: 2px solid var(--ink); border-radius: 10px; background: var(--pink); }
.cb-sched { position: absolute; right: 0; bottom: 92px; display: flex; align-items: center; gap: 10px; padding: 16px 20px; border-radius: 16px; background: #fff; box-shadow: var(--shadow-2); font: 500 16px/1 var(--font-display); color: var(--ink); white-space: nowrap; }
.cb-sched .mk-ico { color: var(--success-ink); }
.cb-sched__days { position: absolute; right: 0; bottom: 40px; display: flex; gap: 6px; }
.cb-sched__days span { padding: 7px 10px; border-radius: 8px; background: #fff; font: 500 13px/1 var(--font-display); color: var(--ink); }

.cb-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.cb-half { position: relative; display: flex; flex-direction: column; gap: 48px; min-height: 780px; padding: 64px 56px 0; border-radius: var(--r-lg); overflow: hidden; }
.cb-half--lilac { background: var(--lilac); } .cb-half--butter { background: var(--lime); }
.cb-half__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.cb-half__copy h3 { max-width: 520px; }
.cb-half__copy p { max-width: 460px; }
.cb-half__visual { position: relative; height: 330px; margin-top: auto; }
.cb-doc, .cb-list { position: absolute; left: 0; right: 56px; top: 0; bottom: 0; padding: 26px 26px 0; border-radius: 18px 18px 0 0; background: #fff; }
.cb-doc__title { margin: 8px 0 16px; font: 600 24px/1.25 var(--font-display); letter-spacing: -.02em; color: var(--ink); max-width: 360px; }
.cb-doc__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cb-doc__chips span { padding: 6px 10px; border-radius: 8px; background: var(--lilac); font: 500 13px/1.2 var(--font-display); color: var(--ink); }
.cb-doc__line { margin-top: 18px; font: 400 15px/1.6 var(--font); color: var(--text-2); max-width: 400px; }
.cb-doc__float { position: absolute; right: 0; top: 150px; display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-radius: 14px; background: #fff; box-shadow: var(--shadow-2); font: 500 15px/1 var(--font-display); color: var(--ink); white-space: nowrap; }
.cb-doc__float .mk-ico { color: var(--success-ink); }
.cb-list .cb-big { margin-top: 12px; }
.cb-list__line { margin-top: 18px; }
.cb-mail { position: absolute; right: 0; top: 168px; display: flex; align-items: center; gap: 12px; width: 290px; padding: 14px 16px; border-radius: 16px; background: #fff; box-shadow: var(--shadow-2); }

/* ── host stories ── */
.cb-stories { padding: var(--band-pad) 48px; }
.cb-stories__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: var(--head-gap); align-items: start; }
.cb-story { display: flex; flex-direction: column; gap: 28px; padding: 32px; border-radius: var(--r-lg); background: #fff; }
.cb-story--lift { margin-top: 56px; }
.cb-story__nums { display: grid; gap: 10px; }
.cb-story__nums > div { padding: 14px 18px 16px; border-radius: 14px; background: var(--pink); }
.cb-story--lift .cb-story__nums > div { background: var(--lime); }
.cb-story:last-child .cb-story__nums > div { background: var(--lilac); }
.cb-story__nums span { display: block; font: 400 13px/1.4 var(--font); color: var(--text-2); }
.cb-story__nums p { display: flex; align-items: baseline; gap: 12px; margin-top: 4px; }
.cb-story__nums s { font: 500 16px/1 var(--font-display); color: var(--text-2); }
.cb-story__nums b { font: 600 34px/1.1 var(--font-display); letter-spacing: -.03em; color: var(--ink); }
.cb-story blockquote { margin: 0; }
.cb-story blockquote p { font: 400 17px/1.65 var(--font); color: var(--ink); }
.cb-story .who img { width: 52px; height: 52px; }

/* ── bring your show over ── */
.cb-move { display: grid; grid-template-columns: 420px 1fr; gap: 80px; align-items: start; }
.cb-move__head { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; position: sticky; top: 40px; }
.cb-move__head .t-lead { color: var(--text-2); }
.cb-move__path { position: relative; display: grid; }
.cb-move__track { position: absolute; left: 24px; right: 24px; top: 33px; height: 2px; border-radius: 2px; background: var(--line-2); }
.cb-move__track i { position: absolute; top: 0; bottom: 0; left: var(--a); width: calc(var(--b) - var(--a)); border-radius: 2px; background: var(--ink); }
.cb-stops { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; }
.cb-stop { position: relative; display: flex; flex-direction: column; align-items: flex-start; min-height: 280px; padding: 20px 24px 28px; border-radius: var(--r-step); }
.cb-stop--butter { background: var(--lime); } .cb-stop--lilac { background: var(--lilac); margin-top: 48px; } .cb-stop--pink { background: var(--pink); margin-top: 96px; }
.cb-stop time { padding: 8px 11px; border-radius: 9px; background: var(--ink); color: var(--on-accent); font: 500 13px/1 var(--font-display); }
.cb-stop h3 { margin-top: auto; padding-top: 56px; font: 500 20px/1.5 var(--font-display); }
.cb-stop p { margin-top: 8px; font-size: 15px; line-height: 1.65; color: var(--text-2); }
.cb-import { width: 360px; margin-top: -120px; padding: 24px; border-radius: 20px; background: #fff; box-shadow: var(--shadow-2); }
.cb-import .cb-big { margin-top: 18px; }
.cb-prog { height: 10px; margin-top: 14px; border-radius: 10px; background: var(--paper); overflow: hidden; }
.cb-prog i { display: block; width: var(--p); height: 100%; border-radius: inherit; background: var(--lilac-2); }
.cb-import__rows { margin-top: 16px; }
.cb-import__rows li { display: flex; justify-content: space-between; padding: 10px 0; border-top: 1px solid var(--line-2); font: 400 14px/1.3 var(--font-display); color: var(--ink); }
.cb-import__rows b { font-weight: 500; color: var(--success-ink); }

/* ── one price per show ── */
.cb-price { padding: var(--band-pad) 100px; }
.cb-price__grid { display: grid; grid-template-columns: 1fr 440px; gap: 32px; margin-top: var(--head-gap); align-items: stretch; }
.cb-plan { display: flex; flex-direction: column; }
.cb-plan .plan__foot { margin-top: auto; }
.cb-plan .plan__body { border-bottom: 0; }
.cb-calc { display: flex; flex-direction: column; gap: 12px; padding: 32px; border-radius: var(--r-lg); background: var(--lime); }
.cb-calc > .cb-t { font-size: 20px; margin-bottom: 8px; }
.cb-calc__row { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-radius: 12px; background: #fff; font: 400 15px/1.3 var(--font-display); color: var(--ink); }
.cb-calc__row > b { font: 600 18px/1 var(--font-display); }
.cb-calc__row .mk-seg { font-size: 14px; }
.cb-calc__out { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cb-calc__out > div { padding: 16px; border-radius: 12px; background: #fff; }
.cb-calc__out span, .cb-calc__total span { display: block; font: 400 13px/1.4 var(--font); color: var(--text-2); }
.cb-calc__out b { display: block; margin-top: 6px; font: 600 36px/1 var(--font-display); letter-spacing: -.03em; color: var(--ink); }
.cb-calc__total { display: flex; justify-content: space-between; align-items: baseline; margin-top: auto; padding-top: 18px; border-top: 1px solid rgba(var(--accent-rgb), .16); }
.cb-calc__total b { font: 600 48px/1 var(--font-display); letter-spacing: -.03em; color: var(--ink); }
.cb-calc__total small { font: 400 14px/1 var(--font); letter-spacing: 0; color: var(--text-2); margin-left: 6px; }

/* ── questions ── */
.cb-qs { display: grid; grid-template-columns: 400px 1fr; gap: 96px; align-items: start; }
.cb-qs__head { position: sticky; top: 40px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.cb-qs__head .t-lead { color: var(--text-2); }
.cb-qs__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cb-q { padding: 30px 30px 34px; border: 1px solid var(--line-2); border-radius: var(--r); background: #fff; transition: background-color .35s var(--ease); }
.cb-q:hover { background: var(--paper-soft); }
.cb-q h3 { font: 500 20px/1.45 var(--font-display); }
.cb-q p { margin-top: 10px; color: var(--text-2); }

/* ── CTA D + footer C ── */
.cb-ctad { background: var(--lilac); }
.cb-foot { margin: var(--section) auto 32px; }
.cb-foot .v-fcf__fade { background: linear-gradient(to bottom, rgba(var(--accent-rgb), 0) 0%, rgba(var(--accent-rgb), .2) 30%, rgba(var(--accent-rgb), .78) 62%, var(--accent) 100%); }
.cb-foot .v-fcf__img { object-position: 50% 40%; }
.cb-foot .logo__mark { background: rgba(255,255,255,.16); }

/* ── responsive ── */
@media (max-width: 1360px) {
  .cb-hero__title { font-size: 100px; }
  .cb-hero__copy { width: 520px; }
  .cb-hero__img { width: 62%; }
  .cb-weekend { grid-template-columns: 1fr 560px; gap: 56px; }
  .cb-weekend__visual { height: 600px; }
  .cb-photocard { left: 28px; width: 270px; }
  .cb-ledger { right: 24px; width: 300px; }
  .cb-ledger__float { left: -70px; }
  .cb-flow { padding-inline: 40px; }
  .cb-flow__outs { grid-template-columns: 260px 1fr 1fr; }
  .cb-editor__win { width: 500px; }
  .cb-editor__body { grid-template-columns: 220px 1fr; }
  .cb-half { padding: 56px 40px 0; }
  .cb-stories { padding-inline: 32px; }
  .cb-move { grid-template-columns: 1fr; gap: 56px; }
  .cb-move__head { position: static; max-width: 640px; }
  .cb-price { padding-inline: 40px; }
  .cb-qs { grid-template-columns: 340px 1fr; gap: 56px; }
}
@media (max-width: 1100px) {
  .cb-weekend { grid-template-columns: 1fr; gap: 48px; }
  .cb-weekend__visual { width: 100%; max-width: 640px; }
  .cb-pair { grid-template-columns: 1fr; }
  .cb-half { min-height: 0; }
  .cb-price__grid { grid-template-columns: 1fr; }
  .cb-qs { grid-template-columns: 1fr; gap: 48px; }
  .cb-qs__head { position: static; }
}
@media (max-width: 991px) {
  .cb-head { padding: 0; }
  .cb-hero__frame { height: auto; display: flex; flex-direction: column; }
  .cb-hero__copy { position: static; width: auto; padding: 48px 40px 40px; }
  .cb-hero__foot { margin-top: 24px; }
  .cb-hero__title { font-size: 92px; }
  .cb-hero__img { position: relative; z-index: 0; width: 100%; height: 520px; object-position: 50% 30%;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 22%); mask-image: linear-gradient(to bottom, transparent 0%, #000 22%); }
  .cb-hcard { right: 24px; bottom: 24px; }
  .cb-flow__outs { grid-template-columns: 1fr 1fr; }
  .cb-out--clip { grid-row: span 2; }
  .cb-fband { min-height: 0; padding-bottom: 48px; }
  .cb-editor { height: 560px; }
  .cb-editor__win { width: 100%; max-width: 540px; }
  .cb-stories__grid { grid-template-columns: 1fr; max-width: 600px; margin-inline: auto; }
  .cb-story--lift { margin-top: 0; }
  .cb-stop--lilac { margin-top: 32px; } .cb-stop--pink { margin-top: 64px; }
  .cb-import { margin-top: 24px; }
  .cb-ctad { flex-direction: column; align-items: flex-start; padding: 48px 40px; }
}
@media (max-width: 767px) {
  .cb-top { margin-top: 8px; }
  .cb-hero__frame { border-radius: var(--r-lg); }
  .cb-hero__copy { padding: 28px 20px 28px; gap: 24px; }
  .cb-hero__title { font-size: 64px; letter-spacing: -.05em; }
  .cb-news span { font-size: 13px; }
  .cb-hero__ctas { flex-direction: column; width: 100%; }
  .cb-hero__ctas .btn { width: 100%; }
  .cb-hero__img { height: 380px; }
  .cb-hcard { position: relative; right: auto; bottom: auto; width: auto; margin: -72px 16px 16px; }
  .cb-plays { font-size: 15px; gap: 6px 12px; margin-top: 28px; }
  .cb-plays span { width: 100%; text-align: center; margin: 0; }
  .cb-weekend__visual { height: 700px; }
  .cb-photocard { left: 16px; top: 16px; width: 64%; }
  .cb-ledger { right: 12px; top: 300px; width: 74%; }
  .cb-ledger__float { left: auto; right: auto; bottom: auto; position: relative; width: 190px; margin: -20px 0 0 -60px; }
  .cb-flow { padding: 72px 16px; }
  .cb-wave { padding: 20px 16px 16px; }
  .cb-wave__bars { gap: 1px; }
  .cb-wave__mark { font-size: 11px; padding: 5px 6px; }
  .cb-wave__axis span:nth-child(2), .cb-wave__axis span:nth-child(4) { display: none; }
  .cb-flow__outs { grid-template-columns: 1fr; }
  .cb-out--clip { grid-row: auto; }
  .cb-clip { min-height: 440px; }
  .cb-out { min-height: 0; }
  .cb-fband .fband__visual.cb-editor { height: auto; }
  .cb-editor__win { position: relative; }
  .cb-editor__body { grid-template-columns: 1fr 1fr; gap: 14px; }
  .cb-editor__side .mk-seg { font-size: 13px; }
  .cb-sched { position: relative; right: auto; bottom: auto; display: inline-flex; margin: -24px 0 0 16px; }
  .cb-sched__days { position: relative; right: auto; bottom: auto; flex-wrap: wrap; margin: 12px 0 0; }
  .cb-half { padding: 40px 20px 0; gap: 36px; }
  .cb-half__visual { height: 380px; }
  .cb-doc, .cb-list { right: 16px; padding: 22px 20px 0; }
  .cb-doc__float { top: auto; bottom: 24px; }
  .cb-mail { top: auto; bottom: 20px; width: 260px; }
  .cb-stories { padding: 72px 16px; }
  .cb-story { padding: 24px 20px; }
  .cb-stops { grid-template-columns: 1fr; gap: 16px; }
  .cb-stop { min-height: 0; }
  .cb-stop--lilac, .cb-stop--pink { margin-top: 0; }
  .cb-stop h3 { padding-top: 28px; }
  .cb-move__track { display: none; }
  .cb-import { width: 100%; }
  .cb-price { padding: 72px 16px; }
  .cb-price .ticks { grid-template-columns: 1fr; }
  .cb-calc { padding: 24px 18px; }
  .cb-calc__total b { font-size: 40px; }
  .cb-qs__grid { grid-template-columns: 1fr; }
  .cb-q { padding: 24px 22px 26px; }
  .cb-ctad { padding: 40px 20px; }
  .cb-ctad .btn { width: 100%; }
  .cb-foot { margin-bottom: 16px; }
}

/* ── round 2 fixes ── */
.cb-photocard > img { height: auto; }
.cb-wave__bars i.is-c { background: var(--lilac-2); }
.cb-cliprows { display: grid; gap: 6px; width: 100%; }
.cb-cliprows li { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; background: var(--paper); font: 400 14px/1.3 var(--font-display); color: var(--ink); }
.cb-cliprows time { font: 500 12px/1.3 var(--font); color: var(--text-2); }
.cb-cliprows .mk-ico { width: 16px; height: 16px; margin-left: auto; color: var(--success-ink); }
.cb-cliprows li.is-on { background: var(--pink); }
.cb-editor__side .cb-trim { margin-top: 6px; }
.cb-doc__float { top: 22px; }
.cb-import { position: relative; margin-top: -64px; width: 340px; }
@media (max-width: 991px) { .cb-import { margin-top: 24px; } }
.cb-photocard { left: 36px; top: 36px; width: 290px; }
.cb-ledger { top: 60px; right: 32px; }
.cb-ledger__float { left: auto; right: 36px; bottom: auto; top: calc(100% + 22px); }
@media (max-width: 1360px) { .cb-ledger { width: 290px; right: 20px; } .cb-photocard { width: 262px; } }
.cb-stop--lilac { margin-top: 32px; } .cb-stop--pink { margin-top: 64px; }
.cb-import { margin-top: 24px; justify-self: end; }
.cb-qs { grid-template-columns: 440px 1fr; gap: 80px; }
@media (max-width: 1360px) { .cb-qs { grid-template-columns: 360px 1fr; gap: 56px; } }
@media (max-width: 1100px) { .cb-qs { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .cb-stop--lilac, .cb-stop--pink { margin-top: 0; } .cb-import { justify-self: stretch; } }
.cb-big { font-size: 48px; }
.cb-story__nums b { font-size: 36px; }
.cb-stop p { font-size: 16px; }
@media (max-width: 767px) {
  .cb-editor__clip .mk-ad__shade { background: linear-gradient(to bottom, rgba(var(--accent-rgb), .5), rgba(var(--accent-rgb), 0) 22%, rgba(var(--accent-rgb), 0) 34%, rgba(var(--accent-rgb), .72) 58%, rgba(var(--accent-rgb), .94)); }
  .cb-editor__clip .cb-clip__cap { font-size: 17px; }
}
/* round 3 */
.cb-weekend { grid-template-columns: 620px 1fr; }
.cb-weekend__visual { order: -1; }
@media (max-width: 1360px) { .cb-weekend { grid-template-columns: 560px 1fr; } }
@media (max-width: 1100px) { .cb-weekend { grid-template-columns: 1fr; } }
.cb-stop--peach { background: var(--mint); }
.cb-trim i { display: grid; place-items: center; }
.cb-trim i b { font: 600 13px/1 var(--font-display); color: var(--ink); }
.cb-glass { border-radius: 20px; }
.cb-glass .mk-glass__bg { inset: -10% -10% -10% 0; width: 110%; height: 120%; }
.cb-glass__card { position: absolute; left: 20px; right: 20px; top: 20px; bottom: 20px; display: flex; flex-direction: column; gap: 14px; padding: 20px; }
.cb-glass .cb-minibars { height: auto; flex: 1; min-height: 120px; }
.cb-calc { display: block; padding: 0; background: #fff; }
.cb-calc .mk-glass__bg { inset: -8% -8% -8% 0; width: 108%; height: 116%; }
.cb-calc__in { position: relative; display: flex; flex-direction: column; gap: 12px; height: calc(100% - 48px); margin: 24px; padding: 24px; }
.cb-calc__row, .cb-calc__out > div { background: rgba(255,255,255,.92); }
@media (max-width: 767px) {
  .cb-ledger__float { position: relative; left: auto; right: auto; top: auto; bottom: auto; width: auto; margin: 12px 0 0 40px; }
  .cb-weekend__visual { height: 760px; }
  .cb-glass { min-height: 380px; }
  .cb-calc__in { margin: 16px; padding: 18px; height: auto; }
}
/* round 4: import card leads the path */
.cb-move { align-items: center; }
.cb-move__head { position: static; }
.cb-move__path { display: grid; gap: 24px; }
.cb-move__stops { position: relative; }
.cb-import { display: grid; grid-template-columns: 1.15fr 1fr; gap: 40px; align-items: center; width: auto; margin: 0; justify-self: stretch; }
.cb-import .cb-big { margin-top: 14px; }
.cb-import__rows { margin-top: 0; }
.cb-import__rows li:first-child { border-top: 0; }
.cb-stop { min-height: 260px; }
.cb-stop--lilac { margin-top: 24px; } .cb-stop--pink { margin-top: 48px; }
.cb-qs { grid-template-columns: 520px 1fr; gap: 64px; }
@media (max-width: 1360px) { .cb-qs { grid-template-columns: 1fr 1.4fr; gap: 56px; } }
@media (max-width: 1100px) { .cb-qs { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .cb-import { grid-template-columns: 1fr; gap: 12px; } .cb-stop--lilac, .cb-stop--pink { margin-top: 0; } }

/* ── final responsive layer (last in the file so it wins) ── */
.cb-wave__head .mk-pill, .cb-list .mk-up { white-space: nowrap; }
@media (max-width: 991px) {
  .cb-head .logo { grid-column: 2; }
  .cb-head .site-head__end { grid-column: 3; }
  .cb-hero__copy { order: -1; }
}
@media (max-width: 767px) {
  .cb-weekend__visual { height: auto; padding: 16px 16px 24px; overflow: visible; }
  .cb-photocard { position: relative; left: auto; top: auto; width: 72%; }
  .cb-ledger { position: relative; right: auto; top: auto; width: 88%; margin: -96px 0 0 auto; }
  .cb-ledger__card { box-shadow: var(--shadow-1); }
  .cb-ledger__float { position: relative; left: auto; right: auto; top: auto; bottom: auto; width: 200px; margin: -24px 0 0 -28px; }
  .cb-wave__head .mk-pill { display: none; }
  .cb-editor__body { grid-template-columns: 1fr; }
  .cb-editor__clip { aspect-ratio: 4 / 5; }
  .cb-doc__float { top: auto; bottom: 24px; right: 0; }
  .cb-mail { top: auto; bottom: 20px; }
  .cb-stop { min-height: 0; }
  .cb-stop h3 { padding-top: 28px; }
  .cb-stop--lilac, .cb-stop--pink { margin-top: 0; }
  .cb-qs { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .cb-hero__frame { height: auto; display: flex; flex-direction: column; }
  .cb-hero__copy { position: static; width: auto; padding: 48px 40px 40px; order: -1; }
  .cb-hero__foot { margin-top: 24px; }
  .cb-hero__title { font-size: 92px; }
  .cb-hero__img { position: relative; z-index: 0; width: 100%; height: 540px; object-position: 50% 30%;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 22%); mask-image: linear-gradient(to bottom, transparent 0%, #000 22%); }
  .cb-hcard { right: 24px; bottom: 24px; }
  .cb-story { padding: 24px; }
  .cb-story__nums s, .cb-story__nums b { white-space: nowrap; }
  .cb-story__nums b { font-size: 28px; }
}
@media (max-width: 767px) {
  .cb-hero__copy { padding: 28px 20px; }
  .cb-hero__title { font-size: 64px; }
  .cb-hero__img { height: 380px; }
  .cb-hcard { position: relative; right: auto; bottom: auto; width: auto; margin: -72px 16px 16px; }
  .cb-ledger { margin-top: -48px; }
}


/* 2026-10-17 fix: the track runs BEHIND the step cards (it threads them together and shows only in the gaps), never across a card or its time pill */
.cb-move__stops { position: relative; isolation: isolate; }
.cb-move__track { z-index: 0; top: 150px; left: 0; right: 0; }
.cb-stops { position: relative; z-index: 1; }
