/* Ranking Drop Investigation: page-scoped styles.
   All selectors are prefixed .rdi- so nothing leaks into other pages.
   Foundation tokens and components are reused wherever they exist. */

/* ============================================================ 1. INK HERO */

.rdi-hero{
  background:var(--ink-deep);
  color:var(--on-ink);
  overflow:hidden;
  padding-bottom:var(--hero-foot);
}
.rdi-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(243,240,230,.045) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(243,240,230,.045) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%,#000 20%,transparent 78%);
          mask-image:radial-gradient(120% 90% at 50% 0%,#000 20%,transparent 78%);
}
.rdi-hero .brx-container{position:relative}

.rdi-hero .tag{
  border-color:var(--hair-strong);
  background:rgba(225,255,1,.10);
  color:var(--on-ink-label);
}
.rdi-hero .tag .dot{background:var(--ny)}

.rdi-h1{color:var(--wh);max-width:32ch}
/* the line under the headline is a pull-out: TT Lakes at heading size, one run */
.rdi-h1-sub{
  font-family:var(--serif);font-weight:400;
  font-size:var(--fs-h2);line-height:1.2;letter-spacing:-.012em;
  color:var(--on-ink-lead);max-width:none;margin:var(--s4) 0 0;
}
.rdi-hero .accent-bar{margin:var(--s5) 0 0}

.rdi-lead{color:var(--on-ink-lead);max-width:36ch;font-style:italic}
.rdi-micro{
  margin:var(--s3) 0 0;font-family:var(--mono);font-size:13px;
  letter-spacing:.06em;color:var(--on-ink-label);
}

/* ============================================================ 2. HERO CHART ISLAND */

