/* ==========================================================================
   RWANDA DIGITAL AI CATALOGUE — Site-Draft 2
   Design language: rigorous Bauhaus minimalism · Swiss grid · Inter
   Palette: Government of Rwanda blues (#00a1de / #003f82 / #001b3d) on
            white and cool neutral greys
   Standard HTML/CSS/JS — WordPress-compatible (all rules scoped .rw-*)
   ========================================================================== */

/* ------------------------------------------------------------------ tokens */
:root {
  --rw-font: Inter, "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;

  --rw-white: #ffffff;
  --rw-paper: #f6f8fa;
  --rw-mist: #eef2f5;
  --rw-ink: #001b3d;
  --rw-ink-soft: #33373d;
  --rw-body: #4c515a;
  --rw-gray: #878d97;
  --rw-gray-soft: #b6bac2;
  --rw-line: #e2e6ea;
  --rw-line-dark: #2a2d33;

  /* Government of Rwanda blue palette — "Branding Elements → Colors".
     Contrast contract (from the guideline's own swatches): these blues are
     FILLS. #00a1de carries BLACK text (#001b3d passes 5.8:1) and must never be
     paired with white; #003f82 is the primary and the only blue that is safe as
     small text on white (10.3:1). #001b3d is the dark-surface blue. */
  --rw-blue: #00a1de;        /* variation 1 — fills, marks, dark-surface accents */
  --rw-blue-deep: #003f82;   /* primary — text, links, borders, focus on light  */
  --rw-blue-ink: #001b3d;    /* variation 2 — dark surfaces, headings, buttons  */
  --rw-blue-mist: #eaf4fb;   /* pale wash for section bands and callouts        */

  --rw-max: 1560px;
  /* fixed chrome height — single source for the header row and every offset
     keyed to it (drawer, page hero, sticky TOC, scroll-margin, mobile hero).
     78-90px: +10px on the 68-80px it held before the Government attribution
     line joined the lockup. */
  --rw-header-h: clamp(4.875rem, 6vh, 5.625rem);
  --rw-pad: clamp(1.25rem, 4vw, 4.5rem);
  --rw-sec: clamp(5.5rem, 11vh, 9.5rem);

  --rw-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --rw-ease-soft: cubic-bezier(0.45, 0, 0.15, 1);
  --rw-dur: 0.85s;
}

/* ----------------------------------------------------------------- resets */
.rw-site,
.rw-site *,
.rw-site *::before,
.rw-site *::after { box-sizing: border-box; }

.rw-site {
  font-family: var(--rw-font);
  font-size: 100%;
  line-height: 1.72;
  color: var(--rw-body);
  background: var(--rw-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

html:has(body.rw-site) { scroll-behavior: smooth; }

body.rw-site {
  margin: 0;
  font-size: 1.0625rem;
  min-height: 100vh;
}

.rw-site img,
.rw-site video { display: block; max-width: 100%; }

.rw-site a { color: inherit; text-decoration: none; }

/* Specificity bridge — `.rw-site a` (0,1,1) beats single-class rules (0,1,0),
   which greyed out ANCHOR nav links ("Why Rwanda", "The AI Stack") and anchor
   buttons on dark chrome while their <button> siblings stayed white.
   These selectors restore the intended colors for <a> elements and preserve
   the solid-header + hover states. */
.rw-site a.rw-nav__link { color: rgba(255, 255, 255, 0.86); }
.rw-header.is-solid a.rw-nav__link { color: var(--rw-ink-soft); }
.rw-site a.rw-btn { color: var(--btn-fg); }
/* Every button hover slides the #00a1de fill in, and the guideline pairs that
   blue with dark text — so all three hover states resolve to ink, not white.
   (Anchor-specific: this selector outranks the single-class rules below.) */
.rw-site a.rw-btn:hover,
.rw-site a.rw-btn--light:hover,
.rw-site a.rw-btn--ink-ghost:hover { color: #001b3d; }

.rw-site ::selection { background: var(--rw-ink); color: var(--rw-white); }

/* accessibility */
.rw-skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--rw-ink); color: var(--rw-white);
  padding: 0.75rem 1.25rem; font-size: 0.8125rem; letter-spacing: 0.08em;
}
.rw-skip-link:focus { left: 0; }

.rw-site :focus-visible {
  outline: 2px solid var(--rw-blue-deep);
  outline-offset: 3px;
}

.rw-visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip: rect(0 0 0 0); clip-path: inset(50%);
  overflow: hidden; white-space: nowrap;
}

/* ------------------------------------------------------------ typography */
.rw-display {
  font-size: clamp(2.9rem, 6.4vw, 6.8rem);
  line-height: 1.0;
  letter-spacing: -0.028em;
  font-weight: 500;
  color: var(--rw-white);
  margin: 0;
  text-wrap: balance;
}

.rw-display--ink { color: var(--rw-ink); }

.rw-h1 {
  font-size: clamp(2.6rem, 5.2vw, 5rem);
  line-height: 1.02;
  letter-spacing: -0.026em;
  font-weight: 500;
  color: var(--rw-ink);
  margin: 0;
  text-wrap: balance;
}

.rw-h2 {
  font-size: clamp(1.9rem, 3.4vw, 3.4rem);
  line-height: 1.06;
  letter-spacing: -0.022em;
  font-weight: 500;
  color: var(--rw-ink);
  margin: 0;
  text-wrap: balance;
}

.rw-h3 {
  font-size: clamp(1.25rem, 1.9vw, 1.625rem);
  line-height: 1.22;
  letter-spacing: -0.012em;
  font-weight: 500;
  color: var(--rw-ink);
  margin: 0;
}

.rw-h4 {
  font-size: 1.0625rem;
  line-height: 1.35;
  letter-spacing: -0.008em;
  font-weight: 600;
  color: var(--rw-ink);
  margin: 0;
}

.rw-lead {
  font-size: clamp(1.125rem, 1.6vw, 1.375rem);
  line-height: 1.55;
  letter-spacing: -0.008em;
  color: var(--rw-ink-soft);
  margin: 0;
}

.rw-lead--light { color: rgba(255, 255, 255, 0.86); }

.rw-label {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--rw-gray);
  margin: 0;
}

.rw-label::before {
  content: "";
  width: 1.75rem; height: 1px;
  background: var(--rw-blue);
  flex: none;
}

.rw-label--plain::before { display: none; }

.rw-label--light { color: rgba(255, 255, 255, 0.66); }

.rw-small {
  font-size: 0.8125rem;
  line-height: 1.6;
  color: var(--rw-gray);
  margin: 0;
}

.rw-num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

em.rw-em { font-style: normal; color: var(--rw-blue-deep); }

/* --------------------------------------------------------------- layout */
.rw-container {
  width: 100%;
  max-width: var(--rw-max);
  margin-inline: auto;
  padding-inline: var(--rw-pad);
}

.rw-container--full { max-width: none; }

.rw-section { padding-block: var(--rw-sec); position: relative; }

.rw-section--paper { background: var(--rw-paper); }
.rw-section--mist { background: var(--rw-mist); }
.rw-section--ink { background: var(--rw-ink); color: rgba(255, 255, 255, 0.78); }
.rw-section--ink .rw-h2, .rw-section--ink .rw-h3 { color: var(--rw-white); }
.rw-section--wood { background: var(--rw-blue-mist); }

.rw-section--tight { padding-block: clamp(3.5rem, 7vh, 6rem); }

/* section head */
.rw-sec-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: clamp(2.75rem, 5vw, 4.5rem);
}

.rw-sec-head__left { max-width: 46rem; display: grid; gap: 1.5rem; }

.rw-sec-head__index {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--rw-gray-soft);
  white-space: nowrap;
  padding-bottom: 0.4rem;
}

.rw-rule {
  border: 0;
  border-top: 1px solid var(--rw-line);
  margin: 0;
}

.rw-section--ink .rw-rule { border-top-color: var(--rw-line-dark); }

/* --------------------------------------------------------------- header */
.rw-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 120;
  background: transparent;
  transition: background 0.45s var(--rw-ease-soft), border-color 0.45s var(--rw-ease-soft);
  border-bottom: 1px solid transparent;
}

.rw-header.is-solid {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom-color: var(--rw-line);
}

.rw-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  height: var(--rw-header-h);
}

/* logo */
.rw-logo {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  flex: none;
}

.rw-logo__mark { display: block; width: 30px; height: 30px; }
.rw-logo__mark circle, .rw-logo__mark rect, .rw-logo__mark polygon {
  transition: transform 0.6s var(--rw-ease);
}
.rw-logo:hover .rw-logo__mark circle { transform: translateX(-1px); }
.rw-logo:hover .rw-logo__mark polygon { transform: translateY(1px); }

.rw-logo__word { display: grid; line-height: 1.18; }
.rw-logo__top {
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--rw-white);
  text-transform: uppercase;
}
.rw-logo__sub {
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62);
}
.rw-header.is-solid .rw-logo__top { color: var(--rw-ink); }
.rw-header.is-solid .rw-logo__sub { color: var(--rw-gray); }

/* Government attribution — part of the lockup, so it rides along wherever the
   lockup appears (header, footer). #00a1de on the mark + currentColor on the
   triangle keeps the mark inside the blue palette on light and dark alike. */
.rw-logo__by {
  font-size: 0.5rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  white-space: nowrap;
}
.rw-header.is-solid .rw-logo__by { color: var(--rw-gray); }
/* the mark's square is currentColor at low opacity, so all three shapes resolve
   on both the dark hero/footer and the white header */
.rw-logo__mark rect { opacity: 0.42; }
/* keep the attribution inside the 320px header: at this size it is no wider
   than the "Digital AI Catalogue" strapline above it; the row height itself
   seats the third line via --rw-header-h (+10px) */
@media (max-width: 720px) {
  .rw-logo__by { font-size: 0.4375rem; letter-spacing: 0.01em; }
}

/* nav */
.rw-nav { display: flex; align-items: stretch; gap: 0.25rem; }

.rw-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  line-height: 1;   /* normalize anchors (inherit 1.72) vs buttons (normal) — fixes vertical misalignment */
  gap: 0.45rem;
  padding: 0.6rem 0.9rem;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.86);
  background: none;
  border: 0;
  font-family: inherit;
  cursor: pointer;
}

