/* Herwin 212 — the structural move: the reference's image-above-text card row
   rebuilt out of TWO sections. A 3-up photogrid is constrained to the container
   and welded flush onto the 3 equal columns beneath it — same tracks, same 32px
   gutter, no vertical gap — so each photograph sits on its own heading. Warm
   concrete ground, no tinted panel anywhere, crate blue only on controls and
   icon strokes, and the light run broken exactly twice (film band, tail). */
body.t-herwin.ws-body {
  --bg: #f2efe8; --fg: #3c3e3d; --heading: #15181c; --text: #3c3e3d; --muted: #7e7c74;
  --hw-line: #dcd6c9; --hw-blue: #1f5fa8; --hw-dark: #14161a;
  --hero-a: rgba(12, 14, 17, .34); --hero-b: rgba(12, 14, 17, .62);
}
body.t-herwin { background: var(--bg); }

/* the bar stays plain type — nothing here is positioned or reordered */
body.t-herwin .ws-brand, body.t-herwin .ws-nav-links a { color: var(--heading); text-transform: uppercase; letter-spacing: .2em; font-size: 11.5px; font-weight: 700; }

/* the stage — one whole viewport, three slides, copy centred, one ask */
body.t-herwin .ws-hero { min-height: 100vh; }
body.t-herwin .ws-hero h1 { color: #f7f4ed; font-size: clamp(33px, 5.8vw, 74px); font-weight: 700; line-height: 1.04; letter-spacing: -.035em; max-width: 17ch; text-shadow: none; }

/* crate blue, flat slab, never a border */
body.t-herwin.ws-body .btn.brand, body.t-herwin.ws-body .ws-hero-cta.btn.brand, body.t-herwin.ws-body .ws-cta .btn.brand { background: var(--hw-blue); color: #f7f4ed; border: 0; border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: .18em; font-size: 11px; font-weight: 700; padding: 16px 34px; }

/* one concrete ground the whole way down — no tinted band anywhere */
body.t-herwin .ws-section { padding: 88px 0; }
body.t-herwin.ws-body .ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink) { background: transparent; }
body.t-herwin .ws-h2 { color: var(--heading); font-size: clamp(23px, 3vw, 34px); font-weight: 700; letter-spacing: -.03em; line-height: 1.1; margin: 0 0 16px; }
body.t-herwin .ws-title-h { color: var(--heading); font-size: clamp(30px, 5vw, 58px); font-weight: 700; letter-spacing: -.038em; line-height: 1.04; }
body.t-herwin .ws-title-sub, body.t-herwin .ws-sub, body.t-herwin .ws-col p, body.t-herwin .ws-feature p, body.t-herwin .ws-gallery-cap span { display: block; color: var(--text); font-size: 14.5px; line-height: 1.8; }
body.t-herwin .ws-col-h, body.t-herwin .ws-feature h3, body.t-herwin .ws-gallery-cap strong { display: block; color: var(--heading); text-transform: uppercase; letter-spacing: .15em; font-size: 13px; font-weight: 700; margin: 14px 0 8px; }

/* the partner band is deliberately the shortest thing on the page: six names,
   two lines, wide measure — it is what stops the stage and the chapter colliding */
body.t-herwin .ws-listblock { padding: 24px 0 26px; border-bottom: 1px solid var(--hw-line); }
body.t-herwin .ws-listblock .ws-container { max-width: 1120px; }
body.t-herwin .ws-listblock .ws-h2 { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .28em; color: var(--muted); margin: 0 0 10px; }
body.t-herwin .ws-list { columns: 3; column-gap: 30px; padding-left: 17px; }
body.t-herwin .ws-list li { color: var(--text); font-size: 12.5px; line-height: 1.9; margin: 0; }

/* THE WELD — photogrid pulled into the container, three tracks and the same
   32px gutter as .ws-cols, then the columns lifted up under it with no gap */
body.t-herwin.ws-body .ws-photogrid { padding: 88px 0 0; }
body.t-herwin .ws-photogrid-grid { max-width: 1120px; margin: 0 auto; padding: 0 22px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
body.t-herwin .ws-photogrid-grid img, body.t-herwin .ws-gallery-item img { aspect-ratio: 4 / 3; border-radius: 0; }
body.t-herwin.ws-body .ws-photogrid + .ws-columns { padding: 6px 0 88px; }

/* two quotes only, narrow and centred against all that grid work, unboxed */
body.t-herwin .ws-testimonials-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; max-width: 880px; margin: 0 auto; }
body.t-herwin .ws-quote { background: transparent; border: 0; border-top: 2px solid var(--hw-blue); border-radius: 0; box-shadow: none; padding: 20px 0 0; }
body.t-herwin .ws-quote blockquote { color: var(--heading); font-size: 17px; line-height: 1.66; }

/* strict 3x2 — two clean rows, never a wrapping list */
body.t-herwin .ws-features-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px 32px; }
body.t-herwin .ws-feature-icon { color: var(--hw-blue); }

/* break 1 of 2 — the full-bleed dark film band */
body.t-herwin.ws-body .ws-section.ws-video { padding: 104px 0; background-color: var(--hw-dark); background-image: linear-gradient(rgba(14, 16, 20, .66), rgba(14, 16, 20, .84)), url("/media/samples/hrw_video.jpg"); background-size: cover; background-position: center; }
body.t-herwin .ws-video .ws-h2, body.t-herwin .ws-video-caption { color: #ece7dc; }
body.t-herwin .ws-video-frame { border-radius: 0; box-shadow: none; }

/* six yards, two across and three down */
body.t-herwin .ws-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px 30px; }

/* break 2 of 2 — the tail goes near-black, blue kept off the band itself */
body.t-herwin.ws-body .ws-cta { background: var(--hw-dark); padding: 96px 0; }
body.t-herwin .ws-footer { background: #101216; border-top: 0; color: #8e8b83; padding: 40px 0; }
body.t-herwin .ws-field input, body.t-herwin .ws-field select, body.t-herwin .ws-field textarea { background: transparent; border: 0; border-bottom: 1px solid var(--hw-line); border-radius: 0; color: var(--heading); padding: 11px 2px; }

@media (max-width: 760px) {
  body.t-herwin .ws-photogrid-grid { gap: 10px; }
  body.t-herwin .ws-features-grid, body.t-herwin .ws-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-herwin .ws-testimonials-grid { grid-template-columns: 1fr; }
  body.t-herwin .ws-list { columns: 2; }
  body.t-herwin .ws-hero { min-height: 84vh; }
}

/* night — the same yard after knock-off, the crate blue one stop lighter */
html[data-theme="dark"] body.t-herwin.ws-body {
  --bg: #14161a; --fg: #a6a59d; --heading: #f2efe8; --text: #a6a59d; --muted: #7d7b73;
  --hw-line: #282b30; --hw-blue: #4f8fd6; --hw-dark: #0b0d10;
  --hero-a: rgba(6, 8, 10, .38); --hero-b: rgba(6, 8, 10, .68);
}
html[data-theme="dark"] body.t-herwin { background: var(--bg); }
html[data-theme="dark"] body.t-herwin .ws-footer { background: #08090b; }