/* ---- foolscap (Foolscap — Archive digitisation 53) — buffer-board buff, library-stamp blue ----
   STRUCTURAL MOVE: three edge-to-edge bleeds bracket and puncture ONE contained
   column that never changes width — the full-viewport cross-fading hero at the
   top, a single letterbox photo band mid-page, and a grayscale rail flush above
   the footer. Nothing between them is wide, boxed or shadowed: all the air is
   BETWEEN bands (100px a side, so 200px of gap), never inside them, and the
   credential strip is pulled up hard against the split above it. Every label,
   count and rand figure is set in the mono face so the page reads like a finding
   aid rather than an agency deck. */
body.t-foolscap.ws-body { --bg: #e9e5da; --fg: #4b4d4f; --heading: #16171b; --text: #4b4d4f; --muted: #8a8b85; }
body.t-foolscap { background: #e9e5da; }
body.t-foolscap .ws-nav { background: color-mix(in srgb, #e9e5da 92%, transparent); border-bottom: 1px solid #d3cec1; }
body.t-foolscap .ws-brand { font-size: 16px; text-transform: uppercase; letter-spacing: 0.28em; font-weight: 700; }
body.t-foolscap .ws-nav-links a { font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.14em; font-weight: 500; opacity: 1; color: #6a6c68; }
body.t-foolscap .ws-nav-links a:hover, body.t-foolscap .ws-nav-links a.on { color: #1e3a8c; }

/* the contained column — one width the whole way down, all the air between bands */
body.t-foolscap.ws-body .ws-section, body.t-foolscap.ws-body .ws-section:nth-child(even) { background: transparent; padding: 100px 0; }
body.t-foolscap .ws-container { max-width: 1060px; }
body.t-foolscap .ws-h2 { font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.2em; font-weight: 700; color: #1e3a8c; text-align: left; margin: 0 0 40px; padding-bottom: 14px; border-bottom: 1px solid #d3cec1; }
body.t-foolscap .ws-sub { text-align: left; margin: -22px 0 34px; max-width: 62ch; font-size: 15.5px; color: #6a6c68; }

/* hero — the only place type sits on a photograph, and it cross-fades three */
body.t-foolscap .ws-hero { min-height: 100vh; --hero-a: rgba(13, 14, 18, 0.32); --hero-b: rgba(13, 14, 18, 0.64); }
body.t-foolscap.ws-body .ws-hero h1 { font-size: clamp(34px, 5.6vw, 70px); font-weight: 700; letter-spacing: -0.04em; line-height: 1.03; max-width: 17ch; text-shadow: none; }
body.t-foolscap.ws-body .ws-hero p { font-family: var(--mono); font-size: 13px; line-height: 1.9; max-width: 60ch; margin: 26px auto 34px; opacity: 0.94; }
body.t-foolscap.ws-body .ws-hero-cta.btn.brand { background: #1e3a8c; color: #eef0f8; box-shadow: none; border-radius: 0; font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.18em; padding: 16px 30px; }
body.t-foolscap.ws-body .ws-hero-cta.btn.brand:hover { background: #16296a; }

/* the two alternating splits */
body.t-foolscap .ws-story-grid { gap: 72px; align-items: center; }
body.t-foolscap .ws-story-media img { border-radius: 0; aspect-ratio: 4 / 5; }
body.t-foolscap .ws-story-copy h2 { font-size: clamp(26px, 3.2vw, 38px); font-weight: 700; letter-spacing: -0.03em; margin: 0 0 22px; }
body.t-foolscap .ws-story-copy p { color: #4b4d4f; font-size: 16px; line-height: 1.85; }

/* the credential strip — pulled up against the split, hairline cells, no cards */
body.t-foolscap.ws-body .ws-features { padding-top: 0; }
body.t-foolscap .ws-features-grid { grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid #d3cec1; }
body.t-foolscap .ws-feature { text-align: left; padding: 28px 26px 0 0; }
body.t-foolscap .ws-feature + .ws-feature { border-left: 1px solid #d3cec1; padding-left: 26px; }
body.t-foolscap .ws-feature-icon { color: #1e3a8c; margin-bottom: 16px; }
body.t-foolscap .ws-feature-icon .ws-ico { width: 22px; height: 22px; }
body.t-foolscap .ws-feature h3 { font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.12em; font-weight: 700; color: #16171b; margin: 0 0 10px; }
body.t-foolscap .ws-feature p { font-size: 13.5px; line-height: 1.7; color: #6a6c68; }

/* bleed 2 of 3 — the one interruption, a letterbox band edge to edge */
body.t-foolscap.ws-body .ws-photogrid { padding: 0; }
body.t-foolscap .ws-photogrid-grid { grid-template-columns: repeat(4, 1fr); gap: 0; }
body.t-foolscap .ws-photogrid-grid img { aspect-ratio: 3 / 2; }

/* the four services — a numbered spec table, no section heading, no icons */
body.t-foolscap .ws-columns .ws-cols { gap: 0; counter-reset: svc; border-top: 1px solid #d3cec1; }
body.t-foolscap .ws-col { padding: 28px 26px 0 0; }
body.t-foolscap .ws-col + .ws-col { border-left: 1px solid #d3cec1; padding-left: 26px; }
body.t-foolscap .ws-col-h { font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.14em; font-weight: 700; color: #1e3a8c; margin: 0 0 14px; }
body.t-foolscap .ws-col-h::before { counter-increment: svc; content: counter(svc, decimal-leading-zero) " / "; color: #a9a79c; }
body.t-foolscap .ws-col p { font-size: 14.5px; line-height: 1.8; color: #4b4d4f; }

/* the showcase — catalogue entries, not cards */
body.t-foolscap .ws-gallery-grid { grid-template-columns: repeat(3, 1fr); gap: 46px 24px; }
body.t-foolscap .ws-gallery-item img { border-radius: 0; aspect-ratio: 4 / 5; }
body.t-foolscap .ws-gallery-cap { padding: 12px 0 0; margin-top: 14px; border-top: 1px solid #d3cec1; gap: 5px; }
body.t-foolscap .ws-gallery-cap strong { font-size: 14.5px; font-weight: 650; letter-spacing: -0.01em; color: #16171b; }
body.t-foolscap .ws-gallery-cap span { font-family: var(--mono); font-size: 11px; letter-spacing: 0.03em; color: #8a8b85; }

/* the rate card — a ruled ledger */
body.t-foolscap .ws-listblock .ws-container { max-width: 840px; }
body.t-foolscap .ws-list-bullet { list-style: none; padding-left: 0; border-top: 1px solid #d3cec1; }
body.t-foolscap .ws-list-bullet li { border-bottom: 1px solid #d3cec1; padding: 18px 0; margin: 0; font-size: 15.5px; line-height: 1.75; color: #4b4d4f; }

/* one voice, ruled off in the accent — no testimonial grid anywhere on this page */
body.t-foolscap .ws-quoteblock { text-align: left; }
body.t-foolscap .ws-quoteblock .ws-container { max-width: 840px; border-left: 2px solid #1e3a8c; padding-left: 34px; }
body.t-foolscap .ws-quote-t { font-size: clamp(20px, 2.5vw, 27px); font-weight: 400; font-style: normal; line-height: 1.55; letter-spacing: -0.015em; color: #16171b; margin: 0 0 18px; }
body.t-foolscap .ws-quote-a { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; font-weight: 700; color: #8a8b85; }

/* the enquiry */
body.t-foolscap .ws-contact .ws-container { max-width: 720px; }
body.t-foolscap .ws-form { max-width: 720px; }
body.t-foolscap .ws-field label { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; font-weight: 700; color: #6a6c68; }
body.t-foolscap .ws-field input, body.t-foolscap .ws-field textarea, body.t-foolscap .ws-field select { border-radius: 0; border: 1px solid #cdc7b8; background: #f2efe7; padding: 13px 14px; }
body.t-foolscap .btn.brand { background: #1e3a8c; color: #eef0f8; border-radius: 0; font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.18em; padding: 15px 28px; }
body.t-foolscap .btn.brand:hover { background: #16296a; }

/* bleed 3 of 3 — the rail flush above the footer, mirroring the hero */
body.t-foolscap.ws-body .ws-logos { padding: 0; }
body.t-foolscap .ws-logos .ws-container { max-width: none; padding: 0; }
body.t-foolscap .ws-logos-heading { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.2em; color: #8a8b85; text-align: center; margin: 0; padding: 0 22px 32px; }
body.t-foolscap .ws-logos-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; opacity: 1; justify-content: initial; }
body.t-foolscap .ws-logos-row img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; filter: grayscale(1); }
body.t-foolscap .ws-footer { border-top-color: #d3cec1; font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; }

@media (max-width: 900px) {
  body.t-foolscap.ws-body .ws-section, body.t-foolscap.ws-body .ws-section:nth-child(even) { padding: 62px 0; }
  body.t-foolscap.ws-body .ws-features { padding-top: 0; }
  body.t-foolscap .ws-story-grid { grid-template-columns: 1fr; gap: 28px; }
  body.t-foolscap .ws-features-grid, body.t-foolscap .ws-columns .ws-cols { grid-template-columns: repeat(2, 1fr); }
  body.t-foolscap .ws-feature + .ws-feature, body.t-foolscap .ws-col + .ws-col { border-left: 0; padding-left: 0; }
  body.t-foolscap .ws-gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 30px 16px; }
  body.t-foolscap .ws-photogrid-grid { grid-template-columns: repeat(2, 1fr); }
  body.t-foolscap .ws-logos-row { grid-template-columns: repeat(3, 1fr); }
  body.t-foolscap .ws-quoteblock .ws-container { padding-left: 20px; }
}

/* foolscap — the same buff store room after the lights go off */
html[data-theme="dark"] body.t-foolscap.ws-body { --bg: #131418; --fg: #b2b4ae; --heading: #ecebe4; --text: #b2b4ae; --muted: #7d7f79; }
html[data-theme="dark"] body.t-foolscap { background: #131418; }
html[data-theme="dark"] body.t-foolscap .ws-nav { background: color-mix(in srgb, #131418 92%, transparent); border-bottom-color: #2a2c31; }
html[data-theme="dark"] body.t-foolscap .ws-nav-links a { color: #93958e; }
html[data-theme="dark"] body.t-foolscap .ws-nav-links a:hover, html[data-theme="dark"] body.t-foolscap .ws-nav-links a.on { color: #8ea2e8; }
html[data-theme="dark"] body.t-foolscap .ws-h2, html[data-theme="dark"] body.t-foolscap .ws-col-h, html[data-theme="dark"] body.t-foolscap .ws-feature-icon { color: #8ea2e8; }
html[data-theme="dark"] body.t-foolscap .ws-h2, html[data-theme="dark"] body.t-foolscap .ws-features-grid,
html[data-theme="dark"] body.t-foolscap .ws-columns .ws-cols, html[data-theme="dark"] body.t-foolscap .ws-list-bullet,
html[data-theme="dark"] body.t-foolscap .ws-list-bullet li, html[data-theme="dark"] body.t-foolscap .ws-gallery-cap { border-color: #2a2c31; }
html[data-theme="dark"] body.t-foolscap .ws-feature + .ws-feature, html[data-theme="dark"] body.t-foolscap .ws-col + .ws-col { border-left-color: #2a2c31; }
html[data-theme="dark"] body.t-foolscap .ws-story-copy p, html[data-theme="dark"] body.t-foolscap .ws-col p,
html[data-theme="dark"] body.t-foolscap .ws-list-bullet li { color: #b2b4ae; }
html[data-theme="dark"] body.t-foolscap .ws-sub, html[data-theme="dark"] body.t-foolscap .ws-feature p,
html[data-theme="dark"] body.t-foolscap .ws-gallery-cap span, html[data-theme="dark"] body.t-foolscap .ws-quote-a { color: #7d7f79; }
html[data-theme="dark"] body.t-foolscap .ws-gallery-cap strong, html[data-theme="dark"] body.t-foolscap .ws-quote-t,
html[data-theme="dark"] body.t-foolscap .ws-feature h3 { color: #ecebe4; }
html[data-theme="dark"] body.t-foolscap .ws-col-h::before { color: #5d5f5a; }
html[data-theme="dark"] body.t-foolscap .ws-quoteblock .ws-container { border-left-color: #8ea2e8; }
html[data-theme="dark"] body.t-foolscap .ws-field label { color: #93958e; }
html[data-theme="dark"] body.t-foolscap .ws-field input, html[data-theme="dark"] body.t-foolscap .ws-field textarea,
html[data-theme="dark"] body.t-foolscap .ws-field select { background: #1b1d22; border-color: #2a2c31; color: #ecebe4; }
html[data-theme="dark"] body.t-foolscap .btn.brand { background: #8ea2e8; color: #131418; }
html[data-theme="dark"] body.t-foolscap .btn.brand:hover { background: #a6b5ee; }
html[data-theme="dark"] body.t-foolscap.ws-body .ws-hero-cta.btn.brand { background: #8ea2e8; color: #131418; }
html[data-theme="dark"] body.t-foolscap.ws-body .ws-hero-cta.btn.brand:hover { background: #a6b5ee; }
html[data-theme="dark"] body.t-foolscap .ws-logos-row img { filter: grayscale(1) brightness(0.8); }
html[data-theme="dark"] body.t-foolscap .ws-footer { border-top-color: #2a2c31; }