.rw-header.is-solid .rw-nav__link { color: var(--rw-ink-soft); }
/* the hover underline is the only hover cue, so it must clear 3:1 on white */
.rw-header.is-solid .rw-nav__link::after { background: var(--rw-blue-deep); }

.rw-nav__link::after {
  content: "";
  position: absolute;
  left: 0.9rem; right: 0.9rem; bottom: 0.25rem;
  height: 1px;
  background: var(--rw-blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.45s var(--rw-ease);
}
.rw-nav__link:hover::after,
.rw-nav__group.is-open > .rw-nav__link::after { transform: scaleX(1); }

.rw-nav__link svg { display: block; width: 9px; height: 9px; opacity: 0.6; transition: transform 0.35s var(--rw-ease); }
.rw-nav__group.is-open > .rw-nav__link svg { transform: rotate(180deg); }

.rw-nav__group { position: relative; }

/* dropdown */
.rw-dropdown {
  position: absolute;
  top: calc(100% + 0.5rem);
  left: 50%;
  translate: -50% 0;
  width: min(34rem, 92vw);
  background: var(--rw-white);
  border: 1px solid var(--rw-line);
  padding: 1rem 1.25rem 1.25rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.35s var(--rw-ease-soft), transform 0.35s var(--rw-ease-soft), visibility 0s 0.35s;
  box-shadow: 0 24px 60px -24px rgba(0, 27, 61, 0.22);
}
.rw-nav__group.is-open .rw-dropdown {
  opacity: 1; visibility: visible; transform: translateY(0);
  transition-delay: 0s;
}

.rw-dropdown__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0.15rem 1.5rem; }

.rw-dropdown__head {
  grid-column: 1 / -1;
  font-size: 0.625rem; font-weight: 700;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--rw-gray);
  padding: 0.5rem 0 0.65rem;
  border-bottom: 1px solid var(--rw-line);
  margin-bottom: 0.5rem;
}

.rw-dropdown__item {
  display: grid;
  grid-template-columns: 1.75rem 1fr;
  gap: 0.35rem 0.5rem;
  padding: 0.55rem 0.5rem;
  border-radius: 2px;
  transition: background 0.25s;
}
.rw-dropdown__item:hover { background: var(--rw-paper); }

.rw-dropdown__num {
  font-size: 0.6875rem; font-weight: 700;
  color: var(--rw-blue-deep);
  padding-top: 0.12rem;
}
.rw-dropdown__name {
  font-size: 0.875rem; font-weight: 600; color: var(--rw-ink); line-height: 1.3;
}
.rw-dropdown__desc {
  grid-column: 2;
  font-size: 0.75rem; line-height: 1.45; color: var(--rw-gray);
}

/* header actions */
.rw-header__actions { display: flex; align-items: center; gap: 1rem; }

.rw-lang { display: flex; gap: 0.35rem; align-items: center; }

.rw-lang__btn {
  font-family: inherit;
  background: none; border: 0; cursor: pointer;
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.55);
  padding: 0.25rem 0.2rem;
  transition: color 0.25s;
}
.rw-header.is-solid .rw-lang__btn { color: var(--rw-gray); }
.rw-lang__btn.is-active,
.rw-lang__btn:hover { color: var(--rw-blue); }
/* on the white header the bright blue is only 2.9:1 as text — swap to primary */
.rw-header.is-solid .rw-lang__btn.is-active,
.rw-header.is-solid .rw-lang__btn:hover { color: var(--rw-blue-deep); }
.rw-lang__sep { color: rgba(255, 255, 255, 0.35); font-size: 0.6875rem; }
.rw-header.is-solid .rw-lang__sep { color: var(--rw-gray-soft); }

/* solid-header CTA: ghost button inverts to ink so it stays visible on white */
.rw-header.is-solid .rw-header__cta {
  --btn-fg: var(--rw-ink);
  color: var(--rw-ink);
  border-color: rgba(0, 27, 61, 0.32);
}
.rw-header.is-solid .rw-header__cta:hover {
  color: var(--rw-blue-ink);
  border-color: var(--rw-blue-ink);
}

/* burger */
.rw-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px; height: 44px;
  padding: 10px;
  background: none; border: 0; cursor: pointer;
}
.rw-burger span {
  display: block; height: 1.5px;
  background: var(--rw-white);
  transition: transform 0.4s var(--rw-ease), opacity 0.3s, background 0.3s;
}
.rw-header.is-solid .rw-burger span,
.rw-drawer.is-open ~ * .rw-burger span { background: var(--rw-ink); }
.rw-burger.is-active span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.rw-burger.is-active span:nth-child(2) { opacity: 0; }
.rw-burger.is-active span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* drawer (mobile) */
.rw-drawer {
  position: fixed;
  inset: 0;
  z-index: 110;
  background: var(--rw-white);
  padding: calc(var(--rw-header-h) + 2rem) var(--rw-pad) 3rem;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-1.5rem);
  transition: opacity 0.45s var(--rw-ease-soft), transform 0.45s var(--rw-ease-soft), visibility 0s 0.45s;
}
.rw-drawer.is-open {
  opacity: 1; visibility: visible; transform: translateY(0);
  transition-delay: 0s;
}

.rw-drawer__group { border-bottom: 1px solid var(--rw-line); }
.rw-drawer__toggle {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.1rem 0;
  background: none; border: 0; cursor: pointer;
  font-family: inherit;
  font-size: 1.375rem; font-weight: 500; letter-spacing: -0.015em;
  color: var(--rw-ink);
}
.rw-drawer__toggle svg { width: 12px; height: 12px; transition: transform 0.35s var(--rw-ease); }
.rw-drawer__group.is-open .rw-drawer__toggle svg { transform: rotate(180deg); }

.rw-drawer__panel {
  display: grid; grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s var(--rw-ease);
}
.rw-drawer__group.is-open .rw-drawer__panel { grid-template-rows: 1fr; }
.rw-drawer__panel-inner { overflow: hidden; }
.rw-drawer__panel a {
  display: flex; gap: 0.9rem; align-items: baseline;
  padding: 0.5rem 0;
  font-size: 1rem; color: var(--rw-body);
}
.rw-drawer__panel a b { font-size: 0.6875rem; color: var(--rw-blue-deep); font-weight: 700; }

.rw-drawer__cta { margin-top: 2rem; }

/* ---------------------------------------------------------------- buttons */
.rw-btn {
  --btn-bg: var(--rw-ink);
  --btn-fg: var(--rw-white);
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 1rem 1.75rem;
  background: var(--btn-bg);
  color: var(--btn-fg);
  border: 1px solid var(--btn-bg);
  font-family: inherit;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  overflow: hidden;
  transition: color 0.4s var(--rw-ease-soft), border-color 0.4s;
}

.rw-btn::before {
  content: "";
  position: absolute; inset: 0;
  background: var(--rw-blue);
  transform: translateY(101%);
  transition: transform 0.5s var(--rw-ease);
  z-index: 0;
}
.rw-btn:hover::before { transform: translateY(0); }
.rw-btn > * { position: relative; z-index: 1; }

/* The hover fill is #00a1de, which the guideline pairs with BLACK text
   ("HEX over Background #000000"): white on bright blue is only 2.9:1, while
   navy #001b3d on it is 5.8:1. This rule must outrank every variant below. */
.rw-btn:hover { color: var(--rw-blue-ink); }

.rw-btn__arrow { display: inline-block; transition: transform 0.4s var(--rw-ease); }
.rw-btn:hover .rw-btn__arrow { transform: translateX(4px); }

.rw-btn--ghost {
  --btn-bg: transparent;
  --btn-fg: var(--rw-white);
  color: #ffffff;            /* hardening: direct white for transparent variants */
  border-color: rgba(255, 255, 255, 0.4);
}
.rw-btn--ghost:hover { border-color: var(--rw-blue); }

.rw-btn--ink-ghost {
  --btn-bg: transparent;
  --btn-fg: var(--rw-ink);
  border-color: rgba(0, 27, 61, 0.28);
}
.rw-btn--ink-ghost:hover { color: var(--rw-blue-ink); }

.rw-btn--light {
  --btn-bg: var(--rw-white);
  --btn-fg: var(--rw-ink);
  color: #001b3d;            /* hardening: direct ink — never white-on-white even if a var fails */
  border-color: var(--rw-white);
}
.rw-btn--light::before { background: var(--rw-blue); }
.rw-btn--light:hover { color: #001b3d; }   /* sits on the #00a1de fill — see the rule above */

.rw-textlink {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rw-ink);
  border-bottom: 1px solid var(--rw-blue-deep);
  padding-bottom: 0.3rem;
}
.rw-textlink svg { width: 13px; height: 13px; transition: transform 0.4s var(--rw-ease); }
.rw-textlink:hover svg { transform: translateX(4px); }

.rw-textlink--light { color: var(--rw-white); }

/* ----------------------------------------------------------------- hero */
.rw-hero {
  position: relative;
  /* fixed-stage hero: 750px total, inclusive of the floating header zone and
     the control bar (both live inside/over the hero box). Header height rides
     --rw-header-h; the stage itself stays a constant 750px on every screen. */
  height: 750px;
  min-height: 720px;
  touch-action: pan-y;  /* vertical scroll stays native; horizontal swipes drive the carousel */
  overflow: hidden;
  background: var(--rw-ink);
  cursor: grab;
}
.rw-hero.is-dragging { cursor: grabbing; }

.rw-hero__track {
  display: flex;
  height: 100%;
  transition: transform 1.05s var(--rw-ease);
  will-change: transform;
}
.rw-hero.is-animating .rw-hero__track { transition: transform 1.05s var(--rw-ease); }
.rw-hero:not(.is-animating) .rw-hero__track { transition: none; }

.rw-hero__slide {
  position: relative;
  flex: 0 0 100%;
  height: 100%;
  overflow: hidden;
}

.rw-hero__media,
.rw-hero__media video,
.rw-hero__media img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}

