/* ---------- Boma — food systems indaba (WEBSITE) ---------------------------
   THE STRUCTURAL MOVE: a full-viewport photographic slider with a bare
   four-claim band WELDED flush to its bottom edge. The band owns no padding of
   its own — the cells do — so cream paper begins on the exact line the
   photograph stops, and the swing from edge-to-edge picture to counted type
   happens without a seam, a card, a border or a shadow. Cream ground,
   charcoal-green ink; the shweshwe indigo is spent only on the day numerals,
   the schedule hairlines, the link hover, the button and the closing band.
   Every selector is a class or one of the renderer's own anchor ids: the hero
   is section one, so an element-indexed selector would silently never fire. */
body.t-boma.ws-body {
  --bg: #f6f1e6; --fg: #414c45; --heading: #1f2a24; --text: #414c45; --muted: #857d6e;
  --bm-indigo: #31448f; --bm-band: #31448f; --bm-rule: #ded5c4;
  --hero-a: rgba(20, 26, 22, .26); --hero-b: rgba(20, 26, 22, .54);
  --sf-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
}
body.t-boma { background: var(--bg, #f6f1e6); }
/* one unbroken sheet of paper — the zebra tint would show every weld */
body.t-boma .ws-section:not(.ws-cta):not(.ws-shoplink) { background: var(--bg); }
body.t-boma .ws-section { padding: 96px 0; }
body.t-boma .ws-container:not(.ws-narrow) { max-width: 1140px; padding: 0 30px; }

/* nav — plain, transparent, non-sticky: it rides the photograph and leaves with it */
body.t-boma .ws-nav { position: absolute; top: 0; left: 0; right: 0; z-index: 40;
  background: transparent; backdrop-filter: none; border-bottom: 0; color: #f6f1e6; }
body.t-boma .ws-nav-inner { height: 90px; }
body.t-boma .ws-nav-links a { color: #f6f1e6; font-size: 11.5px; font-weight: 600;
  letter-spacing: .17em; text-transform: uppercase; opacity: .84; }
body.t-boma .ws-nav-links a:hover, body.t-boma .ws-nav-links a.on { color: #b7c2f0; opacity: 1; border-bottom: 0; }

/* hero — the whole first screen is one photograph, the type centred on it */
body.t-boma .ws-hero { min-height: 100vh; align-items: center; }
body.t-boma .ws-hero h1 { font-size: clamp(38px, 6.6vw, 80px); font-weight: 400; line-height: 1.03;
  letter-spacing: -.015em; max-width: 18ch; text-shadow: none; margin-bottom: 22px; }
body.t-boma .ws-hero p { font-size: clamp(15px, 1.6vw, 18px); line-height: 1.72; max-width: 56ch; margin-bottom: 34px; }
body.t-boma.ws-body .btn.brand, body.t-boma.ws-body .ws-hero-cta.btn.brand { background: var(--bm-band); color: #f6f1e6;
  border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: .18em; font-size: 11px; font-weight: 700; padding: 17px 34px; }
body.t-boma.ws-body .btn.brand:hover, body.t-boma.ws-body .ws-hero-cta.btn.brand:hover { background: #24336e; }

/* THE WELD — four claims on bare cream, no card, no rule, no shadow */
body.t-boma .ws-features { padding: 0; }
body.t-boma .ws-features-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
body.t-boma .ws-feature { text-align: center; padding: 68px 22px 76px; }
body.t-boma .ws-feature-icon { color: var(--bm-indigo); margin: 0 0 18px; }
body.t-boma .ws-feature-icon .ws-ico { width: 22px; height: 22px; }
body.t-boma .ws-feature h3 { font-size: clamp(22px, 2.7vw, 31px); font-weight: 400; line-height: 1.1; margin: 0 0 10px; color: var(--heading); }
body.t-boma .ws-feature p { font-size: 13px; line-height: 1.66; color: var(--muted); margin: 0; }

/* every display face on the page is the one serif */
body.t-boma .ws-brand, body.t-boma .ws-hero h1, body.t-boma .ws-h2, body.t-boma .ws-title-h,
body.t-boma .ws-story-copy h2, body.t-boma .ws-cta-inner h2, body.t-boma .ws-feature h3,
body.t-boma .ws-col-h, body.t-boma .ws-member strong, body.t-boma .ws-gallery-cap strong {
  font-family: var(--sf-serif); font-weight: 400; letter-spacing: -.005em; }
body.t-boma .ws-brand { font-size: 27px; letter-spacing: .02em; color: #f6f1e6; }
body.t-boma .ws-h2 { font-size: clamp(26px, 3.4vw, 40px); color: var(--heading); margin: 0 0 36px; }
body.t-boma .ws-title-h { font-size: clamp(30px, 4.6vw, 58px); color: var(--heading); }
body.t-boma .ws-title-sub { max-width: 54ch; margin: 18px auto 0; font-size: 15.5px; line-height: 1.72; color: var(--muted); }

/* story — the photograph hard left, three short paragraphs right */
body.t-boma .ws-story-grid { gap: 62px; align-items: center; }
body.t-boma .ws-story-copy p { font-size: 16px; line-height: 1.86; color: var(--text); }
body.t-boma .ws-story-media img, body.t-boma .ws-member-photo img, body.t-boma .ws-gallery-item img { border-radius: 0; }
body.t-boma .ws-story-media img { aspect-ratio: 4 / 5; }

/* the speaker wall — one grid, four across, twice */
body.t-boma .ws-team-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px 26px; }
body.t-boma .ws-member { text-align: left; }
body.t-boma .ws-member-photo img { width: 100%; height: auto; aspect-ratio: 1 / 1; margin: 0 0 16px; }
body.t-boma .ws-member strong { font-size: 19px; }
body.t-boma .ws-member p { font-size: 12.5px; line-height: 1.62; color: var(--muted); }

/* the programme — the one place the whitespace collapses: indigo day numerals
   over hairline-ruled schedule lines, three columns, no photography */
body.t-boma .ws-cols { gap: 46px; }
body.t-boma .ws-col-h { font-size: 30px; color: var(--bm-indigo); margin: 0 0 20px; }
body.t-boma .ws-col p { border-top: 1px solid var(--bm-indigo); padding: 11px 0 12px; margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--text); white-space: pre-wrap; }

/* the field wall — full bleed, gapped, eight frames in two rows of four */
body.t-boma .ws-photogrid { padding: 0; }
body.t-boma .ws-photogrid-grid { grid-template-columns: repeat(4, 1fr); gap: 12px; }
body.t-boma .ws-photogrid-grid img { aspect-ratio: 4 / 3; }

/* last year — four captioned tiles, one clean row */
body.t-boma .ws-gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
body.t-boma .ws-gallery-item img { aspect-ratio: 3 / 2; }
body.t-boma .ws-gallery-cap strong { font-size: 17px; color: var(--heading); }
body.t-boma .ws-gallery-cap span { font-size: 12.5px; line-height: 1.5; color: var(--muted); }

/* the single ask, then a narrow centred form */
body.t-boma .ws-cta { background: var(--bm-band); padding: 112px 0; }
body.t-boma .ws-cta-inner h2 { font-size: clamp(28px, 3.8vw, 46px); }
body.t-boma .ws-contact .ws-narrow { max-width: 540px; text-align: center; }
body.t-boma .ws-field { text-align: left; }
body.t-boma .ws-field label { font-size: 10.5px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--muted); }
body.t-boma .ws-field input, body.t-boma .ws-field textarea { border-radius: 0; border-color: var(--bm-rule); background: transparent; }

@media (max-width: 1040px) {
  body.t-boma .ws-features-grid, body.t-boma .ws-team-grid,
  body.t-boma .ws-gallery-grid, body.t-boma .ws-photogrid-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  body.t-boma .ws-cols-3 { grid-template-columns: 1fr; }
  /* the burger panel is painted on cream, so the cream links have to darken */
  body.t-boma .ws-nav-links a { color: var(--heading); }
}

/* night — the same paper after dark: the ink lightens, the indigo comes up to
   meet it, and the closing band drops instead of glowing */
html[data-theme="dark"] body.t-boma.ws-body {
  --bg: #131813; --fg: #a6b0a7; --heading: #f0ece1; --text: #a6b0a7; --muted: #77826f;
  --bm-indigo: #8093e2; --bm-band: #26326b; --bm-rule: #2a322b;
  --hero-a: rgba(8, 11, 9, .40); --hero-b: rgba(8, 11, 9, .68);
}
html[data-theme="dark"] body.t-boma { background: var(--bg); }
html[data-theme="dark"] body.t-boma.ws-body .btn.brand:hover, html[data-theme="dark"] body.t-boma.ws-body .ws-hero-cta.btn.brand:hover { background: #34437f; }
html[data-theme="dark"] body.t-boma .ws-nav-links a:hover, html[data-theme="dark"] body.t-boma .ws-nav-links a.on { color: #a8b6f2; }