/* rel8r-editorial.css — the editorial home FRAME (owner's responsive layout reference, 2026-10-05).
   Frame only: every artwork area is an empty container (.ed-box) at the size the reference draws it; the transparent
   raster art is layered in after the owner approves the frame. Colours and fonts are tokens (site/rel8r-tokens.css,
   section 1c). Element IDs in data-ref match design/reference/layout-map/ (D desktop 1440, T tablet 768, M mobile 390).

   Grid: 4 columns at 767px and below, 8 columns from 768px, 12 columns from 1024px.
   Type: each text element names its size at the three reference anchors (--m at 390, --t at 768, --d at 1440).
   Phones interpolate between 390 and 768, tablets hold the 768 size, desktops scale with the viewport up to 1440. */

/* ---- page and grid ------------------------------------------------------- */
.ed-page {
  --ed-cols: var(--ed-cols-mob); --ed-gap: var(--ed-gap-mob); --ed-gutter: var(--ed-gutter-mob); --ed-header-h: var(--ed-header-h-mob);
  --ed-band-pad: var(--ed-band-pad-mob); --ed-logo-h: var(--ed-logo-h-mob); --ed-logo-footer-h: var(--ed-logo-footer-h-mob);
  margin: 0; background: rgb(var(--ch-stage)); color: rgb(var(--ch-cream)); font-family: var(--font-headline);
  line-height: 1.3; -webkit-font-smoothing: antialiased; overflow-x: clip;
}
@media (min-width: 768px) {
  .ed-page { --ed-cols: var(--ed-cols-tab); --ed-gap: var(--ed-gap-tab); --ed-gutter: var(--ed-gutter-tab); --ed-header-h: var(--ed-header-h-tab);
    --ed-band-pad: var(--ed-band-pad-tab); --ed-logo-h: var(--ed-logo-h-tab); --ed-logo-footer-h: var(--ed-logo-footer-h-tab); }
}
@media (min-width: 1024px) {
  .ed-page { --ed-cols: var(--ed-cols-desk); --ed-gap: var(--ed-gap-desk); --ed-gutter: var(--ed-gutter-desk); --ed-header-h: var(--ed-header-h-desk);
    --ed-band-pad: var(--ed-band-pad-desk); --ed-logo-h: var(--ed-logo-h-desk); --ed-logo-footer-h: var(--ed-logo-footer-h-desk); }
}
.ed-page *, .ed-page *::before, .ed-page *::after { box-sizing: border-box; }
.ed-page ::selection { background: rgb(var(--ch-hotpink)); color: rgb(var(--ch-stage)); }
.ed-wrap, .ed-header__in, .ed-footer__in { width: min(100% - 2 * var(--ed-gutter), var(--ed-content-max)); margin-inline: auto; }
.ed-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ed-sr { position: absolute; width: var(--ed-len-1); height: var(--ed-len-1); overflow: hidden; clip-path: inset(var(--ed-half)); white-space: nowrap; }
/* .ed-page .ed-skip outranks .ed-btn (which sets position: relative, later in this file); as a plain .ed-skip the link stayed in
   flow and left a 46px blank strip above the header on every page (found 2026-10-28) */
.ed-page .ed-skip { position: absolute; left: var(--ed-gutter); top: calc(-1 * var(--ed-len-100)); z-index: var(--ed-z-nav); }
.ed-page .ed-skip:focus { top: var(--ed-len-8); }

/* section bands: content-driven height, a thin antique-gold seam on top between sections (COA-117: was pink; one gold family
   from header to footer, --gold-rule in rel8r-tokens.css); every home band
   pads top and bottom by one step of the 8-point scale at each width (--ed-band-pad, rel8r-tokens.css; owner 2026-10-24) */
.ed-band, .ed-final, .ed-footer { position: relative; }
.ed-band::before, .ed-final::before, .ed-footer::before { content: ""; position: absolute; inset: 0 0 auto; height: var(--ed-len-1);
  height: var(--gold-rule-h); background: var(--gold-rule); opacity: var(--ed-alpha-fill); }
.ed-band { padding-block: var(--ed-band-pad); }

/* ---- fluid type ---------------------------------------------------------- */
.ed-logo, .ed-nav a, .ed-menu nav a, .ed-poster, .ed-hero__lead, .ed-hero__body, .ed-body, .ed-btn, .ed-trust li,
.ed-box__label, .ed-trustband__text, .ed-footer__links a, .ed-dialconsole__pill,
h1, h2, h3, h4, .ed-h1, .ed-h2, .ed-h3, .ed-h4 {
  font-size: clamp(calc(var(--m) * 0.8 * var(--ed-px)), calc(var(--m) * var(--ed-px) + (var(--t) - var(--m)) * (var(--ed-vw-100) - var(--ed-len-390)) / 378), calc(var(--t) * var(--ed-px)));
}
@media (min-width: 768px) {
  .ed-logo, .ed-nav a, .ed-menu nav a, .ed-poster, .ed-hero__lead, .ed-hero__body, .ed-body, .ed-btn, .ed-trust li,
  .ed-box__label, .ed-trustband__text, .ed-footer__links a,
  h1, h2, h3, h4, .ed-h1, .ed-h2, .ed-h3, .ed-h4 { font-size: calc(var(--t) * var(--ed-px)); }
}
@media (min-width: 1024px) {
  .ed-logo, .ed-nav a, .ed-menu nav a, .ed-poster, .ed-hero__lead, .ed-hero__body, .ed-body, .ed-btn, .ed-trust li,
  .ed-box__label, .ed-trustband__text, .ed-footer__links a,
  h1, h2, h3, h4, .ed-h1, .ed-h2, .ed-h3, .ed-h4 {
    font-size: clamp(max(calc(var(--d) * 0.72 * var(--ed-px)), var(--floor, 0px)), calc(var(--d) * var(--ed-vw-100) / 1440), calc(var(--d) * var(--ed-px)));
  }
}
h1, .ed-h1 { font-family: var(--font-headline); font-weight: 800; --m: 36; --t: 54; --d: 64; }
h2, .ed-h2 { font-family: var(--font-headline); font-weight: 800; --m: 26; --t: 36; --d: 44; }
h3, .ed-h3 { font-family: var(--font-headline); font-weight: 700; --m: 20; --t: 26; --d: 32; }
h4, .ed-h4 { font-family: var(--font-headline); font-weight: 700; --m: 16; --t: 20; --d: 24; }
.ed-poster { margin: 0; font-family: var(--font-poster); font-weight: 900; text-transform: uppercase; line-height: 0.9; letter-spacing: 0; }
.ed-pink { color: rgb(var(--ch-hotpink)); }
.ed-line { display: block; }
.ed-body { margin: 0; line-height: 1.45; color: rgb(var(--ch-cream)); --m: 14; --t: 16; --d: 17.5; --floor: var(--ed-len-14); }

/* ---- icons, buttons, focus ----------------------------------------------- */
.ed-ico { display: block; flex: none; }
svg.ed-ico { width: var(--ed-em-1); height: var(--ed-em-1); fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ed-ico.material-symbols-outlined { font-size: var(--ed-em-1); line-height: 1; overflow: hidden; user-select: none;
  font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 40; }
.ed-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--ed-em-0-55); min-height: max(var(--ed-em-3-2), var(--ed-tap-min)); padding: 0 var(--ed-em-2-2);
  border: var(--ed-len-1) solid transparent; border-radius: var(--ed-em-0-7); font-family: var(--font-headline); font-weight: 800; line-height: 1;
  letter-spacing: var(--ed-em-0-04); text-transform: uppercase; text-decoration: none; white-space: nowrap; cursor: pointer;
  --m: 11; --t: 14.5; --d: 14.5; --floor: var(--ed-len-12); position: relative; isolation: isolate;
  transition: transform var(--ed-fast) var(--ed-ease), box-shadow var(--ed-fast) var(--ed-ease), background var(--ed-fast) var(--ed-ease), border-color var(--ed-fast) var(--ed-ease); }
.ed-btn--pink {
  background: linear-gradient(180deg, rgb(var(--ch-bubble)), rgb(var(--ch-hotpink)), rgb(var(--ch-magenta)));
  color: rgb(var(--ch-pure-black));
  font-weight: 800;
  border-color: rgb(var(--ch-gold-edge) / 0.6);
  box-shadow: 0 var(--ed-len-1) var(--ed-len-2) rgb(var(--ch-ink) / 0.55), 0 var(--ed-len-4) var(--ed-len-12) rgb(var(--ch-ink) / 0.4), inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / 0.7), inset 0 calc(-1 * var(--ed-len-1)) 0 rgb(var(--ch-gold-deep) / 0.4); }
.ed-btn--pink:hover {
  transform: translateY(calc(-1 * var(--ed-len-2)));
  background: linear-gradient(180deg, rgb(var(--ch-bubble)), rgb(var(--ch-hot)), rgb(var(--ch-magenta)));
  color: rgb(var(--ch-pure-black));
  border-color: rgb(var(--ch-gold-specular) / 0.8);
  box-shadow: 0 var(--ed-len-4) var(--ed-len-8) rgb(var(--ch-ink) / 0.6), 0 var(--ed-len-8) var(--ed-len-20) rgb(var(--ch-ink) / 0.45), inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / 0.85), inset 0 calc(-1 * var(--ed-len-1)) 0 rgb(var(--ch-gold-deep) / 0.5); }
.ed-btn--pink:active {
  transform: translateY(var(--ed-len-1));
  color: rgb(var(--ch-pure-black));
  box-shadow: 0 var(--ed-len-1) var(--ed-len-2) rgb(var(--ch-ink) / 0.7), inset 0 var(--ed-len-1) var(--ed-len-2) rgb(var(--ch-gold-deep) / 0.6); }
.ed-btn--ghost {
  border-color: rgb(var(--ch-gold-edge) / var(--ed-alpha-line));
  background: linear-gradient(180deg, rgb(var(--ch-gold-edge) / var(--ed-alpha-glow)), transparent);
  color: rgb(var(--ch-cream));
  backdrop-filter: blur(var(--ed-len-12));
  box-shadow: 0 var(--ed-len-2) var(--ed-len-6) rgb(var(--ch-ink) / 0.45), inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / var(--ed-alpha-line)), inset 0 calc(-1 * var(--ed-len-1)) 0 rgb(var(--ch-pure-black) / 0.25); }
.ed-btn--ghost:hover {
  border-color: rgb(var(--ch-gold-specular));
  background: linear-gradient(180deg, rgb(var(--ch-gold-edge) / var(--ed-alpha-fill)), transparent);
  color: rgb(var(--ch-cream));
  box-shadow: 0 0 var(--ed-len-12) rgb(var(--ch-gold-edge) / var(--ed-alpha-glow)), 0 var(--ed-len-4) var(--ed-len-14) rgb(var(--ch-ink) / 0.65), inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / var(--ed-alpha-line));
  transform: translateY(calc(-1 * var(--ed-len-2))); }
.ed-btn--ghost:active {
  transform: translateY(var(--ed-len-1));
  box-shadow: 0 var(--ed-len-1) var(--ed-len-2) rgb(var(--ch-ink) / 0.6), inset 0 var(--ed-len-1) var(--ed-len-2) rgb(var(--ch-pure-black) / 0.35); }
.ed-btn--outline {
  border-color: rgb(var(--ch-hotpink) / 0.85);
  background: linear-gradient(180deg, rgb(var(--ch-plum) / 0.85), rgb(var(--ch-stage)));
  color: rgb(var(--ch-cream));
  --t: 14.5; --d: 14.5;
  box-shadow: 0 var(--ed-len-2) var(--ed-len-8) rgb(var(--ch-ink) / 0.6), inset 0 var(--ed-len-1) 0 rgb(var(--ch-canvas) / 0.2), inset 0 calc(-1 * var(--ed-len-1)) 0 rgb(var(--ch-pure-black) / 0.35); }
