/* ---- laaibrug (Laaibrug — Long-haul freight & abnormal loads 317) — cement
   grey ground, graphite type, one national route-board green kept to the
   hairlines, the depot captions, the accordion markers and the buttons.
   THE MOVE: the four-square photogrid is butted GAPLESSLY onto the roof of the
   four-column text row — same measure, same gutter, no padding between them —
   so each picture stands directly on its own heading and the about block reads
   as one welded slab instead of three image-and-text pairs. The page's only
   asymmetric split is spent on the story photograph, which the FAQ then
   continues as the right-hand column of the same 5/7 grid. No band alternation
   anywhere except the near-black cta plate near the foot. ---- */
body.t-laaibrug.ws-body { --bg: #e7e5e0; --fg: #3d4145; --heading: #1e2124; --text: #3d4145; --muted: #74787c; --lb-line: #17693c; }
body.t-laaibrug .ws-nav { background: #e7e5e0; border-bottom: 1px solid var(--lb-line); }
body.t-laaibrug .ws-hero { min-height: 100vh; --hero-a: rgba(18, 21, 24, 0.30); --hero-b: rgba(18, 21, 24, 0.62); }
/* one flat ground — a zebra tint would break the weld */
body.t-laaibrug .ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink) { background: transparent; }
body.t-laaibrug .ws-h2 { font-size: clamp(15px, 1.9vw, 19px); font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 28px; }
/* THE WELD — four squares sat straight on the roof of four columns */
body.t-laaibrug .ws-photogrid { padding: 34px 0 0; }
body.t-laaibrug .ws-photogrid-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; max-width: 1120px; margin: 0 auto; padding: 0 22px; }
body.t-laaibrug .ws-photogrid-grid img, body.t-laaibrug .ws-gallery-item img { border-radius: 0; aspect-ratio: 4 / 3; }
body.t-laaibrug .ws-columns, body.t-laaibrug .ws-faq, body.t-laaibrug .ws-contact { padding-top: 0; }
body.t-laaibrug .ws-col-h { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.16em; margin: 12px 0 9px; }
/* clients: a ruled quote, no card, no shadow, no portrait */
body.t-laaibrug .ws-quote { background: transparent; border: 0; border-top: 1px solid var(--lb-line); border-radius: 0; box-shadow: none; padding: 16px 0 0; }
/* the one asymmetric split on the page, held across two sections */
body.t-laaibrug .ws-story { padding: 78px 0 22px; }
body.t-laaibrug .ws-story-grid { grid-template-columns: 5fr 7fr; gap: 44px; align-items: start; }
body.t-laaibrug .ws-story-media img { border-radius: 0; aspect-ratio: 3 / 4; }
body.t-laaibrug .ws-faq .ws-container { max-width: 1120px; display: grid; grid-template-columns: 5fr 7fr; gap: 0 44px; }
body.t-laaibrug .ws-faq .ws-h2, body.t-laaibrug .ws-faq .ws-faq-list { grid-column: 2; text-align: left; }
body.t-laaibrug .ws-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 20px; }
body.t-laaibrug .ws-gallery-cap { border-top: 2px solid var(--lb-line); color: var(--lb-line); margin-top: 11px; padding: 9px 0 0; }
body.t-laaibrug .ws-cta { background: #14171a; padding: 64px 0; }
body.t-laaibrug .btn.brand { border-radius: 0; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; padding: 13px 26px; }
body.t-laaibrug .ws-hero-cta.btn.brand, body.t-laaibrug .ws-hero-cta.btn.brand:hover { background: var(--lb-line); color: #ffffff; box-shadow: none; }
/* three hairline-ruled address rows standing straight above the form */
body.t-laaibrug .ws-listblock .ws-container { max-width: 1120px; }
body.t-laaibrug .ws-list { list-style: none; padding: 0; }
body.t-laaibrug .ws-list li { border-top: 1px solid var(--lb-line); padding: 12px 0 0; margin: 0 0 15px; font-size: 15px; }
body.t-laaibrug .ws-contact .ws-container { max-width: 1120px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 44px; align-items: start; }
body.t-laaibrug .ws-contact .ws-h2, body.t-laaibrug .ws-contact .ws-sub { grid-column: 1; text-align: left; max-width: none; margin: 0 0 14px; }
body.t-laaibrug .ws-contact .ws-form { grid-column: 2; grid-row: 1 / 3; max-width: none; margin: 0; }
body.t-laaibrug .ws-field input, body.t-laaibrug .ws-field textarea { border-radius: 0; border-color: #cbc8c0; background: #f1efeb; }
/* narrow screens: two-up both times, so a picture keeps its own column */
@media (max-width: 900px) {
  body.t-laaibrug .ws-photogrid-grid, body.t-laaibrug .ws-columns .ws-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  body.t-laaibrug .ws-story-grid, body.t-laaibrug .ws-faq .ws-container, body.t-laaibrug .ws-contact .ws-container { grid-template-columns: 1fr; }
  body.t-laaibrug .ws-faq .ws-h2, body.t-laaibrug .ws-faq .ws-faq-list, body.t-laaibrug .ws-contact .ws-form { grid-column: 1; grid-row: auto; }
  body.t-laaibrug .ws-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

html[data-theme="dark"] body.t-laaibrug.ws-body { --bg: #16191b; --fg: #b0b5b3; --heading: #e9e7e2; --text: #b0b5b3; --muted: #7d8285; --lb-line: #2f8f57; }
html[data-theme="dark"] body.t-laaibrug { background: #16191b; }
html[data-theme="dark"] body.t-laaibrug .ws-nav { background: #16191b; border-bottom-color: var(--lb-line); }
html[data-theme="dark"] body.t-laaibrug .ws-story-copy p,
html[data-theme="dark"] body.t-laaibrug .ws-feature p,
html[data-theme="dark"] body.t-laaibrug .ws-faq-item p,
html[data-theme="dark"] body.t-laaibrug .ws-sub,
html[data-theme="dark"] body.t-laaibrug .ws-quote blockquote { color: #b0b5b3; }
html[data-theme="dark"] body.t-laaibrug .ws-faq-list, html[data-theme="dark"] body.t-laaibrug .ws-faq-item { border-color: #2b2f31; }
html[data-theme="dark"] body.t-laaibrug .ws-field input, html[data-theme="dark"] body.t-laaibrug .ws-field textarea, html[data-theme="dark"] body.t-laaibrug .ws-field select { background: #1e2224; border-color: #2b2f31; color: #e9e7e2; }
html[data-theme="dark"] body.t-laaibrug .ws-cta { background: #0d0f10; }
html[data-theme="dark"] body.t-laaibrug .ws-footer { border-top-color: #2b2f31; }