.rw-hero__media::after {
  content: "";
  position: absolute; inset: 0;
  background:
    /* header-zone scrim — guarantees contrast for the floating transparent header
       on bright slides/posters; fades out by a third of the slide height */
    linear-gradient(to bottom, rgba(0, 12, 28, 0.78) 0%, rgba(0, 12, 28, 0.30) 14%, rgba(0, 12, 28, 0) 32%),
    linear-gradient(to top, rgba(0, 12, 28, 0.82) 0%, rgba(0, 12, 28, 0.25) 46%, rgba(0, 12, 28, 0.38) 100%),
    linear-gradient(to right, rgba(0, 12, 28, 0.5), transparent 62%);
}

.rw-hero__slide .rw-hero__media {
  transform: scale(1.08);
  transition: transform 6.5s linear;
}
.rw-hero__slide.is-active .rw-hero__media { transform: scale(1); }

.rw-hero__content {
  position: absolute;
  inset: auto 0 0 0;
  z-index: 3;
  /* fixed 750px stage: clearance above the control bar (60-72px). +25px on
     2026-09-10 — the CTAs sat too close to the navigation strip. */
  padding-bottom: calc(4.75rem + 25px);
}

.rw-hero__content .rw-container {
  display: grid;
  justify-items: start;
  gap: 1.5rem;  /* fixed stage — the old vh-keyed rhythm no longer applies */
  max-width: var(--rw-max);
}

.rw-hero__headline { max-width: 15ch; }

.rw-hero__sub {
  max-width: 44rem;
  font-size: clamp(1rem, 1.35vw, 1.1875rem);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.82);
  margin: 0;
}

.rw-hero__ctas { display: flex; flex-wrap: wrap; gap: 0.9rem; }
/* 141px = the accidental 188px SVG-inflated height minus 25% (Ken 2026-09-10).
   The arrow needs an explicit size: unconstrained, an SVG flex-stretches and
   re-inflates the buttons (same bug the ≤720px block caps). */
.rw-hero__ctas .rw-btn { height: 141px; padding: 1.25rem 1.75rem; }
.rw-hero__ctas .rw-btn svg { height: 6.5rem; width: auto; flex: none; }

/* hero control bar */
.rw-hero__bar {
  position: absolute;
  z-index: 4;
  left: 0; right: 0; bottom: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(0, 12, 28, 0.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.rw-hero__bar-inner {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 1.5rem;
  height: clamp(3.75rem, 6.5vh, 4.5rem);
}

.rw-hero__captions {
  display: flex;
  align-items: center;
  gap: 2.25rem;
  overflow: hidden;
  min-width: 0;
}

.rw-hero__cap {
  display: grid;
  gap: 0.15rem;
  opacity: 0.38;
  transition: opacity 0.5s var(--rw-ease-soft);
  white-space: nowrap;
}
.rw-hero__cap.is-active { opacity: 1; }

.rw-hero__cap b {
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--rw-white);
}
.rw-hero__cap span {
  font-size: 0.6875rem; letter-spacing: 0.05em;
  color: rgba(255, 255, 255, 0.55);
}

.rw-hero__counter {
  display: flex; align-items: center;
  font-size: 0.75rem; font-weight: 600;
  letter-spacing: 0.12em;
  color: rgba(255, 255, 255, 0.75);
  gap: 0.3rem;
}
.rw-hero__counter b { color: var(--rw-white); font-weight: 700; }

.rw-hero__nav { display: flex; align-items: stretch; }

.rw-hero__arrow {
  width: clamp(3.25rem, 5vw, 4.25rem);
  display: grid; place-items: center;
  background: none; border: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.16);
  color: var(--rw-white);
  cursor: pointer;
  transition: background 0.35s;
}
.rw-hero__arrow:hover { background: rgba(255, 255, 255, 0.08); }
.rw-hero__arrow svg { width: 16px; height: 16px; }

/* progress segments */
.rw-hero__progress {
  position: absolute;
  z-index: 5;
  left: 0; right: 0;
  top: -1px;
  display: flex;
  gap: 3px;
  height: 2px;
}

.rw-hero__seg {
  flex: 1;
  background: rgba(255, 255, 255, 0.22);
  position: relative;
  overflow: hidden;
}
.rw-hero__seg i {
  position: absolute; inset: 0;
  background: var(--rw-blue);
  transform: scaleX(0);
  transform-origin: left;
}
.rw-hero.is-playing .rw-hero__seg.is-active i {
  transform: scaleX(var(--seg-progress, 0));
  transition: none;
}

/* scroll cue */
.rw-hero__cue {
  position: absolute;
  z-index: 4;
  right: var(--rw-pad);
  bottom: clamp(5.5rem, 12vh, 8.5rem);
  display: grid;
  justify-items: center;
  gap: 0.7rem;
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}
.rw-hero__cue::after {
  content: "";
  width: 1px; height: 3.25rem;
  background: linear-gradient(rgba(255,255,255,0.6), transparent);
  animation: rw-cue 2.2s var(--rw-ease-soft) infinite;
}
@keyframes rw-cue {
  0% { transform: scaleY(0); transform-origin: top; }
  45% { transform: scaleY(1); transform-origin: top; }
  55% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

/* ------------------------------------------------------------- stat strip */
.rw-stats { border-top: 1px solid var(--rw-line); border-bottom: 1px solid var(--rw-line); }

.rw-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.rw-stat {
  padding: clamp(1.75rem, 3vw, 2.75rem) clamp(1.25rem, 2vw, 2rem);
  border-left: 1px solid var(--rw-line);
  display: grid;
  gap: 0.4rem;
}
.rw-stat:first-child { border-left: 0; }

.rw-stat__value {
  font-size: clamp(2.1rem, 3.4vw, 3.2rem);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--rw-ink);
}
.rw-stat__value sup {
  font-size: 0.45em; font-weight: 600;
  color: var(--rw-blue-deep); margin-left: 0.1em;
}
.rw-stat__label {
  font-size: 0.75rem; line-height: 1.45;
  letter-spacing: 0.04em;
  color: var(--rw-gray);
}

/* ------------------------------------------------------------- numbered grid (why rwanda) */
.rw-why {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--rw-line);
  border-left: 1px solid var(--rw-line);
}

.rw-why__cell {
  position: relative;
  padding: clamp(1.75rem, 2.6vw, 2.75rem);
  border-right: 1px solid var(--rw-line);
  border-bottom: 1px solid var(--rw-line);
  background: var(--rw-white);
  display: grid;
  gap: 1.1rem;
  align-content: start;
  min-height: 16rem;
  transition: background 0.5s var(--rw-ease-soft);
  overflow: hidden;
}
.rw-why__cell:hover { background: var(--rw-paper); }

.rw-why__num {
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.14em; color: var(--rw-blue-deep);
}

.rw-why__cell p { margin: 0; font-size: 0.9375rem; line-height: 1.65; color: var(--rw-body); }

.rw-why__glyph {
  position: absolute;
  right: clamp(1.25rem, 2vw, 2rem);
  bottom: clamp(1.25rem, 2vw, 2rem);
  width: 14px; height: 14px;
  opacity: 0.85;
}
.rw-why__glyph--circ { border-radius: 50%; background: var(--rw-gray-soft); }
.rw-why__glyph--sq { background: var(--rw-blue); }
.rw-why__glyph--tri {
  width: 0; height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 14px solid var(--rw-ink);
}

/* ------------------------------------------------------------ pathways */
.rw-paths {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.5rem, 2.5vw, 2.5rem);
}

.rw-path-card {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  background: var(--rw-ink);
  color: var(--rw-white);
  overflow: hidden;
  min-height: clamp(30rem, 52vh, 40rem);
  isolation: isolate;
}

.rw-path-card__media {
  position: absolute; inset: 0;
  z-index: -1;
}
.rw-path-card__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(0.82) contrast(1.02);
  transform: scale(1.02);
  transition: transform 1.4s var(--rw-ease), filter 1.4s var(--rw-ease);
}
.rw-path-card:hover .rw-path-card__media img { transform: scale(1.07); filter: saturate(1) contrast(1.05); }
.rw-path-card__media::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,12,28,0.92) 12%, rgba(0,12,28,0.32) 62%, rgba(0,12,28,0.18));
}

.rw-path-card__head {
  padding: clamp(1.75rem, 3vw, 2.5rem);
  display: grid; gap: 1rem;
  align-self: start;
}

.rw-path-card__index {
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.16em; color: var(--rw-blue);
}

/* These cards are dark photo surfaces and set their own colour to white, but the
   .rw-h2 utility forces ink and beat the inherited colour — leaving the heading
   dark over the bright part of the photograph. Restore the intended white. */
.rw-path-card .rw-h2 { color: var(--rw-white); }

.rw-path-card__body { padding: 0 clamp(1.75rem, 3vw, 2.5rem); align-self: end; display: grid; gap: 1.75rem; }

.rw-path-card__q { font-style: italic; color: rgba(255,255,255,0.62); font-size: 1rem; margin: 0; }

.rw-path-card__list { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 0; padding: 0; list-style: none; }

.rw-path-card__list li {
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  border: 1px solid rgba(255,255,255,0.28);
  padding: 0.45rem 0.8rem;
  transition: background 0.35s, border-color 0.35s;
}
.rw-path-card:hover .rw-path-card__list li { border-color: rgba(255,255,255,0.42); }
.rw-path-card__list li:hover { background: rgba(255,255,255,0.1); }

.rw-path-card__foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: clamp(1.5rem, 2.5vw, 2rem) clamp(1.75rem, 3vw, 2.5rem);
  border-top: 1px solid rgba(255,255,255,0.16);
}

/* brand hover affordance — signals the whole card is interactive. These sit on
   the dark photo overlay, so they take the bright blue, not the primary. */
.rw-path-card__foot span,
.rw-path-card__foot svg { transition: color .3s var(--rw-ease), transform .45s var(--rw-ease); }
.rw-path-card:hover .rw-path-card__foot span { color: var(--rw-blue); }
.rw-path-card:hover .rw-path-card__foot svg { color: var(--rw-blue); transform: translateX(8px); }

/* ----------------------------------------------------------------- stack */
.rw-stack { display: grid; gap: 0; border-top: 1px solid var(--rw-line); }