.ed-btn--outline:hover {
  background: linear-gradient(180deg, rgb(var(--ch-hotpink) / 0.22), rgb(var(--ch-plum) / 0.95));
  border-color: rgb(var(--ch-hotpink));
  box-shadow: 0 var(--ed-len-4) var(--ed-len-14) rgb(var(--ch-ink) / 0.7), inset 0 var(--ed-len-1) 0 rgb(var(--ch-canvas) / 0.35);
  transform: translateY(calc(-1 * var(--ed-len-2))); }
.ed-btn--outline:active {
  transform: translateY(var(--ed-len-1));
  box-shadow: 0 var(--ed-len-1) var(--ed-len-2) rgb(var(--ch-ink) / 0.7), inset 0 var(--ed-len-1) var(--ed-len-2) rgb(var(--ch-pure-black) / 0.4); }
.ed-btn--outline > [aria-hidden] { color: rgb(var(--ch-hotpink)); }
.ed-btn--sm { min-height: var(--ed-em-3-5); padding-inline: var(--ed-em-2-4); --m: 9.5; --t: 13; --d: 13; --floor: var(--ed-len-11); }
@media (max-width: 767px) {
  .ed-btn--sm { padding-inline: var(--ed-em-1-8); }
  .ed-btn--ghost { padding-inline: var(--ed-em-2-9); }
}
.ed-page a:focus-visible, .ed-page button:focus-visible, .ed-page summary:focus-visible, .ed-moments__track:focus-visible {
  outline: var(--ed-len-3) solid rgb(var(--ch-pink-soft)); outline-offset: var(--ed-len-3); }

/* ---- artwork containers (frame placeholders; the art replaces the label) - */
.ed-box { position: relative; display: grid; place-items: center; min-width: 0; margin: 0;
  background: linear-gradient(180deg, rgb(var(--ch-plum) / 0.85), rgb(var(--ch-stage)));
  border: var(--ed-len-1) solid var(--gold-line); border-radius: var(--ed-radius-box);
  box-shadow: 0 var(--ed-len-4) var(--ed-len-16) rgb(var(--ch-ink) / var(--ed-alpha-fill)), var(--gold-bevel); text-align: center; }
.ed-box__label { position: relative; display: block; padding: var(--ed-em-0-3); font-family: var(--font-label); font-weight: 500; line-height: 1.05;
  letter-spacing: 0; text-transform: uppercase; color: rgb(var(--ch-cream)); --m: 15; --t: 25; --d: 25; --floor: var(--ed-len-15); }
.ed-box__label small { display: block; font-size: var(--ed-em-0-97); font-weight: 400; text-transform: none; color: rgb(var(--ch-cream) / 0.85); }
.ed-box__label .ed-upper { text-transform: uppercase; }
.ed-hero__art .ed-box__label { --m: 21.8; --t: 26.6; --d: 29.3; }
.ed-hero__art .ed-box__label small { font-size: var(--ed-em-0-84); }
.ed-product .ed-box__label { --d: 21; }
.ed-box--round { border-radius: var(--ed-radius-round); aspect-ratio: 1; }
.ed-box.ed-has-art { aspect-ratio: auto; background: none; border: 0; border-radius: var(--ed-radius-box); box-shadow: none; overflow: hidden; }
.ed-art-img { display: block; width: 100%; height: auto; }
/* cropped art: the container sets the shape, the art fills it from the top (titles and faces stay in view) */
.ed-art-img--cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 0; }
.ed-box__shape { display: none; }
@media (min-width: 768px) {
  .ed-box--stepped { background: none; border: 0; border-radius: 0; box-shadow: none; }
  .ed-box__shape { position: absolute; inset: 0; display: block; width: 100%; height: 100%; overflow: visible;
    filter: drop-shadow(0 var(--ed-len-2) var(--ed-len-6) rgb(var(--ch-ink) / 0.5)); }
  .ed-box__shape polygon { fill: rgb(var(--ch-gunmetal)); stroke: rgb(var(--ch-hotpink) / 0.85); stroke-width: var(--ed-len-2);
    stroke-linejoin: round; vector-effect: non-scaling-stroke; }
}

/* ---- carousels: native scroll-snap tracks, arrows step them (js/ed-page.js) */
.ed-carousel { position: relative; }
.ed-styles__track, .ed-moments__track, .ed-get__list, .ed-trust, .ed-trustband__list { margin-block: 0; padding: 0; list-style: none; }
.ed-styles__track, .ed-moments__track, .ed-get__list, .ed-trust { margin-inline: 0; }
.ed-arrow { position: absolute; top: var(--ed-half); z-index: var(--ed-z-content); display: grid; place-items: center; width: var(--ed-len-48); height: var(--ed-len-48);
  translate: 0 calc(-1 * var(--ed-half)); padding: 0 0 var(--ed-em-0-12); border: var(--ed-len-1-5) solid rgb(var(--ch-cream) / 0.55); border-radius: var(--ed-radius-round);
  background: rgb(var(--ch-stage) / 0.85); color: rgb(var(--ch-cream)); font: 400 var(--ed-len-30)/1 var(--font-headline); cursor: pointer; }
.ed-arrow--prev { left: calc(-1 * var(--ed-len-12)); }
.ed-arrow--next { right: calc(-1 * var(--ed-len-12)); }
.ed-moments__track { display: flex; gap: var(--ed-mgap); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
  scrollbar-width: none; --ed-mgap: var(--ed-len-16); }
.ed-moment { flex: 0 0 var(--ed-mcard); scroll-snap-align: start; }

/* ---- visibility per reference state -------------------------------------- */
@media (max-width: 767px) { .ed-not-mobile { display: none !important; } }
@media (min-width: 768px) { .ed-only-mobile { display: none !important; } }
@media (min-width: 768px) and (max-width: 1023px) { .ed-not-tablet { display: none !important; } }
@media (max-width: 767px), (min-width: 1024px) { .ed-tablet-only { display: none !important; } }
@media (min-width: 1024px) { .ed-not-desk { display: none !important; } }
@media (max-width: 1023px) { .ed-desk-only { display: none !important; } }

/* ==== 01 header: logo, menu, START HERE (full navigation from 1024px) ===== */
/* locked: the header box (border included) is exactly the token height at each width */
.ed-header { position: sticky; top: 0; z-index: var(--ed-z-nav); box-sizing: border-box; height: var(--ed-header-h);
  background: var(--gold-chassis);
  border-bottom: var(--gold-frame-h) solid var(--gold-line);
  box-shadow: 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / var(--ed-alpha-glow)),
              0 var(--ed-len-4) var(--ed-len-20) rgb(var(--ch-ink) / var(--ed-alpha-text)),
              0 var(--ed-len-2) var(--ed-len-12) rgb(var(--ch-hotpink) / var(--ed-alpha-glow)); }
.ed-header__in { display: flex; align-items: center; gap: var(--ed-gap); height: 100%; }
.ed-logo { margin-right: auto; font-family: var(--font-headline); font-weight: 800; line-height: 1; letter-spacing: calc(-1 * var(--ed-em-0-01));
  text-transform: uppercase; color: rgb(var(--ch-cream)); text-decoration: none; --m: 26; --t: 39; --d: 43; }
/* the brand mark replaces the typed wordmark (owner 2026-10-24); its height is a token per width, the width follows */
.ed-logo:has(> .ed-logo__img) { display: inline-flex; align-items: center; line-height: 0; }
.ed-logo__img { display: block; width: auto; height: var(--ed-logo-h); filter: drop-shadow(0 var(--ed-len-2) var(--ed-len-6) rgb(var(--ch-pure-black) / 0.6)); }
.ed-logo--footer .ed-logo__img { height: var(--ed-logo-footer-h); }
.ed-nav { display: none; }
.ed-nav a, .ed-menu nav a { color: rgb(var(--ch-cream)); font-weight: 500; text-decoration: none; --m: 18; --t: 20; --d: 15.6; --floor: var(--ed-len-13); }
.ed-nav a:hover, .ed-menu nav a:hover { color: rgb(var(--ch-hotpink)); }
.ed-nav { align-items: center; white-space: nowrap; }
.ed-nav__drop { position: relative; }
.ed-nav__drop > summary { list-style: none; cursor: pointer; color: rgb(var(--ch-cream)); font-weight: 500; --m: 18; --t: 20; --d: 15.6; --floor: var(--ed-len-13); }
.ed-nav__drop > summary::-webkit-details-marker { display: none; }
.ed-nav__drop > summary:hover { color: rgb(var(--ch-hotpink)); }
.ed-nav__drop > div { position: absolute; top: 100%; left: 0; display: grid; gap: var(--ed-len-4); min-width: max-content; padding: var(--ed-len-10) var(--ed-len-16);
  background: rgb(var(--ch-stage)); border: var(--ed-len-1) solid rgb(var(--ch-gold-edge) / var(--ed-alpha-line));
  box-shadow: 0 var(--ed-len-4) var(--ed-len-12) rgb(var(--ch-ink) / var(--ed-alpha-text)), inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / var(--ed-alpha-glow)); }
.ed-menu > summary { display: grid; place-items: center; width: var(--ed-len-40); height: var(--ed-len-40); list-style: none; cursor: pointer; color: rgb(var(--ch-cream)); }
.ed-menu > summary::-webkit-details-marker { display: none; }
.ed-menu > summary .ed-ico { font-size: var(--ed-len-30); }
.ed-menu > nav { position: fixed; inset: var(--ed-header-h) 0 auto; display: grid; gap: var(--ed-len-4); padding: var(--ed-len-12) var(--ed-gutter) var(--ed-len-20);
  background: rgb(var(--ch-stage)); border-bottom: var(--ed-len-1) solid rgb(var(--ch-gold-edge) / var(--ed-alpha-line)); }
.ed-menu > nav a { padding-block: var(--ed-len-10); }
@media (min-width: 768px) {
  .ed-header__in { display: grid; grid-template-columns: repeat(var(--ed-cols), minmax(0, 1fr)); column-gap: var(--ed-gap); }
  .ed-header__in > * { grid-row: 1; }
  .ed-logo { grid-column: 1 / 3; justify-self: center; margin: 0; }
  .ed-menu { grid-column: 4 / 6; justify-self: center; }
  .ed-menu > summary .ed-ico { font-size: var(--ed-len-36); }
  .ed-header__cta { grid-column: 7 / 9; justify-self: end; }
}
@media (min-width: 1024px) {
  .ed-logo { justify-self: end; }
  .ed-nav { display: flex; grid-column: 4 / 11; gap: clamp(var(--ed-len-20), var(--ed-vw-2-9), var(--ed-len-42)); }
  .ed-menu { display: none; }
  .ed-header__cta { grid-column: 11 / 13; justify-self: start; }
}

