/* ---- splice (Splice — Community fibre build 139) ---------------------------
   STRUCTURAL MOVE: the campaign band is a REAL GAUGE. Four oversized, very
   light figures stand on a 3px dust hairline that runs almost edge to edge
   directly under the stage, and an orange fill is drawn across that hairline to
   the fraction pledged (--sc-done) — so the first thing read after the headline
   is a number standing on its own progress rule. Everything between the stage
   and the footer is counted, ruled or iconed: photography is rationed to the
   three hero slides, one split block and one gapless four-tile wall. Lime-washed
   bone under bitumen ink; duct orange is spent on three things only — the gauge,
   the buttons and the campaign figures. Contact band and footer invert to
   near-black. Nothing is reached with :first-of-type / :nth-of-type; the partner
   row is the page's SECOND list, so it is addressed as #list-2. */
body.t-splice.ws-body {
  --bg: #f0eee2; --fg: #4b4940; --heading: #14130f; --text: #4b4940; --muted: #8a877b;
  --sc-duct: #e2621b; --sc-line: #d7d3c3; --sc-dark: #131210; --sc-done: 68%;
  --hero-a: rgba(12, 12, 10, .30); --hero-b: rgba(12, 12, 10, .70);
}
body.t-splice { background: #f0eee2; color: #14130f; }

/* the bar floats on the stage — wordmark hard left, four lowercase words right */
body.t-splice .ws-nav { position: absolute; top: 0; left: 0; right: 0; padding: 16px 0; background: transparent; backdrop-filter: none; border-bottom: 0; }
body.t-splice .ws-brand, body.t-splice .ws-nav-links a, body.t-splice .ws-nav-links a:hover, body.t-splice .ws-nav-links a.on { color: #f4f2e8; font-size: 13px; font-weight: 600; letter-spacing: .04em; opacity: .9; border-bottom: 0; }

/* the stage — one build at dawn, midday and dusk, copy hard left */
body.t-splice .ws-hero { min-height: 100vh; }
body.t-splice .ws-hero h1 { font-size: clamp(36px, 6.6vw, 80px); font-weight: 300; letter-spacing: -.035em; line-height: 1.02; max-width: 17ch; text-shadow: none; }
body.t-splice.ws-body .btn.brand, body.t-splice.ws-body .ws-hero-cta.btn.brand, body.t-splice.ws-body .ws-cta .btn.brand { background: var(--sc-duct); color: #14130f; border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: .18em; font-size: 11px; font-weight: 800; padding: 17px 32px; }

/* one unbroken lime-washed ground: the zebra wash never fires and the shared
   brand-filled cta band is flattened back onto the paper with it */
body.t-splice.ws-body .ws-section, body.t-splice.ws-body .ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink) { background: transparent; color: var(--text); padding: 96px 0; }
body.t-splice .ws-h2 { text-align: center; color: var(--heading); font-size: clamp(20px, 2.6vw, 28px); font-weight: 600; letter-spacing: -.022em; margin: 0 0 42px; }
/* the shared sheet hard-codes these greys for light pages only */
body.t-splice .ws-sub, body.t-splice .ws-feature p, body.t-splice .ws-story-copy p, body.t-splice .ws-quote blockquote, body.t-splice .ws-list li { color: var(--text); line-height: 1.85; }
body.t-splice .ws-feature h3, body.t-splice .ws-story-copy h2, body.t-splice .ws-cta-inner h2, body.t-splice .ws-quote figcaption strong { color: var(--heading); }

/* THE MOVE — four figures standing on a gauge drawn to the money, welded to the
   bottom edge of the stage and run almost the full width of the window */
body.t-splice.ws-body .ws-columns { padding: 0 0 88px; }
body.t-splice .ws-columns .ws-container { max-width: none; padding: 0 40px; }
body.t-splice .ws-columns .ws-cols { position: relative; border-top: 3px solid var(--sc-line); padding-top: 40px; gap: 26px; }
body.t-splice .ws-columns .ws-cols::before { content: ""; position: absolute; top: -3px; left: 0; width: var(--sc-done); height: 3px; background: var(--sc-duct); }
body.t-splice .ws-col-h { color: var(--sc-duct); font-size: clamp(34px, 5.6vw, 74px); font-weight: 200; letter-spacing: -.045em; line-height: .96; font-variant-numeric: tabular-nums; margin: 0 0 14px; }
body.t-splice .ws-col p { color: var(--muted); text-transform: uppercase; letter-spacing: .17em; font-size: 10.5px; font-weight: 700; line-height: 1.7; margin: 0; }

/* four icon-and-heading tiles — cards, not photographs */
body.t-splice .ws-features-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 44px 34px; }

/* the argument, in a bare centred column — the whitespace is the pacing device */
body.t-splice.ws-body .ws-richtext { padding: 132px 0; }
body.t-splice .ws-richtext .ws-container { max-width: 660px; text-align: center; font-size: 17px; }

/* the four phases — ruled rows under a leading numeral, no bullets anywhere */
body.t-splice .ws-list-number { list-style: none; padding-left: 0; counter-reset: ph; }
body.t-splice .ws-list-number li { counter-increment: ph; position: relative; border-top: 1px solid var(--sc-line); margin: 0; padding: 26px 0 26px 80px; font-size: 15.5px; }
body.t-splice .ws-list-number li::before { content: counter(ph, decimal-leading-zero); position: absolute; left: 0; top: 22px; font-size: 32px; font-weight: 200; letter-spacing: -.04em; line-height: 1; color: var(--sc-line); }

/* the partners are SET AS TYPE, six names ruled three across — never logo images */
body.t-splice #list-2 .ws-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; list-style: none; padding: 0; border-top: 1px solid var(--sc-line); }
body.t-splice #list-2 .ws-list li { border-bottom: 1px solid var(--sc-line); padding: 20px 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; line-height: 1.5; color: var(--heading); }

/* the work itself — four tiles welded gapless, and the only other photograph is
   the split block, both squared off and cooled so the duct orange stays alone */
body.t-splice .ws-photogrid-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
body.t-splice .ws-story-media img, body.t-splice .ws-photogrid-grid img { border-radius: 0; filter: saturate(.76) contrast(1.05); }

/* four voices, ruled rather than boxed — the quote glyph would spend the orange */
body.t-splice .ws-testimonials-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 50px; }
body.t-splice .ws-quote { background: transparent; border: 0; border-top: 1px solid var(--sc-line); border-radius: 0; box-shadow: none; padding: 22px 0 0; }
body.t-splice .ws-quote blockquote::before { content: none; }

