/* ============================================================
   lintel — WEBSITE: bone paper, warm near-black, unlacquered brass.
   STRUCTURAL MOVE: the nav is FIXED and dark so it floats on the
   full-viewport slideshow hero rather than sitting above it — and the
   contained rhythm that follows is broken exactly once, by a gapless
   edge-to-edge run of tall photographs with no heading and no caption,
   before a single project has been named. The register after it is
   deliberately plain three-up, category over name, and the page closes
   near-black: a second photographic band, then a full-width form on the
   dark ground that runs straight into the footer.
   ============================================================ */
body.t-lintel.ws-body { --bg: #ece6da; --fg: #4d4740; --heading: #191512; --text: #4d4740; --muted: #7c766b;
  --lt-line: #d6cec0; --lt-ink: #17140f; --lt-brass: #7d5a1f; --lt-tile: #e3dbcc; }
body.t-lintel { background: #ece6da; }
body.t-lintel .ws-container:not(.ws-narrow) { max-width: 1240px; padding: 0 34px; }
body.t-lintel .ws-section { padding: 92px 0; }
body.t-lintel .ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink) { background: transparent; }

/* nav: fixed, so the hero photograph runs under it */
body.t-lintel .ws-nav { position: fixed; top: 0; left: 0; right: 0; border-bottom: 0;
  background: color-mix(in srgb, #17140f 56%, transparent); backdrop-filter: saturate(1.3) blur(9px); }
body.t-lintel .ws-nav-inner { height: 72px; color: #ece6da; }
body.t-lintel .ws-brand { text-transform: uppercase; letter-spacing: 0.36em; font-weight: 600; font-size: 13.5px; }
body.t-lintel .ws-nav-links { gap: 34px; }
body.t-lintel .ws-nav-links a { text-transform: uppercase; letter-spacing: 0.2em; font-size: 10.5px; font-weight: 600; opacity: 0.8; }
body.t-lintel .ws-nav-links a:hover, body.t-lintel .ws-nav-links a.on { color: #d9b071; opacity: 1; }

/* headings — brass micro-caps over a short rule, always left */
body.t-lintel .ws-h2, body.t-lintel .ws-title-h { text-align: left; text-transform: uppercase; letter-spacing: 0.24em;
  font-size: 11px; font-weight: 700; color: var(--lt-brass); margin: 0 0 30px; }
body.t-lintel .ws-h2::before { content: ''; display: block; width: 34px; height: 1px; background: var(--lt-brass); margin: 0 0 16px; }
body.t-lintel .ws-sub { text-align: left; margin: -18px 0 32px; max-width: 48ch; font-size: 15.5px; }

/* hero — full viewport, three frames cross-fading under fixed copy */
body.t-lintel .ws-hero { min-height: 100vh; --hero-a: rgba(23,20,15,0.28); --hero-b: rgba(23,20,15,0.64); }
body.t-lintel .ws-hero-inner { max-width: 1240px; padding: 0 34px; }
body.t-lintel .ws-hero h1 { font-size: clamp(38px, 6.6vw, 78px); font-weight: 500; letter-spacing: -0.035em; line-height: 1.02; max-width: 14ch; }
body.t-lintel .ws-hero p { font-size: 15.5px; line-height: 1.75; max-width: 50ch; opacity: 0.88; margin: 18px auto 34px; }
/* the closing photographic band is a second hero, shorter and darker */
body.t-lintel #hero-2 { min-height: 58vh; --hero-a: rgba(23,20,15,0.48); --hero-b: rgba(23,20,15,0.74); }
body.t-lintel #hero-2 h1 { font-size: clamp(25px, 3.6vw, 42px); letter-spacing: -0.02em; max-width: 22ch; }
body.t-lintel #hero-2 p { font-size: 14.5px; }

body.t-lintel.ws-body .btn.brand, body.t-lintel.ws-body .ws-hero-cta.btn.brand { background: #a9803c; color: #17140f;
  border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: 0.22em; font-size: 10.5px; font-weight: 700; padding: 16px 32px; }
body.t-lintel.ws-body .btn.brand:hover, body.t-lintel.ws-body .ws-hero-cta.btn.brand:hover { background: #8f6a2f; }

/* four square tiles, one gapped row, nothing announcing them */
body.t-lintel .ws-features-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
body.t-lintel .ws-feature { aspect-ratio: 1 / 1; display: flex; flex-direction: column; align-items: flex-start;
  text-align: left; padding: 28px; background: var(--lt-tile); }
body.t-lintel .ws-feature-icon { margin: 0; color: var(--lt-brass); }
body.t-lintel .ws-feature-icon .ws-ico { width: 26px; height: 26px; }
body.t-lintel .ws-feature h3 { margin: auto 0 8px; font-size: 20px; font-weight: 500; letter-spacing: -0.01em; color: var(--heading); }
body.t-lintel .ws-feature p { font-size: 13.5px; line-height: 1.65; color: var(--text); margin: 0; }

/* THE BREAK — gapless, edge to edge, silent */
body.t-lintel .ws-photogrid { padding: 0; }
body.t-lintel .ws-photogrid-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
body.t-lintel .ws-photogrid-grid img { aspect-ratio: 3 / 4; }

/* the register — plain three-up, category above the name */
body.t-lintel .ws-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 54px 34px; }
body.t-lintel .ws-gallery-item img { aspect-ratio: 4 / 5; border-radius: 0; }
body.t-lintel .ws-gallery-cap { flex-direction: column-reverse; align-items: flex-start; gap: 6px; padding: 16px 0 0; }
body.t-lintel .ws-gallery-cap span { text-transform: uppercase; letter-spacing: 0.2em; font-size: 10px; font-weight: 700; color: var(--lt-brass); }
body.t-lintel .ws-gallery-cap strong { font-size: 19px; font-weight: 400; letter-spacing: -0.01em; color: var(--heading); }

/* the widest air on the page — portrait plate, measured column */
body.t-lintel .ws-story { padding: 136px 0; }
body.t-lintel .ws-story-grid { gap: 92px; align-items: center; }
body.t-lintel .ws-story-media img { aspect-ratio: 3 / 4; border-radius: 0; }
body.t-lintel .ws-story-copy { max-width: 40ch; }
body.t-lintel .ws-story-copy h2 { text-transform: uppercase; letter-spacing: 0.24em; font-size: 11px; font-weight: 700; color: var(--lt-brass); margin: 0 0 22px; }
body.t-lintel .ws-story-copy p { font-size: 16px; line-height: 1.85; color: var(--text); }

/* numbered stages, ruled, brass leading zeros */
body.t-lintel .ws-listblock .ws-container { max-width: 1000px; }
body.t-lintel .ws-list-number { list-style: none; padding-left: 0; counter-reset: lt; }
body.t-lintel .ws-list-number li { counter-increment: lt; display: grid; grid-template-columns: 74px 1fr; align-items: start;
  border-top: 1px solid var(--lt-line); padding: 22px 0; margin: 0; font-size: 15.5px; line-height: 1.75; color: var(--text); }
body.t-lintel .ws-list-number li::before { content: counter(lt, decimal-leading-zero); color: var(--lt-brass);
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.2em; padding-top: 6px; }

/* four bare quotes, ruled, no cards */
body.t-lintel .ws-testimonials-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; }
body.t-lintel .ws-quote { background: transparent; border: 0; border-top: 1px solid var(--lt-line); border-radius: 0; box-shadow: none; padding: 20px 0 0; }
body.t-lintel .ws-quote blockquote { font-size: 14.5px; line-height: 1.75; color: var(--text); margin: 0 0 18px; }
body.t-lintel .ws-quote blockquote::before { content: none; }
body.t-lintel .ws-quote figcaption { text-transform: uppercase; letter-spacing: 0.16em; font-size: 10.5px; font-weight: 700; color: var(--heading); }
body.t-lintel .ws-quote figcaption .muted { color: var(--lt-brass); }

/* the form has no margins — it runs the width of the screen, on the dark */
body.t-lintel .ws-contact { background: var(--lt-ink); padding: 104px 0 112px; }
body.t-lintel .ws-contact .ws-container { max-width: none; padding: 0 34px; }
body.t-lintel .ws-contact .ws-h2 { color: #d9b071; }
body.t-lintel .ws-contact .ws-h2::before { background: #d9b071; }
body.t-lintel .ws-contact .ws-sub { color: #a49c8f; }
body.t-lintel .ws-contact .ws-form { max-width: none; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 26px 40px; }
body.t-lintel .ws-contact .ws-field:has(textarea) { grid-column: 1 / -1; }
body.t-lintel .ws-contact .ws-form > .btn.brand { grid-column: 1 / -1; justify-self: start; }
body.t-lintel .ws-contact .ws-field label { text-transform: uppercase; letter-spacing: 0.18em; font-size: 10px; font-weight: 700; color: #a49c8f; }
body.t-lintel .ws-contact .ws-field input, body.t-lintel .ws-contact .ws-field textarea, body.t-lintel .ws-contact .ws-field select {
  background: transparent; border: 0; border-bottom: 1px solid #3a342c; border-radius: 0; color: #ece6da; padding: 12px 2px; }
body.t-lintel .ws-footer { background: var(--lt-ink); border-top: 1px solid #2c2820; color: #837c72; }
body.t-lintel .ws-footer a { color: #a49c8f; }

@media (max-width: 980px) {
  body.t-lintel .ws-features-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-lintel .ws-photogrid-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-lintel .ws-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 20px; }
  body.t-lintel .ws-testimonials-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-lintel .ws-story { padding: 84px 0; }
  body.t-lintel .ws-story-grid { gap: 44px; }
}
@media (max-width: 760px) {
  body.t-lintel .ws-nav-links { background: #17140f; border-color: #2c2820; border-radius: 0; }
  body.t-lintel .ws-nav-links a { color: #ece6da; opacity: 1; }
  body.t-lintel .ws-feature { aspect-ratio: auto; padding: 22px; }
  body.t-lintel .ws-list-number li { grid-template-columns: 44px 1fr; }
  body.t-lintel .ws-contact .ws-form { grid-template-columns: 1fr; }
}

/* night */
html[data-theme="dark"] body.t-lintel.ws-body { --bg: #141210; --fg: #b4ada2; --heading: #ece6da; --text: #b4ada2; --muted: #837c72;
  --lt-line: #2c2820; --lt-ink: #0d0c0a; --lt-brass: #c9a05a; --lt-tile: #1c1915; }
html[data-theme="dark"] body.t-lintel { background: #141210; }
html[data-theme="dark"] body.t-lintel .ws-nav { background: color-mix(in srgb, #0d0c0a 72%, transparent); }
html[data-theme="dark"] body.t-lintel .ws-contact .ws-field input,
html[data-theme="dark"] body.t-lintel .ws-contact .ws-field textarea,
html[data-theme="dark"] body.t-lintel .ws-contact .ws-field select { border-bottom-color: #332e26; }
html[data-theme="dark"] body.t-lintel.ws-body .btn.brand, html[data-theme="dark"] body.t-lintel.ws-body .ws-hero-cta.btn.brand { background: #c9a05a; color: #141210; }
html[data-theme="dark"] body.t-lintel.ws-body .btn.brand:hover, html[data-theme="dark"] body.t-lintel.ws-body .ws-hero-cta.btn.brand:hover { background: #d9b478; }