/* ==== 02 hero: copy above artwork (phone, tablet); artwork left, copy right (desktop) */
.ed-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--ed-len-12); padding-block: var(--ed-len-8) 0; }
.ed-hero__copy { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.ed-hero__eyebrow {
  display: inline-flex; align-items: center; gap: var(--ed-space-8);
  padding: var(--ed-len-4) var(--ed-len-12);
  border: var(--ed-len-1) solid rgb(var(--ch-gold-edge) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-pill);
  background: rgb(var(--ch-gold-edge) / var(--ed-alpha-glow));
  font: 700 var(--ed-len-11)/1 var(--font-label);
  letter-spacing: var(--ed-em-0-08); text-transform: uppercase;
  color: rgb(var(--ch-gold-foil)); margin-bottom: var(--ed-space-16);
}
.ed-hero__crest-dot {
  width: var(--ed-len-6); height: var(--ed-len-6); border-radius: var(--ed-radius-round);
  background: rgb(var(--ch-gold-specular)); box-shadow: 0 0 var(--ed-len-6) rgb(var(--ch-gold-specular) / var(--ed-alpha-fill));
}
.ed-hero__h { line-height: 0.82; --m: 40.7; --t: 68.8; --d: var(--ed-hero-h-desk); }
.ed-hero__lead { margin: var(--ed-em-0-5) 0 0; font-weight: 600; line-height: 1.35; --m: 17.5; --t: 23.4; --d: 23.3; --floor: var(--ed-len-16); }
.ed-hero__body { margin: var(--ed-em-0-35) 0 0; line-height: 1.45; --m: 14.4; --t: 19.4; --d: 17.4; --floor: var(--ed-len-14); }
@media (min-width: 768px) { .ed-hero__body { line-height: 1.45; } }
.ed-ctas { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ed-len-8); margin-top: var(--ed-len-14); }
.ed-trust { display: flex; justify-content: space-between; align-items: center; gap: var(--ed-len-12); color: rgb(var(--ch-cream) / 0.85); }
.ed-trust li { display: flex; align-items: center; gap: var(--ed-em-0-6); line-height: 1.35; white-space: nowrap; --m: 9.5; --t: 16; --d: 14.5; --floor: var(--ed-len-12); }
.ed-trust .ed-ico { font-size: var(--ed-em-2-7); color: rgb(var(--ch-hotpink)); }
.ed-trust--hero { align-self: stretch; margin-top: var(--ed-len-14); }
@media (max-width: 767px) {
  /* phones (1:1 layout map): copy, the three trust points in one row, then the art strip at full width */
  .ed-hero__grid { row-gap: var(--ed-len-12); }
  /* the art bleeds edge to edge as the populated mock's mobile art does (owner 2026-10-09); the box's own margin: 0 is
     overridden here. The image is scaled about the focal origin inside the clipped box (Treatment B; 1 = no zoom). */
  .ed-hero .ed-hero__art { padding-top: 0; aspect-ratio: var(--ed-hero-art-ratio-mob); overflow: hidden;
    width: calc(var(--ed-full) + 2 * var(--ed-gutter)); margin-inline: calc(-1 * var(--ed-gutter)); }
  .ed-hero__art > .ed-art-img { position: absolute; inset: 0; height: 100%; object-fit: cover; object-position: var(--ed-hero-crop-mob);
    transform: scale(var(--ed-hero-zoom-mob)); transform-origin: var(--ed-hero-zoom-origin-mob); }
}
/* hero stage: the car (hero-main, z 20) alone; the TRIGGERED sign is off the page (owner 2026-10-14), placement deferred;
   the dashboard dials are drawn into hero-main, so they are not a separate layer here */
.ed-hero__art { position: relative; padding-top: var(--ed-hero-art-pad); }
.ed-hero__art > .ed-art-img { position: relative; z-index: var(--ed-z-content); }
@media (min-width: 768px) {
  .ed-hero__grid { row-gap: var(--ed-len-18); padding-block: var(--ed-len-13) var(--ed-len-6); }
  .ed-hero__copy { padding-inline: var(--ed-len-16); }
  .ed-ctas { flex-direction: row; flex-wrap: wrap; gap: var(--ed-len-12) var(--ed-len-26); margin-top: var(--ed-len-16); }
  .ed-trust--hero { margin-top: var(--ed-len-18); }
  .ed-hero .ed-hero__art { padding-top: 0; aspect-ratio: var(--ed-hero-art-ratio-tab); overflow: hidden; }
  .ed-hero__art > .ed-art-img { position: absolute; inset: 0; height: 100%; object-fit: cover; object-position: var(--ed-hero-crop-tab); }
}
@media (min-width: 768px) and (max-width: 1023px) {
  /* tablet follows the populated mock (owner 2026-10-09): the art strip runs edge to edge ABOVE the headline */
  .ed-hero .ed-hero__art { order: -1; width: calc(var(--ed-full) + 2 * var(--ed-gutter)); margin-inline: calc(-1 * var(--ed-gutter)); }
}
@media (min-width: 1024px) {
  /* blueprint S02: visual stage 7 columns, copy stage 5 columns (tokens); the band is at least --ed-hero-h-min-desk, a share of the viewport height */
  .ed-hero__grid { grid-template-columns: repeat(var(--ed-cols), minmax(0, 1fr)); column-gap: var(--ed-gap); align-items: center;
    min-height: var(--ed-hero-h-min-desk); padding-block: var(--ed-hero-pad-top-desk) var(--ed-hero-pad-bot-desk); }
  /* the art bleeds left to the page edge (never past it), as the art mock's hero does */
  .ed-hero__art { grid-column: 1 / span var(--ed-hero-cols-art); grid-row: 1; align-self: stretch; padding-top: 0;
    margin-left: calc((min(var(--ed-vw-100) - 2 * var(--ed-gutter), var(--ed-content-max)) - var(--ed-vw-100)) / 2); }
  /* the art box stretches to the hero's full height (the ratio token is auto; owner 2026-10-28) and the image covers it */
  .ed-hero .ed-hero__art { aspect-ratio: var(--ed-hero-art-ratio-desk); overflow: hidden; }
  .ed-hero__art > .ed-art-img { position: absolute; inset: 0; height: 100%; object-fit: cover; object-position: var(--ed-hero-crop-desk); }
  .ed-hero__copy { grid-column: span var(--ed-hero-cols-copy) / -1; grid-row: 1; padding-inline: 0; }
  /* headline: exactly two lines, REL8 TO WHAT'S / REALLY HAPPENING. */
  .ed-hero__h .ed-line { white-space: nowrap; }
  /* CTAs: one row, side by side; the type scales with the viewport (no floor) so both fit the copy stage down to 1024px */
  .ed-ctas { flex-wrap: wrap; gap: var(--ed-hero-cta-gap-desk); }
  .ed-ctas .ed-btn { padding-inline: var(--ed-hero-btn-pad-desk); --floor: initial; }
  .ed-trust--hero { flex-wrap: wrap; justify-content: flex-start; gap: var(--ed-len-10) clamp(var(--ed-len-12), var(--ed-vw-1-5), var(--ed-len-22)); }
  .ed-trust--hero .ed-ico { font-size: var(--ed-em-2-2); }
}
@media (min-width: 1280px) {
  .ed-dials__copy .ed-btn { padding-inline: var(--ed-em-3-1); }
}

/* ==== 03 attachment styles: scroll row (phone), 2 x 2 (tablet), 4 across (desktop) */
.ed-styles { overflow-x: clip; }
/* heading left, pill right at every width, as the Moments head (owner 2026-10-14, WF2): the heading wraps, the pill never does */
.ed-styles__head { display: flex; align-items: center; justify-content: space-between; gap: var(--ed-len-8) var(--ed-gap);
  margin-bottom: clamp(var(--ed-len-6), var(--ed-vw-1) + var(--ed-len-2), var(--ed-len-18)); }
.ed-styles__head .ed-h2 { flex: 1 1 auto; min-width: 0; }
.ed-styles__head .ed-btn { flex: none; }
.ed-styles .ed-h2 { --m: 23.4; --t: 31; --d: 35.7; }
.ed-styles__track { display: flex; gap: var(--ed-len-11); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
  margin-right: calc(-1 * var(--ed-gutter)); padding-right: var(--ed-gutter); }
.ed-style { flex: 0 0 calc((var(--ed-vw-100) - 2 * var(--ed-gutter) - var(--ed-len-11)) / 2); aspect-ratio: 1448 / 1086; scroll-snap-align: start; }
/* every card opens its style page (owner 2026-10-14, WF2): the link fills the card, so the whole art is the target */
.ed-style__link { position: absolute; inset: 0; display: block; color: inherit; text-decoration: none; }
.ed-style__name { position: absolute; inset: auto 0 0; z-index: var(--ed-z-over); padding: var(--ed-len-14) var(--ed-len-2) var(--ed-len-5); font: 900 var(--ed-len-12)/1 var(--font-poster);
  letter-spacing: var(--ed-em-0-03); text-align: center; text-transform: uppercase; color: rgb(var(--ch-cream));
  background: linear-gradient(transparent, rgb(var(--ch-stage) / 0.9)); }
@media (max-width: 767px) {
  /* phones: all four cards in one compact row, as the mock draws them; portrait crop on the couple, name beneath */
  .ed-styles__track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ed-len-6); overflow: visible; margin-right: 0; padding-right: 0; }
  .ed-styles__track .ed-style { aspect-ratio: 3 / 4; overflow: hidden; border: var(--ed-len-1-5) solid rgb(var(--ch-gold-edge) / var(--ed-alpha-line));
    border-radius: var(--ed-len-6); box-shadow: 0 0 0 var(--ed-len-1) rgb(var(--ch-gold-deep) / var(--ed-alpha-meta)), 0 var(--ed-len-4) var(--ed-len-12) rgb(var(--ch-ink) / var(--ed-alpha-text)), 0 0 var(--ed-len-14) rgb(var(--ch-hotpink) / var(--ed-alpha-glow)); }
  .ed-styles__track .ed-style .ed-art-img { position: absolute; inset: 0; height: 100%; object-fit: cover; object-position: var(--ed-style-crop-card); }
}
@media (min-width: 768px) {
  .ed-styles__track { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ed-len-12) var(--ed-gap); overflow: visible;
    margin-right: 0; padding-right: 0; }
  .ed-styles__track .ed-style { aspect-ratio: var(--ed-style-ratio-tab); overflow: hidden; }
  .ed-styles__track .ed-style .ed-art-img { position: absolute; inset: 0; height: 100%; object-fit: cover; object-position: var(--ed-style-crop); }
}
@media (min-width: 1024px) {
  .ed-styles { padding-block: var(--ed-styles-pad-top-desk) var(--ed-styles-pad-bot-desk); }
  .ed-styles__head { margin-bottom: var(--ed-len-8); }
  .ed-styles__track { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ed-styles__track .ed-style { aspect-ratio: var(--ed-style-ratio-desk); }
  .ed-styles__track .ed-style .ed-art-img { object-position: var(--ed-style-crop); }
}

/* ==== 04 the two dials: title over the pair (phone); copy beside the pair (tablet); copy, pair, support (desktop) */
.ed-dials__grid { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--ed-len-2); align-items: center; }
.ed-dials .ed-h2 { --m: 24.5; --t: 43.9; --d: 47.6; }
.ed-sub { margin-top: var(--ed-em-0-1); --m: 22; --t: 29.9; --d: 33.5; }
.ed-dials__copy .ed-body { max-width: var(--ed-len-410); margin-top: var(--ed-len-10); line-height: 1.45; }
.ed-dials__copy .ed-btn { margin-top: var(--ed-len-14); }
.ed-dials__corners a { color: var(--gold-text); text-underline-offset: var(--ed-len-3); }
.ed-dials__corners a:hover { color: rgb(var(--ch-hotpink)); }
/* two physical instruments: gauge face with its printed label (dial-anxiety / dial-avoidance, needle-less) + one
   separate heart-tail needle (dial-*-needle) rotated in CSS. Measured from the art: the needle image (1536x1024) has
   its hub at 43.75% 56.25% and rests pointing 57.9deg clockwise from straight up; each face's hub is placed under it.
   --ed-read is the reading as an angle from straight up (-90deg = 0, +90deg = 100). */
/* Overarching teaching banner and flanking axis notes */
.ed-dials__axis-banner { flex: 1 0 100%; display: flex; justify-content: center; margin-bottom: var(--ed-len-4); }
.ed-dials__axis-tag { display: inline-block; padding: var(--ed-len-2) var(--ed-len-10); border: var(--ed-len-1) solid rgb(var(--ch-gold-edge) / var(--ed-alpha-line)); border-radius: var(--ed-radius-pill); background: rgb(var(--ch-stage) / 0.85); color: rgb(var(--ch-gold-foil)); font: var(--ed-fw-bold) var(--ed-len-11)/1 var(--font-headline); letter-spacing: var(--ed-em-0-04); text-transform: uppercase; }
.ed-dials__cluster { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--ed-len-12); width: 100%; }
.ed-dials__axis-col { display: flex; flex-direction: column; gap: var(--ed-len-4); max-width: var(--ed-len-200); }
.ed-dials__axis-badge { align-self: flex-start; padding: var(--ed-len-1) var(--ed-len-6); border-radius: var(--ed-radius-pill); background: rgb(var(--ch-stage)); border: var(--ed-len-1) solid var(--gold-line); color: var(--gold-text); font: var(--ed-fw-bold) var(--ed-len-10)/1 var(--font-mono); letter-spacing: var(--ed-em-0-04); text-transform: uppercase; }
.ed-dials__axis-label { font: var(--ed-fw-black) var(--ed-len-13)/1.2 var(--font-headline); color: rgb(var(--ch-cream)); text-transform: uppercase; letter-spacing: var(--ed-em-0-04); }
.ed-dials__axis-desc { margin: 0; font: 400 var(--ed-len-12)/1.4 var(--font-body); color: rgb(var(--ch-cream) / var(--ed-alpha-text)); }
/* desktop (COA-116): the teaching notes sit beside their dial, left note | two dials | right note, never wrapped above or below */
@media (min-width: 1024px) {
  .ed-dials__cluster { display: grid; grid-template-columns: minmax(0, 1fr) auto auto minmax(0, 1fr); flex-wrap: nowrap; }
  .ed-dials__axis-col--anxiety { text-align: right; align-items: flex-end; justify-self: end; }
  .ed-dials__axis-col--anxiety .ed-dials__axis-badge { align-self: flex-end; }
}
@media (max-width: 767px) {
  .ed-dials__axis-col { max-width: 100%; text-align: center; align-items: center; }
  .ed-dials__axis-badge { align-self: center; }
}