.rw-layer {
  position: relative;
  display: grid;
  grid-template-columns: 5.5rem minmax(11rem, 17rem) 1fr;
  gap: clamp(1rem, 2.5vw, 2.5rem);
  align-items: baseline;
  padding: clamp(1.35rem, 2.4vw, 1.9rem) clamp(0.5rem, 1vw, 1.25rem);
  border-bottom: 1px solid var(--rw-line);
  background: var(--rw-white);
  transition: background 0.45s var(--rw-ease-soft), padding-left 0.45s var(--rw-ease-soft);
}
.rw-layer:hover { background: var(--rw-paper); padding-left: clamp(1.25rem, 2vw, 2rem); }

.rw-layer__lvl {
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.16em; color: var(--rw-gray);
}
.rw-layer:hover .rw-layer__lvl { color: var(--rw-blue-deep); }

.rw-layer__name {
  font-size: clamp(1.25rem, 2vw, 1.625rem);
  font-weight: 500; letter-spacing: -0.015em;
  color: var(--rw-ink);
}

.rw-layer__what { font-size: 0.9375rem; line-height: 1.65; color: var(--rw-body); }

.rw-layer__bar {
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--rw-blue);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.5s var(--rw-ease);
}
.rw-layer:hover .rw-layer__bar { transform: scaleY(1); }

/* --------------------------------------------------------- participate rows */
.rw-modes { border-top: 1px solid var(--rw-line); }

.rw-mode {
  display: grid;
  grid-template-columns: 6.5rem 1fr 2.5rem;
  gap: clamp(1rem, 3vw, 3rem);
  align-items: center;
  padding: clamp(1.5rem, 2.6vw, 2.1rem) 0;
  border-bottom: 1px solid var(--rw-line);
  transition: padding-left 0.45s var(--rw-ease-soft);
}
.rw-mode:hover { padding-left: clamp(0.75rem, 1.5vw, 1.5rem); }

.rw-mode__num {
  font-size: clamp(1.5rem, 2.6vw, 2.25rem);
  font-weight: 500; letter-spacing: -0.02em;
  color: var(--rw-gray-soft);
  transition: color 0.4s;
}
.rw-mode:hover .rw-mode__num { color: var(--rw-blue-deep); }

.rw-mode__body { display: grid; gap: 0.35rem; }
.rw-mode__body p { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--rw-body); max-width: 56rem; }

.rw-mode__arrow { width: 20px; height: 20px; justify-self: end; color: var(--rw-gray-soft); transition: transform 0.45s var(--rw-ease), color 0.3s; }
.rw-mode:hover .rw-mode__arrow { transform: translateX(6px); color: var(--rw-ink); }

/* ------------------------------------------------------------- archetypes */
.rw-audience {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-left: 1px solid var(--rw-line);
  border-top: 1px solid var(--rw-line);
}
.rw-audience__cell {
  padding: clamp(1.5rem, 2.2vw, 2.25rem) clamp(1.15rem, 1.8vw, 1.75rem);
  border-right: 1px solid var(--rw-line);
  border-bottom: 1px solid var(--rw-line);
  display: grid;
  gap: 0.9rem;
  align-content: start;
  background: var(--rw-white);
  transition: background 0.45s var(--rw-ease-soft);
}
.rw-audience__cell:hover { background: var(--rw-mist); }
.rw-audience__cell p { margin: 0; font-size: 0.875rem; line-height: 1.6; color: var(--rw-body); }
.rw-audience__cell .rw-h4 { min-height: 2.7em; }

/* --------------------------------------------------------------- journey */
.rw-journey { position: relative; overflow: hidden; background: var(--rw-ink); }

.rw-journey__bg {
  position: absolute; inset: -12% 0;
  z-index: 0;
}
.rw-journey__bg img {
  width: 100%; height: 100%; object-fit: cover;
  filter: saturate(0.35) brightness(0.55) contrast(1.05);
}
.rw-journey__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(0,12,28,0.9), rgba(0,12,28,0.55));
}

.rw-journey__inner { position: relative; z-index: 1; }

.rw-journey__steps {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.25rem;
  margin: 0 0 2.5rem;
  padding: 0;
  list-style: none;
}
.rw-journey__steps li {
  font-size: 0.8125rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(255,255,255,0.9);
  display: inline-flex; align-items: center; gap: 1.25rem;
}
.rw-journey__steps li:not(:last-child)::after {
  content: "";
  width: 2.5rem; height: 1px;
  background: var(--rw-blue);
}

/* ----------------------------------------------------------- page (child) */
.rw-page-hero {
  position: relative;
  padding-top: calc(var(--rw-header-h) + clamp(3.5rem, 8vh, 6.5rem));
  padding-bottom: clamp(3.5rem, 8vh, 6rem);
  overflow: hidden;
  background: var(--rw-paper);
  border-bottom: 1px solid var(--rw-line);
}

.rw-crumb {
  display: flex; flex-wrap: wrap; gap: 0.6rem;
  font-size: 0.6875rem; font-weight: 600;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--rw-gray);
  margin-bottom: clamp(2rem, 4vh, 3rem);
}
.rw-crumb a { transition: color 0.3s; }
.rw-crumb a:hover { color: var(--rw-blue-deep); }
.rw-crumb span { color: var(--rw-line); }
.rw-crumb em { font-style: normal; color: var(--rw-ink); }

.rw-page-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: end;
}

.rw-page-hero__tag {
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 1.55;
  letter-spacing: -0.008em;
  color: var(--rw-ink-soft);
  max-width: 34rem;
  margin: clamp(1.25rem, 2.5vh, 1.75rem) 0 0;
}

.rw-page-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: clamp(1.5rem, 3vh, 2rem);
  padding: 0; list-style: none;
}
.rw-page-hero__meta li {
  font-size: 0.625rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--rw-gray);
  border: 1px solid var(--rw-line);
  background: var(--rw-white);
  padding: 0.4rem 0.7rem;
}

.rw-page-hero__media {
  position: relative;
  aspect-ratio: 4 / 3.4;
  overflow: hidden;
}
.rw-page-hero__media img {
  width: 100%; height: 100%; object-fit: cover;
  filter: saturate(0.85);
  transition: transform 1.6s var(--rw-ease);
}
.rw-page-hero__media:hover img { transform: scale(1.045); }

.rw-page-hero__badge {
  position: absolute;
  left: 0; bottom: 0;
  background: var(--rw-ink);
  color: var(--rw-white);
  font-size: 0.625rem; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  padding: 0.75rem 1rem;
  display: inline-flex; align-items: center; gap: 0.6rem;
}
.rw-page-hero__badge::before {
  content: "";
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--rw-blue);
}

/* child page body with sticky toc */
.rw-body-grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 9fr);
  gap: clamp(2.5rem, 5vw, 5.5rem);
  align-items: start;
}

.rw-toc {
  position: sticky;
  top: calc(var(--rw-header-h) + 1.5rem);
  display: grid;
  gap: 0.1rem;
  border-left: 1px solid var(--rw-line);
  padding-left: 1.25rem;
}
.rw-toc__title {
  font-size: 0.625rem; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--rw-gray);
  margin-bottom: 0.75rem;
}
.rw-toc a {
  position: relative;
  display: grid;
  grid-template-columns: 1.75rem 1fr;
  gap: 0.4rem;
  font-size: 0.8125rem; line-height: 1.45;
  color: var(--rw-gray);
  padding: 0.32rem 0;
  transition: color 0.3s;
}
.rw-toc a b { font-weight: 700; font-size: 0.6875rem; color: var(--rw-gray-soft); padding-top: 0.1rem; }
.rw-toc a::before {
  content: "";
  position: absolute;
  left: -1.25rem; top: 0; bottom: 0;
  width: 1px;
  background: var(--rw-blue);
  transform: scaleY(0);
  transition: transform 0.4s var(--rw-ease);
}
.rw-toc a:hover { color: var(--rw-ink); }
.rw-toc a.is-active { color: var(--rw-ink); }
.rw-toc a.is-active b { color: var(--rw-blue-deep); }
.rw-toc a.is-active::before { transform: scaleY(1); }

/* narrative blocks */
.rw-block {
  display: grid;
  gap: clamp(1.5rem, 3vh, 2.25rem);
  padding-block: clamp(2.75rem, 6vh, 4.5rem);
  border-top: 1px solid var(--rw-line);
  scroll-margin-top: calc(var(--rw-header-h) + 1.5rem);
}
.rw-block:first-child { border-top: 0; padding-top: 0; }

.rw-block__head { display: flex; align-items: baseline; gap: 1.25rem; }
.rw-block__num {
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.14em; color: var(--rw-blue-deep);
}
.rw-block__title { font-size: clamp(1.35rem, 2.1vw, 1.875rem); }

.rw-block p { max-width: 62rem; margin: 0 0 1.1rem; }
.rw-block p:last-child { margin-bottom: 0; }

.rw-block strong { color: var(--rw-ink); font-weight: 600; }

.rw-cols-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.5rem, 3vw, 3rem);
}
.rw-cols-2 h4 {
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--rw-gray);
  margin: 0 0 1rem;
}

.rw-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.rw-checklist li {
  position: relative;
  padding-left: 1.4rem;
  font-size: 0.9375rem; line-height: 1.55;
}
.rw-checklist li::before {
  content: "";
  position: absolute; left: 0; top: 0.62em;
  width: 7px; height: 7px;
  background: var(--rw-blue);
}
.rw-checklist li:nth-child(3n)::before { border-radius: 50%; }
.rw-checklist li:nth-child(3n+1)::before {
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  width: 8px; height: 7px; top: 0.66em;
}

/* chips (investment opportunity) */
.rw-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.rw-chips li {
  font-size: 0.8125rem; font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--rw-ink-soft);
  background: var(--rw-white);
  border: 1px solid var(--rw-line);
  padding: 0.55rem 0.95rem;
  transition: border-color 0.3s, background 0.3s, transform 0.3s var(--rw-ease);
}
.rw-chips li:hover {
  border-color: var(--rw-blue);
  background: var(--rw-blue-mist);
  transform: translateY(-2px);
}

.rw-subhead {
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--rw-blue-deep);
  margin: 2rem 0 0.9rem;
}
.rw-subhead:first-child { margin-top: 0; }

