/* ---------- Jumar — Rope access 68 (website) ----------
   The one structural move: the zebra tint is thrown away and every band is
   painted explicitly BY CLASS, so the page runs bone / charcoal / bone /
   charcoal edge to edge and reads as a stack of labelled chapters rather than
   a flow. Nothing on this page is off-centre — there is no split block, no
   left-aligned band, no story section anywhere. Tile counts descend and
   return (six, one, four, six) so two 3x2 gapped grids bracket the middle,
   and the rhythm breaks exactly once: a SECOND hero, #hero-2, carrying a
   photograph and the safety figure, dropped in after the job register. */
body.t-jumar.ws-body { --bg: #f3f0e8; --fg: #4a4740; --heading: #14130f; --text: #4a4740; --muted: #8b8578; }
body.t-jumar .ws-section { padding: 128px 0; }
body.t-jumar .ws-h2 { color: #14130f; font-size: clamp(26px, 3.8vw, 42px); font-weight: 800; letter-spacing: -0.038em; margin: 0 0 16px; }
body.t-jumar .ws-sub { color: #6f6a60; font-size: 16.5px; line-height: 1.7; max-width: 58ch; margin: 0 auto 66px; }

/* the bands. each carries `body` + the section's own class so it always
   outranks `.ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink)` —
   the band colour must follow the CLASS, never the index */
body.t-jumar.ws-body .ws-section.ws-features,
body.t-jumar.ws-body .ws-section.ws-team,
body.t-jumar.ws-body .ws-section.ws-contact { background: #f3f0e8; }
body.t-jumar.ws-body .ws-section.ws-columns,
body.t-jumar.ws-body .ws-section.ws-gallery,
body.t-jumar.ws-body .ws-section.ws-titleblock { background: #1b1a17; }

/* nav — a charcoal bar, thin logo hard left, the menu centred in small caps */
body.t-jumar .ws-nav { background: #1b1a17; border-bottom: 0; backdrop-filter: none; color: #f3f0e8; }
body.t-jumar .ws-nav-inner { height: 68px; }
body.t-jumar .ws-brand { color: #f3f0e8; font-size: 14px; font-weight: 800; letter-spacing: 0.32em; text-transform: uppercase; }
body.t-jumar .ws-nav-links a { color: #f3f0e8; font-size: 11px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.66; }
body.t-jumar .ws-nav-links a:hover, body.t-jumar .ws-nav-links a.on { opacity: 1; color: #f3f0e8; }
@media (min-width: 761px) {
  body.t-jumar .ws-brand { flex: 1 1 0; }
  body.t-jumar .ws-nav-links { flex: 0 1 auto; justify-content: center; gap: 30px; }
  body.t-jumar .ws-nav-inner::after { content: ''; flex: 1 1 0; }
}

/* hero — the full first screen, type sitting above the true midline */
body.t-jumar .ws-hero { min-height: 100vh; --hero-a: rgba(9, 8, 6, 0.28); --hero-b: rgba(9, 8, 6, 0.66); }
body.t-jumar .ws-hero-inner { padding-bottom: 140px; }
body.t-jumar.ws-body .ws-hero h1 { font-size: clamp(38px, 6.6vw, 84px); font-weight: 800; letter-spacing: -0.048em; line-height: 1.01; max-width: 15ch; }
body.t-jumar.ws-body .ws-hero p { color: #e4dfd3; font-size: 16px; line-height: 1.65; max-width: 44ch; margin-bottom: 34px; }
body.t-jumar .ws-hero-cta.btn.brand { background: #f05a14; color: #14130f; box-shadow: none; border-radius: 2px; padding: 17px 36px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; }
body.t-jumar .ws-hero-cta.btn.brand:hover { background: #ff6a22; }

/* six tiles, 3x2 — the first of the two grids that bracket the middle */
body.t-jumar .ws-features-grid { grid-template-columns: repeat(3, 1fr); gap: 58px 46px; }
body.t-jumar .ws-feature { text-align: center; padding: 0; }
body.t-jumar .ws-feature-icon { color: #14130f; margin-bottom: 20px; }
body.t-jumar .ws-feature h3 { color: #14130f; font-size: 12.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.17em; margin: 0 0 12px; }
body.t-jumar .ws-feature p { color: #6f6a60; font-size: 14.5px; line-height: 1.75; }

/* the narrow single column between the two grids — the whole argument, one measure */
body.t-jumar .ws-columns .ws-container { max-width: 800px; }
body.t-jumar .ws-col-h { text-align: center; color: #f3f0e8; font-size: clamp(26px, 3.8vw, 42px); font-weight: 800; letter-spacing: -0.038em; margin: 0 0 36px; }
body.t-jumar .ws-columns .ws-col p { color: #b3ada0; font-size: 16.5px; line-height: 1.85; margin: 0 0 22px; }

/* four across — the crew */
body.t-jumar .ws-team-grid { grid-template-columns: repeat(4, 1fr); gap: 36px 30px; }
body.t-jumar .ws-member-photo img { width: 100%; height: auto; aspect-ratio: 4 / 5; border-radius: 0; margin: 0 0 18px; }
body.t-jumar .ws-member strong { color: #14130f; font-size: 15px; font-weight: 800; letter-spacing: -0.012em; }
body.t-jumar .ws-member .muted { display: block; margin-top: 5px; color: #8b8578; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; }
body.t-jumar .ws-member p { color: #6f6a60; font-size: 14px; line-height: 1.7; margin-top: 12px; }

/* six again, 3x2 — the job register, the deep grid the three bands above earn */
body.t-jumar .ws-gallery .ws-h2 { color: #f3f0e8; margin-bottom: 62px; }
body.t-jumar .ws-gallery-grid { grid-template-columns: repeat(3, 1fr); gap: 40px 28px; }
body.t-jumar .ws-gallery-item img { aspect-ratio: 4 / 3; border-radius: 0; }
body.t-jumar .ws-gallery-cap { text-align: center; padding-top: 16px; gap: 5px; }
body.t-jumar .ws-gallery-cap strong { color: #f3f0e8; font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.15em; }
body.t-jumar .ws-gallery-cap span { color: #f05a14; font-size: 12px; letter-spacing: 0.05em; }

/* the fulcrum — the one band that breaks the alternation, and the only place
   besides the two buttons and the job figures where the ember is allowed */
body.t-jumar #hero-2 { min-height: 74vh; --hero-a: rgba(7, 7, 6, 0.56); --hero-b: rgba(7, 7, 6, 0.80); }
body.t-jumar.ws-body #hero-2 h1 { color: #f05a14; font-size: clamp(32px, 5.4vw, 72px); font-weight: 800; letter-spacing: -0.052em; line-height: 1.02; max-width: 19ch; text-shadow: none; }
body.t-jumar.ws-body #hero-2 p { color: #d5d0c3; font-size: 15.5px; line-height: 1.7; max-width: 56ch; }

/* the ask */
body.t-jumar .ws-form { max-width: 560px; }
body.t-jumar .ws-field label { color: #8b8578; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.16em; }
body.t-jumar .ws-field input,
body.t-jumar .ws-field textarea,
body.t-jumar .ws-field select,
body.t-jumar .ws-select-trigger { background: #ffffff; border: 1px solid #d9d4c7; border-radius: 2px; color: #14130f; }
body.t-jumar .ws-contact .btn.brand { background: #f05a14; color: #14130f; border-radius: 2px; padding: 16px 34px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; }
body.t-jumar .ws-contact .btn.brand:hover { background: #ff6a22; }

/* the signature — the last charcoal band, and the footer just continues it */
body.t-jumar .ws-titleblock { padding: 104px 0 88px; }
body.t-jumar .ws-title-h { color: #f3f0e8; font-size: clamp(56px, 13vw, 164px); font-weight: 800; letter-spacing: -0.07em; margin: 0 0 18px; }
body.t-jumar .ws-title-sub { color: #8b8578; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.24em; }
body.t-jumar .ws-footer { background: #1b1a17; border-top: 0; color: #8b8578; padding: 8px 0 44px; }
body.t-jumar .ws-footer a { color: #8b8578; }

@media (max-width: 900px) {
  body.t-jumar .ws-section { padding: 72px 0; }
  body.t-jumar .ws-features-grid, body.t-jumar .ws-team-grid, body.t-jumar .ws-gallery-grid { grid-template-columns: repeat(2, 1fr); }
  body.t-jumar .ws-sub { margin-bottom: 44px; }
  body.t-jumar .ws-hero-inner { padding-bottom: 90px; }
  body.t-jumar .ws-titleblock { padding: 64px 0 56px; }
}
@media (max-width: 760px) {
  /* the collapsed menu paints itself var(--bg) — bone — and the links are bone */
  body.t-jumar .ws-nav-links { background: #1b1a17; border-color: #2e2b26; }
  body.t-jumar .ws-nav-links a { opacity: 1; }
  body.t-jumar .ws-features-grid, body.t-jumar .ws-team-grid, body.t-jumar .ws-gallery-grid { grid-template-columns: 1fr; }
}

/* jumar — bone and charcoal by day; by night the same two bands drop to
   near-black and lifted black, so the alternation survives the toggle
   instead of collapsing into one flat surface */
html[data-theme="dark"] body.t-jumar.ws-body { --bg: #121110; --fg: #a29c92; --heading: #f0ece2; --text: #a29c92; --muted: #7b756a; }
html[data-theme="dark"] body.t-jumar { background: #121110; }
html[data-theme="dark"] body.t-jumar.ws-body .ws-section.ws-features,
html[data-theme="dark"] body.t-jumar.ws-body .ws-section.ws-team,
html[data-theme="dark"] body.t-jumar.ws-body .ws-section.ws-contact { background: #121110; }
html[data-theme="dark"] body.t-jumar.ws-body .ws-section.ws-columns,
html[data-theme="dark"] body.t-jumar.ws-body .ws-section.ws-gallery,
html[data-theme="dark"] body.t-jumar.ws-body .ws-section.ws-titleblock { background: #1e1c19; }
html[data-theme="dark"] body.t-jumar .ws-nav,
html[data-theme="dark"] body.t-jumar .ws-nav-links,
html[data-theme="dark"] body.t-jumar .ws-footer { background: #1e1c19; border-color: #2e2b26; }
html[data-theme="dark"] body.t-jumar .ws-h2,
html[data-theme="dark"] body.t-jumar .ws-feature h3,
html[data-theme="dark"] body.t-jumar .ws-feature-icon,
html[data-theme="dark"] body.t-jumar .ws-member strong { color: #f0ece2; }
html[data-theme="dark"] body.t-jumar .ws-sub,
html[data-theme="dark"] body.t-jumar .ws-feature p,
html[data-theme="dark"] body.t-jumar .ws-member p,
html[data-theme="dark"] body.t-jumar .ws-columns .ws-col p { color: #a29c92; }
html[data-theme="dark"] body.t-jumar .ws-field input,
html[data-theme="dark"] body.t-jumar .ws-field textarea,
html[data-theme="dark"] body.t-jumar .ws-field select,
html[data-theme="dark"] body.t-jumar .ws-select-trigger { background: #1e1c19; border-color: #2e2b26; color: #f0ece2; }