.ed-dials__stage { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(var(--ed-len-10), var(--ed-vw-2), var(--ed-len-28)); padding-block: var(--ed-len-8);
  --ed-dial-pair: calc(var(--ed-dials-dial-w-mob) * 2 + clamp(var(--ed-len-10), var(--ed-vw-2), var(--ed-len-28))); }
.ed-dial { position: relative; flex: 0 1 auto; width: var(--ed-dials-dial-w-mob); margin: 0; }
.ed-dial > .ed-art-img:first-child { width: 100%; }
.ed-dial .ed-dial__needle { position: absolute; z-index: var(--ed-z-over); left: var(--ed-nl); top: var(--ed-nt); width: var(--ed-nw); height: auto;
  transform-origin: var(--ed-dial-hub); rotate: calc(var(--ed-read) - 57.9deg);
  transition: rotate var(--ed-needle-swing) var(--ease-pop); pointer-events: none;
  filter: drop-shadow(0 var(--ed-len-3) var(--ed-len-5) rgb(var(--ch-stage) / 0.7)); }
.ed-dial--anxiety { --ed-nl: var(--ed-dial-anxiety-nl); --ed-nt: var(--ed-dial-anxiety-nt); --ed-nw: var(--ed-dial-anxiety-nw); --ed-read: 45deg; }    /* knob centre (634,631) of 1271x1237, read off a zoomed grid; reads high */
.ed-dial--avoidance { --ed-nl: var(--ed-dial-avoidance-nl); --ed-nt: var(--ed-dial-avoidance-nt); --ed-nw: var(--ed-dial-avoidance-nw); --ed-read: -30deg; } /* knob centre (626,610) of 1268x1240, read off a zoomed grid; reads low */
.ed-dials__stage.is-armed .ed-dial:not(.is-live) .ed-dial__needle { rotate: calc(-90deg - 57.9deg); }
.ed-dial:hover .ed-dial__needle { animation: ed-needle-twitch var(--ed-needle-twitch) var(--ed-ease); }
.ed-dials__stage[data-ed-still] .ed-dial:hover .ed-dial__needle { animation: none; }
.ed-dials__read { flex: 1 0 100%; min-height: var(--ed-len-20); margin: 0; text-align: center; color: var(--gold-text); font-size: var(--ed-fine-size); }
.ed-dials__stage--mini .ed-dial { width: var(--ed-len-72); }
@keyframes ed-needle-twitch { 30% { transform: rotate(6deg); } 60% { transform: rotate(-4deg); } 100% { transform: none; } }
/* One bar under the two gauges. A pill picks the corner. One charm and one felt line show at a time. */
.ed-dialconsole { flex: 1 0 100%; display: flex; flex-direction: column; align-items: center; gap: var(--ed-len-4); width: 100%; }
.ed-dialconsole__pills { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--ed-len-4); width: min(100%, var(--ed-dial-pair)); }
.ed-dialconsole__pill { margin: 0; padding: var(--ed-len-2) var(--ed-len-8); border: var(--ed-len-1) solid rgb(var(--ch-cream) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-pill); background: rgb(var(--ch-cream) / var(--ed-alpha-glow)); color: rgb(var(--ch-cream) / var(--ed-alpha-text));
  --m: 11; --t: 12; --d: 12; --floor: var(--ed-len-11); line-height: 1; letter-spacing: var(--ed-em-0-04); cursor: pointer; }
.ed-dialconsole__pill:hover, .ed-dialconsole__pill.is-on { border-color: rgb(var(--ch-hotpink)); color: rgb(var(--ch-cream));
  background: rgb(var(--ch-hotpink) / var(--ed-alpha-glow)); box-shadow: 0 var(--ed-len-2) var(--ed-len-6) rgb(var(--ch-ink) / 0.6); }
.ed-dialconsole__pill:focus-visible { outline: var(--ed-len-1) solid rgb(var(--ch-hotpink)); outline-offset: var(--ed-len-2); }
.ed-dialconsole__bar { display: flex; align-items: center; gap: var(--ed-len-8); width: min(100%, var(--ed-dial-pair)); min-height: var(--ed-len-64);
  padding: var(--ed-len-6) var(--ed-len-10); border: var(--ed-len-1) solid rgb(var(--ch-gold-edge) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-box); background: rgb(var(--ch-stage) / 0.85); box-shadow: 0 var(--ed-len-2) var(--ed-len-8) rgb(var(--ch-ink) / 0.5); }
.ed-dialconsole__icon { flex-shrink: 0; width: var(--ed-len-48); height: var(--ed-len-48); max-width: calc(var(--ed-len-48) + var(--ed-len-4)); max-height: calc(var(--ed-len-48) + var(--ed-len-4)); overflow: hidden; }
.ed-dialconsole__img { width: 100%; height: 100%; object-fit: contain; }
.ed-dialconsole__copy { display: flex; flex-direction: column; gap: var(--ed-len-2); min-width: 0; }
.ed-dialconsole__metrics { --m: 12; --t: 12; --d: 13; --floor: var(--ed-len-12); line-height: 1.35; color: rgb(var(--ch-hotpink)); }
.ed-dialconsole__quote { --m: 13; --t: 14; --d: 14.5; --floor: var(--ed-len-13); line-height: var(--ed-fine-lh); }
@media (min-width: 768px) {
  .ed-dials__grid { grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--ed-gap); align-items: center; }
  .ed-dials__copy { padding-top: var(--ed-len-16); }
  .ed-dials__stage { --ed-dial-pair: calc(var(--ed-dials-dial-w-tab) * 2 + clamp(var(--ed-len-10), var(--ed-vw-2), var(--ed-len-28))); }
  .ed-dial { width: var(--ed-dials-dial-w-tab); }
}
@media (min-width: 1024px) {
  .ed-dials { padding-block: var(--ed-dials-pad-top-desk) var(--ed-dials-pad-bot-desk); }
  .ed-dials__grid { grid-template-columns: repeat(var(--ed-cols), minmax(0, 1fr)); align-items: end; }
  .ed-dials__copy { grid-column: 1 / 4; padding-top: 0; }
  .ed-dials__stage { grid-column: 4 / 13; }
  /* 290px, or the desktop dial width when that is smaller, so the side notes keep room at 1024px (was a 10px page overflow) */
  .ed-dials__stage[data-ed-tour] { --ed-tour-dial: min(var(--ed-len-290), var(--ed-dials-dial-w-desk)); --ed-dial-pair: calc(var(--ed-tour-dial) * 2 + var(--ed-len-6)); gap: var(--ed-len-6); padding-block: 0; min-height: 0; max-height: calc(var(--ed-len-390) - var(--ed-len-10)); }
  .ed-dials__stage[data-ed-tour] .ed-dial { width: var(--ed-tour-dial); }
  .ed-dial { width: var(--ed-dials-dial-w-desk); }
}

/* ==== 05 nineteen moments: 2 cards (phone), 3 (tablet), 4 and a peek (desktop) */
.ed-moments__head { display: flex; align-items: center; justify-content: space-between; gap: var(--ed-gap);
  margin-bottom: clamp(var(--ed-len-6), var(--ed-vw-1) + var(--ed-len-2), var(--ed-len-17)); }
.ed-moments .ed-h2 { --m: 25.4; --t: 35.1; --d: 48.3; }
/* landscape cards cropped from the top (the art's title chip stays in view); one card and a peek on phones */
.ed-moments__track { --ed-mgap: var(--ed-len-10); --ed-mcard: var(--ed-moments-card); }
.ed-moments__track .ed-moment { aspect-ratio: 5 / 4; overflow: hidden; }
.ed-moments__track .ed-moment.ed-has-art { border: var(--ed-len-2) solid rgb(var(--ch-gold-edge) / var(--ed-alpha-line)); border-radius: var(--ed-radius-box);
  box-shadow: 0 0 0 var(--ed-len-1) rgb(var(--ch-gold-deep) / var(--ed-alpha-meta)), 0 var(--ed-len-6) var(--ed-len-20) calc(-1 * var(--ed-len-2)) rgb(var(--ch-ink) / var(--ed-alpha-text)), 0 0 var(--ed-len-14) rgb(var(--ch-hotpink) / var(--ed-alpha-glow)); }
/* noir-diorama dark red: a maroon glow rises behind the cards; a slot still waiting for its card is burgundy lacquer, not gunmetal */
.ed-moments { background: radial-gradient(var(--ed-moments-glow), rgb(var(--ch-maroon) / 0.6), transparent var(--ed-moments-glow-end)); }
.ed-moments__track .ed-moment:not(.ed-has-art) { background: linear-gradient(160deg, rgb(var(--ch-burgundy)), rgb(var(--ch-maroon))); }
/* die-cut cards (transparent ground, their own pink frame, title at the foot): shown whole, so no slot frame and no top crop */
.ed-moments__track .ed-moment--diecut.ed-has-art { border: 0; box-shadow: none; }
.ed-art-img--contain { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.ed-carousel--moments .ed-arrow { width: var(--ed-len-36); height: var(--ed-len-36); font-size: var(--ed-len-24); }
@media (min-width: 768px) {
  .ed-moments__track { --ed-mgap: var(--ed-len-13); --ed-mcard: calc((100% - 2 * var(--ed-mgap)) / 3); }
  .ed-carousel--moments .ed-arrow { width: var(--ed-len-48); height: var(--ed-len-48); font-size: var(--ed-len-30); }
}
@media (min-width: 1024px) {
  .ed-moments { padding-block: var(--ed-moments-pad-top-desk) var(--ed-moments-pad-bot-desk); }
  .ed-moments__track { --ed-mgap: var(--ed-len-16); --ed-mcard: calc((100% - 4 * var(--ed-mgap) - var(--ed-moments-slack)) / 4); }
  .ed-moments__track .ed-moment { aspect-ratio: var(--ed-moments-card-ratio-desk); }
}

/* ==== 06 pocket coach: phone and character (phone); + support (tablet); copy, tile, phone, character, support (desktop) */
/* coach: one composed transparent scene (pocket-coach-scene: phone chat, coach, cards, props) beside the copy on desktop,
   under the heading on tablet; phones crop to the phone and the coach, as the mock's phone column shows. */
.ed-coach__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ed-len-12) var(--ed-gap); align-items: center; }
/* the copy column may shrink below the CTA's one-line width; the CTA then wraps inside its column and never runs into the
   art (owner 2026-10-09: "Keep the CTA entirely inside its assigned column") */
.ed-coach__copy { min-width: 0; }
.ed-coach .ed-h2 { --m: 25.1; --t: 35.8; --d: 40.3; }
.ed-coach__copy .ed-body { max-width: var(--ed-len-400); margin-top: var(--ed-len-12); line-height: 1.45; }
.ed-coach__copy .ed-btn { margin-top: var(--ed-len-10); max-width: var(--ed-full); white-space: normal; text-wrap: balance; text-align: center; }
.ed-coach .ed-coach__scene { position: relative; z-index: var(--ed-z-content); aspect-ratio: var(--ed-coach-scene-ratio-mob); overflow: hidden; }
/* WF7 (owner 2026-10-14): the gauges are no longer baked into the art; two live dials sit on a plate that reproduces the
   cover crop (plate = the art's own 3:2 box, at least as large as the scene; its crop point aligns like object-position). */