/* the foot inverts to bitumen: four ruled fields and one warm slab, no map */
body.t-splice.ws-body .ws-contact { background: var(--sc-dark); padding: 100px 0 108px; }
body.t-splice .ws-contact .ws-h2, body.t-splice .ws-contact .ws-field label { color: #f2f0e6; }
body.t-splice .ws-field input, body.t-splice .ws-field textarea { background: transparent; border: 0; border-bottom: 1px solid rgba(242,240,230,.26); border-radius: 0; color: #f2f0e6; padding: 12px 2px; }
body.t-splice .ws-footer { background: var(--sc-dark); color: #858075; border-top: 0; }

/* mobile: every four-across rhythm halves and the menu drops onto bone */
@media (max-width: 860px) {
  body.t-splice .ws-features-grid, body.t-splice .ws-photogrid-grid, body.t-splice .ws-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-splice .ws-testimonials-grid, body.t-splice #list-2 .ws-list { grid-template-columns: 1fr; }
  body.t-splice .ws-nav-links a { color: var(--heading); opacity: 1; }
  body.t-splice .ws-hero h1 { font-size: clamp(32px, 10vw, 54px); }
}

/* night — the same gauge, printed bone on bitumen, orange one stop hotter */
html[data-theme="dark"] body.t-splice.ws-body, html[data-theme="dark"] body.t-splice {
  --bg: #121210; --fg: #a4a196; --heading: #f2f0e6; --text: #a4a196; --muted: #7c7970;
  --sc-duct: #ff7326; --sc-line: #302e28; --sc-dark: #080807; --sc-done: 68%;
  --hero-a: rgba(6, 6, 5, .34); --hero-b: rgba(6, 6, 5, .74);
  background: #121210; color: #f2f0e6;
}
