/* Shared color system. Load after the page styles so every template stays in sync. */
:root {
  --theme-primary: #183b4e;
  --theme-primary-hover: #102d3d;
  --theme-link: #28566d;
  --theme-ink: #1d303a;
  --theme-muted: #59676e;
  --theme-page: #fbfaf7;
  --theme-surface: #ffffff;
  --theme-soft: #eff2f1;
  --theme-tint: #e7eeed;
  --theme-border: #d7dfdd;
  --theme-accent: #b8c9cd;
  --theme-footer: #142e3e;
  --theme-footer-bottom: #102532;
  --ink: var(--theme-ink);
  --charcoal: var(--theme-footer);
  --blue: var(--theme-primary);
  --blue-deep: var(--theme-link);
  --cyan: var(--theme-accent);
  --paper: var(--theme-page);
  --soft: var(--theme-soft);
  --line: var(--theme-border);
  color-scheme: light;
  accent-color: var(--theme-primary);
}

body { background: var(--theme-page); color: var(--theme-ink); }
::selection { background: var(--theme-primary); color: #fff; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--theme-link);
  outline-offset: 3px;
}

/* Navigation and shared actions. */
.announcement { background: var(--theme-footer); color: #edf2f2; }
.announcement i { background: var(--theme-accent); box-shadow: 0 0 0 3px rgb(184 201 205 / 12%); }
.site-header { background: rgb(251 250 247 / 98%); border-bottom-color: var(--theme-border); box-shadow: 0 5px 20px rgb(20 46 62 / 4%); }
.brand-copy small { color: var(--theme-muted); }
.main-nav > .nav-link, .nav-trigger, .header-contact { color: var(--theme-ink); }
.nav-link:hover, .nav-trigger:hover, .nav-trigger[aria-expanded=true],
.main-nav > .nav-link.is-current, .nav-trigger.is-current { color: var(--theme-primary); background: var(--theme-tint); }
.nav-dropdown { background: var(--theme-surface); border-color: var(--theme-border); }
.nav-dropdown a:hover { color: var(--theme-primary); background: var(--theme-soft); }
.nav-dropdown a small { color: var(--theme-muted); }
.nav-dropdown .menu-all { border-top-color: var(--theme-border) !important; }
.menu-button { background: var(--theme-surface); border-color: var(--theme-border); }
.menu-button span { background: var(--theme-ink); }
.button-blue, .button-dark, .quote-link, .series-hero .button,
.product-info a, .carousel-arrow, .mcw-mobile-quote {
  background: var(--theme-primary);
  color: #fff;
  box-shadow: none;
}
.button-blue:hover, .button-dark:hover, .quote-link:hover, .series-hero .button:hover,
.product-info a:hover, .carousel-arrow:hover, .mcw-mobile-quote:hover {
  background: var(--theme-primary-hover);
  color: #fff;
}
.button-outline, .rfq-actions .button-outline {
  background: transparent;
  color: var(--theme-primary);
  border-color: var(--theme-primary);
}
.button-outline:hover, .rfq-actions .button-outline:hover { background: var(--theme-tint); color: var(--theme-primary-hover); }
.button-white { background: var(--theme-page); color: var(--theme-primary); }
.button-white:hover { background: var(--theme-tint); color: var(--theme-primary-hover); }
.mcw-copy { background: #fff; color: var(--theme-link); border-color: var(--theme-border); }
.mcw-copy:hover { background: var(--theme-soft); }

/* Warm, quiet sections keep the real product photography prominent. */
.wave-white { fill: var(--theme-page); }
.wave-accent { fill: var(--theme-accent); }
.homepage .hero .button-blue { background: var(--theme-page); color: var(--theme-primary); }
.homepage .hero .button-blue:hover { background: var(--theme-tint); color: var(--theme-primary-hover); }
.button-glass:hover { color: var(--theme-primary); }
.buyer-proof { background: var(--theme-page); }
.buyer-proof-grid, .buyer-proof-grid > div { border-color: var(--theme-border); }
.buyer-proof-grid { box-shadow: 0 12px 32px rgb(20 46 62 / 5%); }
.buyer-proof-grid span, .product-info p, .direct-grid p { color: var(--theme-muted); }
.product-card { background: var(--theme-surface); }
.lineup-section .product-card { border-color: var(--theme-border); }
.feature-section, .feature-section.reverse { background: var(--theme-soft); }
.hotspot span { background: var(--theme-primary); color: #fff; }
.marquee { background: var(--theme-footer); border-color: var(--theme-footer); color: var(--theme-primary); }
.marquee-track { background: var(--theme-page); }
.factory-direct { background: var(--theme-soft); }
.direct-grid article { background: var(--theme-surface); border-color: var(--theme-border); }
.collections-band { background: var(--theme-footer); }
.application-grid article { border-color: rgb(184 201 205 / 25%); background: rgb(255 255 255 / 3%); }
.application-grid p { color: #d3dde1; }
.quote-section { background: var(--theme-primary); color: #fff; }
.quote-section :where(a, button):focus-visible,
.hero :where(a, button):focus-visible { outline-color: var(--theme-accent); }

/* Product details, buying guides, tables and inquiry forms. */
.retro-detail { --retro-link: var(--theme-link); --retro-line: var(--theme-border); }
.sourcing-summary, .catalog-card, .resource-card, .entity-panel,
.mcw-filter-bar, .retro-detail .rfq-form { background: var(--theme-soft); border-color: var(--theme-border); }
.detail-callout { background: var(--theme-tint); }
.factory-facts > div, .spec-list > div, .data-status > div { background: var(--theme-soft); border-color: var(--theme-border); }
.model-note, .retro-note, .buyer-checklist li { background: var(--theme-soft); border-left-color: var(--theme-link); }
.series-hero > figure { background: #fff; border-color: var(--theme-border); box-shadow: 0 12px 30px rgb(20 46 62 / 5%); }
.series-hero > figure figcaption { border-top-color: var(--theme-border); color: var(--theme-muted); }
.series-hero > div > p:not(.eyebrow):not(.detail-lead):not(.source-note) { color: var(--theme-ink); border-color: var(--theme-border); }
.series-hero .source-note { background: var(--theme-soft); border-color: var(--theme-border); color: var(--theme-muted); }
.series-hero .source-note::before { background: var(--theme-tint); color: var(--theme-link); }
.detail-main:has(.series-hero) > .detail-section:first-of-type { border-top-color: var(--theme-border); }
.catalog-card h2 a, .resource-card h2, .resource-card h3,
.spec-list dd, .retro-quick dd { color: var(--theme-ink); }
.source-note, .breadcrumbs, .detail-lead, .series-hero .detail-lead,
.detail-main figcaption, .catalog-card p, .resource-card p,
.spec-list dt, .retro-quick dt, .article-meta,
.mcw-model-card p, .mcw-filter-count, .mcw-steps span,
.mcw-section > p, .mcw-video-grid p, .mcw-video-grid figcaption,
.faq-grid details p, .retro-detail p.retro-small,
.sourcing-page .retro-detail .series-hero > div > p.retro-small { color: var(--theme-muted); }
table a, .source-note a, .detail-main p a, .related-links a, .text-link,
.form-privacy a, #rfq-status a, .resource-card a,
.factory-facts strong, .data-status strong, .series-hero .eyebrow,
.catalog-card .product-kicker, .mcw-model-card .product-kicker,
.mcw-model-card .mcw-card-link, .mcw-inline-links a, .mcw-download,
.mcw-quote-links a, .mcw-steps li::before { color: var(--theme-link); }
caption, .retro-detail caption { background: var(--theme-tint); color: var(--theme-ink); }
thead { background: var(--theme-soft); }
th, td { border-bottom-color: var(--theme-border); }
.evidence-grid figure, .article-meta, .mcw-model-card,
.mcw-empty, .mcw-checklist details { border-color: var(--theme-border); }
.resource-card .resource-card-media, .mcw-video-grid figure { background: var(--theme-soft); border-color: var(--theme-border); }
.mcw-video-grid video { background: var(--theme-tint); }
.mcw-steps li { border-top-color: var(--theme-accent); }
.mcw-short-specs span { background: var(--theme-soft); color: var(--theme-ink); border-color: var(--theme-border); }
.mcw-thumb { border-color: var(--theme-border); }
.mcw-thumb[aria-pressed=true] { border-color: var(--theme-primary); }
.rfq-form { background: #fff; color: var(--theme-ink); }
.quote-inner .rfq-form p { color: var(--theme-muted); }
.rfq-fields input, .rfq-fields select, .rfq-fields textarea,
.mcw-filter-bar select, .mcw-filter-bar input { background: #fff; color: var(--theme-ink); border-color: #99aaaF; }
.rfq-fields :is(input, textarea)::placeholder, .mcw-filter-bar input::placeholder { color: var(--theme-muted); opacity: 1; }
#rfq-status { background: var(--theme-soft); color: var(--theme-ink); border-color: var(--theme-border); }
.retro-detail :is(a, button, summary, input, select, textarea):focus-visible,
.retro-detail .table-scroll:focus-visible,
.quote-section .rfq-form :where(a, button):focus-visible { outline-color: var(--theme-link); }

/* A consistent navy footer; WhatsApp retains its familiar brand green. */
.site-footer { background: var(--theme-footer); color: #d3dde1; }
.site-footer .footer-grid p, .site-footer .footer-grid a,
.site-footer .footer-bottom a { color: #d3dde1; }
.site-footer .footer-contact a { color: #c2d4dc; }
.site-footer .footer-bottom { background: var(--theme-footer-bottom); border-top-color: #344d5b; color: #d3dde1; }
.site-footer a:hover, .site-footer a:focus-visible { color: #fff; outline-color: var(--theme-accent); }

@media (max-width: 1160px) {
  .main-nav { background: var(--theme-page); border-color: var(--theme-border); }
  .main-nav .nav-link, .nav-trigger { border-bottom-color: var(--theme-border); }
  .nav-dropdown { background: var(--theme-soft); }
}
@media (max-width: 700px) {
  .homepage .hero { background-color: var(--theme-footer); }
  .homepage .hero-shade { background: linear-gradient(180deg, transparent 15%, rgb(20 46 62 / 12%) 29%, var(--theme-footer) 48%); }
}