.ed-coach__plate { --ed-coach-crop-y: var(--ed-coach-crop-y-mob); position: absolute; left: var(--ed-half); top: var(--ed-coach-crop-y); min-width: var(--ed-full); min-height: var(--ed-full); aspect-ratio: var(--ed-coach-plate-ratio);
  transform: translate(calc(-1 * var(--ed-half)), calc(-1 * var(--ed-coach-crop-y))); }
.ed-coach__plate > .ed-art-img:first-child { position: absolute; inset: 0; width: var(--ed-full); height: var(--ed-full); }
.ed-dial--inlay { position: absolute; width: var(--ed-coach-inlay-w); top: var(--ed-coach-inlay-y); transform: translate(calc(-1 * var(--ed-half)), calc(-1 * var(--ed-half))); }
.ed-dial--inlay.ed-dial--anxiety { left: var(--ed-coach-inlay-anx-x); }
.ed-dial--inlay.ed-dial--avoidance { left: var(--ed-coach-inlay-avo-x); }
@media (max-width: 767px) {
  /* phones (owner 2026-10-09, M2): the art bleeds edge to edge and is zoomed onto the coach and the phone; the CTA keeps
     a comfortable touch target */
  .ed-coach .ed-coach__scene { width: calc(var(--ed-full) + 2 * var(--ed-gutter)); margin-inline: calc(-1 * var(--ed-gutter)); }
  .ed-coach__plate { transform: translate(calc(-1 * var(--ed-half)), calc(-1 * var(--ed-coach-crop-y))) scale(var(--ed-coach-zoom-mob)); transform-origin: var(--ed-coach-zoom-origin-mob); }
  .ed-coach__copy .ed-btn { min-height: max(var(--ed-em-3-2), var(--ed-tap-min)); }
  .ed-coach__copy .ed-body { text-wrap: balance; }   /* the one-line phone description wraps evenly, no orphaned word */
}
@media (min-width: 768px) {
  /* tablet and desktop: copy left, art right */
  .ed-coach__grid { grid-template-columns: var(--ed-coach-cols-tab); column-gap: var(--ed-gap); }
  .ed-coach__copy { grid-column: 1; grid-row: 1; }
  .ed-coach__scene { grid-column: 2; grid-row: 1; }
  .ed-coach .ed-coach__scene { aspect-ratio: var(--ed-coach-scene-ratio-tab); }
  .ed-coach__plate { --ed-coach-crop-y: var(--ed-coach-crop-y-tab); }
}
@media (min-width: 768px) and (max-width: 1023px) {
  /* tablet: the art bleeds to the right edge, as in the populated mock */
  .ed-coach .ed-coach__scene { margin-right: calc(-1 * var(--ed-gutter)); }
}
@media (min-width: 1024px) {
  .ed-coach { padding-block: var(--ed-coach-pad-top-desk) var(--ed-coach-pad-bot-desk); }
  .ed-coach__grid { grid-template-columns: var(--ed-coach-cols-desk); }
  .ed-coach .ed-coach__scene { aspect-ratio: var(--ed-coach-scene-ratio-desk); }
  .ed-coach__plate { --ed-coach-crop-y: var(--ed-coach-crop-y-desk); }
}

/* earned stage: heading and the cast (earned-security-cast, z 20); the EARNED SECURITY sign is off the page
   (owner 2026-10-14), placement deferred. The WE REL8! lineup is shown whole, boots included, at every width (owner
   2026-10-24): the box takes the art's own ratio and the art is contained, never cropped; a short screen caps the box
   height (--ed-earned-cast-max-h) and the art letterboxes inside it. Phones and tablets put the copy under the art. */
.ed-earned__grid { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--ed-space-16); }
.ed-earned__stage { position: relative; display: grid; row-gap: var(--ed-space-8); }
.ed-earned .ed-h2 { --m: 24.9; --t: 36.8; --d: 44.5; }
.ed-earned__stage .ed-earned__cast { position: relative; z-index: var(--ed-z-content); aspect-ratio: var(--ed-earned-cast-ratio-mob);
  max-height: var(--ed-earned-cast-max-h); overflow: hidden; }
.ed-earned__cast > .ed-earned__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.ed-earned__line { --m: 16; --t: 19; --d: 32.7; line-height: 0.88; }
.ed-earned__body { max-width: var(--ed-len-290); margin-top: var(--ed-len-4); line-height: 1.4; --d: 16; }
.ed-earned__cta { margin-top: var(--ed-space-16); --m: 9.5; --t: 15; }
@media (max-width: 767px) {
  .ed-earned__cta { margin-top: 0; min-height: max(var(--ed-em-3-2), var(--ed-tap-min)); }
}
@media (min-width: 768px) {
  .ed-earned__stage .ed-earned__cast { aspect-ratio: var(--ed-earned-cast-ratio-tab); }
}
@media (min-width: 1024px) {
  .ed-earned { padding-block: var(--ed-earned-pad-top-desk) var(--ed-earned-pad-bot-desk); }
  .ed-earned__grid { grid-template-columns: repeat(var(--ed-cols), minmax(0, 1fr)); column-gap: var(--ed-gap); align-items: center; }
  .ed-earned__stage { grid-column: 1 / span var(--ed-earned-cols-cast); }
  .ed-earned__copy { grid-column: span var(--ed-earned-cols-copy) / -1; }
  .ed-earned__stage .ed-earned__cast { aspect-ratio: var(--ed-earned-cast-ratio-desk); }
  .ed-earned__cta { padding-inline: var(--ed-em-2-6); }
}

/* Dating Red Flags (the funnel's fourth beat, after the Moments), COA-96 Golden Ratio dual-panel layout:
   The hook headline and narrative lead are center-weighted; under them the two 9:16 panels sit side by side
   with the illuminated nocturnal time capsule between them (11:42 PM -> 45 MINS ON READ -> 12:27 AM).
   Each panel directly anchors its own action button underneath (Start on her side / Start on his side). */
.ed-story__grid { display: flex; flex-direction: column; align-items: center; gap: var(--ed-space-32); width: var(--ed-full); position: relative; }
.ed-story__head { display: flex; flex-direction: column; align-items: center; text-align: center; max-width: calc(var(--ed-len-400) + var(--ed-len-290)); gap: var(--ed-space-8); min-width: 0; z-index: var(--ed-z-content); }
.ed-story__poster { margin: 0; font-family: var(--font-poster); font-weight: 900; text-transform: uppercase; line-height: 0.92; letter-spacing: calc(-1 * var(--ed-em-0-02)); --m: 32; --t: 46; --d: 56; text-align: center; }
.ed-story__lead { max-width: calc(var(--ed-len-400) + var(--ed-len-290)); text-align: center; line-height: 1.4; margin-top: var(--ed-space-8); }

/* The Stage: Golden Ratio dual diorama */
.ed-story__stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: var(--ed-gap);
  align-items: center;
  width: var(--ed-full);
  max-width: calc(var(--ed-len-400) * 2 + var(--ed-len-100) + var(--ed-gap) * 2);
  margin-inline: auto;
  position: relative;
}

.ed-story__side {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--ed-space-12);
}

.ed-story__panel { gap: var(--ed-space-8); }
.ed-story__panel--her, .ed-story__panel--his {
  background: rgb(var(--ch-stage)) !important;
  border: var(--ed-len-1) solid rgb(var(--ch-gold-edge) / 0.5) !important;
  border-radius: var(--ed-radius-box) !important;
  box-shadow: 0 var(--ed-len-8) var(--ed-len-24) calc(-1 * var(--ed-len-4)) rgb(var(--ch-ink) / 0.8),
              0 0 var(--ed-len-14) rgb(var(--ch-hotpink) / 0.25),
              inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / 0.5) !important;
  overflow: hidden !important;
}
.ed-story__panel .ed-art-img {
  display: block;
  width: var(--ed-full);
  aspect-ratio: 9 / 16;
  object-fit: cover;
}
.ed-story__panel .ed-box__label { --m: 12; --t: 13; --d: 15; text-align: center; color: rgb(var(--ch-cream) / 0.9); }

.ed-story__cta {
  width: var(--ed-full);
  min-height: var(--ed-tap-min);
  padding-inline: var(--ed-space-12);
  font-size: calc(var(--t) * var(--ed-px));
  justify-content: center;
  text-align: center;
  white-space: normal;
}

/* The Hinge: Nocturnal Timeline */
.ed-story__hinge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--ed-space-8);
  padding-inline: var(--ed-len-4);
}

.ed-story__time {
  font-family: var(--font-mono);
  font-size: var(--ed-len-11);
  font-weight: 700;
  letter-spacing: var(--ed-em-0-04);
  color: rgb(var(--ch-cream) / 0.65);
}

.ed-story__track {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ed-len-6);
}

.ed-story__line {
  display: block;
  width: var(--ed-len-1);
  height: clamp(var(--ed-len-24), var(--ed-vw-2-9), var(--ed-len-48));
  background: linear-gradient(180deg, rgb(var(--ch-gold-specular) / 0.8), rgb(var(--ch-hotpink) / 0.3));
  box-shadow: 0 0 var(--ed-len-8) rgb(var(--ch-hotpink) / 0.5);
}

.ed-story__pill {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--ed-len-6) var(--ed-space-16);
  background: rgb(var(--ch-ink) / 0.94);
  border: var(--ed-len-1) solid rgb(var(--ch-gold-edge) / 0.7);
  border-radius: var(--ed-radius-pill);
  backdrop-filter: blur(var(--ed-len-12));
  box-shadow: 0 0 0 var(--ed-len-1) rgb(var(--ch-hotpink) / 0.35),
              0 var(--ed-len-4) var(--ed-len-16) rgb(var(--ch-ink) / 0.8),
              inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / 0.6);
  text-align: center;
  white-space: nowrap;
}

.ed-story__pill-dur {
  font-family: var(--font-label);
  font-weight: 900;
  font-size: var(--ed-len-13);
  line-height: 1;
  letter-spacing: var(--ed-em-0-08);
  text-transform: uppercase;
  color: rgb(var(--ch-cream));
}

.ed-story__pill-sub {
  font-family: var(--font-headline);
  font-weight: 800;
  font-size: var(--ed-len-8);
  line-height: 1.2;
  letter-spacing: var(--ed-em-0-08);
  text-transform: uppercase;
  color: rgb(var(--ch-hotpink));
  margin-top: var(--ed-len-2);
}

@media (max-width: 767px) {
  .ed-story__stage { gap: var(--ed-len-8); }
  .ed-story__cta { min-height: max(var(--ed-em-3-2), var(--ed-tap-min)); font-size: var(--ed-len-11); padding-inline: var(--ed-len-8); }
  .ed-story__pill { padding: var(--ed-len-4) var(--ed-space-8); }
  .ed-story__pill-dur { font-size: var(--ed-len-10); }
  .ed-story__pill-sub { font-size: var(--ed-len-8); }
  .ed-story__time { font-size: var(--ed-len-9, var(--ed-len-8)); }
}

/* ==== 08 what you get (the offer): the audience line, the cards first with the price, the refund and who made it, the two
   buy buttons (goToStore in ed-store.html; the story alone reads store.json price.story_alone), the bundle's three parts as
   squares of their art (WF9, owner 2026-10-15: "the thumbnails are too small to tell what they are"), then two cards in
   full (<!--#moment-card--> in build-pages.mjs) and the story with its free preview. Order and content: the value tests of
   2026-10-18 (docs/4-explanation/rel8r/DATING-RED-FLAGS-VALUE-TESTS-2026-10-18.md, sections 3 and 6 item 8). */
