/* ---------- Rostrum — city symphony orchestra (WEBSITE) --------------------
   THE STRUCTURAL MOVE: the attributed quote band is hoisted to third position,
   so the page runs full-screen photograph → one bare centred paragraph → a
   single large quote before any picture ever pairs with a word. Only two
   plates sit off the warm near-black ground — that quote band and the concert
   grid — and both are the same charcoal, so the dark never goes flat. The
   milestone row is four serif years with the icon slot suppressed outright, so
   it carries no imagery at all. Every selector here is a class: the hero is
   section one, so an element-indexed selector would silently never fire on any
   of the bands below it. */
body.t-rostrum.ws-body {
  --bg: #12100f; --fg: #b4aca5; --heading: #f4efe8; --text: #b4aca5; --muted: #837a73;
  --rst-plum: #6E3B4E; --rst-lit: #c78ba4; --rst-char: #1b1817; --rst-line: #2c2724; --rst-field: #171413;
  --hero-a: rgba(9, 7, 7, .40); --hero-b: rgba(9, 7, 7, .76);
  --sf-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
}
body.t-rostrum { background: var(--bg); }

/* nav — one row riding over the hero on a plum hairline, four links, nothing else */
body.t-rostrum .ws-nav { background: color-mix(in srgb, var(--bg) 62%, transparent); border-bottom: 1px solid var(--rst-plum); color: var(--heading); }
body.t-rostrum .ws-brand { font-family: var(--sf-serif); font-weight: 400; font-size: 18px; letter-spacing: .2em; text-transform: uppercase; }
body.t-rostrum .ws-nav-links a { font-size: 10.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; opacity: .72; }
body.t-rostrum .ws-nav-links a:hover, body.t-rostrum .ws-nav-links a.on { color: var(--rst-lit); opacity: 1; }

/* hero — the whole first screen, plum eyebrow set small UNDER the bone heading */
body.t-rostrum .ws-hero { min-height: 100vh; }
body.t-rostrum .ws-hero h1 { font-family: var(--sf-serif); font-size: clamp(36px, 6vw, 74px); font-weight: 400; letter-spacing: -.02em; line-height: 1.04; max-width: 17ch; text-shadow: none; }
body.t-rostrum.ws-body .ws-hero p { color: var(--rst-lit); font-size: 11px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; max-width: none; margin: 24px 0 36px; }
body.t-rostrum.ws-body .ws-hero-cta.btn.brand { background: transparent; color: var(--heading); box-shadow: none; padding: 0; font-size: 11px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 11px; text-decoration-color: var(--rst-lit); }

/* the ladder — zebra off (except the gallery, which paints itself), serif heads */
body.t-rostrum .ws-section { padding: 104px 0; }
body.t-rostrum .ws-section:nth-child(even):not(.ws-gallery):not(.ws-cta):not(.ws-shoplink) { background: transparent; }
body.t-rostrum .ws-h2, body.t-rostrum .ws-story-copy h2, body.t-rostrum .ws-cta-inner h2 { font-family: var(--sf-serif); font-size: clamp(24px, 3vw, 33px); font-weight: 400; letter-spacing: -.015em; color: var(--heading); margin: 0 0 26px; }
body.t-rostrum .ws-sub { color: var(--muted); font-size: 14px; line-height: 1.85; max-width: 46ch; }

/* the quiet — a bare centred measure directly under the full-screen opening */
body.t-rostrum .ws-richtext .ws-narrow { max-width: 640px; text-align: center; }
body.t-rostrum .ws-richtext p, body.t-rostrum .ws-story-copy p { color: var(--text); font-size: 16.5px; line-height: 1.95; margin: 0 0 20px; }