/* note / callout */
.rw-note {
  border-left: 2px solid var(--rw-blue);
  background: var(--rw-blue-mist);
  padding: 1.25rem 1.5rem;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--rw-ink-soft);
  max-width: 46rem;
}
.rw-note b { color: var(--rw-ink); }

/* readiness journey graphic */
.rw-journey-graphic {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid var(--rw-line);
  background: var(--rw-white);
}
.rw-jstep {
  padding: clamp(1.5rem, 2.4vw, 2.25rem);
  border-left: 1px solid var(--rw-line);
  display: grid;
  gap: 0.7rem;
  position: relative;
  transition: background 0.45s var(--rw-ease-soft);
}
.rw-jstep:first-child { border-left: 0; }
.rw-jstep:hover { background: var(--rw-paper); }

.rw-jstep__stage {
  font-size: 0.625rem; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--rw-blue-deep);
}
.rw-jstep__dot {
  width: 10px; height: 10px;
  background: var(--rw-ink);
}
.rw-jstep:nth-child(2) .rw-jstep__dot { border-radius: 50%; background: var(--rw-blue); }
.rw-jstep:nth-child(3) .rw-jstep__dot {
  clip-path: polygon(50% 0, 100% 100%, 0 100%); background: var(--rw-gray);
}
.rw-jstep:nth-child(4) .rw-jstep__dot { background: var(--rw-ink); transform: rotate(45deg) scale(0.9); }
.rw-jstep p { margin: 0; font-size: 0.8125rem; line-height: 1.55; color: var(--rw-body); }

/* cross-link bands */
.rw-xband { background: var(--rw-ink); color: rgba(255,255,255,0.75); }

.rw-xband__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding-block: clamp(2.25rem, 4.5vh, 3.25rem);
}

.rw-xband__label {
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  display: grid; gap: 0.6rem;
}

.rw-xband__links { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.rw-xpill {
  display: inline-flex; align-items: center; gap: 0.55rem;
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--rw-white);
  border: 1px solid rgba(255,255,255,0.28);
  padding: 0.65rem 1.1rem;
  transition: background 0.35s, border-color 0.35s;
}
.rw-xpill:hover { background: var(--rw-blue); border-color: var(--rw-blue); color: var(--rw-blue-ink); }
.rw-xpill i {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--rw-blue);
  transition: background 0.35s;
}
.rw-xpill:hover i { background: var(--rw-blue-ink); }

/* cards grid (hubs) */
.rw-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(1.25rem, 2vw, 2rem);
}

.rw-cards--8 { grid-template-columns: repeat(4, 1fr); }

.rw-card {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  background: var(--rw-white);
  border: 1px solid var(--rw-line);
  overflow: hidden;
  transition: border-color 0.4s, transform 0.55s var(--rw-ease), box-shadow 0.55s var(--rw-ease);
}
.rw-card:hover {
  border-color: transparent;
  transform: translateY(-6px);
  box-shadow: 0 30px 60px -30px rgba(0,27,61,0.3);
}

.rw-card__media { aspect-ratio: 4 / 2.6; overflow: hidden; background: var(--rw-mist); }
.rw-card__media img {
  width: 100%; height: 100%; object-fit: cover;
  filter: saturate(0.82);
  transition: transform 1.3s var(--rw-ease), filter 0.8s;
}
.rw-card:hover .rw-card__media img { transform: scale(1.06); filter: saturate(1); }

.rw-card__body { padding: clamp(1.25rem, 1.8vw, 1.75rem); display: grid; gap: 0.7rem; align-content: start; }
.rw-card__body p { margin: 0; font-size: 0.875rem; line-height: 1.6; color: var(--rw-body); }

.rw-card__num {
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.14em; color: var(--rw-blue-deep);
}

.rw-card__foot {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem clamp(1.25rem, 1.8vw, 1.75rem);
  border-top: 1px solid var(--rw-line);
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--rw-ink);
}
.rw-card__foot svg { width: 14px; height: 14px; color: var(--rw-gray); transition: transform 0.4s var(--rw-ease), color 0.3s; }
.rw-card:hover .rw-card__foot svg { transform: translateX(5px); color: var(--rw-blue-deep); }

/* big CTA */
.rw-cta { position: relative; overflow: hidden; }

.rw-cta__inner {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vh, 2.25rem);
  padding-block: clamp(5rem, 12vh, 8.5rem);
}

.rw-cta__title {
  font-size: clamp(2.4rem, 5.2vw, 5.25rem);
  line-height: 1.0; letter-spacing: -0.026em;
  font-weight: 500;
  color: var(--rw-white);
  max-width: 18ch;
  margin: 0;
  text-wrap: balance;
}

.rw-cta__sub { max-width: 40rem; color: rgba(255,255,255,0.68); margin: 0; }

/* geometric ornament */
.rw-ornament {
  position: absolute;
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 10px;
  opacity: 0.14;
}
.rw-ornament span { display: block; }
.rw-ornament .o1 { width: 12px; height: 12px; border-radius: 50%; background: var(--rw-white); }
.rw-ornament .o2 { width: 12px; height: 12px; background: var(--rw-blue); }
.rw-ornament .o3 {
  width: 0; height: 0;
  border-left: 6px solid transparent; border-right: 6px solid transparent;
  border-bottom: 12px solid var(--rw-white);
}

/* ----------------------------------------------------------------- form */
.rw-form { display: grid; gap: 2rem; }

.rw-field { display: grid; gap: 0.5rem; }

.rw-field__label {
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--rw-ink-soft);
  display: flex; justify-content: space-between; gap: 1rem;
}
.rw-field__label small { color: var(--rw-gray); font-weight: 600; letter-spacing: 0.08em; }

.rw-input,
.rw-select,
.rw-textarea {
  width: 100%;
  font-family: inherit;
  font-size: 1rem;
  color: var(--rw-ink);
  background: var(--rw-white);
  border: 1px solid var(--rw-line);
  border-radius: 0;
  padding: 0.85rem 1rem;
  transition: border-color 0.3s, box-shadow 0.3s;
  appearance: none;
  -webkit-appearance: none;
}
.rw-textarea { min-height: 8.5rem; resize: vertical; }
.rw-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23878d97' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}
.rw-input:focus,
.rw-select:focus,
.rw-textarea:focus {
  outline: none;
  border-color: var(--rw-ink);
  box-shadow: 0 1px 0 0 var(--rw-ink);
}

.rw-field.has-error .rw-input,
.rw-field.has-error .rw-select,
.rw-field.has-error .rw-textarea { border-color: #b3452e; }
.rw-field__error {
  display: none;
  font-size: 0.75rem; color: #b3452e;
  letter-spacing: 0.02em;
}
.rw-field.has-error .rw-field__error { display: block; }

.rw-checks { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.rw-check {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  border: 1px solid var(--rw-line);
  background: var(--rw-white);
  padding: 0.6rem 0.95rem;
  font-size: 0.8125rem; font-weight: 600;
  color: var(--rw-ink-soft);
  cursor: pointer;
  transition: border-color 0.3s, background 0.3s, color 0.3s;
  user-select: none;
}
.rw-check:hover { border-color: var(--rw-blue-deep); }
.rw-check input {
  position: absolute; opacity: 0; pointer-events: none;
}
.rw-check i {
  width: 9px; height: 9px;
  border: 1px solid var(--rw-gray);
  flex: none;
  transition: background 0.25s, border-color 0.25s;
}
.rw-check input:checked ~ i {
  background: var(--rw-blue-deep);
  border-color: var(--rw-blue-deep);
}
.rw-check input:checked ~ span { color: var(--rw-ink); }
.rw-check input:focus-visible ~ i { outline: 2px solid var(--rw-blue-deep); outline-offset: 2px; }

.rw-consent {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.9rem;
  align-items: start;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--rw-body);
}
.rw-consent input { width: 1.05rem; height: 1.05rem; margin-top: 0.2rem; accent-color: var(--rw-blue-deep); }
.rw-consent a { text-decoration: underline; text-underline-offset: 3px; }

.rw-honeypot {
  position: absolute !important;
  left: -9999px; width: 1px; height: 1px;
  opacity: 0;
}

.rw-form__foot {
  display: flex; flex-wrap: wrap;
  align-items: center; gap: 1.5rem;
  justify-content: space-between;
  border-top: 1px solid var(--rw-line);
  padding-top: 1.75rem;
}

/* success panel */
.rw-success {
  display: none;
  border: 1px solid var(--rw-line);
  background: var(--rw-paper);
  padding: clamp(2.5rem, 5vw, 4rem);
  text-align: center;
  display: none;
  grid-gap: 1.25rem;
  justify-items: center;
}
.rw-success.is-visible { display: grid; }
.rw-success__mark {
  width: 52px; height: 52px;
  border: 1px solid var(--rw-blue-deep);
  border-radius: 50%;
  display: grid; place-items: center;
  color: var(--rw-blue-deep);
}
.rw-success__mark svg { width: 20px; height: 20px; }

/* ----------------------------------------------------------------- footer */
.rw-footer { background: var(--rw-ink); color: rgba(255,255,255,0.6); }

.rw-footer__top {
  display: grid;
  grid-template-columns: minmax(0, 4fr) repeat(4, minmax(0, 2fr));
  gap: clamp(2rem, 4vw, 4rem);
  padding-block: clamp(3.5rem, 7vh, 5.5rem);
}

.rw-footer__brand { display: grid; gap: 1.25rem; align-content: start; }

.rw-footer__title {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 500; letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--rw-white);
  margin: 0;
  max-width: 14ch;
}

.rw-footer__col { display: grid; gap: 0.9rem; align-content: start; }

.rw-footer__head {
  font-size: 0.625rem; font-weight: 700;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

.rw-footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.rw-footer__list a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.72);
  transition: color 0.3s;
}
.rw-footer__list a:hover { color: var(--rw-blue); }

.rw-footer__bottom {
  border-top: 1px solid var(--rw-line-dark);
  padding-block: 1.5rem;
  display: flex; flex-wrap: wrap;
  align-items: center; justify-content: space-between;
  gap: 1rem;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.4);
}
.rw-footer__bottom a { color: rgba(255,255,255,0.55); }
.rw-footer__bottom a:hover { color: var(--rw-blue); }