.ed-get__grid { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--ed-len-12); align-items: center; }
.ed-get__buy { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ed-len-8); min-width: 0; }
.ed-get__buy .ed-body { max-width: var(--ed-len-400); margin: 0; line-height: 1.45; }
.ed-get .ed-h3 { --m: 24.2; --t: 29.2; --d: 34.9; }
.ed-get__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ed-gap); }
.ed-get__item { display: grid; gap: var(--ed-len-6); justify-items: center; text-align: center; }
.ed-get__item .ed-product { display: block; width: 100%; }
.ed-get__item .ed-box__label { --m: 12; --t: 13; --d: 15; --floor: var(--ed-len-12); color: rgb(var(--ch-cream)); }
.ed-product { color: rgb(var(--ch-cream) / 0.85); }
.ed-get__list .ed-product { aspect-ratio: var(--ed-get-tile-ratio-mob); }
.ed-product > .ed-art-img { position: absolute; inset: 0; height: 100%; object-fit: contain; }
.ed-product > .ed-ico { font-size: clamp(var(--ed-len-17), var(--ed-vw-5-4), var(--ed-len-22)); }
.ed-get__samples, .ed-get__story { display: flex; flex-direction: column; gap: var(--ed-len-12); min-width: 0; margin-top: var(--ed-len-16); }
.ed-get__samples > .ed-body, .ed-get__story > .ed-body { max-width: var(--ed-doc-max); }
.ed-sample { gap: var(--ed-len-12); }
@media (min-width: 768px) {
  .ed-get__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); column-gap: var(--ed-gap); }
  .ed-get .ed-h3, .ed-get__samples, .ed-get__story { grid-column: 1 / -1; }
  .ed-get__list .ed-product { aspect-ratio: var(--ed-get-tile-ratio-tab); }
  .ed-product > .ed-ico { font-size: var(--ed-len-24); }
}
@media (min-width: 1024px) {
  .ed-get { padding-block: var(--ed-get-pad-top-desk) var(--ed-get-pad-bot-desk); }
  .ed-get__grid { grid-template-columns: repeat(var(--ed-cols), minmax(0, 1fr)); column-gap: var(--ed-gap); }
  .ed-get .ed-h3, .ed-get__samples, .ed-get__story { grid-column: 1 / -1; }
  .ed-get__buy { grid-column: 1 / span 6; }
  .ed-get__list { grid-column: 7 / -1; gap: var(--ed-gap); }
  .ed-get__list .ed-product { aspect-ratio: var(--ed-get-tile-ratio-desk); }
}

/* ==== 09 trust strip: icons (phone); icon over text (tablet); icon beside text (desktop) */
.ed-trustband__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--ed-len-8); }
.ed-trustband li { display: flex; flex-direction: column; align-items: center; gap: var(--ed-len-6); min-width: 0; }
.ed-trustband .ed-ico { font-size: var(--ed-len-30); color: rgb(var(--ch-hotpink)); }
.ed-trustband .ed-ico--wide { scale: 1.3; }
.ed-trustband__text { line-height: 1.3; color: rgb(var(--ch-cream) / 0.85); --m: 9.5; --t: 9.5; --d: 15.4; --floor: var(--ed-len-13); }
.ed-trustband__short { line-height: 1.3; text-align: center; color: rgb(var(--ch-cream) / 0.85); font: 600 var(--ed-len-10)/1.3 var(--font-headline); }
@media (max-width: 767px) {
  .ed-trustband__text { position: absolute; width: var(--ed-len-1); height: var(--ed-len-1); overflow: hidden; clip-path: inset(var(--ed-half)); white-space: nowrap; }
}
@media (min-width: 768px) {
  .ed-trustband li { align-items: flex-start; }
  .ed-trustband .ed-ico { font-size: var(--ed-len-24); }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .ed-final .ed-btn { min-height: var(--ed-em-4-5); }
}
@media (min-width: 1024px) {
  .ed-trustband { padding-block: var(--ed-trust-pad-top-desk) var(--ed-trust-pad-bot-desk); }
  .ed-trustband__list { display: flex; justify-content: space-between; gap: var(--ed-len-16); padding-inline: var(--ed-len-12); }
  .ed-trustband li { flex-direction: row; align-items: center; gap: var(--ed-len-14); }
  .ed-trustband .ed-ico { font-size: var(--ed-len-46); }
}

/* ==== 10 final call */
.ed-final { padding-block: var(--ed-band-pad); }
.ed-final__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--ed-len-12) clamp(var(--ed-len-16), var(--ed-vw-1-8), var(--ed-len-26)); text-align: center; }
.ed-final__h { line-height: 1.08; --m: 22.7; --t: 27.3; --d: 39.1; }
.ed-final .ed-btn { --t: 10; --d: 11.4; --floor: var(--ed-len-11); padding-inline: var(--ed-em-1-9); }
@media (min-width: 1024px) {
  .ed-final { display: grid; align-content: center; min-height: var(--ed-final-h-min-desk);
    padding-block: var(--ed-final-pad-top-desk) var(--ed-final-pad-bot-desk); }
  .ed-final .ed-btn { min-height: var(--ed-em-4-1); }
}

/* ==== 11 footer */
/* the footer mirrors the header (COA-117): the same gold edge, on top instead of below, over the blackened chassis, so the
   gold logo up top has a counterweight at the bottom of every page */
.ed-footer { background: var(--gold-chassis); border-top: var(--gold-frame-h) solid var(--gold-line);
  box-shadow: inset 0 var(--ed-len-1) 0 rgb(var(--ch-gold-specular) / var(--ed-alpha-glow)), 0 calc(-1 * var(--ed-len-4)) var(--ed-len-20) rgb(var(--ch-ink) / var(--ed-alpha-text)); }
.ed-footer::before { display: none; }
.ed-footer { padding-bottom: var(--nam-clear); }
.ed-footer__fine { border-top: var(--ed-len-1) solid var(--gold-line); }
.ed-footer__in { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; min-height: var(--ed-len-46); }
@media (min-width: 768px) { .ed-footer__in { min-height: var(--ed-len-72); } }
@media (min-width: 1024px) { .ed-footer__in { min-height: var(--ed-footer-h-desk); } }
.ed-logo--footer { grid-column: 1; justify-self: start; margin: 0; --m: 21.9; --t: 29.6; --d: 33.8; }
.ed-footer__links { grid-column: 2; display: flex; gap: clamp(var(--ed-len-16), var(--ed-vw-2), var(--ed-len-28)); }
.ed-footer__links a { color: rgb(var(--ch-cream)); text-decoration: none; --m: 12; --t: 13; --d: 14.5; --floor: var(--ed-len-13); }
.ed-footer__links a:hover { color: rgb(var(--ch-hotpink)); }
.ed-social { grid-column: 3; justify-self: end; display: flex; align-items: center; gap: clamp(var(--ed-len-12), var(--ed-vw-1-6), var(--ed-len-22)); }
.ed-social a { display: grid; place-items: center; color: rgb(var(--ch-cream)); }
.ed-social .ed-ico { width: clamp(var(--ed-len-17), var(--ed-vw-1-7), var(--ed-len-25)); height: clamp(var(--ed-len-17), var(--ed-vw-1-7), var(--ed-len-25)); stroke-width: 1.8; }

/* ==== 12 content pages (privacy, terms, refunds, 404, guides): built from the same bands, wrap, poster and body as
   the home page. A text band narrows its .ed-wrap to the reading measure; .ed-band--panel is a filled band. */
.ed-band--text { padding-block: var(--ed-doc-pad-top) var(--ed-doc-pad-bot); }
.ed-band--text:first-child { padding-top: var(--ed-doc-pad-first); }
.ed-band--text > .ed-wrap { display: flex; flex-direction: column; gap: var(--ed-doc-flow); max-width: var(--ed-doc-max); }
.ed-band--panel { background: rgb(var(--ch-gunmetal) / var(--ed-alpha-fill)); box-shadow: inset 0 var(--ed-len-1) 0 rgb(var(--ch-canvas) / 0.12), 0 var(--ed-len-4) var(--ed-len-16) rgb(var(--ch-ink) / 0.6); }
.ed-band--key::before { height: var(--ed-len-2); background: rgb(var(--ch-hotpink)); }
.ed-h1 { --m: var(--ed-h1-m); --t: var(--ed-h1-t); --d: var(--ed-h1-d); line-height: var(--ed-h1-lh); }
.ed-band--text .ed-h2 { --m: var(--ed-h2-m); --t: var(--ed-h2-t); --d: var(--ed-h2-d); line-height: var(--ed-h2-lh); }
.ed-band--text .ed-body { line-height: var(--ed-doc-lh); color: rgb(var(--ch-cream) / var(--ed-alpha-text)); }
.ed-band--text ul.ed-body { display: flex; flex-direction: column; gap: var(--ed-len-8); padding-left: var(--ed-len-20); }
.ed-band--text ul.ed-body > li { list-style: disc; }
.ed-band--text ul.ed-body > li::marker { color: rgb(var(--ch-hotpink)); }
.ed-band--text strong { color: rgb(var(--ch-cream)); }
.ed-band--text a:not(.ed-btn):not(.ed-route) { color: rgb(var(--ch-hotpink)); font-weight: var(--ed-fw-bold); text-underline-offset: var(--ed-len-4); }
.ed-band--text code { padding: 0 var(--ed-len-4); border-radius: var(--ed-len-4); background: rgb(var(--ch-gunmetal)); font-family: var(--font-label); }
.ed-meta { color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); }
/* Fine print: the one style for legal boilerplate (tier 3 of Machine-Norms standards/DISCLOSURE-AND-FINE-PRINT-STANDARD.md). No box, no heading, no icon. */
.ed-fine { margin: 0; font-size: var(--ed-fine-size); line-height: var(--ed-fine-lh); font-weight: var(--ed-fw-regular); color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); }
.ed-fine a { color: inherit; text-decoration: underline; }
.ed-footer__fine { grid-column: 1 / -1; padding-block: var(--ed-len-12); text-align: center; }
.ed-lead { font-weight: var(--ed-fw-semi); }
.ed-tag { align-self: flex-start; padding: var(--ed-len-4) var(--ed-len-12); border: var(--ed-len-1) solid var(--gold-line);
  border-radius: var(--ed-radius-box); color: var(--gold-text); box-shadow: var(--gold-bevel); font: var(--ed-fw-black) var(--ed-len-12)/var(--ed-h2-lh) var(--font-poster);
  letter-spacing: var(--ed-em-0-1); text-transform: uppercase; }
.ed-routes { display: grid; gap: var(--ed-len-12); margin: 0; padding: 0; list-style: none; }
.ed-route { display: flex; align-items: center; gap: var(--ed-len-12); padding: var(--ed-len-12) var(--ed-len-16);
  border: var(--ed-len-1) solid var(--gold-line); border-radius: var(--ed-radius-box);
  background: rgb(var(--ch-gunmetal) / var(--ed-alpha-fill)); color: rgb(var(--ch-cream)); font-family: var(--font-headline);
  font-weight: var(--ed-fw-heavy); text-decoration: none; }
.ed-route:hover { border-color: var(--gold-line-hot); }
.ed-route .ed-ico { color: rgb(var(--ch-hotpink)); font-size: var(--ed-len-24); }
@media (min-width: 768px) { .ed-routes { grid-template-columns: repeat(var(--ed-route-cols), minmax(0, 1fr)); } }

