/* ---- runway (Runway — Business funding advisory 97) — bank slip: a cool
   near-white paper ground, graphite type, and one deep ledger blue that is only
   ever let onto the numerals, the button fills and the single highlighted price
   card. Bands are separated by hairlines at eight percent black instead of an
   alternating tint, so the whole page reads as one sheet of paper.
   THE STRUCTURAL MOVE: the statistics are pulled OFF the hero into their own
   contained four-up row, each figure set five times the size of the label under
   it — the loudest thing on the page is a number. From there the page descends
   through a deliberate count rhythm (4 figures, 1 video, 6 icons, 4 photographs,
   3 prices, 8 client rows) on uniform generous gaps, with no gapless mosaic
   anywhere and photography in four places only, desaturated so the blue stays
   the one saturated thing on the sheet. ---- */
body.t-runway.ws-body { --bg: #f3f4f7; --fg: #4d545e; --heading: #171b21; --text: #4d545e; --muted: #878f9a;
  --rw-line: rgba(18,22,28,0.08); --rw-edge: rgba(18,22,28,0.18); --rw-blue: #17407c; }
body.t-runway { background: #f3f4f7; color: #171b21; }
body.t-runway .ws-nav { background: var(--bg); backdrop-filter: none; border-bottom: 1px solid var(--rw-line); }
body.t-runway .ws-brand { text-transform: uppercase; letter-spacing: 0.34em; font-size: 12.5px; font-weight: 700; }

/* the only edge-to-edge photography above the fold; copy centred, one flat slab */
body.t-runway .ws-hero { min-height: 90vh; --hero-a: rgba(14,18,24,0.44); --hero-b: rgba(14,18,24,0.64); }
body.t-runway .ws-hero h1 { font-size: clamp(34px, 5.2vw, 60px); font-weight: 600; letter-spacing: -0.035em; line-height: 1.06; max-width: 19ch; text-shadow: none; }
body.t-runway.ws-body .btn.brand { background: var(--rw-blue); color: #f3f4f7; border-radius: 0; text-transform: uppercase; letter-spacing: 0.18em; font-size: 11px; font-weight: 700; padding: 16px 30px; }
body.t-runway.ws-body .btn.brand:hover { background: #0f2f5d; }

/* hairlines, not tints — the ground never changes under a heading */
body.t-runway.ws-body .ws-section, body.t-runway.ws-body .ws-section:nth-child(even) { background: none; padding: 104px 0; border-top: 1px solid var(--rw-line); }
body.t-runway .ws-h2 { text-align: left; font-size: clamp(18px, 2.2vw, 23px); font-weight: 600; letter-spacing: -0.015em; color: var(--heading); border-bottom: 1px solid var(--rw-line); padding-bottom: 16px; margin: 0 0 44px; }
/* the shared sheet hard-codes these four colours for light pages only */
body.t-runway .ws-sub, body.t-runway .ws-feature p, body.t-runway .ws-plan li, body.t-runway .ws-quote blockquote { text-align: left; margin-left: 0; color: var(--text); }
/* nothing on this page is rounded or lifted */
body.t-runway .ws-plan, body.t-runway .ws-quote, body.t-runway .ws-video-frame, body.t-runway .ws-story-media img,
body.t-runway .ws-photogrid-grid img, body.t-runway .ws-field input, body.t-runway .ws-field textarea, body.t-runway .ws-field select { border-radius: 0; box-shadow: none; }

/* THE NUMERALS — the four figures the whole page is built around */
body.t-runway .ws-col-h { font-size: clamp(38px, 5vw, 66px); font-weight: 600; letter-spacing: -0.05em; line-height: 1; color: var(--rw-blue); margin: 0 0 16px; }
body.t-runway .ws-col p { text-transform: uppercase; letter-spacing: 0.15em; font-size: 10.5px; font-weight: 700; line-height: 1.8; color: var(--muted); margin: 0; }

/* photography — cooled off so the blue is the only saturated thing on the sheet */
body.t-runway .ws-story-media img, body.t-runway .ws-photogrid-grid img { filter: saturate(0.42) contrast(1.04); }
body.t-runway .ws-photogrid-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding: 0 20px; }

/* the callout — the one band on the page that is not paper */
body.t-runway.ws-body .ws-section.ws-video { background-image: linear-gradient(rgba(15,20,27,0.74), rgba(15,20,27,0.80)), url("/media/samples/rwy_video.jpg"); background-size: cover; background-position: center; border-top: 0; }
body.t-runway .ws-video .ws-h2 { color: #eef0f4; border-bottom-color: rgba(238,240,244,0.26); }
body.t-runway .ws-video-caption { text-align: left; color: #b3bcc8; }

/* six tiles in two rows of three, then three equal price cards — nothing orphans */
body.t-runway .ws-features-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 52px 44px; }
body.t-runway .ws-feature { text-align: left; padding: 0; }
body.t-runway .ws-feature-icon, body.t-runway .ws-plan li::before { color: var(--rw-blue); margin-bottom: 16px; }
body.t-runway .ws-pricing-grid, body.t-runway .ws-testimonials-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 1120px; }
body.t-runway .ws-plan { background: none; border: 1px solid var(--rw-line); text-align: left; padding: 34px 30px; }
body.t-runway .ws-plan-amt { font-size: clamp(32px, 3.8vw, 48px); font-weight: 600; letter-spacing: -0.045em; color: var(--rw-blue); }
/* the visual climax: one card of the three is filled, and it is the only fill */
body.t-runway .ws-plan:nth-child(2) { background: var(--rw-blue); border-color: var(--rw-blue); }
body.t-runway .ws-plan:nth-child(2) h3, body.t-runway .ws-plan:nth-child(2) li, body.t-runway .ws-plan:nth-child(2) li::before,
body.t-runway .ws-plan:nth-child(2) .ws-plan-amt, body.t-runway .ws-plan:nth-child(2) .ws-plan-period { color: #eef0f4; }
body.t-runway.ws-body .ws-plan:nth-child(2) .btn.brand { background: #eef0f4; color: var(--rw-blue); }

/* quotes and the client directory — ruled runs, never boxes */
body.t-runway .ws-quote { background: none; border: 0; border-top: 2px solid var(--rw-blue); padding: 20px 0 0; }
body.t-runway .ws-quote blockquote::before { content: none; }
body.t-runway .ws-list { padding-left: 0; list-style: none; }
body.t-runway .ws-list li { border-top: 1px solid var(--rw-line); padding: 15px 0; margin: 0; font-size: 15px; line-height: 1.6; }
/* the close — the band the brand colour would have filled stays paper */
body.t-runway.ws-body .ws-cta, body.t-runway .ws-cta-inner h2 { color: var(--heading); }
body.t-runway .ws-field input, body.t-runway .ws-field textarea, body.t-runway .ws-field select { border-color: var(--rw-edge); background: none; }

@media (max-width: 900px) {
  body.t-runway .ws-features-grid, body.t-runway .ws-cols-4, body.t-runway .ws-photogrid-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-runway .ws-pricing-grid, body.t-runway .ws-testimonials-grid { grid-template-columns: 1fr; }
}

/* night — the same slip, printed white on carbon */
html[data-theme="dark"] body.t-runway.ws-body, html[data-theme="dark"] body.t-runway { --bg: #0d1117; --fg: #a3acb8; --heading: #eef1f5; --text: #a3acb8; --muted: #6f7a87;
  --rw-line: rgba(238,241,245,0.11); --rw-edge: rgba(238,241,245,0.22); --rw-blue: #6098dd; background: #0d1117; color: #eef1f5; }
html[data-theme="dark"] body.t-runway.ws-body .btn.brand { background: var(--rw-blue); color: #0d1117; }
html[data-theme="dark"] body.t-runway.ws-body .btn.brand:hover { background: #85b1e8; }
html[data-theme="dark"] body.t-runway .ws-plan:nth-child(2) h3, html[data-theme="dark"] body.t-runway .ws-plan:nth-child(2) li,
html[data-theme="dark"] body.t-runway .ws-plan:nth-child(2) li::before, html[data-theme="dark"] body.t-runway .ws-plan:nth-child(2) .ws-plan-amt,
html[data-theme="dark"] body.t-runway .ws-plan:nth-child(2) .ws-plan-period { color: #0d1117; }
html[data-theme="dark"] body.t-runway.ws-body .ws-plan:nth-child(2) .btn.brand { background: #0d1117; color: var(--rw-blue); }
