/* ---------- 291 · Skemer — night market hall, Wolseley (website) ----------
   THE STRUCTURAL MOVE: the reference is a single 100vh photograph with a
   countdown floating inside it. Rebuilt here as a full-viewport stage carrying
   the type with NO overlay panel, and a four-numeral metric row pulled UP over
   the bottom of that photograph (negative margin + z-index) so the figures
   crest the fold exactly the way the countdown does. Near-black ground, one
   sodium amber, no second hue — the photographs supply every other colour. */
body.t-skemer.ws-body {
  --bg: #0b0c0e; --fg: #b4b0a7; --heading: #f2efe8; --text: #aca89f; --muted: #7a766f;
  --sk-amber: #e8a33d; --sk-graphite: #14161a; --sk-line: rgba(242, 239, 232, .16);
  --hero-a: rgba(11, 12, 14, .24); --hero-b: rgba(11, 12, 14, .62);
}
body.t-skemer .ws-brand, body.t-skemer .ws-nav-links a { text-transform: lowercase; font-weight: 400; letter-spacing: -.02em; }

/* the stage — one photograph, full viewport, tiny eyebrow riding directly on
   top of an oversized lowercase line, and the stack lifted to clear the row */
body.t-skemer .ws-hero { min-height: 100vh; background-color: var(--bg); }
body.t-skemer .ws-hero-inner { display: flex; flex-direction: column; align-items: center; padding-bottom: 196px; }
body.t-skemer .ws-hero-inner p { order: -1; max-width: none; margin: 0 0 12px; opacity: .74; font-size: 11.5px; font-weight: 500; letter-spacing: .34em; text-transform: lowercase; }
body.t-skemer .ws-hero h1 { max-width: none; margin: 0 0 44px; font-size: clamp(42px, 10.5vw, 124px); font-weight: 400; line-height: .92; letter-spacing: -.055em; text-transform: lowercase; text-shadow: 0 2px 44px rgba(0, 0, 0, .5); }

/* one button shape for the whole page: a sodium ghost — hero, close, notify */
body.t-skemer.ws-body .ws-hero-cta.btn.brand, body.t-skemer.ws-body .ws-cta .btn.brand, body.t-skemer.ws-body .ws-contact .btn.brand { background: transparent; color: var(--sk-amber); box-shadow: inset 0 0 0 1px rgba(232, 163, 61, .55); border-radius: 999px; padding: 15px 36px; font-size: 10.5px; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; }
body.t-skemer.ws-body .ws-hero-cta.btn.brand:hover, body.t-skemer.ws-body .ws-cta .btn.brand:hover, body.t-skemer.ws-body .ws-contact .btn.brand:hover { background: var(--sk-amber); color: #0b0c0e; }

/* bands: black everywhere, graphite twice, and never a rule between them */
body.t-skemer.ws-body .ws-section:not(.ws-story):not(.ws-quoteblock):not(.ws-features) { background: var(--bg); }
body.t-skemer.ws-body .ws-section.ws-story, body.t-skemer.ws-body .ws-section.ws-quoteblock { background: var(--sk-graphite); }
body.t-skemer .ws-h2, body.t-skemer .ws-story-copy h2, body.t-skemer .ws-cta-inner h2 { color: var(--heading); font-weight: 400; letter-spacing: -.04em; text-transform: lowercase; }

/* the four numerals crest the fold — hauled up over the last of the photograph */
body.t-skemer.ws-body .ws-section.ws-features { position: relative; z-index: 1; margin-top: -134px; padding: 0 0 108px; background: transparent; }
body.t-skemer .ws-features-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
body.t-skemer .ws-feature h3 { margin: 0 0 12px; color: var(--sk-amber); font-size: clamp(38px, 5.4vw, 66px); font-weight: 400; line-height: 1; letter-spacing: -.05em; }
body.t-skemer .ws-quote-a, body.t-skemer .ws-feature p, body.t-skemer .ws-form label:not(.ws-choice), body.t-skemer .ws-form legend { margin: 0; color: var(--muted); font-size: 10.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; }

/* the only split on the page — one picture, a short block, and a lot of air */
body.t-skemer.ws-body .ws-section.ws-story, body.t-skemer.ws-body .ws-section.ws-cta { padding: 136px 0; }
body.t-skemer .ws-story-grid { grid-template-columns: .78fr 1fr; gap: 68px; }
body.t-skemer .ws-story-media img, body.t-skemer .ws-gallery-item img { border-radius: 0; aspect-ratio: 1 / 1; }
body.t-skemer .ws-story-copy p, body.t-skemer .ws-sub { color: var(--text); font-size: 15.5px; line-height: 1.9; }

/* six night tiles welded wall to wall — no gutter, no radius, no container */
body.t-skemer .ws-gallery .ws-container { max-width: 100%; padding: 0; }
body.t-skemer .ws-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
body.t-skemer .ws-quote-t { color: var(--heading); font-style: normal; font-weight: 400; font-size: clamp(20px, 2.8vw, 32px); line-height: 1.42; letter-spacing: -.02em; }
body.t-skemer .ws-cta-inner h2 { font-size: clamp(32px, 5.4vw, 64px); line-height: .98; letter-spacing: -.055em; }
body.t-skemer .ws-field > input { background: transparent; border: 1px solid var(--sk-line); border-radius: 0; color: var(--heading); }

/* narrow: the numerals stop cresting and stand on their own — 4 folds to 2x2,
   the six tiles fold to 3x2, and every row still fills */
@media (max-width: 900px) {
  body.t-skemer.ws-body .ws-section.ws-features { margin-top: 0; padding: 66px 0; }
  body.t-skemer .ws-features-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 42px 0; }
  body.t-skemer .ws-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-skemer .ws-story-grid { grid-template-columns: 1fr; gap: 34px; }
  body.t-skemer .ws-hero-inner { padding-bottom: 64px; }
}

/* night — the ground drops past black to coal, the graphite band closes up
   behind it, and the sodium lifts a shade so the numerals still carry */
html[data-theme="dark"] body.t-skemer.ws-body {
  --bg: #050506; --fg: #a6a29a; --heading: #fffdf7; --text: #9d998f; --muted: #6a6660;
  --sk-amber: #f4b45c; --sk-graphite: #0d0f12; --sk-line: rgba(255, 253, 247, .14);
  --hero-a: rgba(2, 2, 3, .32); --hero-b: rgba(2, 2, 3, .70);
}