/* --------------------------------------------------------- media credits */
.rw-credits { font-size: 0.6875rem; line-height: 1.7; color: rgba(255,255,255,0.34); max-width: 72rem; }

/* ---------------------------------------------------------- reveal anim */
.rw-reveal {
  opacity: 0;
  transform: translateY(26px);
  transition:
    opacity 0.9s var(--rw-ease-soft),
    transform 0.9s var(--rw-ease-soft);
  transition-delay: var(--rw-reveal-delay, 0s);
  will-change: opacity, transform;
}
.rw-reveal.is-in { opacity: 1; transform: translateY(0); }

.rw-reveal--clip {
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1.1s var(--rw-ease);
}
.rw-reveal--clip.is-in { clip-path: inset(0 0 0% 0); }

/* page transition veil */
.rw-veil {
  position: fixed; inset: 0;
  z-index: 300;
  background: var(--rw-ink);
  transform: scaleY(0);
  transform-origin: bottom;
  pointer-events: none;
  transition: transform 0.55s var(--rw-ease-soft);
}
.rw-veil.is-covering { transform: scaleY(1); transform-origin: top; }
.rw-veil.is-revealing { transform: scaleY(0); transform-origin: bottom; transition: transform 0.65s var(--rw-ease-soft) 0.05s; }

/* toast */
.rw-toast {
  position: fixed;
  left: 50%; bottom: 2rem;
  translate: -50% 0;
  z-index: 320;
  background: var(--rw-ink);
  color: var(--rw-white);
  font-size: 0.8125rem; letter-spacing: 0.04em;
  padding: 0.85rem 1.4rem;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.4s var(--rw-ease-soft), transform 0.4s var(--rw-ease-soft);
  pointer-events: none;
}
.rw-toast.is-visible { opacity: 1; transform: translateY(0); }

/* ------------------------------------------------------------- utilities */
.rw-mt-0 { margin-top: 0; }
.rw-grid-divider { border-top: 1px solid var(--rw-line); }
.rw-stack-2 > * + * { margin-top: 2rem; }

/* ---------------------------------------------------------- responsive */
@media (max-width: 1180px) {
  .rw-audience { grid-template-columns: repeat(3, 1fr); }
  .rw-audience__cell .rw-h4 { min-height: 0; }
  .rw-cards, .rw-cards--8 { grid-template-columns: repeat(2, 1fr); }
  .rw-footer__top { grid-template-columns: repeat(2, 1fr); }
  .rw-footer__brand { grid-column: 1 / -1; }
}

@media (max-width: 1024px) {
  .rw-nav, .rw-lang { display: none; }
  .rw-burger { display: flex; }

  .rw-why { grid-template-columns: 1fr 1fr; }
  .rw-paths { grid-template-columns: 1fr; }
  .rw-layer { grid-template-columns: 4rem 1fr; }
  .rw-layer__what { grid-column: 2; }
  .rw-stats__grid { grid-template-columns: 1fr 1fr; }
  .rw-stat:nth-child(odd) { border-left: 0; }
  .rw-stat:nth-child(n+3) { border-top: 1px solid var(--rw-line); }
  .rw-body-grid { grid-template-columns: 1fr; }
  .rw-toc { position: static; border-left: 0; padding-left: 0; display: none; }
  .rw-page-hero__grid { grid-template-columns: 1fr; align-items: start; }
  .rw-journey-graphic { grid-template-columns: 1fr 1fr; }
  .rw-jstep:nth-child(odd) { border-left: 0; }
  .rw-jstep:nth-child(n+3) { border-top: 1px solid var(--rw-line); }
}

@media (max-width: 720px) {
  body.rw-site { font-size: 1rem; }
  .rw-why { grid-template-columns: 1fr; }
  .rw-audience { grid-template-columns: 1fr; }
  .rw-cards, .rw-cards--8 { grid-template-columns: 1fr; }
  .rw-stats__grid { grid-template-columns: 1fr; }
  .rw-stat { border-left: 0; border-top: 1px solid var(--rw-line); }
  .rw-stat:first-child { border-top: 0; }
  .rw-cols-2 { grid-template-columns: 1fr; }
  .rw-hero__cap span { display: none; }
  .rw-hero__captions { gap: 1.25rem; }
  .rw-sec-head { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
  .rw-mode { grid-template-columns: 3rem 1fr; }
  .rw-mode__arrow { display: none; }
  .rw-journey-graphic { grid-template-columns: 1fr; }
  .rw-jstep { border-left: 0; border-top: 1px solid var(--rw-line); }
  .rw-jstep:first-child { border-top: 0; }
  .rw-footer__top { grid-template-columns: 1fr; }
  .rw-hero__cue { display: none; }
}

/* ------------------------------------------------------- atlas record */
.rw-atlas { margin-top: clamp(2rem, 4vh, 3rem); }
.rw-atlas__tabs { display: flex; gap: 2rem; border-bottom: 1px solid var(--rw-line); }
.rw-atlas__tab {
  font-family: inherit; background: none; border: 0;
  border-bottom: 2px solid transparent;
  padding: .9rem .1rem; margin-bottom: -1px;
  font-size: 1.05rem; font-weight: 600; letter-spacing: -.01em;
  color: var(--rw-ink-soft);            /* 11.0:1 on white — AA pass */
  cursor: pointer;
  display: inline-flex; gap: .5rem; align-items: baseline;
  transition: color .25s;
}
.rw-atlas__tab span { font-size: .75rem; font-weight: 500; letter-spacing: .06em; color: var(--rw-body); /* 7.9:1 */ }
.rw-atlas__tab:hover { color: var(--rw-ink); }
.rw-atlas__tab.is-on { color: var(--rw-ink); border-bottom-color: var(--rw-blue-deep); /* 5.1:1 UI marker */ }
.rw-atlas__tab.is-on span { color: var(--rw-blue-deep); /* 5.1:1 */ }

.rw-atlas__filters { background: var(--rw-paper); border: 1px solid var(--rw-line); padding: 1.1rem 1.1rem .35rem; margin-top: 1.4rem; }
.rw-atlas__search {
  width: 100%; font-family: inherit; font-size: 1rem;  /* 16px — prevents iOS focus zoom */
  color: var(--rw-ink);
  background: var(--rw-white); border: 1px solid var(--rw-line); padding: .8rem 1rem;
}
.rw-atlas__search::placeholder { color: var(--rw-body); /* 7.9:1 */ }
.rw-atlas__search:focus { outline: 2px solid var(--rw-blue-deep); outline-offset: -1px; }
.rw-atlas__frow { display: flex; align-items: baseline; gap: 1rem; padding: .8rem 0 .55rem; }
.rw-atlas__flab { flex: none; width: 3.6rem; font-size: .6875rem; letter-spacing: .12em; text-transform: uppercase; color: var(--rw-body); /* 7.9:1 */ }
.rw-atlas__chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.rw-atlas__chip {
  font-family: inherit; font-size: .6875rem; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--rw-ink-soft); background: var(--rw-white);
  border: 1px solid var(--rw-line); padding: .38rem .7rem; cursor: pointer;
  transition: color .2s, border-color .2s, background .2s;
}
.rw-atlas__chip:hover { border-color: var(--rw-blue-deep); color: var(--rw-blue-deep); }
.rw-atlas__chip.is-on { background: var(--rw-ink); border-color: var(--rw-ink); color: var(--rw-white); }

.rw-atlas__meta { display: flex; justify-content: space-between; align-items: center; margin-top: 1.1rem; }
.rw-atlas__count { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--rw-body); /* 7.9:1 */ }

.rw-atlas__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--rw-line); border: 1px solid var(--rw-line); margin-top: .8rem; }
.rw-atlas-card { background: var(--rw-white); padding: 1.4rem 1.3rem 1.2rem; display: flex; flex-direction: column; gap: .7rem; }
.rw-atlas-card__meta { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.rw-atlas-card__tag { font-size: .625rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--rw-blue-deep); border: 1px solid currentColor; padding: .18rem .45rem; white-space: nowrap; }
.rw-atlas-card__id { font-size: .6875rem; color: var(--rw-body); /* 7.9:1 */ letter-spacing: .06em; }
.rw-atlas-card h3 { font-size: 1.05rem; line-height: 1.32; color: var(--rw-ink); margin: 0; letter-spacing: -.01em; }
.rw-atlas-card__sum { font-size: .9rem; line-height: 1.6; color: var(--rw-body); margin: 0; }
.rw-atlas-card__foot { margin-top: auto; padding-top: .8rem; border-top: 1px solid var(--rw-line); display: flex; justify-content: space-between; gap: 1rem; }
.rw-atlas-card__foot div { display: grid; gap: .15rem; }
.rw-atlas-card__foot div:last-child { text-align: right; }
.rw-atlas-card__foot .k { font-size: .625rem; letter-spacing: .1em; text-transform: uppercase; color: var(--rw-body); /* 7.9:1 */ }
.rw-atlas-card__foot .v { font-size: .85rem; color: var(--rw-ink); }
.rw-atlas-card__foot .v.is-accent { color: var(--rw-blue-deep); /* 10.3:1 — marks scaling/deployed momentum */ }
.rw-atlas__empty { grid-column: 1 / -1; background: var(--rw-white); padding: 2rem; font-size: .9rem; color: var(--rw-body); }

@media (max-width: 1024px) {
  .rw-atlas__grid { grid-template-columns: 1fr 1fr; }
  .rw-atlas__tabs { gap: 1.4rem; }
}
@media (max-width: 720px) {
  .rw-atlas__grid { grid-template-columns: 1fr; }
  .rw-atlas__frow { flex-direction: column; gap: .55rem; }
  .rw-atlas__flab { width: auto; }
  .rw-atlas__tabs { gap: 1.1rem; }
  .rw-atlas__tab { font-size: .95rem; }
}

/* ------------------------------------------ atlas profile popup (drawer) */
/* Cards open the record profile drawer. */
.rw-atlas-card.is-clickable { cursor: pointer; transition: background .25s var(--rw-ease-soft); }
.rw-atlas-card.is-clickable:hover,
.rw-atlas-card.is-clickable:focus-visible { background: var(--rw-paper); }
.rw-atlas-card.is-clickable:focus-visible { outline: 2px solid var(--rw-blue-deep); outline-offset: -2px; }