/* ==== 13 page components (guides, compass, reader): every value from rel8r-tokens.css */
.ed-intro { display: grid; gap: var(--ed-len-24); align-items: center; }
.ed-intro__copy { display: flex; flex-direction: column; gap: var(--ed-doc-flow); }
@media (min-width: 1024px) { .ed-intro { grid-template-columns: var(--ed-intro-cols); } }
.ed-band--page { padding-block: var(--ed-doc-pad-top) var(--ed-doc-pad-bot); }
.ed-band--page:first-child { padding-top: var(--ed-doc-pad-first); }
.ed-band--page > .ed-wrap { display: flex; flex-direction: column; gap: var(--ed-doc-flow); }
.ed-band--page > .ed-wrap > .ed-btn { align-self: flex-start; }
.ed-band--page > .ed-wrap.ed-intro { display: grid; }
.ed-band--page .ed-h2, .ed-card .ed-h2 { --m: var(--ed-h2-m); --t: var(--ed-h2-t); --d: var(--ed-h2-d); line-height: var(--ed-h2-lh); }
.ed-band--page .ed-body, .ed-card .ed-body { line-height: var(--ed-doc-lh); }
.ed-chips { display: flex; flex-wrap: wrap; gap: var(--ed-len-8); margin: 0; padding: 0; list-style: none; }
.ed-chip { align-self: flex-start; padding: var(--ed-len-4) var(--ed-len-12); border: var(--ed-len-1) solid rgb(var(--ch-hotpink) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-box); color: rgb(var(--ch-cream)); font: var(--ed-fw-heavy) var(--ed-len-12)/var(--ed-h2-lh) var(--font-headline);
  letter-spacing: var(--ed-em-0-04); text-transform: uppercase; }
.ed-pill { display: inline-flex; align-self: flex-start; align-items: center; padding: var(--ed-len-4) var(--ed-len-12);
  border: var(--ed-len-1) solid currentColor; border-radius: var(--ed-radius-pill);
  font: var(--ed-fw-heavy) var(--ed-len-12)/var(--ed-h2-lh) var(--font-headline);
  letter-spacing: var(--ed-em-0-04); text-transform: uppercase; }
.ed-pill--emerald { color: rgb(var(--ch-emerald-400)); border-color: rgb(var(--ch-emerald-400) / var(--ed-alpha-line)); background: rgb(var(--ch-emerald-950) / var(--ed-alpha-fill)); }
.ed-pill--rose { color: rgb(var(--ch-hotpink)); border-color: rgb(var(--ch-hotpink) / var(--ed-alpha-line)); background: rgb(var(--ch-stage) / var(--ed-alpha-fill)); }
.ed-pill--blue { color: rgb(var(--ch-sky)); border-color: rgb(var(--ch-sky) / var(--ed-alpha-line)); background: rgb(var(--ch-navy) / var(--ed-alpha-fill)); }
.ed-pill--amber { color: rgb(var(--ch-amber-400)); border-color: rgb(var(--ch-amber-400) / var(--ed-alpha-line)); background: rgb(var(--ch-amber-950) / var(--ed-alpha-fill)); }
.ed-grid { display: grid; gap: var(--ed-grid-gap); margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .ed-grid { grid-template-columns: repeat(var(--ed-grid-cols-tab), minmax(0, 1fr)); } }
@media (min-width: 1024px) { .ed-grid { grid-template-columns: repeat(var(--ed-grid-cols-desk), minmax(0, 1fr)); }
  .ed-grid--4 { grid-template-columns: repeat(var(--ed-grid-cols-wide), minmax(0, 1fr)); } }
.ed-card { position: relative; display: flex; flex-direction: column; gap: var(--ed-card-gap); min-width: 0; padding: var(--ed-card-pad);
  border: var(--ed-len-1) solid var(--gold-line); border-radius: var(--ed-radius-box); box-shadow: var(--gold-bevel);
  background: rgb(var(--ch-gunmetal) / var(--ed-alpha-fill)); color: rgb(var(--ch-cream) / var(--ed-alpha-text)); text-align: left; }
.ed-card > .ed-btn { align-self: flex-start; }
.ed-card--key { border-width: var(--ed-len-2); border-color: var(--gold-line-hot); box-shadow: var(--gold-bevel), var(--gold-glow); }
button.ed-card { font: inherit; cursor: pointer; transition: border-color var(--ed-fast) var(--ed-ease), transform var(--ed-fast) var(--ed-ease); }
button.ed-card:hover { border-color: var(--gold-line-hot); transform: translateY(calc(-1 * var(--ed-len-2))); }
.ed-card__h { margin: 0; color: rgb(var(--ch-cream)); font: var(--ed-fw-black) var(--ed-len-20)/var(--ed-h2-lh) var(--font-poster); text-transform: uppercase; }
.ed-card__h .ed-card__kicker { display: block; margin-top: var(--ed-len-4); }
.ed-card__kicker { color: var(--gold-text); font: var(--ed-fw-heavy) var(--ed-len-12)/var(--ed-h2-lh) var(--font-headline);
  letter-spacing: var(--ed-em-0-04); text-transform: uppercase; }
.ed-card__foot { margin-top: auto; padding-top: var(--ed-len-12); border-top: var(--ed-len-1) dashed rgb(var(--ch-cream) / var(--ed-alpha-line));
  color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); }
.ed-card ul { display: flex; flex-direction: column; gap: var(--ed-len-8); margin: 0; padding-left: var(--ed-len-20); }
.ed-card li { list-style: disc; } .ed-card li::marker { color: rgb(var(--ch-hotpink)); }
@media (min-width: 1024px) { .ed-grid--2 { grid-template-columns: repeat(var(--ed-grid-cols-tab), minmax(0, 1fr)); } }
.ed-sheet__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--ed-len-12); padding-bottom: var(--ed-len-12);
  border-bottom: var(--ed-len-1) solid rgb(var(--ch-cream) / var(--ed-alpha-line)); }
.ed-sheet__title { margin: 0; color: rgb(var(--ch-cream)); font: var(--ed-fw-black) var(--ed-len-30)/var(--ed-h2-lh) var(--font-poster); text-transform: uppercase; }
.ed-sec { display: flex; flex-direction: column; gap: var(--ed-len-8); }
.ed-sec__h { margin: 0; color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); font: var(--ed-fw-heavy) var(--ed-len-12)/var(--ed-h2-lh) var(--font-headline);
  letter-spacing: var(--ed-em-0-04); text-transform: uppercase; }
.ed-move { margin: 0; padding: var(--ed-len-16); border: var(--ed-len-1) solid rgb(var(--ch-hotpink)); border-radius: var(--ed-radius-box);
  color: rgb(var(--ch-cream)); font: var(--ed-fw-bold) var(--ed-len-18)/var(--ed-doc-lh) var(--font-headline); }
.ed-strike { color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); }
.ed-note { margin: 0; padding: var(--ed-len-12) var(--ed-len-16); border-left: var(--ed-len-3) solid rgb(var(--ch-hotpink));
  background: rgb(var(--ch-gunmetal) / var(--ed-alpha-fill)); color: rgb(var(--ch-cream) / var(--ed-alpha-text)); }
/* Moment lock card (free Moments page only; Decision C7, wl-3f364d91): the copy-ready scripts and somatic
   exercises sit behind the Rel8r Bundle lock card, matching the Spread 25 reader paywall (Decision C5). */
.ed-lock { display: flex; flex-direction: column; align-items: center; gap: var(--ed-len-12); text-align: center;
  margin: var(--ed-len-8) 0; padding: var(--ed-len-30) var(--ed-len-16);
  border: var(--ed-len-1) solid rgb(var(--ch-hotpink) / var(--ed-alpha-line)); border-radius: var(--ed-radius-box);
  background: rgb(var(--ch-gunmetal) / var(--ed-alpha-fill)); }
.ed-lock__badge { font-family: var(--font-mono); font-size: var(--ed-fine-size); letter-spacing: var(--ed-em-0-12);
  text-transform: uppercase; color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); }
.ed-lock__title { margin: 0; color: rgb(var(--ch-cream)); text-transform: uppercase;
  font: var(--ed-fw-black) var(--ed-len-20)/var(--ed-h2-lh) var(--font-poster); }
.ed-lock__copy { max-width: var(--ed-len-400); margin: 0; color: rgb(var(--ch-cream) / var(--ed-alpha-text));
  font: var(--ed-fw-semi) var(--ed-len-15)/var(--ed-doc-lh) var(--font-body); }
.ed-lock__actions { display: flex; flex-wrap: wrap; gap: var(--ed-len-8); justify-content: center; }
.ed-tabs { display: flex; gap: var(--ed-len-8); overflow-x: auto; scrollbar-width: none; }
.ed-tab { flex: none; padding: var(--ed-len-8) var(--ed-len-16); border: var(--ed-len-1) solid rgb(var(--ch-cream) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-box); background: rgb(var(--ch-stage)); color: rgb(var(--ch-cream));
  font: var(--ed-fw-heavy) var(--ed-len-14)/var(--ed-h2-lh) var(--font-headline); cursor: pointer; }
.ed-tab[aria-pressed="true"], .ed-tab:hover { border-color: rgb(var(--ch-hotpink)); background: rgb(var(--ch-hotpink)); color: rgb(var(--ch-stage)); }
.ed-sticky { position: sticky; top: var(--ed-header-h); z-index: var(--ed-z-content); background: rgb(var(--ch-stage)); }
.ed-figure { margin: 0; overflow: hidden; border: var(--ed-len-2) solid rgb(var(--ch-hotpink) / var(--ed-alpha-line)); border-radius: var(--ed-radius-box); }
.ed-figure img { display: block; width: var(--ed-full); height: auto; }
/* a figure that links (pocket guide, Meet the four, WF4 2026-10-14): block link, frame lights up on hover and keyboard focus */
.ed-card__art { display: block; }
.ed-card__art:hover .ed-figure, .ed-card__art:focus-visible .ed-figure { border-color: rgb(var(--ch-hotpink)); }
.ed-figure--aside { align-self: flex-start; width: min(var(--ed-full), var(--ed-aside-w)); }
/* a Moment's two-panel pair in the opened sheet (ART_RENDER_PROGRAM.md): two 4:5 panels, stacked on phones, side by side from 900px; the
   caption box is a solid token fill under its image, never on it (MOBILE_TWO_PANEL_FRAMEWORK.md R10) */
.ed-pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ed-len-8); }
.ed-pair__panel { display: flex; flex-direction: column; gap: var(--ed-len-8); }
.ed-pair__cap { display: flex; flex-direction: column; gap: var(--ed-len-8); padding: var(--ed-len-12) var(--ed-len-16); border-left: var(--ed-len-3) solid rgb(var(--ch-hotpink));
  background: rgb(var(--ch-gunmetal)); color: rgb(var(--ch-cream)); }
.ed-pair__cap .ed-body { margin: 0; }
@media (min-width: 900px) { .ed-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ed-len-12); } }
/* On phones (COA-100) the opened Moment shows MY MOVE and the script before the full-height art: the sheet card is a flex column,
   the pair and its move panel dissolve into it (display: contents), and tokens set the order: head, lead, art, rest. */
@media (max-width: 767px) {
  .ed-sheet .ed-card > * { order: var(--ed-order-rest); }
  .ed-sheet .ed-sheet__head { order: var(--ed-order-head); }
  .ed-sheet .ed-pair, .ed-sheet .ed-pair__panel--move { display: contents; }
  .ed-sheet .ed-sheet__lead { order: var(--ed-order-lead); }
  .ed-sheet .ed-sheet__art { order: var(--ed-order-art); }
}
.ed-packs { display: flex; justify-content: center; }
.ed-packs .ed-figure { width: min(var(--ed-full), var(--ed-aside-w)); }
.ed-sheet { width: min(var(--ed-full) - 2 * var(--ed-gutter), var(--ed-sheet-max)); max-height: calc(var(--ed-vh-full) - 2 * var(--ed-gutter)); padding: 0; overflow-y: auto;
  border: 0; background: transparent; color: rgb(var(--ch-cream)); }
.ed-sheet::backdrop { background: rgb(var(--ch-stage) / var(--ed-alpha-scrim)); }
.ed-sheet .ed-card { background: rgb(var(--ch-stage)); border-color: rgb(var(--ch-hotpink)); }
.ed-toast { position: fixed; inset-inline: 0; bottom: var(--ed-toast-bottom); z-index: var(--ed-z-nav); width: max-content; margin-inline: auto; padding: var(--ed-len-10) var(--ed-len-20);
  border-radius: var(--ed-radius-box); background: rgb(var(--ch-hotpink)); color: rgb(var(--ch-stage)); font: var(--ed-fw-heavy) var(--ed-len-14)/var(--ed-h2-lh) var(--font-headline);
  opacity: 0; pointer-events: none; transition: opacity var(--ed-fast) var(--ed-ease); }