/* THE HOIST — the quote lands third, on charcoal, with no card around it */
body.t-rostrum.ws-body .ws-section.ws-testimonials, body.t-rostrum.ws-body .ws-section.ws-gallery { background: var(--rst-char); }
body.t-rostrum .ws-testimonials-grid { grid-template-columns: 1fr; max-width: 720px; margin: 0 auto; }
body.t-rostrum .ws-quote { background: transparent; border: 0; box-shadow: none; padding: 0; text-align: center; }
body.t-rostrum .ws-quote blockquote { font-family: var(--sf-serif); font-size: clamp(20px, 2.6vw, 28px); font-weight: 400; line-height: 1.5; color: var(--heading); margin: 0 0 22px; }
body.t-rostrum .ws-quote figcaption { font-size: 10.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }

/* the only unequal split on the page — copy left, one tall portrait right */
body.t-rostrum .ws-story-grid { grid-template-columns: 1.4fr .85fr; gap: 64px; align-items: start; }
body.t-rostrum .ws-story-media img { aspect-ratio: 3 / 4; border-radius: 0; filter: grayscale(.32) contrast(1.05); }

/* the milestones — four serif years, no icon, a plum rule over each */
body.t-rostrum .ws-features-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 30px; }
body.t-rostrum .ws-feature-icon { display: none; }
body.t-rostrum .ws-feature { text-align: left; padding: 30px 0 4px; border-top: 1px solid var(--rst-plum); }
body.t-rostrum .ws-feature h3 { font-family: var(--sf-serif); font-size: clamp(34px, 4.4vw, 54px); font-weight: 400; line-height: 1; letter-spacing: -.02em; color: var(--rst-lit); margin: 0 0 14px; }
body.t-rostrum .ws-feature p { color: var(--muted); font-size: 13px; line-height: 1.6; }

/* the page's single photo grid — image over title over date, four across */
body.t-rostrum .ws-gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px 22px; }
body.t-rostrum .ws-gallery-item img { aspect-ratio: 4 / 3; border-radius: 0; }
body.t-rostrum .ws-gallery-cap strong { font-family: var(--sf-serif); font-size: 17px; font-weight: 400; color: var(--heading); }
body.t-rostrum .ws-gallery-cap span { font-size: 10.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--rst-lit); }

/* the season ask — plum hairlines instead of a painted band */
body.t-rostrum.ws-body .ws-section.ws-cta { background: var(--bg); border-top: 1px solid var(--rst-plum); border-bottom: 1px solid var(--rst-plum); padding: 82px 0; }
body.t-rostrum.ws-body .ws-cta .btn.brand, body.t-rostrum.ws-body .ws-contact .btn.brand { background: var(--rst-plum); color: #f6f1ec; border-radius: 0; box-shadow: none; padding: 16px 34px; font-size: 10.5px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }

/* four fields on the ink ground, and nothing after them */
body.t-rostrum .ws-field label { font-size: 10.5px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
body.t-rostrum .ws-field input, body.t-rostrum .ws-field textarea { background: var(--rst-field); border: 1px solid var(--rst-line); border-radius: 0; color: var(--heading); }

@media (max-width: 860px) {
  body.t-rostrum .ws-section { padding: 66px 0; }
  body.t-rostrum .ws-features-grid, body.t-rostrum .ws-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-rostrum .ws-story-grid { grid-template-columns: 1fr; gap: 30px; }
  body.t-rostrum .ws-nav-links { background: var(--rst-char); border: 1px solid var(--rst-line); border-radius: 0; box-shadow: none; }
}

/* night — the same page, a stop colder, with the plum lifted to stay legible */
html[data-theme="dark"] body.t-rostrum.ws-body {
  --bg: #0a0908; --fg: #a9a19a; --heading: #fbf7f1; --text: #a9a19a; --muted: #77706a;
  --rst-plum: #8b4d63; --rst-lit: #d9a0b6; --rst-char: #131110; --rst-line: #241f1e; --rst-field: #100e0d;
  --hero-a: rgba(5, 4, 4, .46); --hero-b: rgba(5, 4, 4, .82);
}
html[data-theme="dark"] body.t-rostrum { background: var(--bg); }