/* overlay + right-hand drawer */
.rw-atlas-panel { position: fixed; inset: 0; z-index: 200; }
.rw-atlas-panel[hidden] { display: none; }
.rw-atlas-panel__scrim {
  position: absolute; inset: 0;
  background: rgba(0, 27, 61, .55);
  opacity: 0;
  transition: opacity .35s var(--rw-ease-soft);
}
.rw-atlas-panel__wrap {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: min(60rem, 100%);
  background: var(--rw-white);
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  box-shadow: -14px 0 40px rgba(0, 27, 61, .24);
  transform: translateX(24px); opacity: 0;
  transition: transform .5s var(--rw-ease), opacity .5s var(--rw-ease-soft);
}
.rw-atlas-panel.is-open .rw-atlas-panel__scrim { opacity: 1; }
.rw-atlas-panel.is-open .rw-atlas-panel__wrap { transform: none; opacity: 1; }

.rw-atlas-panel__close {
  position: sticky; top: 0; float: right;
  margin: .9rem 1.25rem 0 0; z-index: 5;
  background: var(--rw-white); border: 1px solid var(--rw-line);
  padding: .55rem .9rem; font-family: inherit;
  font-size: .6875rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--rw-ink); cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.rw-atlas-panel__close:hover { background: var(--rw-ink); border-color: var(--rw-ink); color: var(--rw-white); }
.rw-atlas-panel__close:focus-visible { outline: 2px solid var(--rw-blue-deep); outline-offset: 2px; }

/* profile header */
.rw-ad__head { padding: 2rem 2.25rem 1.5rem; border-bottom: 1px solid var(--rw-line); border-top: 4px solid var(--rw-ink); }
.rw-ad__row { display: flex; gap: .65rem; align-items: center; flex-wrap: wrap; margin-bottom: .9rem; }
.rw-ad__tag { font-size: .625rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--rw-blue-deep); border: 1px solid currentColor; padding: .18rem .45rem; white-space: nowrap; }
.rw-ad__stage { font-weight: 600; font-size: .8125rem; color: var(--rw-ink); }
.rw-ad__stage.is-accent { color: var(--rw-blue-deep); /* marks scaling/deployed momentum */ }
.rw-ad__id { font-size: .6875rem; color: var(--rw-body); /* 7.9:1 */ letter-spacing: .06em; }
.rw-ad__head h2 { font-size: 1.8rem; line-height: 1.16; letter-spacing: -.02em; color: var(--rw-ink); margin: 0 0 .75rem; }
.rw-ad__sum { font-size: 1.0625rem; line-height: 1.58; color: var(--rw-body); margin: 0; }

/* two-column body: narrative + institutional sidebar */
.rw-ad__grid { display: grid; grid-template-columns: 1fr 18.75rem; }
.rw-ad__main { padding: .4rem 2.25rem 2.75rem; min-width: 0; }
.rw-ad__block { padding: 1.5rem 0; border-bottom: 1px solid var(--rw-line); }
.rw-ad__block:last-child { border-bottom: none; }
.rw-ad__block h4 { font-size: .6875rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--rw-blue-deep); /* 5.1:1 — labels only */ margin: 0 0 .8rem; }
.rw-ad__block p { font-size: .9688rem; line-height: 1.65; color: var(--rw-body); margin: 0; }
.rw-ad__flow, .rw-ad__list { margin: 0; padding-left: 1.2rem; }
.rw-ad__flow li, .rw-ad__list li { font-size: .9375rem; line-height: 1.58; margin-bottom: .5rem; color: var(--rw-body); }
.rw-ad__flow li::marker { font-weight: 600; color: var(--rw-blue-deep); }
.rw-ad__list { list-style: none; padding-left: 0; }
.rw-ad__list li { padding-left: 1.05rem; position: relative; }
.rw-ad__list li::before { content: ""; position: absolute; left: 0; top: .65rem; width: .5rem; height: 1px; background: var(--rw-blue-deep); }

/* outcome stat tiles */
.rw-ad__mgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(8.25rem, 1fr)); gap: 1px; background: var(--rw-line); border: 1px solid var(--rw-line); }
.rw-ad__mcard { background: var(--rw-paper); padding: 1rem; }
.rw-ad__mcard b { display: block; font-size: 1.5rem; line-height: 1.1; letter-spacing: -.02em; color: var(--rw-ink); }
.rw-ad__mcard span { display: block; font-size: .625rem; letter-spacing: .04em; color: var(--rw-body); margin-top: .45rem; line-height: 1.45; }

/* institutional sidebar */
.rw-ad__side { border-left: 1px solid var(--rw-line); background: var(--rw-paper); padding: 1.5rem 1.6rem 2.75rem; }
.rw-ad__dl { margin: 0; }
.rw-ad__dl dt { font-size: .5938rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--rw-body); margin-top: 1.05rem; }
.rw-ad__dl dt:first-child { margin-top: 0; }
.rw-ad__dl dd { font-size: .875rem; color: var(--rw-ink); margin: .3rem 0 0; line-height: 1.5; }
.rw-ad__src { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--rw-gray-soft); }
.rw-ad__src .k { display: block; font-size: .5938rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--rw-body); margin-bottom: .4rem; }
.rw-ad__src p { font-size: .75rem; line-height: 1.55; color: var(--rw-body); margin: 0; }

/* cross-links between profiles + source button */
.rw-ad__links { display: flex; flex-wrap: wrap; gap: .4rem; }
.rw-ad__link {
  text-align: left; font-family: inherit; font-size: .7813rem;
  color: var(--rw-ink); background: var(--rw-white);
  border: 1px solid var(--rw-line); padding: .45rem .65rem;
  cursor: pointer; line-height: 1.3;
  transition: background .2s, color .2s, border-color .2s;
}
.rw-ad__link:hover { background: var(--rw-blue-deep); border-color: var(--rw-blue-deep); color: var(--rw-white); }
.rw-ad__link:focus-visible { outline: 2px solid var(--rw-blue-deep); outline-offset: 2px; }
.rw-ad__btn {
  display: inline-flex; align-items: center; gap: .55rem;
  font-weight: 600; font-size: .9rem; min-height: 2.875rem;
  padding: .8rem 1.25rem; background: var(--rw-ink); color: var(--rw-white);
  border: 1px solid var(--rw-ink); text-decoration: none;
  transition: background .2s, border-color .2s;
}
.rw-ad__btn:hover { background: var(--rw-blue-deep); border-color: var(--rw-blue-deep); color: var(--rw-white); }
.rw-ad__note { font-size: .8125rem; color: var(--rw-body); margin-top: .65rem; }
.rw-ad__none { font-size: .875rem; color: var(--rw-body); margin: 0; }

@media (max-width: 60rem) {
  .rw-ad__head { padding: 1.4rem 1.25rem 1.1rem; }
  .rw-ad__head h2 { font-size: 1.45rem; }
  .rw-ad__sum { font-size: .9688rem; }
  .rw-ad__grid { grid-template-columns: 1fr; }
  .rw-ad__main { padding: .15rem 1.25rem 1.75rem; }
  .rw-ad__side { border-left: none; border-top: 1px solid var(--rw-line); padding: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .rw-atlas-panel__scrim, .rw-atlas-panel__wrap, .rw-atlas-card.is-clickable { transition: none; }
  .rw-atlas-panel__wrap { transform: none; }
}

/* ------------------------------------------------------- partners page */
/* Enablers — official institutional marks opening the partners section:
   badge first, then the three big logos at full colour. */
.rw-enablers { display: grid; gap: clamp(1.75rem, 4vh, 2.5rem); justify-items: start; }
.rw-enablers__logos {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: clamp(2rem, 6vw, 4.5rem);
}
.rw-enablers__logos img {
  display: block; height: clamp(72px, 9vw, 116px); width: auto; max-width: 100%;
  object-fit: contain;
}
.rw-partners-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--rw-line); border: 1px solid var(--rw-line); margin-top: clamp(2rem, 4vh, 3rem); }
.rw-partner-card { background: var(--rw-white); padding: 1.5rem 1.4rem 1.6rem; display: flex; flex-direction: column; gap: .8rem; }
.rw-partner-card__meta { display: flex; align-items: center; gap: .7rem; }
.rw-partner-card__num { font-size: .6875rem; font-weight: 700; letter-spacing: .08em; color: var(--rw-blue-deep); }
.rw-partner-card__cat { font-size: .8125rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rw-ink); }
.rw-partner-card__chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.rw-partner-card__chips span { font-size: .6875rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--rw-ink-soft); background: var(--rw-paper); border: 1px solid var(--rw-line); padding: .38rem .65rem; }

/* partner logo wall — typographic wordmarks, desaturated until hover */
.rw-logo-wall { display: flex; flex-wrap: wrap; align-items: baseline; gap: .9rem 1.9rem; }
.rw-logo-wall .wm {
  font-size: 1.2rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.15;
  color: var(--rw-gray); opacity: .72; white-space: nowrap;
  transition: color .25s var(--rw-ease), opacity .25s var(--rw-ease), transform .25s var(--rw-ease);
  cursor: default;
}
.rw-logo-wall .wm:hover { color: var(--rw-blue-deep); opacity: 1; transform: translateY(-2px); }
.rw-partner-card:hover .rw-logo-wall .wm { opacity: .9; }
.rw-logo-wall .wm--serif { font-family: Georgia, 'Times New Roman', serif; font-weight: 600; }
.rw-logo-wall .wm--mono { font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; font-size: 1.05rem; letter-spacing: .05em; }
.rw-logo-wall .wm--light { font-weight: 400; letter-spacing: .02em; }
.rw-logo-wall .wm--black { font-weight: 800; letter-spacing: -.03em; }
.rw-logo-wall .wm--caps { text-transform: uppercase; letter-spacing: .16em; font-size: .9rem; font-weight: 600; }
.rw-logo-wall img.wl {
  height: 30px; width: auto; max-width: 130px; object-fit: contain;
  filter: grayscale(1); opacity: .55;
  transition: filter .25s var(--rw-ease), opacity .25s var(--rw-ease), transform .25s var(--rw-ease);
  cursor: default;
}
.rw-logo-wall img.wl:hover { filter: none; opacity: 1; transform: translateY(-2px); }
.rw-atlas__badge {
  display: inline-block; font-size: .6875rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--rw-blue-deep);
  border: 1px solid var(--rw-blue-deep); padding: .3rem .7rem;
}
@media (max-width: 1024px) { .rw-partners-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) { .rw-partners-grid { grid-template-columns: 1fr; } }