.rdi-chart{
  margin:var(--s7) 0 0;
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  background:rgba(243,240,230,.035);
  overflow:hidden;
}
.rdi-chart-top{
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding:18px clamp(18px,2vw,26px);
  border-bottom:1px solid var(--line);
}
.rdi-chart-label{
  margin:0 0 6px;font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--on-ink-label);
}
.rdi-chart-title{
  margin:0;font-family:var(--sans);font-weight:400;font-size:var(--fs-h3);
  line-height:1.3;color:var(--wh);
}
.rdi-legend{display:flex;gap:20px;flex-wrap:wrap}
.rdi-legend-item{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--on-ink-label);
}
.rdi-sw{width:18px;height:3px;border-radius:var(--r-cell);flex:none;display:inline-block}
.rdi-sw--v{background:#E1FF01}
.rdi-sw--rd{background:linear-gradient(90deg,#B8D3D8 0 6px,transparent 6px 10px,#B8D3D8 10px 16px)}

.rdi-chart-plot{position:relative;overflow-x:auto;padding:10px clamp(10px,1.4vw,18px) 4px}
.rdi-chart-svg{display:block;width:100%;min-width:940px;height:auto}

.rdi-chart-svg .rdi-grid line{stroke:rgba(243,240,230,.10);stroke-width:1}
.rdi-chart-svg .rdi-axis{stroke:rgba(243,240,230,.32);stroke-width:1.4}
.rdi-chart-svg .rdi-tick text{font-family:var(--mono);font-size:12.5px;fill:var(--on-ink-label);font-variant-numeric:tabular-nums}
.rdi-chart-svg .rdi-tick--l text{text-anchor:end}
.rdi-chart-svg .rdi-tick--r text{text-anchor:start}
.rdi-chart-svg .rdi-tick--x text{letter-spacing:.12em}
.rdi-chart-svg .rdi-line{fill:none;stroke-linecap:round;stroke-linejoin:round}
.rdi-chart-svg .rdi-line--v{stroke:#E1FF01;stroke-width:2.6}
.rdi-chart-svg .rdi-line--rd{stroke:#B8D3D8;stroke-width:1.8;stroke-dasharray:6 5}
.rdi-chart-svg .rdi-area{fill:url(#rdiVisitsFill);stroke:none}
.rdi-chart-svg .rdi-dot--v{fill:#E1FF01;stroke:#20211F;stroke-width:2}
.rdi-chart-svg .rdi-dot--rd{fill:#B8D3D8;stroke:#20211F;stroke-width:1.5}
.rdi-chart-svg .rdi-anno{font-family:var(--mono);font-size:12px;letter-spacing:.1em}
.rdi-chart-svg .rdi-anno--v{fill:var(--surface)}
.rdi-chart-svg .rdi-anno--rd{fill:var(--bl)}
.rdi-chart-svg .rdi-mark-line{stroke:#E1FF01;stroke-width:1.4;stroke-dasharray:3 5;opacity:.7}
.rdi-chart-svg .rdi-mark-tag{fill:#E1FF01}
.rdi-chart-svg .rdi-mark-txt{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;fill:#20211F;font-weight:600}
.rdi-chart-svg .rdi-band{fill:transparent}
.rdi-chart-svg .rdi-band:hover{fill:rgba(243,240,230,.05)}
.rdi-chart-svg .rdi-dot--hot{fill:var(--wh);stroke:#E1FF01;stroke-width:2.5}

/* draw-in: only armed by JS, so the chart is complete without JS */
.rdi-chart[data-draw="armed"] .rdi-line--v,
.rdi-chart[data-draw="armed"] .rdi-line--rd{stroke-dashoffset:var(--rdi-len,0)}
.rdi-chart[data-draw="run"] .rdi-line--v,
.rdi-chart[data-draw="run"] .rdi-line--rd{stroke-dashoffset:0;transition:stroke-dashoffset 1.7s cubic-bezier(.32,.72,.28,1)}
.rdi-chart[data-draw="armed"] .rdi-area,
.rdi-chart[data-draw="armed"] .rdi-anno,
.rdi-chart[data-draw="armed"] .rdi-mark,
.rdi-chart[data-draw="armed"] .rdi-pts{opacity:0}
.rdi-chart[data-draw="run"] .rdi-area,
.rdi-chart[data-draw="run"] .rdi-anno,
.rdi-chart[data-draw="run"] .rdi-mark,
.rdi-chart[data-draw="run"] .rdi-pts{opacity:1;transition:opacity .7s ease}

.rdi-tip{
  position:absolute;z-index:3;pointer-events:none;
  min-width:190px;max-width:250px;padding:12px 14px;
  border:1px solid var(--hair-strong);border-radius:var(--r-sm);
  background:var(--ink-deep);box-shadow:var(--shadow-lift);
  transform:translate(-50%,-118%);
}
.rdi-tip p{margin:0;font-size:13px;line-height:1.45;color:var(--on-ink-lead)}
.rdi-tip .rdi-tip-m{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--on-ink-label);margin-bottom:8px}
.rdi-tip .rdi-tip-v,.rdi-tip .rdi-tip-r{display:flex;align-items:center;gap:9px}
.rdi-tip b{font-family:var(--head);font-size:15px;color:var(--wh);font-variant-numeric:tabular-nums}
.rdi-tip .rdi-tip-n{margin-top:8px;font-size:12.5px;color:var(--ny)}
.rdi-tip .rdi-tip-n:empty{display:none}

.rdi-keyfigs{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;
  background:rgba(243,240,230,.14);
  border-top:1px solid var(--line);
}
.rdi-keyfigs>div{background:var(--ink);padding:18px clamp(16px,1.8vw,22px)}
.rdi-keyfigs .v{
  display:block;font-family:var(--head);font-size:clamp(20px,2.2vw,26px);line-height:1;
  letter-spacing:-.02em;color:var(--ny);font-variant-numeric:tabular-nums;
}
.rdi-keyfigs .k{display:block;margin-top:9px;font-size:14px;line-height:1.45;color:var(--on-ink-lead)}
.rdi-chart-cap{
  margin:0;padding:14px clamp(18px,2vw,26px);
  border-top:1px solid var(--line);
  font-size:14px;line-height:1.5;color:var(--on-ink-label);
}

/* ============================================================ 3. SECTION 01 */

.rdi-two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,44px)}
.rdi-two-col .body{max-width:none}

/* ============================================================ 4. SCORED COMPARISON */

.rdi-vs{
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--bg);overflow:hidden;
}
.rdi-vs-head,.rdi-vs-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 178px minmax(0,1fr);
  align-items:stretch;
}
.rdi-vs-head{background:var(--surface);border-bottom:1px solid var(--line)}
.rdi-vs-col{
  margin:0;padding:15px 22px;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.16em;text-transform:uppercase;
}
.rdi-vs-col--them{color:var(--muted)}
.rdi-vs-col--us{
  color:var(--ink);background:rgba(225,255,1,.32);
  border-left:2px solid var(--ny);border-right:2px solid var(--ny);
}
.rdi-vs-spine{margin:0;grid-column:2}
.rdi-vs-rows{list-style:none;margin:0;padding:0}
.rdi-vs-row{border-bottom:1px solid var(--line)}
.rdi-vs-row:last-child{border-bottom:none}
.rdi-vs-dim{
  grid-column:2;order:2;margin:0;padding:18px 20px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink);text-align:center;
  border-left:1px solid var(--line);border-right:1px solid var(--line);
  background:var(--surface);
  display:flex;align-items:center;justify-content:center;
}
.rdi-vs-them,.rdi-vs-us{margin:0;padding:18px 22px;font-size:var(--fs-small);font-weight:300;line-height:1.5;display:flex;gap:11px;align-items:flex-start}
.rdi-vs-them{grid-column:1;order:1;color:var(--muted)}
.rdi-vs-us{
  grid-column:3;order:3;color:var(--ink);background:rgba(225,255,1,.12);
  border-left:2px solid var(--ny);border-right:2px solid var(--ny);
}
.rdi-vs-icon{
  flex:none;width:19px;height:19px;border-radius:50%;margin-top:2px;
  display:flex;align-items:center;justify-content:center;font-size:12px;line-height:1;
}
.rdi-vs-them .rdi-vs-icon{border:1px solid var(--hair-strong);color:var(--muted)}
.rdi-vs-us .rdi-vs-icon{background:var(--ink);color:var(--ny)}
.rdi-vs-score{display:grid;grid-template-columns:minmax(0,1fr) 178px minmax(0,1fr);border-top:1px solid var(--line)}
.rdi-vs-scorecell{padding:20px 22px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.rdi-vs-scorecell--them{grid-column:1;background:var(--surface)}
.rdi-vs-scorecell--us{
  grid-column:3;background:var(--ny);
  border-left:2px solid var(--ny);border-right:2px solid var(--ny);border-bottom:2px solid var(--ny);
}
.rdi-vs-scorev{font-family:var(--head);font-size:34px;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.rdi-vs-scorecell--them .rdi-vs-scorev{color:var(--muted)}
.rdi-vs-scoreof{font-size:20px;color:var(--ink)}
.rdi-vs-scorecell--us .rdi-vs-scoreof{color:rgba(42,43,41,.72)}
.rdi-vs-scorek{font-size:14px;line-height:1.45;max-width:24ch;color:var(--ink-soft)}
.rdi-vs-scorecell--them .rdi-vs-scorek{color:var(--muted)}

/* ============================================================ 5. ACTION PLAN (product UI) */

.rdi-plan{
  border:1px solid var(--hair-strong);border-radius:var(--r-md);
  background:var(--bg);overflow:hidden;
}
.rdi-plan-top{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:14px 20px;background:var(--ink);
}
.rdi-plan-label{
  margin:0;display:flex;align-items:center;gap:9px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#CFCABB;
}
.rdi-plan-dot{width:7px;height:7px;border-radius:50%;background:var(--ny);flex:none;animation:wl-pulse 2.4s ease-in-out infinite}
.rdi-plan .rdi-plan-note{margin:0;font-size:14px;line-height:1.45;color:var(--on-ink-label);max-width:52ch}
.rdi-plan-fields{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  padding:13px 20px;border-bottom:1px solid var(--line);background:var(--surface);
}
.rdi-plan-fields .k{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);margin-right:4px;
}
.rdi-plan-fields span.f{
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--ink-soft);
  border:1px solid var(--line);background:var(--bg);border-radius:var(--r-pill);padding:4px 11px;
}
.rdi-plan-rows{list-style:none;margin:0;padding:0}
.rdi-plan-row{
  display:grid;grid-template-columns:172px minmax(0,1fr);gap:clamp(16px,2vw,26px);
  padding:20px;border-bottom:1px solid var(--line);
  transition:background .25s;
}
.rdi-plan-row:last-child{border-bottom:none}
.rdi-plan-row:hover{background:var(--surface)}
.rdi-plan-meta{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.rdi-pri{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
  border-radius:var(--r-pill);padding:5px 12px;white-space:nowrap;border:1.5px solid transparent;
}
.rdi-pri--p1{background:var(--ink);color:var(--ny)}
.rdi-pri--p2{background:var(--ny);color:var(--ink)}
.rdi-pri--p3{background:var(--bl);color:var(--ink)}
.rdi-pri--p4{background:transparent;border-color:var(--hair-strong);color:var(--muted)}
.rdi-chip{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--line);background:var(--surface);border-radius:var(--r-xs);padding:4px 10px;color:var(--ink-soft);
  white-space:nowrap;
}
.rdi-chip--own{border-color:var(--hair-strong);color:var(--accent-dark)}
.rdi-plan .rdi-plan-act{margin:0 0 14px;font-size:var(--fs-body);line-height:1.45;color:var(--ink)}
.rdi-plan .rdi-plan-act b{font-weight:400;background:linear-gradient(transparent 62%,var(--ny) 62%);padding:0 .05em}
.rdi-url{
  font-family:var(--mono);font-size:14px;background:rgba(42,43,41,.06);
  border:1px solid var(--line);border-radius:var(--r-xs);padding:1px 7px;overflow-wrap:anywhere;
}
.rdi-plan-detail{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(16px,2vw,26px)}
.rdi-plan .rdi-plan-k{
  margin:0 0 5px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);
}
.rdi-plan .rdi-plan-v{margin:0;font-size:var(--fs-small);font-weight:300;line-height:1.55;color:var(--ink-soft)}
.rdi-tiers{
  list-style:none;margin:0;padding:18px 20px;display:grid;gap:10px;
  grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line);background:var(--surface);
}
.rdi-tiers li{display:flex;align-items:center;gap:12px;font-size:var(--fs-small);font-weight:300;line-height:1.45;color:var(--ink-soft)}
.rdi-tiers .rdi-pri{flex:none;min-width:104px;text-align:center}
.rdi-plan .rdi-plan-foot{
  margin:0;padding:0 20px 18px;background:var(--surface);max-width:none;
  font-size:14px;line-height:1.55;color:var(--muted);
}

/* ============================================================ 6. VAGUE TO ACTIONABLE */

.rdi-swap{display:grid;grid-template-columns:minmax(0,.72fr) 44px minmax(0,1fr);align-items:center;gap:0}
.rdi-swap-a,.rdi-swap-b{border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px;background:var(--bg)}
.rdi-swap-a{border-style:dashed;background:rgba(42,43,41,.03)}
.rdi-swap-b{border-color:var(--hair-strong);background:var(--surface);box-shadow:var(--shadow-hover)}
.rdi-swap .rdi-swap-k{margin:0 0 10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.rdi-swap-b .rdi-swap-k{color:var(--accent-dark)}
.rdi-swap .rdi-swap-t{margin:0;font-size:var(--fs-small);font-weight:300;line-height:1.6;color:var(--ink-soft)}
.rdi-swap-a .rdi-swap-t{font-family:var(--serif);font-weight:400;font-style:italic;font-size:var(--fs-h3);line-height:1.4;color:var(--muted)}
.rdi-swap .rdi-swap-arw{margin:0;text-align:center;font-family:var(--mono);font-size:18px;color:var(--accent-dark)}

/* ============================================================ 7. FIVE STEPS */

.rdi-steps.rdi-steps--gap{margin-top:var(--s7)}

.rdi-steps{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
}
.rdi-step{background:var(--bg);padding:clamp(22px,2.3vw,30px) clamp(18px,1.7vw,24px);transition:background .25s}
.rdi-step:hover{background:var(--surface)}
.rdi-step-bar{display:block;height:3px;border-radius:var(--r-pill);background:rgba(42,43,41,.10);position:relative;margin-bottom:20px;overflow:hidden}
.rdi-step-bar::after{content:"";position:absolute;top:0;bottom:0;left:0;background:var(--ny);border-radius:var(--r-pill)}
.rdi-step:nth-child(1) .rdi-step-bar::after{width:20%}
.rdi-step:nth-child(2) .rdi-step-bar::after{width:40%}
.rdi-step:nth-child(3) .rdi-step-bar::after{width:60%}
.rdi-step:nth-child(4) .rdi-step-bar::after{width:80%}
.rdi-step:nth-child(5) .rdi-step-bar::after{width:100%}
.rdi-step-n{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--accent-dark);margin-bottom:14px}
.rdi-step-h{margin:0 0 10px;letter-spacing:-.015em}
.rdi-step p{margin:0;font-size:var(--fs-small);font-weight:300;line-height:1.6;color:var(--ink-soft)}

/* ============================================================ 8. TEN-PHASE STEPPER */

.rdi-phases{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);overflow:hidden}
.rdi-phases-top{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:14px 22px;border-bottom:1px solid var(--line);background:var(--surface);
}
.rdi-phases .rdi-phases-label{margin:0;font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.rdi-phases .rdi-phases-count{margin:0;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--ink-soft)}
.rdi-phases-n{font-family:var(--head);font-size:16px;color:var(--ink);margin-right:4px}
.rdi-phase-list{list-style:none;margin:0;padding:0}
.rdi-phase{
  display:grid;grid-template-columns:72px minmax(0,1fr);
  border-bottom:1px solid var(--line);position:relative;
  padding:18px 22px 18px 0;
}
.rdi-phase:last-child{border-bottom:none}
.rdi-phase::before{
  content:"";position:absolute;left:37px;top:0;bottom:0;width:1px;
  background:var(--line);
}
.rdi-phase:first-child::before{top:32px}
.rdi-phase--last::before{bottom:auto;height:32px}
.rdi-phase-n{
  position:relative;z-index:1;justify-self:start;margin-left:22px;
  width:31px;height:31px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.02em;
  border:1px solid var(--hair-strong);background:var(--surface);color:var(--muted);
  transition:background .4s ease,color .4s ease,border-color .4s ease;
}
.rdi-phase[data-seen="true"] .rdi-phase-n{background:var(--ny);border-color:var(--ink);color:var(--ink)}
.rdi-phase-body{padding-top:3px}
.rdi-phases .rdi-phase-name{margin:0 0 7px;font-family:var(--sans);font-weight:400;font-size:var(--fs-h3);line-height:1.3;color:var(--ink)}
.rdi-phases .rdi-phase-txt{margin:0;font-size:var(--fs-small);font-weight:300;line-height:1.6;color:var(--ink-soft);max-width:74ch}
.rdi-phases .rdi-phase-ev{
  margin:11px 0 0;display:flex;gap:10px;flex-wrap:nowrap;align-items:flex-start;
  font-family:var(--mono);font-size:12.5px;line-height:1.5;color:var(--accent-dark);
}
.rdi-phases .rdi-phase-ev .k{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
  border:1px solid var(--line);border-radius:var(--r-pill);padding:3px 9px;flex:none;
}
/* reveal is armed by the island only when it can also release */
.rdi-phases[data-armed="true"] .rdi-phase{opacity:0;transform:translateY(14px)}
.rdi-phases[data-armed="true"] .rdi-phase[data-seen="true"]{
  opacity:1;transform:none;
  transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1);
}

/* ============================================================ 9. PROOF SECTION TEXTURE */

.rdi-proof{overflow:hidden}
.rdi-proof::before{
  content:"";position:absolute;z-index:0;pointer-events:none;
  top:-4%;right:-16%;width:min(720px,74%);aspect-ratio:1100/828;
  background:url(../img/ranking-drop-investigation/datamap-terrain.jpg) center/contain no-repeat;
  mix-blend-mode:multiply;opacity:.13;filter:blur(.6px);
  -webkit-mask-image:radial-gradient(60% 60% at 50% 50%,#000 25%,transparent 76%);
          mask-image:radial-gradient(60% 60% at 50% 50%,#000 25%,transparent 76%);
}
.rdi-proof .brx-container{position:relative;z-index:1}
.rdi-h2-sub{color:var(--ink-soft);margin-top:6px}

/* ============================================================ 10. OFFER BAND */

.rdi-offer .h2{max-width:30ch}
.rdi-offer .lead{color:var(--ink);max-width:68ch}
.rdi-offer-micro{margin:var(--s4) 0 0;font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--ink)}

/* ============================================================ 11. DELIVERABLE LIST */

.rdi-doc{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
}
.rdi-doc-item{
  background:var(--bg);padding:20px 22px;display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;
  transition:background .25s;
}
.rdi-doc-item:hover{background:var(--surface)}
.rdi-doc-n{
  font-family:var(--mono);font-size:11.5px;font-weight:600;color:var(--ink);
  border:1px solid var(--hair-strong);border-radius:var(--r-sm);
  width:34px;height:28px;display:flex;align-items:center;justify-content:center;
  background:rgba(225,255,1,.35);
}
.rdi-doc-item:last-child{grid-column:1 / -1}
.rdi-doc .rdi-doc-t{margin:0 0 7px;font-family:var(--sans);font-weight:400;font-size:var(--fs-h3);line-height:1.3;color:var(--ink)}
.rdi-doc .rdi-doc-b{margin:0;font-size:var(--fs-small);font-weight:300;line-height:1.6;color:var(--ink-soft)}

/* ============================================================ 12. CLOSE */

.rdi-close-sub{max-width:36ch}
/* the centred section rule auto-centres the capture heading block; keep it flush left */
.rdi-close .capture .h3{margin-left:0;margin-right:0}

/* ============================================================ 13. RESPONSIVE */

@media (max-width:1080px){
  .rdi-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rdi-keyfigs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rdi-vs-head,.rdi-vs-row,.rdi-vs-score{grid-template-columns:minmax(0,1fr) 140px minmax(0,1fr)}
}
@media (max-width:960px){
  .rdi-plan-row{grid-template-columns:minmax(0,1fr);gap:14px}
  .rdi-plan-meta{flex-direction:row;flex-wrap:wrap;align-items:center}
  .rdi-plan-detail{grid-template-columns:minmax(0,1fr);gap:16px}
  .rdi-swap{grid-template-columns:minmax(0,1fr);gap:14px}
  .rdi-swap-arw{transform:rotate(90deg);padding:2px 0}
  .rdi-doc{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:820px){
  .rdi-two-col{grid-template-columns:minmax(0,1fr)}
  .rdi-steps{grid-template-columns:minmax(0,1fr)}
  .rdi-tiers{grid-template-columns:minmax(0,1fr)}
  .rdi-vs-head{display:none}
  .rdi-vs-row,.rdi-vs-score{grid-template-columns:minmax(0,1fr)}
  .rdi-vs-dim{grid-column:1;order:1;justify-content:flex-start;text-align:left;border-left:none;border-right:none;border-bottom:1px solid var(--line);padding:13px 20px}
  .rdi-vs-them{grid-column:1;order:2;border-bottom:1px solid var(--line)}
  .rdi-vs-us{grid-column:1;order:3;border-left:none;border-right:none;border-top:2px solid var(--ny);border-bottom:2px solid var(--ny)}
  .rdi-vs-them::after,.rdi-vs-us::after{
    font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
    color:var(--muted);margin-left:auto;padding-left:12px;flex:none;
  }
  .rdi-vs-them::after{content:"Standard"}
  .rdi-vs-us::after{content:"WLDM"}
  .rdi-vs-scorecell--them,.rdi-vs-scorecell--us{grid-column:1}
  .rdi-vs-scorecell--us{border-left:none;border-right:none}
  .rdi-phase{grid-template-columns:56px minmax(0,1fr);padding-right:18px}
  .rdi-phase::before{left:29px}
  .rdi-phase-n{margin-left:14px}
  .rdi-chart-plot{padding-left:0;padding-right:0}
}
@media (max-width:560px){
  .rdi-phases .rdi-phase-ev{flex-direction:column;gap:6px}
  .rdi-phases .rdi-phase-ev .k{align-self:flex-start}
}
@media (max-width:480px){
  .rdi-phase{grid-template-columns:46px minmax(0,1fr);padding-right:14px}
  .rdi-phase::before{left:24px}
  .rdi-phase-n{margin-left:9px}
  .rdi-hero .btn-row .btn{width:100%;justify-content:center}
  .rdi-keyfigs{grid-template-columns:minmax(0,1fr)}
  .rdi-plan-row,.rdi-doc-item{padding:16px}
  .rdi-doc-item{grid-template-columns:minmax(0,1fr);gap:10px}
}

/* ============================================================ 14. MOTION AND PRINT */

@media (prefers-reduced-motion:reduce){
  .rdi-chart[data-draw]{--rdi-len:0}
  .rdi-chart[data-draw] .rdi-line--v,
  .rdi-chart[data-draw] .rdi-line--rd{stroke-dashoffset:0!important}
  .rdi-chart[data-draw] .rdi-area,
  .rdi-chart[data-draw] .rdi-anno,
  .rdi-chart[data-draw] .rdi-mark,
  .rdi-chart[data-draw] .rdi-pts{opacity:1!important}
  .rdi-phases[data-armed="true"] .rdi-phase{opacity:1;transform:none}
}
@media print{
  .rdi-proof::before,.rdi-hero::before,.rdi-tip{display:none!important}
  .rdi-hero{background:#EEEADE;color:#2A2B29}
  .rdi-chart[data-draw] .rdi-line--v,
  .rdi-chart[data-draw] .rdi-line--rd{stroke-dashoffset:0!important}
  .rdi-chart[data-draw] .rdi-area,
  .rdi-chart[data-draw] .rdi-anno,
  .rdi-chart[data-draw] .rdi-mark,
  .rdi-chart[data-draw] .rdi-pts{opacity:1!important}
  .rdi-phases[data-armed="true"] .rdi-phase{opacity:1!important;transform:none!important}
  .rdi-plan,.rdi-vs,.rdi-phases,.rdi-doc,.rdi-steps{break-inside:avoid}
}

/* ---------------------------------------------------------- dark section
   Section 3 runs on the ink ground, so the ink-coloured type flips. */
.brx-section--ink .rdi-phases-n,
.brx-section--ink .rdi-phases .rdi-phase-name{color:var(--on-ink)}