/* ---- rugslag (Rugslag — Learn-to-swim school 125) ---------------------------
   STRUCTURAL MOVE: the middle of the page is ONE text-only slab. The four class
   tiles and the eight-line timetable share a single cooler tile band — the
   columns block loses its bottom padding, the list block loses its top padding
   — so they weld together with no seam and no heading between them. Photographs
   are rationed to the two ends: a full-viewport three-slide stage at the top,
   four captioned tiles at the bottom. Between the two sits one portrait with NO
   title band over it — the coach's name is the only heading — so the page opens
   on a person rather than a brand. Every small label on the page (her name, the
   class tiles, the tile captions) runs on one 12.5px uppercase scale, which is
   what lets the timetable be the biggest block of type in the middle. Lane-rope
   red is spent exactly three ways: nav links, the first (active) class tile,
   and the buttons. Padding sits low-specificity so the two welded bands win. */
body.t-rugslag.ws-body {
  --bg: #eef0ee; --fg: #2f4a57; --heading: #17394d; --text: #2f4a57; --muted: #6e8792;
  --rg-tile: #e0e7e7; --rg-line: #ccd7d7; --rg-rope: #c0392b;
  --hero-a: rgba(11, 30, 40, .20); --hero-b: rgba(11, 30, 40, .58);
}
body.t-rugslag { background: var(--bg); }

/* the wordmark sits centred with the four links gathered around it */
/* header stays one row, brand hard left — house rule; the theme keeps its
   own type, colour and rhythm, it just does not restack or centre the name */
body.t-rugslag .ws-nav-links { gap: 28px; }
body.t-rugslag .ws-brand { color: var(--heading); text-transform: uppercase; letter-spacing: .3em; font-size: 13px; font-weight: 700; }
body.t-rugslag .ws-nav-links a { color: var(--heading); opacity: .78; text-transform: uppercase; letter-spacing: .16em; font-size: 10.5px; font-weight: 600; }
/* red 1 of 3 */
body.t-rugslag .ws-nav-links a:hover, body.t-rugslag .ws-nav-links a.on { color: var(--rg-rope); opacity: 1; }

/* the stage — one whole viewport, one line under the heading, one ask */
body.t-rugslag .ws-hero { min-height: 100vh; }
body.t-rugslag .ws-hero h1 { color: #f4f7f6; font-size: clamp(40px, 7.4vw, 92px); font-weight: 700; letter-spacing: -.04em; line-height: 1; text-shadow: none; max-width: 16ch; }
body.t-rugslag .ws-hero p { color: #dfe7e6; font-size: 15.5px; line-height: 1.7; max-width: 52ch; margin: 20px auto 32px; }
/* red 3 of 3 — flat slabs, no border anywhere */
body.t-rugslag.ws-body .btn.brand { background: var(--rg-rope); color: #fdf6f4; border: 0; border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: .18em; font-size: 10.5px; font-weight: 700; padding: 16px 32px; }
body.t-rugslag.ws-body .ws-hero-cta.btn.brand { background: var(--rg-rope); color: #fdf6f4; box-shadow: none; }

/* one flat cement ground everywhere except the welded middle */
body.t-rugslag .ws-section { padding: 98px 0; }
body.t-rugslag.ws-body .ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink) { background: transparent; }
body.t-rugslag .ws-h2, body.t-rugslag .ws-title-h, body.t-rugslag .ws-cta-inner h2 { color: var(--heading); font-size: clamp(26px, 3.8vw, 44px); font-weight: 700; letter-spacing: -.035em; line-height: 1.06; margin: 0 0 14px; }
body.t-rugslag .ws-sub, body.t-rugslag .ws-title-sub, body.t-rugslag .ws-col p, body.t-rugslag .ws-gallery-cap span { color: var(--muted); font-size: 14px; line-height: 1.72; }

/* the portrait lands with no title band — square-cut, same crop as the tiles */
body.t-rugslag .ws-story-media img, body.t-rugslag .ws-gallery-item img { border-radius: 0; aspect-ratio: 3 / 4; object-fit: cover; }
body.t-rugslag .ws-story-copy p { color: var(--text); font-size: 15.5px; line-height: 1.82; }
/* the one label scale — her name, the class tiles, the tile captions */
body.t-rugslag .ws-story-copy h2, body.t-rugslag .ws-col-h, body.t-rugslag .ws-gallery-cap strong { color: var(--heading); text-transform: uppercase; letter-spacing: .16em; font-size: 12.5px; font-weight: 700; }

/* THE WELD — class strip and timetable are one tile band with no seam */
body.t-rugslag .ws-columns { background: var(--rg-tile); padding: 92px 0 0; }
body.t-rugslag .ws-listblock { background: var(--rg-tile); padding: 44px 0 96px; }
body.t-rugslag .ws-cols-4 { gap: 24px; }
body.t-rugslag .ws-col { background: var(--bg); padding: 26px 20px 30px; }
/* red 2 of 3 — the first tile reads as the open one, the way a tab does */
body.t-rugslag .ws-cols .ws-col:first-child { box-shadow: inset 0 4px 0 var(--rg-rope); }
body.t-rugslag .ws-cols .ws-col:first-child .ws-col-h { color: var(--rg-rope); }

/* eight lines, a hairline under every one, times on tabular figures */
body.t-rugslag .ws-list { list-style: none; padding-left: 0; margin: 22px 0 0; border-top: 1px solid var(--rg-line); }
body.t-rugslag .ws-list li { border-bottom: 1px solid var(--rg-line); margin: 0; padding: 15px 2px; font-size: 14px; line-height: 1.5; color: var(--heading); font-variant-numeric: tabular-nums; }

/* photographs come back only at the end — four across, caption under each */
body.t-rugslag .ws-gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }

/* closes on pool blue, then a narrow stack of four questions on plain rules */
body.t-rugslag .ws-cta { background: var(--heading); color: #e8eeed; }
body.t-rugslag .ws-field input, body.t-rugslag .ws-field select { background: transparent; border: 0; border-bottom: 1px solid var(--rg-line); border-radius: 0; color: var(--heading); padding: 11px 2px; }

@media (max-width: 760px) {
  body.t-rugslag .ws-cols-4, body.t-rugslag .ws-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-rugslag .ws-hero h1 { font-size: clamp(34px, 11vw, 56px); }
}

/* night — wet tile after hours: same cement, same tile, the rope one stop hotter */
html[data-theme="dark"] body.t-rugslag.ws-body {
  --bg: #101a1f; --fg: #9fb3bb; --heading: #e6efee; --text: #9fb3bb; --muted: #748b95;
  --rg-tile: #16232a; --rg-line: #27383f; --rg-rope: #e05a45;
  --hero-a: rgba(6, 14, 18, .28); --hero-b: rgba(6, 14, 18, .66);
}
html[data-theme="dark"] body.t-rugslag { background: var(--bg); }