.ed-toast.is-on { opacity: 1; }
.ed-copyline { display: flex; align-items: flex-start; gap: var(--ed-len-12); padding: var(--ed-len-12); border: var(--ed-len-1) solid rgb(var(--ch-cream) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-box); }
.ed-copyline--copy { border-color: rgb(var(--ch-hotpink) / var(--ed-alpha-line)); }
.ed-copyline > :first-child { flex: 1; }
/* chat bubbles, terminal blocks, steps, tables (coach install page) */
.ed-band--page code, .ed-card code { padding: 0 var(--ed-len-4); border-radius: var(--ed-len-4); background: rgb(var(--ch-gunmetal));
  color: rgb(var(--ch-pink-soft)); font-family: var(--font-label); overflow-wrap: anywhere; }
.ed-band--page a:not(.ed-btn):not(.ed-route), .ed-card a:not(.ed-btn) { color: rgb(var(--ch-hotpink)); font-weight: var(--ed-fw-bold); text-underline-offset: var(--ed-len-4); }
.ed-bubble { max-width: var(--ed-bubble-max); margin: 0; padding: var(--ed-len-8) var(--ed-len-16); border-radius: var(--ed-radius-box);
  font-weight: var(--ed-fw-semi); line-height: var(--ed-doc-lh); }
.ed-bubble--me { align-self: flex-end; background: rgb(var(--ch-hotpink)); color: rgb(var(--ch-stage)); }
.ed-bubble--them { align-self: flex-start; background: rgb(var(--ch-cream) / var(--ed-alpha-bubble)); color: rgb(var(--ch-cream)); }
.ed-bubble--coach { align-self: flex-end; border: var(--ed-len-1) solid rgb(var(--ch-hotpink)); color: rgb(var(--ch-cream)); font-weight: var(--ed-fw-bold); }
.ed-end { align-self: flex-end; }
.ed-term { display: flex; align-items: flex-start; gap: var(--ed-len-8); padding: var(--ed-len-12); border: var(--ed-len-1) solid rgb(var(--ch-cream) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-box); background: rgb(var(--ch-stage)); }
.ed-term pre { flex: 1; margin: 0; overflow-x: auto; color: rgb(var(--ch-pink-soft)); font: var(--ed-fw-bold) var(--ed-len-14)/var(--ed-doc-lh) var(--font-label); }
.ed-steps { display: flex; flex-direction: column; gap: var(--ed-len-16); margin: 0; padding: 0; list-style: none; }
.ed-steps > li { display: flex; flex-direction: column; gap: var(--ed-len-8); }
.ed-step__h { margin: 0; color: rgb(var(--ch-cream)); font: var(--ed-fw-black) var(--ed-len-18)/var(--ed-h2-lh) var(--font-headline); }
.ed-list-num { display: flex; flex-direction: column; gap: var(--ed-len-12); margin: 0; padding-left: var(--ed-len-20); }
.ed-list-num > li { list-style: decimal; } .ed-list-num > li::marker { color: rgb(var(--ch-hotpink)); font-weight: var(--ed-fw-black); }
.ed-table-wrap { overflow-x: auto; border: var(--ed-len-1) solid rgb(var(--ch-hotpink) / var(--ed-alpha-line)); border-radius: var(--ed-radius-box); }
.ed-table { width: var(--ed-full); border-collapse: collapse; table-layout: fixed; text-align: left; color: rgb(var(--ch-cream) / var(--ed-alpha-text)); }
.ed-table th { padding: var(--ed-len-16); color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); font: var(--ed-fw-heavy) var(--ed-len-12)/var(--ed-h2-lh) var(--font-headline);
  letter-spacing: var(--ed-em-0-04); text-transform: uppercase; }
.ed-table td { padding: var(--ed-len-16); border-top: var(--ed-len-1) solid rgb(var(--ch-cream) / var(--ed-alpha-line)); vertical-align: top; }
.ed-table td:first-child { color: rgb(var(--ch-cream)); font-weight: var(--ed-fw-black); }

/* the Attachment Compass (attachment-compass.html, js/attachment-compass-page.js) */
.ed-band--page[id] { scroll-margin-top: var(--ed-header-h); }
.ed-progress { display: flex; align-items: center; gap: var(--ed-len-12); }
.ed-progress__track { flex: 1; height: var(--ed-progress-h); overflow: hidden; border-radius: var(--ed-radius-box); background: rgb(var(--ch-cream) / var(--ed-alpha-bubble)); }
.ed-progress__bar { width: calc(var(--ed-progress, 0) * var(--ed-full)); height: var(--ed-full); background: rgb(var(--ch-hotpink));
  transition: width var(--ed-fast) var(--ed-ease); }
.ed-qs { display: flex; flex-direction: column; gap: var(--ed-grid-gap); margin: 0; padding: 0; list-style: none; }
.ed-q__n { padding-right: var(--ed-len-8); color: rgb(var(--ch-hotpink)); font: var(--ed-fw-bold) var(--ed-len-12)/var(--ed-h2-lh) var(--font-label); }
.ed-scale { display: flex; flex-direction: column; gap: var(--ed-len-4); margin: 0; padding: 0; border: 0; }
.ed-scale__row { display: flex; align-items: center; justify-content: space-between; gap: var(--ed-len-4); }
.ed-scale__opt { display: flex; flex: 1; justify-content: center; }
.ed-scale__dot { display: grid; place-items: center; width: var(--ed-scale-dot-mob); height: var(--ed-scale-dot-mob); border: var(--ed-len-2) solid rgb(var(--ch-cream) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-round); color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); font: var(--ed-fw-black) var(--ed-len-14)/var(--ed-h2-lh) var(--font-headline); cursor: pointer;
  transition: background var(--ed-fast) var(--ed-ease), border-color var(--ed-fast) var(--ed-ease); }
.ed-scale__opt:hover .ed-scale__dot { border-color: rgb(var(--ch-hotpink)); }
.ed-scale__opt input:checked + .ed-scale__dot { border-color: rgb(var(--ch-hotpink)); background: rgb(var(--ch-hotpink)); color: rgb(var(--ch-stage)); }
.ed-scale__opt input:focus-visible + .ed-scale__dot { outline: var(--ed-len-3) solid rgb(var(--ch-pink-soft)); outline-offset: var(--ed-len-3); }
@media (min-width: 768px) { .ed-scale__dot { width: var(--ed-scale-dot); height: var(--ed-scale-dot); } }
.ed-scale__ends { display: flex; justify-content: space-between; color: rgb(var(--ch-cream) / var(--ed-alpha-meta)); font: var(--ed-fw-bold) var(--ed-len-12)/var(--ed-doc-lh) var(--font-headline); }
.ed-plot { display: block; width: var(--ed-full); height: auto; border: var(--ed-len-1) solid rgb(var(--ch-hotpink) / var(--ed-alpha-line));
  border-radius: var(--ed-radius-box); background: rgb(var(--ch-gunmetal) / var(--ed-alpha-fill)); }
.ed-plot__line { stroke: rgb(var(--ch-cream) / var(--ed-alpha-meta)); stroke-width: var(--ed-plot-line); stroke-dasharray: var(--ed-plot-dash); }
.ed-plot__label { fill: rgb(var(--ch-cream) / var(--ed-alpha-meta)); font: var(--ed-fw-black) var(--ed-plot-label) var(--font-headline); }
.ed-plot__dot { fill: rgb(var(--ch-hotpink)); stroke: rgb(var(--ch-cream)); stroke-width: var(--ed-plot-dot-line); }
.ed-score { margin: 0; color: rgb(var(--ch-cream)); font: var(--ed-fw-black) var(--ed-len-30)/var(--ed-h2-lh) var(--font-poster); }
.ed-score .ed-meta { font: var(--ed-fw-bold) var(--ed-len-16)/var(--ed-h2-lh) var(--font-headline); }
.ed-dial--intro { --ed-read: var(--ed-dial-read-intro); }
[data-ed-hold] .ed-dial { --ed-read: -90deg; }
.ed-dials-explain .ed-dials__stage, .ed-card .ed-dials__stage { grid-column: auto; }
.ed-dials-explain { display: grid; gap: var(--ed-len-16); align-items: center; }
@media (min-width: 768px) { .ed-dials-explain { grid-template-columns: repeat(var(--ed-grid-cols-tab), minmax(0, 1fr)); } }
.ed-results-grid { display: grid; gap: var(--ed-len-24); align-items: center; }
@media (min-width: 768px) { .ed-results-grid { grid-template-columns: repeat(var(--ed-grid-cols-tab), minmax(0, 1fr)); } }
.ed-facts { display: grid; gap: var(--ed-grid-gap); margin: 0; }
@media (min-width: 768px) { .ed-facts { grid-template-columns: repeat(var(--ed-grid-cols-desk), minmax(0, 1fr)); } }
.ed-facts dd { margin: var(--ed-len-4) 0 0; }

/* Script Swapper (interactive workplace rewrite toggle) */
.ed-swapper { display: flex; flex-direction: column; gap: var(--ed-len-16); }
.ed-swapper__nav { display: flex; flex-direction: column; gap: var(--ed-len-8); }
.ed-swapper__title-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--ed-len-8); }
.ed-swapper__panels { margin: 0; }
.ed-swapper.is-single .ed-swapper__panels { display: block; }
.ed-swapper.is-single .ed-swapper__card { width: var(--ed-full); }
.ed-swapper__card[hidden] { display: none; }
.ed-swapper__card-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--ed-len-8); }
.ed-swapper__card-foot { display: flex; align-items: center; justify-content: flex-end; margin-top: auto; padding-top: var(--ed-len-12); border-top: var(--ed-len-1) dashed rgb(var(--ch-cream) / var(--ed-alpha-line)); }
.ed-swapper__metrics-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--ed-len-8); }
.ed-tab.is-selected { border-color: rgb(var(--ch-hotpink)); background: rgb(var(--ch-hotpink)); color: rgb(var(--ch-stage)); }

/* Blister Pop art slots (js/blister-slots.js) on the dark stage; replaces blister-slots.css on migrated pages */
.bp-slot { position: relative; min-width: 0; max-width: var(--ed-full); margin: 0; }
.bp-slot[hidden], [data-bp-group][hidden] { display: none; }
.bp-slot img { display: block; width: var(--ed-full); height: auto; }
.bp-pack { overflow: hidden; border: var(--ed-len-1) solid rgb(var(--ch-hotpink) / var(--ed-alpha-line)); border-radius: var(--ed-radius-box); }
.bp-obj { width: min(var(--ed-full), var(--ed-art-w-obj)); }
.bp-set { display: flex; flex-direction: column; gap: var(--ed-len-8); min-width: 0; }
.bp-thumbs { display: grid; grid-template-columns: repeat(var(--ed-thumb-cols), minmax(0, 1fr)); gap: var(--ed-len-8); min-width: 0; }
.bp-card { width: min(var(--ed-full), var(--ed-art-w-card)); margin-inline: auto; }
.bp-sheet { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--ed-len-16); }
.bp-sheet .bp-pack { width: min(var(--ed-full), var(--ed-art-w-sheet)); }
.bp-aside { display: flex; justify-content: center; }
.bp-aside .bp-pack { width: min(var(--ed-full), var(--ed-art-w-card)); }

/* ==== phone band details (after the section rules they adjust); band padding is --ed-band-pad, never set per band here */
@media (max-width: 767px) {
  .ed-styles__head { margin-bottom: var(--ed-len-12); }
  .ed-dials__grid { row-gap: 0; }
  .ed-dials .ed-h2 { line-height: 0.85; }
  .ed-styles .ed-btn--outline, .ed-moments .ed-btn--outline { min-height: var(--ed-em-3); }
  .ed-get__grid { row-gap: var(--ed-len-12); }
  .ed-trustband .ed-ico { font-size: var(--ed-len-26); }
}

@media (prefers-reduced-motion: reduce) {
  .ed-page *, .ed-page *::before, .ed-page *::after { transition: none !important; scroll-behavior: auto !important; }
}