/* Isolated light-site preview. Loaded last; original styles and media retained. */
:root {
  --light-bg: #f8f8f4;
  --light-surface: #eeefe8;
  --light-ink: #232821;
  --light-muted: #596052;
  --light-line: #d3d7cb;
  --light-brand: #34442b;
  --black: var(--light-bg);
  --black-soft: var(--light-surface);
  --graphite: #e9ece3;
  --paper: var(--light-ink);
  --muted: var(--light-muted);
  --line: var(--light-line);
  --accent: var(--light-brand);
  --accent-solid: var(--light-brand);
  --bg: var(--light-bg);
  color: var(--light-ink);
  background: var(--light-bg);
  color-scheme: light;
}
html body, html body.subpage-body, html body.reading-page { color: var(--light-ink); background: var(--light-bg); min-width: 0; }
html .reading-page { --reading-bg: var(--light-bg); --reading-muted: var(--light-muted); --reading-accent: var(--light-brand); --reading-line: var(--light-line); }
html body .site-header.site-header, html body .site-header.site-header.is-scrolled {
  color: var(--light-ink); background: rgba(248,248,244,.97); border-color: var(--light-line);
}
html .site-header .language-switcher-label { color: var(--light-muted); }
html .site-header .header-tools { border-color: var(--light-line); }
html .site-header .menu-toggle { color: inherit; border-color: #87917e; }
html body .site-header .primary-nav { color: inherit; }
html .site-header .language-switcher { color: inherit; }
html .site-header .language-switcher select { color: inherit; }
html .site-header .primary-nav a:hover { color: var(--light-brand); }
html :focus-visible { outline-color: var(--light-brand); }
html ::selection { color: #fff; background: var(--light-brand); }

/* Image-led home opening and dark closing frame share the same brand palette. */
html .hero, html .production-feature, html .page-footer, html .footer {
  --paper: #f2f0eb; --black: #10140f; --muted: #c1c6b9; --line: rgba(242,240,235,.24);
  color: #f2f0eb;
}
html .hero { background: #10140f; }
html body:has(.hero) .site-header:not(.is-scrolled) { background: rgba(16,20,15,.32); color: #fff; border-color: rgba(255,255,255,.25); }
html body:has(.hero) .site-header:not(.is-scrolled) .language-switcher-label { color: #d4d9ce; }
html body:has(.hero) .site-header:not(.is-scrolled) .header-tools { border-color: rgba(255,255,255,.25); }
html body:has(.hero) .site-header:not(.is-scrolled) .primary-nav a:hover { color: #fff; }
html .page-footer, html .footer.footer-editorial { background: #10140f; }
html .page-footer .footer, html .footer.footer-editorial { border-color: rgba(255,255,255,.25); }
html .production-feature img { filter: none; }
html .production-feature .outline-button { border-color: rgba(255,255,255,.7); color: #fff; }
html .hero .solid-button { color: #232821; background: #f8f8f4; }
html .hero .solid-button:hover { background: #fff; }
html .hero .upgrade-text-link { color: #fff; border-color: rgba(255,255,255,.65); }

/* Subpage opening: readable text on paper, unshaded project photograph beside it. */
html body .page-hero { background: var(--light-bg); color: var(--light-ink); }
html body .page-hero:has(.page-hero-media) {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center;
  gap: clamp(2rem,4.5vw,5rem); min-height: 0;
  padding: calc(var(--site-header-height) + 3.5rem) var(--gutter) 4rem;
  border-bottom: 1px solid var(--light-line);
}
html body .page-hero:has(.page-hero-media) .page-hero-media {
  position: relative; inset: auto; order: 2; width: 100%; min-width: 0; aspect-ratio: 4 / 3; margin: 0;
}
html body .page-hero:has(.page-hero-media) .page-hero-media img { width: 100%; height: 100%; object-fit: cover; filter: none; }
html body .page-hero:has(.page-hero-media) .page-hero-shade { display: none; }
html body .page-hero:has(.page-hero-media) .page-hero-content { order: 1; width: 100%; max-width: none; padding: 0; margin: 0; min-width: 0; }
html body .page-hero:has(.page-hero-media) .page-title { font-size: clamp(2.5rem,4vw,4.5rem); line-height: 1.18; letter-spacing: -.035em; text-transform: none; }
html body .page-hero:has(.page-hero-media) .page-lede { margin: 1.7rem 0 0; font-size: clamp(1rem,1.15vw,1.15rem); line-height: 1.8; color: var(--light-muted); }
html body .page-hero-meta { color: var(--light-muted); border-color: var(--light-line); }
html .page-kicker { color: var(--light-muted); }

/* Shared content surfaces and secondary text. */
html .knowledge-home, html .trust-section, html .case-notes,
html .service-light, html .service-dark, html .capability-detail,
html .service-page .capability-detail:nth-child(n),
html .home-product-overview .product-category-card, html .upgrade-collaboration article {
  color: var(--light-ink); background: var(--light-bg);
}
html .service-light, html .trust-section, html .case-notes, html .knowledge-home { background: var(--light-surface); }
html .capability-detail, html .service-page .capability-detail { border-color: var(--light-line); }
html .service-page .capability-detail--with-evidence > .service-brief, html .service-brief,
html .rfq-mode-note, html .rfq-draft, html .rfq-mode-switch { background: var(--light-surface); border-color: var(--light-line); color: var(--light-ink); }
html .home-product-overview .product-category-list, html .upgrade-collaboration > div,
html .buyer-use-options { background: var(--light-line); }
html .buyer-use-option { background: var(--light-bg); }
html .buyer-use-option:hover, html .buyer-use-option:focus-visible, html .buyer-use-option.is-active { background: #e6ebdf; color: var(--light-ink); }
html .buyer-use-option.is-active { box-shadow: inset 0 3px var(--light-brand); }
html .buyer-use-status { border-inline-start-color: var(--light-brand); }
html .case-filter-bar, html .buyer-use-head, html .upgrade-collaboration,
html .location-intro--trust, html .case-enquiry-link, html .rfq-honesty-note,
html .service-page .capability-detail figure figcaption { border-color: var(--light-line); }
html .case-filter-button { border-color: #8d9785; }
html .case-filter-button:is(:hover,:focus-visible,.is-active) { color: #fff; background: var(--light-brand); border-color: var(--light-brand); }
html .case-year-select { background: var(--light-bg); color: var(--light-ink); border-color: #87917e; }
html .case-enquiry-link:is(:hover,:focus-visible) { background: #e6ebdf; color: var(--light-brand); }
html :is(.page-intro,.company-page .page-intro,.service-page .page-intro) > div,
html :is(.work-card,.project-card,.process-list li,.about-fact,.editorial-row,.service-range-item,.case-summary-copy,.case-note,.contact-aside,.legal-section) p,
html .case-note ul, html .service-copy p, html .service-copy > span,
html .capability-detail p, html .capability-detail ul, html .capability-detail-copy > span,
html .service-page .service-brief .service-brief-note,
html .service-page .capability-detail figure figcaption,
html .home-product-overview .product-category-copy p, html .product-category-link span,
html .upgrade-collaboration article p, html .home-cta .rfq-heading > div,
html .trust-lede, html .trust-card .cert-standard, html .cert-facts dd, html .certificate-entity, html .certificate-record dd,
html .knowledge-home .section-heading > p:last-child, html .guide-summary, html .guide-topic, html .guide-index,
html .knowledge-contact p, html .knowledge-email, html .knowledge-load-note,
html .faq-row p, html .guide-section p, html .guide-sources p, html .guide-note, html .guide-sources a,
html .work-card-meta, html .work-card-date, html .work-card-date time, html .home-case-date, html .home-case-date time,
html .case-content-date, html .case-content-date time, html .guide-home-meta .content-date, html .guide-home-meta .content-date time,
html .case-facts dt, html .cert-facts dt, html .cert-index, html .row-index, html .certificate-record dt,
html .form-actions p, html .form-note, html .contact-aside > p, html .rfq-mode-hint {
  color: var(--light-muted);
}
html .upgrade-collaboration article span { color: var(--light-brand); }
html .project-card img, html .work-card img, html .service img { filter: none; }
html .outline-button { color: var(--light-brand); border-color: #738268; }
html .outline-button:is(:hover,:focus-visible), html .solid-button:is(:hover,:focus-visible) { background: #26361e; border-color: #26361e; color: #fff; }
html .home-cta .outline-button { color: var(--light-brand); }
html .home-cta .outline-button:is(:hover,:focus-visible) { color: #fff; }
html .solid-button { color: #fff; background: var(--light-brand); }
html .certificate-download { border-color: #87917e; }
html .certificate-download:hover { background: var(--light-brand); color: #fff; }
html .service-link:is(:hover,:focus-visible), html .visual-detail summary:hover,
html .guide-link:hover .guide-arrow, html .faq-sidebar a:hover, html .guide-contents a:hover { color: var(--light-brand); }

/* Form fields and expanded reading states need their own light backgrounds. */
html .rfq-form, html .contact-form-wrap .rfq-form, html .form-row { border-color: var(--light-line); }
html .form-row :is(input,select,textarea), html .faq-search input, html .rfq-draft textarea {
  color: var(--light-ink); background: #fff; border-color: #87917e; caret-color: var(--light-brand);
}
html .form-row:focus-within { background: #edf1e7; }
html .form-row:focus-within > span { color: var(--light-brand); }
html :is(input,textarea)::placeholder { color: #697361; opacity: 1; }
html .rfq-mode-switch button[aria-pressed="true"] { color: #fff; background: var(--light-brand); }
html .rfq-honesty-note strong, html .rfq-draft-badge { color: var(--light-brand); }
html .faq-search button:not(:disabled):hover { background: #e6ebdf; }
html .form-error-summary { color: #8f2c1d; background: #fbede8; border-color: #a23926; }
html .field-error, html .form-consent.has-field-error, html [data-form-status][data-tone="error"] { color: #a23926; }
html [data-form-status][data-tone="success"] { color: #315c2c; }
html .reading-page .knowledge-hero, html .reading-page .site-header { background: var(--light-bg); }
html .reading-page .page-lede { color: var(--light-muted); }
html .direct-contact { color: var(--light-ink); }
html .direct-contact p, html .direct-contact span { color: var(--light-muted); }
html .direct-contact a:is(:hover,:focus-visible) { color: var(--light-brand); }
html .footer .direct-contact p, html .footer .direct-contact span { color: #c1c6b9; }
html .rfq.home-cta { background: var(--light-surface); color: var(--light-ink); }
html .buyer-breadcrumb, html .buyer-breadcrumb [aria-current], html .buyer-breadcrumb li::after { color: var(--light-muted); }
html .buyer-breadcrumb, html .buyer-related { border-color: var(--light-line); }
html .page-intro > p:first-child, html .rfq-heading > p,
html .positioning-copy > p, html .section-heading > p, html .capability-title > p,
html .process-heading > p, html .capability-nav span,
html .insight-topic-nav > p, html .insight-year-filter > p,
html .content-date, html .content-date time,
html .next-project > span, html .next-project em, html .next-project strong { color: var(--light-muted); }
html .home-cta .rfq-heading > div span { color: var(--light-muted); }
html .home-cta p, html .home-cta p span, html .process-list span,
html .service-page .capability-detail-copy > span, html .case-note > span,
html .b2b-kicker span, html .b2b-side-title, html .b2b-sidebar nav small,
html .b2b-collection-heading > span, html .b2b-card-use, html .b2b-steps article > span,
html .b2b-needs li > span { color: var(--light-muted); }
html body .b2b .b2b-card-use, html body .b2b .b2b-gallery-line,
html body .b2b .b2b-detail-facts dt, html body .b2b .b2b-detail-note,
html body .b2b .b2b-spec-content dt { color: var(--light-muted); }
/* The catalogue's original secondary copy uses important declarations. */
html body .b2b .b2b-card-use, html body .b2b .b2b-detail-note { color: var(--light-muted) !important; }
html .b2b-collection-heading h2 > span { color: var(--light-muted); }

@media (max-width: 900px) {
  html body .page-hero:has(.page-hero-media) { grid-template-columns: 1fr; gap: 2rem; padding-top: calc(var(--site-header-height) + 2rem); padding-bottom: 2.5rem; }
  html body .page-hero:has(.page-hero-media) .page-hero-media { aspect-ratio: 16 / 10; }
  html body .page-hero:has(.page-hero-media) .page-title { font-size: clamp(2rem,6vw,3.5rem); }
  html body .page-hero:has(.page-hero-media) .page-hero-meta { margin-top: 2rem; }
}
@media (max-width: 760px) {
  html body .site-header .primary-nav { color: var(--light-ink); background: var(--light-bg); border-color: var(--light-line); }
  html body:has(.hero) .site-header:not(.is-scrolled) .primary-nav a:hover { color: var(--light-brand); }
  html .site-header .language-switcher { border-color: #87917e; }
}

/* 2026-10-20 trade-terms bar (homepage under hero, product detail under quote button). */
html .trade-terms-bar { background: var(--light-surface); color: var(--light-ink); }
html .trade-terms-bar-inner { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 2rem; padding-block: 1.1rem; }
html .trade-terms-bar-title { margin: 0; font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--light-brand); white-space: nowrap; }
html .trade-terms-bar-list { display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; margin: 0; padding: 0; list-style: none; flex: 1 1 36rem; min-width: 0; }
html .trade-terms-bar-list li { position: relative; padding-inline-start: 1.05rem; font-size: .92rem; line-height: 1.45; overflow-wrap: anywhere; }
html .trade-terms-bar-list li::before { content: ""; position: absolute; inset-inline-start: 0; top: .5em; width: .42rem; height: .42rem; border-radius: 50%; background: var(--light-brand); }
html .trade-terms-bar-link { font-size: .86rem; font-weight: 600; color: var(--light-brand); text-decoration: underline; text-underline-offset: .2em; white-space: nowrap; }
@media (max-width: 760px) {
  html .trade-terms-bar-inner { flex-direction: column; align-items: flex-start; gap: .6rem; padding-block: 1rem; }
  html .trade-terms-bar-list { flex-direction: column; flex-basis: auto; gap: .4rem; }
  html .trade-terms-bar-list li { font-size: .88rem; }
}
html .b2b-trade-terms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; margin: 14px 0 0; padding: 12px 14px; list-style: none; background: #f1f3ec; border: 1px solid #d8decf; }
html .b2b-trade-terms li { position: relative; padding-inline-start: 13px; font-size: 12px; line-height: 1.5; color: #2f3b2a; overflow-wrap: anywhere; }
html .b2b-trade-terms li::before { content: ""; position: absolute; inset-inline-start: 0; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: var(--light-brand); }
@media (max-width: 700px) { html .b2b-trade-terms { grid-template-columns: minmax(0, 1fr); margin-inline-end: 72px; } }
