/* ═══════════════════════════════════════════════════════════════════
     EDITORIAL SUB-PAGE LAYER
     Brings the interior pages onto the same choreography, band logic
     and watermark language as the home page. Nothing here invents a
     new palette: cream #f4f0e8, deep #0a0c12, navy #141826, accent
     #4e8ff7 / teal #14b8a6, sans-serif display over Plus Jakarta body
     with JetBrains Mono for anything that behaves like metadata.
     ═══════════════════════════════════════════════════════════════ */

  /* ── Band tones. Scoped to the band, not the body, so a single page
        can move cream → deep without touching the fixed nav tokens. ── */
  .ed-band {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }
  .ed-cream {
    background: #f4f0e8;
    --page-text: #14171f;
    --page-text-secondary: rgba(20,23,31,0.70);
    --ed-rule: rgba(20,23,31,0.13);
    --ed-rule-strong: rgba(20,23,31,0.26);
    --ed-ink: 20,23,31;
    --ed-accent: #2f6ede;
    --ed-seam-from: #0a0c12;
  }
  .ed-deep {
    background: #0a0c12;
    --page-text: #eceef3;
    --page-text-secondary: rgba(236,238,243,0.70);
    --ed-rule: rgba(255,255,255,0.11);
    --ed-rule-strong: rgba(255,255,255,0.24);
    --ed-ink: 255,255,255;
    --ed-accent: #6da3fa;
    --ed-seam-from: #f4f0e8;
  }
  .ed-navy {
    background: #141826;
    --page-text: #eceef3;
    --page-text-secondary: rgba(236,238,243,0.70);
    --ed-rule: rgba(255,255,255,0.11);
    --ed-rule-strong: rgba(255,255,255,0.24);
    --ed-ink: 255,255,255;
    --ed-accent: #6da3fa;
    --ed-seam-from: #f4f0e8;
  }

  /* Ambient plate — one soft directional light per band, never a blob
     field. Cream gets a warm fall-off, dark gets the brand blue. */
  .ed-deep::after,
  .ed-navy::after {
    content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background:
      radial-gradient(70% 60% at 14% 0%, rgba(78,143,247,0.11), transparent 64%),
      radial-gradient(60% 55% at 92% 100%, rgba(20,184,166,0.07), transparent 66%);
  }
  .ed-cream::after {
    content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background:
      radial-gradient(72% 62% at 88% 4%, rgba(20,23,31,0.05), transparent 62%),
      radial-gradient(56% 48% at 4% 96%, rgba(47,110,222,0.05), transparent 66%);
  }

  /* ── Fractured seam. Same principle as the home page savings edge:
        the shaped break IS the border, there is no straight line under
        it. Three cut profiles so consecutive seams do not repeat. ── */
  .ed-seam::before {
    content: '';
    position: absolute;
    top: -1px; left: 0; right: 0;
    height: clamp(38px, 4.4vw, 64px);
    background: var(--ed-seam-from);
    pointer-events: none;
    z-index: 3;
  }
  .ed-seam-a::before {
    clip-path: polygon(0% 0%, 100% 0%, 100% 14%, 92% 31%, 84% 11%, 76% 33%, 68% 9%, 60% 29%, 52% 13%, 44% 35%, 36% 15%, 28% 31%, 20% 11%, 12% 27%, 4% 13%, 0% 23%);
  }
  .ed-seam-b::before {
    clip-path: polygon(0% 0%, 100% 0%, 100% 26%, 94% 9%, 86% 30%, 78% 14%, 70% 34%, 62% 12%, 55% 28%, 47% 10%, 39% 32%, 31% 15%, 23% 33%, 15% 12%, 7% 29%, 0% 11%);
  }
  .ed-seam-c::before {
    clip-path: polygon(0% 0%, 100% 0%, 100% 8%, 90% 27%, 82% 13%, 73% 30%, 65% 16%, 57% 34%, 48% 12%, 40% 28%, 32% 10%, 24% 32%, 16% 14%, 8% 30%, 0% 16%);
  }

  /* ── Watermarks. Line drawings only, at plate weight, keyed to the
        band's ink colour so the same markup works cream or dark. ── */
  .ed-wm {
    position: absolute;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
  }
  .ed-wm svg { width: 100%; height: 100%; display: block; }
  .ed-wm path,
  .ed-wm circle,
  .ed-wm line,
  .ed-wm ellipse {
    fill: none;
    stroke: rgb(var(--ed-ink));
    stroke-width: 1.05;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
  }
  .ed-wm-right  { top: 0; right: 0; bottom: 0; width: clamp(340px, 48vw, 760px); opacity: 0.20; }
  .ed-wm-left   { top: 0; left: 0;  bottom: 0; width: clamp(260px, 32vw, 480px); opacity: 0.18; }
  .ed-wm-full   { inset: 0; opacity: 0.14; }
  .ed-wm-corner { right: 0; bottom: 0; width: clamp(320px, 42vw, 660px); height: clamp(300px, 40vw, 600px); opacity: 0.17; }
  @media (max-width: 900px) { .ed-wm { display: none; } }

  /* Watermarks draw themselves in once, rather than fading as a lump. */
  .ed-wm-draw path,
  .ed-wm-draw circle,
  .ed-wm-draw ellipse {
    stroke-dasharray: 2600;
    stroke-dashoffset: 2600;
    transition: stroke-dashoffset 2.6s cubic-bezier(.22,.9,.24,1);
  }
  .ed-wm-draw.in path,
  .ed-wm-draw.in circle,
  .ed-wm-draw.in ellipse { stroke-dashoffset: 0; }
  .ed-wm-draw path:nth-child(2)  { transition-delay: .10s; }
  .ed-wm-draw path:nth-child(3)  { transition-delay: .20s; }
  .ed-wm-draw path:nth-child(4)  { transition-delay: .30s; }
  .ed-wm-draw path:nth-child(5)  { transition-delay: .40s; }
  .ed-wm-draw path:nth-child(6)  { transition-delay: .50s; }
  .ed-wm-draw path:nth-child(7)  { transition-delay: .60s; }
  .ed-wm-draw path:nth-child(8)  { transition-delay: .70s; }
  .ed-wm-draw path:nth-child(9)  { transition-delay: .80s; }
  .ed-wm-draw path:nth-child(10) { transition-delay: .90s; }

  /* Ledger rule field — very fine horizontal strata, the paper the
     page is printed on rather than a decorative texture. */
  .ed-strata::before {
    content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background-image: repeating-linear-gradient(
      to bottom,
      rgba(var(--ed-ink), 0.055) 0px,
      rgba(var(--ed-ink), 0.055) 1px,
      transparent 1px,
      transparent 34px);
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 72%, transparent);
    mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 72%, transparent);
  }

  /* ── The fold. Copy holds a narrow measure on the left of a full
        height hairline; the space to its right is left to the
        watermark on purpose. ── */
  .ed-hero {
    min-height: 74svh;
    display: flex;
    align-items: center;
    padding: clamp(120px, 13vw, 176px) 0 clamp(72px, 9vw, 120px);
  }
  .ed-hero-inner {
    position: relative;
    z-index: 2;
    display: block;
  }
  /* fold divider retired: this hero now runs full width, single column */
  .ed-hero-inner::before { display: none; }
  @media (max-width: 900px) {
    .ed-hero-inner { grid-template-columns: 1fr; }
    .ed-hero-inner::before { display: none; }
  }

  .ed-kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--mono);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--page-text-secondary);
    margin: 0 0 clamp(22px, 2.6vw, 32px);
  }
  .ed-kicker::before {
    content: '';
    width: 26px; height: 1px;
    background: var(--ed-accent);
    opacity: 0.75;
  }
  .ed-kicker em { font-style: normal; color: var(--ed-accent); }

  .ed-h1 {
    font-family: var(--sans);
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: clamp(32px, 4.1vw, 52px);
    letter-spacing: -0.022em;
    line-height: 1.1;
    color: var(--page-text);
    margin: 0 0 clamp(18px, 2vw, 26px);
    max-width: none;
    text-wrap: balance;
  }
  .ed-h1 .ed-soft { color: var(--page-text-secondary); }

  .ed-lede {
    font-family: var(--sans);
    font-size: clamp(16px, 1.3vw, 19px);
    font-weight: 400;
    line-height: 1.58;
    color: var(--page-text-secondary);
    max-width: 44ch;
    margin: 0;
  }

  /* The right half of the fold: a quiet caption hung off the hairline,
     used only where the page already has the words for it. */
  .ed-fold-aside {
    position: relative;
    z-index: 2;
    padding-left: clamp(0px, 3vw, 44px);
  }
  @media (max-width: 900px) { .ed-fold-aside { padding-left: 0; } }

  /* ── Reading band ────────────────────────────────────────────────── */
  .ed-read { padding: clamp(76px, 9vw, 130px) 0 clamp(84px, 10vw, 148px); }
  .ed-read-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
    gap: clamp(28px, 5vw, 76px);
    align-items: start;
  }
  @media (max-width: 900px) { .ed-read-grid { grid-template-columns: 1fr; gap: 26px; } }

  /* Left rail: mono label plus a rule that draws down the page. */
  .ed-rail {
    position: sticky;
    top: 128px;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--page-text-secondary);
    opacity: 0.72;
  }
  .ed-rail::after {
    content: '';
    display: block;
    width: 1px;
    height: clamp(60px, 9vw, 130px);
    margin-top: 18px;
    background: linear-gradient(to bottom, var(--ed-accent), transparent);
    transform: scaleY(0);
    transform-origin: 50% 0;
    transition: transform 1.1s cubic-bezier(.16,1,.3,1) .2s;
  }
  .ed-rail.in::after { transform: scaleY(1); }
  @media (max-width: 900px) {
    .ed-rail { position: static; }
    .ed-rail::after { width: 44px; height: 1px; margin-top: 14px; background: linear-gradient(to right, var(--ed-accent), transparent); transform: scaleX(0); transform-origin: 0 50%; }
    .ed-rail.in::after { transform: scaleX(1); }
  }

  .ed-measure { max-width: 68ch; }

  /* Standfirst — the opening paragraph set in the display face so the
     band opens with weight instead of dropping straight into body. */
  .ed-standfirst {
    font-family: var(--sans);
    font-optical-sizing: auto;
    font-weight: 480;
    font-size: clamp(20px, 2.05vw, 27px);
    line-height: 1.38;
    letter-spacing: -0.012em;
    color: var(--page-text);
    max-width: 26ch;
    margin: 0 0 clamp(30px, 3.4vw, 46px);
    text-wrap: pretty;
  }
  .ed-standfirst--wide { max-width: 34ch; }

  .ed-body p {
    font-family: var(--sans);
    font-size: clamp(15px, 1.12vw, 16.5px);
    line-height: 1.75;
    color: var(--page-text-secondary);
    margin: 0 0 1.35em;
    max-width: 62ch;
  }
  .ed-body p:last-child { margin-bottom: 0; }

  /* A pivot line — one short sentence the page turns on, given its own
     air and a hairline above it. Used only on existing sentences. */
  .ed-pivot {
    position: relative;
    margin: clamp(34px, 4.2vw, 56px) 0 clamp(30px, 3.6vw, 46px);
    padding-top: 26px;
    border-top: 1px solid var(--ed-rule);
  }
  .ed-pivot p {
    font-family: var(--sans);
    font-optical-sizing: auto;
    font-weight: 470;
    font-size: clamp(18px, 1.65vw, 22px);
    line-height: 1.42;
    color: var(--page-text);
    max-width: 30ch;
    margin: 0;
  }
  .ed-pivot::after {
    content: '';
    position: absolute; top: -1px; left: 0;
    width: 0; height: 1px;
    background: linear-gradient(90deg, var(--ed-accent), transparent);
    transition: width 1s cubic-bezier(.16,1,.3,1) .15s;
  }
  .ed-pivot.in::after { width: 92px; }

  /* ── Horizontal sequence rail. One continuous hairline with the
        moments hung beneath it, drawn left to right on entry. Replaces
        three floating cards with a single piece of structure. ── */
  .ed-seq { padding: clamp(66px, 8vw, 118px) 0 clamp(86px, 10vw, 150px); }
  .ed-seq-head {
    position: relative; z-index: 2;
    max-width: 46ch;
    margin: 0 0 clamp(46px, 5.6vw, 78px);
  }
  .ed-seq-track { position: relative; z-index: 2; }
  .ed-seq-line {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: var(--ed-rule);
  }
  .ed-seq-line::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(90deg, var(--ed-accent), var(--teal) 62%, transparent);
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform 1.9s cubic-bezier(.22,.9,.24,1) .15s;
  }
  .ed-seq-track.in .ed-seq-line::after { transform: scaleX(1); }

  .ed-seq-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(26px, 4vw, 64px);
    padding-top: 0;
  }
  .ed-seq-item { position: relative; padding-top: clamp(28px, 3vw, 40px); }
  /* the tick that hangs each moment off the rail */
  .ed-seq-item::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 1px; height: 0;
    background: var(--ed-accent);
    transition: height .7s cubic-bezier(.16,1,.3,1);
  }
  .ed-seq-track.in .ed-seq-item::before { height: clamp(18px, 2vw, 26px); }
  .ed-seq-track.in .ed-seq-item:nth-child(2)::before { transition-delay: .34s; }
  .ed-seq-track.in .ed-seq-item:nth-child(3)::before { transition-delay: .62s; }

  .ed-seq-when {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ed-accent);
    margin-bottom: 12px;
  }
  .ed-seq-what {
    font-family: var(--sans);
    font-optical-sizing: auto;
    font-weight: 560;
    font-size: clamp(19px, 1.7vw, 24px);
    letter-spacing: -0.014em;
    color: var(--page-text);
    margin-bottom: 12px;
  }
  .ed-seq-note {
    font-family: var(--sans);
    font-size: clamp(14px, 1.02vw, 15.5px);
    line-height: 1.68;
    color: var(--page-text-secondary);
    max-width: 36ch;
  }
  @media (max-width: 820px) {
    .ed-seq-row { grid-template-columns: 1fr; gap: 0; }
    .ed-seq-item { padding-top: 26px; padding-bottom: 30px; }
    .ed-seq-note { max-width: none; }
  }

  /* ── Choreography. Mirrors the home page: opacity plus a transform
        driven by --reveal-x / --reveal-y / --reveal-scale, staggered by
        --i, with headline-level elements resolving out of blur. ── */
  .ed-r {
    opacity: 0;
    transform: translate3d(var(--reveal-x, 0px), var(--reveal-y, 20px), 0) scale(var(--reveal-scale, 0.985));
    transition:
      opacity 0.9s cubic-bezier(.16,1,.3,1),
      transform 1s cubic-bezier(.16,1,.3,1),
      filter 1s cubic-bezier(.16,1,.3,1);
    transition-delay: calc(var(--i, 0) * 110ms);
    will-change: opacity, transform;
  }
  .ed-r.in { opacity: 1; transform: translate3d(0,0,0) scale(1); }
  .ed-head { filter: blur(8px); --reveal-y: 14px; --reveal-scale: 0.99; }
  .ed-head.in { filter: blur(0); }
  .ed-from-left  { --reveal-x: -26px; --reveal-y: 0px; }
  .ed-from-right { --reveal-x: 26px;  --reveal-y: 0px; }
  .ed-rise-lg    { --reveal-y: 34px; --reveal-scale: 0.965; }

  /* Line-by-line entrance for a display heading: each line clipped and
     lifted so the headline assembles rather than fades. */
  .ed-lines { display: block; }
  .ed-lines > span {
    display: block;
    overflow: hidden;
  }
  .ed-lines > span > span {
    display: block;
    transform: translateY(112%);
    transition: transform 1.05s cubic-bezier(.16,1,.3,1);
  }
  .ed-lines.in > span > span { transform: translateY(0); }
  .ed-lines.in > span:nth-child(2) > span { transition-delay: .1s; }
  .ed-lines.in > span:nth-child(3) > span { transition-delay: .2s; }
  .ed-lines.in > span:nth-child(4) > span { transition-delay: .3s; }

  @media (prefers-reduced-motion: reduce) {
    .ed-r, .ed-head, .ed-lines > span > span,
    .ed-wm-draw path, .ed-wm-draw circle, .ed-wm-draw ellipse,
    .ed-hero-inner::before, .ed-rail::after, .ed-pivot::after,
    .ed-seq-line::after, .ed-seq-item::before {
      transition: opacity .35s ease !important;
      transition-delay: 0s !important;
      transform: none !important;
      filter: none !important;
      stroke-dashoffset: 0 !important;
      opacity: 1;
    }
    .ed-hero-inner::before { transform: scaleY(1) !important; }
    .ed-rail::after { transform: scaleY(1) !important; }
    .ed-seq-line::after { transform: scaleX(1) !important; }
    .ed-pivot::after { width: 92px !important; }
    .ed-seq-item::before { height: 22px !important; }
  }

  /* Legacy sub-page shell is retired on these pages. */
  .ed-page .page-hero,
  .ed-page .page-body { display: none; }

  /* ── Closing statement band. One paragraph, given the whole band,
        set in the display face at reading weight. ── */
  .ed-close { padding: clamp(84px, 10vw, 148px) 0 clamp(96px, 11vw, 164px); }
  .ed-close-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
    gap: clamp(28px, 5vw, 76px);
    align-items: start;
  }
  @media (max-width: 900px) { .ed-close-grid { grid-template-columns: 1fr; gap: 26px; } }
  .ed-statement {
    font-family: var(--sans);
    font-optical-sizing: auto;
    font-weight: 460;
    font-size: clamp(19px, 1.95vw, 26px);
    line-height: 1.42;
    letter-spacing: -0.012em;
    color: var(--page-text);
    max-width: 30ch;
    margin: 0;
    text-wrap: pretty;
  }

  /* ── Fold refinements ───────────────────────────────────────────── */
  .ed-hero-inner { grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr); }
  .ed-hero-inner::before { left: calc(59% - 1px); }
  .ed-hero--tall { min-height: 82svh; }
  .ed-hero-inner--wide { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); }
  .ed-hero-inner--wide::before { left: calc(52% - 1px); }
  @media (max-width: 900px) {
    .ed-hero-inner--wide { grid-template-columns: 1fr; }
    .ed-hero-inner--wide::before { display: none; }
  }

  .ed-h1 { font-size: clamp(30px, 3.7vw, 46px); max-width: none; }
  .ed-h1--xl {
    font-size: clamp(46px, 7.4vw, 96px);
    font-weight: 580;
    letter-spacing: -0.032em;
    line-height: 1.02;
  }
  .ed-lede--wide { max-width: 40ch; font-size: clamp(17px, 1.42vw, 20.5px); }

  /* keep descenders off the clip edge of a masked headline line */
  .ed-lines > span { padding-bottom: 0.1em; margin-bottom: -0.1em; }

  /* ── Calibration pass ───────────────────────────────────────────── */
  .ed-hero-inner { grid-template-columns: minmax(0, 1.32fr) minmax(0, 0.68fr); }
  .ed-hero-inner::before { left: calc(65% - 1px); }
  .ed-hero-inner--wide { grid-template-columns: minmax(0, 1.16fr) minmax(0, 0.84fr); }
  .ed-hero-inner--wide::before { left: calc(57% - 1px); }
  @media (max-width: 900px) {
    .ed-hero-inner, .ed-hero-inner--wide { grid-template-columns: 1fr; }
  }

  /* rail sits closer to the column it annotates */
  .ed-read-grid,
  .ed-close-grid { grid-template-columns: minmax(0, 148px) minmax(0, 1fr); gap: clamp(24px, 3.4vw, 54px); }
  @media (max-width: 900px) {
    .ed-read-grid, .ed-close-grid { grid-template-columns: 1fr; gap: 24px; }
  }
  .ed-rail::after { height: clamp(46px, 6vw, 84px); }

  /* a closing paragraph is read, not admired — pull the display size
     back and let the measure breathe */
  .ed-statement {
    font-size: clamp(18px, 1.72vw, 23px);
    line-height: 1.46;
    max-width: 40ch;
  }
  .ed-close { padding: clamp(80px, 9.5vw, 136px) 0 clamp(84px, 10vw, 140px); }

  /* line work needs more weight over a dark plate than over cream */
  .ed-deep .ed-wm-right,
  .ed-navy .ed-wm-right  { opacity: 0.30; }
  .ed-deep .ed-wm-left,
  .ed-navy .ed-wm-left   { opacity: 0.24; }
  .ed-deep .ed-wm-corner,
  .ed-navy .ed-wm-corner { opacity: 0.24; }
  .ed-deep .ed-strata::before,
  .ed-navy .ed-strata::before { background-image: repeating-linear-gradient(to bottom, rgba(255,255,255,0.075) 0px, rgba(255,255,255,0.075) 1px, transparent 1px, transparent 34px); }

  .ed-pivot p { max-width: 34ch; }
  .ed-seq { padding: clamp(66px, 8vw, 118px) 0 clamp(72px, 8vw, 118px); }

  /* ── Small screens: the rail turns horizontal, the fold stops
        reserving space for a watermark that is no longer drawn. ── */
  @media (max-width: 900px) {
    .ed-rail::after {
      width: 44px;
      height: 1px;
      margin-top: 14px;
      background: linear-gradient(to right, var(--ed-accent), transparent);
      transform: scaleX(0);
      transform-origin: 0 50%;
    }
    .ed-rail.in::after { transform: scaleX(1); }
    .ed-hero { min-height: 0; padding: clamp(104px, 22vw, 132px) 0 clamp(52px, 12vw, 76px); }
    .ed-hero--tall { min-height: 0; }
    .ed-read { padding: clamp(56px, 13vw, 78px) 0 clamp(60px, 14vw, 86px); }
    .ed-close { padding: clamp(56px, 13vw, 78px) 0 clamp(64px, 15vw, 92px); }
    .ed-seq { padding: clamp(52px, 12vw, 74px) 0 clamp(60px, 14vw, 84px); }
    .ed-h1--xl { font-size: clamp(40px, 13vw, 58px); }
  }

  /* ═══════════════════════════════════════════════════════════════════
     MINIMAL PASS
     Kickers and rail labels removed. One left margin per page, shared
     by every band. Watermarks reduced to the site's own sparse stroke
     sets and confined to cream — the dark bands carry the brand glow
     and nothing else.
     ═══════════════════════════════════════════════════════════════ */

  /* every band measures from the same container, including the fold
     (whose flex centring would otherwise shrink-wrap it) */
  .ed-hero > .section-inner { width: 100%; }

  /* the rail column is gone; bands open on the accent rule that was
     already the sub-page motif */
  .ed-read-grid,
  .ed-close-grid { display: block; }
  .ed-rail { display: none; }

  .ed-open { position: relative; padding-top: 28px; }
  .ed-open::before {
    content: '';
    position: absolute; top: 0; left: 0;
    width: 0; height: 1px;
    background: linear-gradient(90deg, var(--accent), var(--teal));
    transition: width .9s cubic-bezier(.16,1,.3,1) .1s;
  }
  .ed-open.in::before { width: 46px; }

  /* watermarks: cream only, and only ever a few strokes */
  .ed-deep .ed-wm,
  .ed-navy .ed-wm { display: none; }
  .ed-cream .ed-wm-right { opacity: 0.19; width: clamp(320px, 46vw, 720px); }
  .ed-cream .ed-wm-corner { opacity: 0.17; }
  .ed-strata::before { display: none; }
  /* ── Watermarks pulled back: a corner mark, not a flourish ──────── */
  .ed-cream .ed-wm-right,
  .ed-cream .ed-wm-corner,
  .ed-cream .ed-wm-left {
    width: clamp(200px, 24vw, 360px);
    opacity: 0.13;
  }
  .ed-wm svg path:nth-child(n+4) { display: none; }
  .ed-wm path { stroke-width: 0.9; }

  .ed-pivot p { max-width: 38ch; }

  /* ═══════════════════════════════════════════════════════════════════
     PARITY + PACE
     One fold spec shared by every sub-page, one opener on every second
     band, and the whole entrance slowed to the home page's cadence.
     Seams are straight or single-angled; the geometry stays as quiet
     as the mark.
     ═══════════════════════════════════════════════════════════════ */

  /* ── Seams ──────────────────────────────────────────────────────── */
  .ed-seam::before { height: clamp(28px, 3vw, 46px); }
  /* a flat seam is simply the colour change, no overlay at all */
  .ed-seam-flat::before { display: none; }
  /* one angle */
  .ed-seam-down::before { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 0%); }
  .ed-seam-up::before   { clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%); }
  /* two angles, shallow */
  .ed-seam-vee::before  { clip-path: polygon(0% 0%, 100% 0%, 100% 24%, 52% 100%, 0% 30%); }

  /* ── One fold, five pages ───────────────────────────────────────── */
  .ed-hero,
  .ed-hero--tall { min-height: 74svh; }
  .ed-hero-inner,
  .ed-hero-inner--wide { grid-template-columns: minmax(0, 1.32fr) minmax(0, 0.68fr); }
  .ed-hero-inner::before,
  .ed-hero-inner--wide::before { left: calc(65% - 1px); }
  .ed-h1,
  .ed-h1--xl {
    font-size: clamp(30px, 3.7vw, 46px);
    font-weight: 600;
    letter-spacing: -0.022em;
    line-height: 1.1;
  }
  .ed-lede,
  .ed-lede--wide { max-width: 44ch; font-size: clamp(16px, 1.3vw, 19px); }
  @media (max-width: 900px) {
    .ed-hero-inner, .ed-hero-inner--wide { grid-template-columns: 1fr; }
    .ed-h1, .ed-h1--xl { font-size: clamp(28px, 7.4vw, 38px); }
  }

  /* ── Pace. Same curve, same order, more air between the beats. ──── */
  .ed-r {
    transition:
      opacity 1.5s cubic-bezier(.16,1,.3,1),
      transform 1.7s cubic-bezier(.16,1,.3,1),
      filter 1.6s cubic-bezier(.16,1,.3,1);
    transition-delay: calc(var(--i, 0) * 210ms);
  }
  .ed-lines > span > span { transition: transform 1.45s cubic-bezier(.16,1,.3,1); }
  .ed-lines.in > span:nth-child(2) > span { transition-delay: .17s; }
  .ed-lines.in > span:nth-child(3) > span { transition-delay: .34s; }
  .ed-lines.in > span:nth-child(4) > span { transition-delay: .51s; }
  /* the lede follows the headline rather than racing it */
  .ed-hero .ed-lede { transition-delay: .42s; }

  .ed-wm-draw path,
  .ed-wm-draw circle,
  .ed-wm-draw ellipse { transition: stroke-dashoffset 3.6s cubic-bezier(.22,.9,.24,1); }
  .ed-hero-inner::before { transition: transform 2.1s cubic-bezier(.16,1,.3,1) .35s; }
  .ed-open::before { transition: width 1.3s cubic-bezier(.16,1,.3,1) .2s; }
  .ed-pivot::after { transition: width 1.4s cubic-bezier(.16,1,.3,1) .2s; }
  .ed-seq-line::after { transition: transform 2.6s cubic-bezier(.22,.9,.24,1) .25s; }
  .ed-seq-track.in .ed-seq-item::before { transition: height 1s cubic-bezier(.16,1,.3,1); }
  .ed-seq-track.in .ed-seq-item:nth-child(2)::before { transition-delay: .48s; }
  .ed-seq-track.in .ed-seq-item:nth-child(3)::before { transition-delay: .88s; }
  .ed-hero { align-items: flex-start; }
  .ed-hero-inner { align-items: start; }
  /* reading band tightened so it clears the fold alongside the hero */
  .ed-read, .ed-close { padding: clamp(46px, 4.8vw, 64px) 0 clamp(48px, 5vw, 68px); }
  .ed-seq { padding: clamp(46px, 4.8vw, 64px) 0 clamp(52px, 5.4vw, 74px); }
  .ed-open { padding-top: 24px; }
  .ed-standfirst { margin: 0 0 clamp(22px, 2.4vw, 32px); }
  .ed-body p { margin: 0 0 1.15em; }
  .ed-pivot { margin: clamp(24px, 2.8vw, 36px) 0 clamp(22px, 2.6vw, 32px); padding-top: 22px; }

  /* ═══════════════════════════════════════════════════════════════════
     FOLD BUDGET
     The fold is sized so the reading band that follows it lands whole
     inside the same screen, the way the team page does, instead of
     being cut in half. The hero no longer reserves a minimum height —
     it is exactly its copy plus air.
     ═══════════════════════════════════════════════════════════════ */
  .ed-hero,
  .ed-hero--tall {
    min-height: 0;
    padding: clamp(84px, 8.4vw, 108px) 0 clamp(38px, 4.2vw, 58px);
  }
  .ed-read,
  .ed-close { padding: clamp(50px, 5.4vw, 74px) 0 clamp(54px, 5.8vw, 80px); }
  .ed-seq   { padding: clamp(50px, 5.4vw, 74px) 0 clamp(58px, 6vw, 84px); }

  /* On a two-band page there is no third section to show through, so the
     closing band holds the fold open and the footer stays off it. */
  body > section.ed-band:first-of-type + section.ed-band:last-of-type {
    min-height: 62svh;
    display: flex;
    align-items: center;
  }
  body > section.ed-band:first-of-type + section.ed-band:last-of-type > .section-inner { width: 100%; }

  @media (max-width: 900px) {
    .ed-hero, .ed-hero--tall { padding: clamp(88px, 19vw, 112px) 0 clamp(32px, 7vw, 48px); }
    .ed-read, .ed-close, .ed-seq { padding: clamp(44px, 10vw, 62px) 0 clamp(48px, 11vw, 68px); }
    body > section.ed-band:first-of-type + section.ed-band:last-of-type { min-height: 0; display: block; }
  }


  @media (max-width: 900px) { .ed-hero { align-items: flex-start; } }




  @media (prefers-reduced-motion: reduce) {
    .ed-open::before { width: 46px !important; transition: none !important; }
  }

  /* ── "Why Revori" tone ladder ─────────────────────────────────────
        Extra band tone sitting between cream and the dark bands, for
        the three-tier progression on this page only. ── */
  .ed-stone {
    background: #c7c0b0;
    --page-text: #1b1d22;
    --page-text-secondary: rgba(27,29,34,0.66);
    --ed-rule: rgba(27,29,34,0.18);
    --ed-rule-strong: rgba(27,29,34,0.3);
    --ed-ink: 27,29,34;
    --ed-accent: #2f6ede;
    --ed-seam-from: #f4f0e8;
  }

  /* ── Tier rows: text left, layered-diamond visual right. ── */
  .wr-tier { padding: clamp(64px, 8vw, 108px) 0; }
  .wr-tier-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: clamp(36px, 6vw, 96px);
    align-items: center;
  }
  @media (max-width: 860px) {
    .wr-tier-grid { grid-template-columns: 1fr; gap: 40px; }
  }

  .wr-kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--mono);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--page-text-secondary);
    margin: 0 0 clamp(16px, 2vw, 22px);
  }
  .wr-kicker::before {
    content: '';
    width: 22px; height: 1px;
    background: var(--ed-accent);
    opacity: 0.75;
  }

  .wr-h {
    font-family: var(--sans);
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: clamp(24px, 2.7vw, 34px);
    letter-spacing: -0.015em;
    line-height: 1.16;
    color: var(--page-text);
    margin: 0 0 clamp(12px, 1.6vw, 16px);
  }

  .wr-p {
    font-family: var(--sans);
    font-size: clamp(14.5px, 1.05vw, 16px);
    line-height: 1.68;
    color: var(--page-text-secondary);
    max-width: 42ch;
    margin: 0;
  }

  .wr-caption {
    margin-top: clamp(26px, 3.6vw, 40px);
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--page-text-secondary);
    opacity: 0.65;
    line-height: 1.8;
  }

  .wr-vis {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(16px, 2.6vw, 34px);
  }
  .wr-vis-svg { width: 100%; max-width: 260px; justify-self: center; overflow: visible; }
  .wr-labels {
    position: relative;
    align-self: stretch;
    padding: 6px 0;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--page-text-secondary);
    opacity: 0.75;
    text-align: right;
    white-space: nowrap;
  }
  .wr-labels span {
    position: absolute;
    right: 0;
    transform: translateY(-50%);
  }
  @media (max-width: 560px) {
    .wr-vis { grid-template-columns: 1fr; justify-items: center; }
    .wr-labels {
      position: static; display: flex; flex-wrap: wrap;
      justify-content: center; gap: 8px 14px; text-align: center;
    }
    .wr-labels span { position: static; transform: none; }
  }

  .wr-diamond { fill: rgba(var(--ed-ink), 0.07); stroke: rgba(var(--ed-ink), 0.4); stroke-width: 1.1; }
  .wr-diamond--soft { fill: rgba(var(--ed-ink), 0.04); stroke: rgba(var(--ed-ink), 0.24); }
  .wr-node { fill: var(--ed-accent); filter: drop-shadow(0 0 6px var(--ed-accent)); }
  .wr-node--dim { fill: rgba(var(--ed-ink), 0.5); filter: none; }
  .wr-beam { stroke: var(--ed-accent); stroke-width: 1.4; opacity: 0.5; filter: drop-shadow(0 0 5px var(--ed-accent)); }