/* ------------------------------------------------------- reduced motion */
@media (prefers-reduced-motion: reduce) {
  html:has(body.rw-site) { scroll-behavior: auto; }
  .rw-reveal { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
  .rw-hero__track { transition: none !important; }
  .rw-hero__slide .rw-hero__media,
  .rw-hero__slide.is-active .rw-hero__media { transform: none; transition: none; }
  .rw-hero__cue::after { animation: none; }
  .rw-path-card__media img,
  .rw-card__media img,
  .rw-page-hero__media img { transition: none; }
  .rw-veil { display: none; }
}

/* ================================================== responsive fixes (F-01…F-04)
   Fixes surfaced by the 2026-09-10 responsive audit:
     F-01 header row overflow pushed the burger off-screen on every phone
     F-02 hero content clipped upward beneath the fixed header on short viewports
     F-03 hero control bar collapsed (captions clipped, counter stacked)
     F-04 footer link tap targets below WCAG 2.5.8 AA (24px)
   Verified by responsive-audit/verify_fixes.py across 9 viewports. */

/* F-01: below 481px the CTA pushes the burger off-canvas; the drawer carries
   an identical "Invest in Rwanda" CTA, so hiding it here costs nothing. */
@media (max-width: 480px) {
  .rw-header__cta { display: none; }
}
/* F-01 (revised per Ken 2026-09-10): keep the FULL lockup at every width —
   hiding the strapline left only "RWANDA". The burger fits once the CTA is
   hidden ≤480px, so no strapline rule is needed any more. */

/* F-03 (tablet): the captions row squeezes the counter to ~37px at 768–1024px,
   stacking "01 / 03" into four lines. Stop the shrink and clip-proof the captions. */
@media (max-width: 1024px) {
  .rw-hero__counter { flex: none; white-space: nowrap; }
  .rw-hero__cap { display: none; }
  .rw-hero__cap.is-active { display: grid; }
}

/* F-02 / F-03: below 720px the hero grows with its content instead of clipping
   upward into the fixed header, and the control bar returns to normal flow. */
@media (max-width: 720px) {
  .rw-hero {
    height: auto;
    /* 660px mobile floor: keeps the hero substantial while letting the
       bottom-pinned bar kill the dead space below the CTAs (2026-09-10
       balance fix — the 720px floor left 67-124px of empty photo there) */
    min-height: 660px;
    max-height: none;
    display: flex;
    flex-direction: column;
  }
  .rw-hero__track { position: absolute; inset: 0; }   /* media layer fills the grown hero */
  .rw-hero__content {
    position: relative;
    inset: auto;
    /* +50px above the heading (2026-09-10): it sat too close to the header */
    padding-top: calc(var(--rw-header-h) + 0.25rem + 50px + env(safe-area-inset-top, 0px));
    padding-bottom: 2rem;
  }
  .rw-hero__content .rw-container { gap: 1.25rem; }
  .rw-hero .rw-hero__headline { font-size: clamp(1.9rem, 8.6vw, 2.6rem); }
  /* full-width CTAs collapse the wrapped label to one line and stop the row
     stretching both buttons to the tallest sibling */
  .rw-hero__ctas { width: 100%; gap: 0.6rem; }
  .rw-hero__ctas .rw-btn { flex: 1 1 100%; justify-content: space-between; padding: 0.9rem 1.25rem; height: auto; }  /* height:auto — the desktop 141px fixed height must not inflate the stacked mobile CTAs */
  /* the arrow SVG has no intrinsic size; unconstrained it flex-stretches to
     ~172px and inflates every CTA to ~200px tall */
  .rw-hero__ctas .rw-btn svg { width: 1.15rem; height: 1.15rem; flex: none; }
  .rw-hero__bar { position: relative; margin-top: auto; }
  .rw-hero__bar-inner {
    height: auto;
    min-height: 3.75rem;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-block: 0.6rem;
  }
  .rw-hero__captions { flex: 1 1 100%; order: 1; overflow: visible; }
  .rw-hero__cap { display: none; white-space: normal; }
  .rw-hero__cap.is-active { display: grid; }
  .rw-hero__cap span { display: block; }
  .rw-hero__counter { order: 2; flex: none; white-space: nowrap; }
  .rw-hero__nav { order: 3; margin-left: auto; }
  /* bar-inner is auto-height here, so the arrows no longer stretch — keep them
     square and above the 24px tap minimum */
  .rw-hero__arrow { min-height: 3.25rem; }
}

/* F-04 (extended): breadcrumb links are 19px tall; give them a >=24px hit area */
.rw-crumb a { display: inline-block; padding-block: 0.25rem; }

/* ================================================== Government of Rwanda guideline tokens
   Source: "Government of Rwanda Websites Guideline" (Branding Elements → Colors).
   WIRED 2026-09-10: the Primary Blue row (#00a1de / #003f82 / #001b3d) is the live
   site palette (see the --rw-blue-* tokens at the top of this file). The Green and
   Gold rows stay declared-but-unused — they belong to other government categories
   ("Institutions", "National Bank or other") and would break the blue identity.

   ⚠️ USAGE RULE (contrast): the guideline's own swatches state "HEX over Background:
   #000000" for gold / warning / error — i.e. these are FILL colours that carry black text.
   On white they fail WCAG as text: gold #E5BE01 ≈ 1.9:1, error #FF6161 ≈ 2.9:1,
   warning #E2B93B ≈ 2.1:1. Use them as backgrounds/borders/marks, never as small text.
   Only Primary Blue #003F82 (≈ 9.9:1), Primary Green #20603D (7.49:1 per the guideline)
   and the Black 1–3 values are safe as text on white. */

:root {
  /* Brand — Rwanda flag */
  --gov-blue:        #00A1DE;   /* Pantone 3005 */
  --gov-gold:        #E5BE01;   /* Pantone 130  */
  --gov-yellow:      #FAD201;   /* Pantone 109  */
  --gov-green:       #20603D;   /* Pantone 3415 */

  /* Primary Blue — "Main Government Website" */
  --gov-blue-1:      #00A1DE;
  --gov-blue-2:      #003F82;
  --gov-blue-3:      #001B3D;

  /* Primary Green — "Institutions" */
  --gov-green-1:     #3DB874;
  --gov-green-2:     #20603D;
  --gov-green-3:     #143E28;

  /* Secondary Gold — "National Bank or other" (category undefined in the guideline) */
  --gov-gold-1:      #FDE35D;
  --gov-gold-2:      #E5BE01;
  --gov-gold-3:      #CAA902;

  /* State — fills with black text (see usage rule above) */
  --gov-info:        #509CFF;
  --gov-success:     #27AE60;
  --gov-warning:     #E2B93B;
  --gov-error:       #FF6161;

  /* Text */
  --gov-text-display:    #000000;
  --gov-text-body:       #000F14;
  --gov-text-subheading: #050F0A;
  --gov-white:           #FFFFFF;

  /* Achromatic */
  --gov-gray-1:      #333333;
  --gov-gray-2:      #4F4F4F;
  --gov-gray-3:      #BDBDBD;
  --gov-gray-4:      #F4F4F4;   /* disabled */
}

/* ------------------------------------------------- drawer-open header contrast
   The drawer is a FOLLOWING sibling of the header in the DOM, so the original
   rule `.rw-drawer.is-open ~ * .rw-burger span` can never match (it only
   reaches later siblings). With the drawer open, the fixed header sits above a
   white panel and its white logo/burger vanish. `:has()` keys off the drawer
   state regardless of DOM order. */
body:has(.rw-drawer.is-open) .rw-header {
  background: var(--rw-white);
  border-bottom-color: var(--rw-line);
  transition: none;          /* flip instantly — a 0.45s fade leaves the white
                                marks over the white drawer mid-transition */
}
body:has(.rw-drawer.is-open) .rw-header .rw-logo__top { color: var(--rw-ink); }
body:has(.rw-drawer.is-open) .rw-header .rw-logo__sub { color: var(--rw-gray); }
body:has(.rw-drawer.is-open) .rw-header .rw-logo__by { color: var(--rw-gray); }
body:has(.rw-drawer.is-open) .rw-header .rw-burger span {
  background: var(--rw-ink);
  transition: transform 0.4s var(--rw-ease), opacity 0.3s;   /* keep the X animation, drop the colour fade */
}
body:has(.rw-drawer.is-open) .rw-header .rw-header__cta {
  --btn-fg: var(--rw-ink);
  color: var(--rw-ink);
  border-color: rgba(0, 27, 61, 0.32);
}

/* ------------------------------------------------------- logo mark contrast
   The mark's triangle is `currentColor`, so it follows the surface: white on the
   dark hero and the ink footer, ink on the solid (white) header — including when
   the drawer is open, which forces a white header. */
.rw-logo__mark { color: var(--rw-white); }
.rw-header.is-solid .rw-logo__mark { color: var(--rw-ink); }
body:has(.rw-drawer.is-open) .rw-header .rw-logo__mark { color: var(--rw-ink); }

/* ------------------------------------------------------------ focus rings
   The default ring is Primary Blue #003f82 (10.3:1 on white). On the dark navy
   surfaces that ring would be invisible (1.7:1), and there #00a1de is both
   legible (5.8:1) and unmistakably the brand accent. */
.rw-section--ink :focus-visible,
.rw-section--ink a:focus-visible,
.rw-hero :focus-visible,
.rw-footer :focus-visible,
.rw-path-card :focus-visible,
.rw-journey :focus-visible,
.rw-cta :focus-visible,
.rw-xband :focus-visible {
  outline-color: var(--rw-blue);
}

/* F-04: footer links get a >=24px hit area (WCAG 2.5.8 AA) */
.rw-footer a { display: inline-block; padding-block: 0.3rem; }
.rw-footer__list { gap: 0.15rem; }
