/* Shared site palette, matched to the approved navy/red logo. */
:root {
  --logo-navy: #303f75;
  --logo-red: #df252a;
  --logo-red-text: #bc1d24;
  --logo-navy-deep: #26315c;
  --logo-muted: #60677a;
  --logo-line: #e0e4ef;
  --logo-soft: #f7f8fc;
  --logo-red-tint: #fff2f3;
}

body,
body:has(.brand-page),
body:has(.brand-page-fuji),
body:has(.product-page.brand-page-mhi) {
  --ink: var(--logo-navy);
  --muted: var(--logo-muted);
  --blue: var(--logo-red);
  --accent: var(--logo-red);
  --line: var(--logo-line);
  --soft: var(--logo-soft);
  --theme-shadow: 0 14px 36px #303f750a;
  color: var(--logo-navy);
}

::selection { background: var(--logo-navy); color: #fff; }
a:focus-visible, button:focus-visible, summary:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline-color: var(--logo-red);
}

/* Navigation: navy identity, red actions and active states. */
.topbar { background: var(--logo-navy); color: #eef0f8; }
.topbar a:hover { color: #ffccd0; }
.top-dot { color: #c6cce1; }
.header { border-color: var(--logo-line); }
.header nav a, .menu-button { color: var(--logo-navy); }
.header nav a:hover, .header nav a[aria-current] {
  color: var(--logo-red-text);
  border-color: var(--logo-red);
}
.header-contact {
  color: var(--logo-red-text);
  border-color: #ebc9cd;
  background: #fff;
}
.header-contact:hover {
  color: #fff;
  border-color: var(--logo-red);
  background: var(--logo-red);
}
.header nav.open { border-color: var(--logo-line); box-shadow: 0 20px 30px #303f7510; }

/* Red is reserved for actions, rules and short emphasis. */
.button:not(.button-outline):not(.button-white) {
  color: #fff;
  background: var(--logo-red);
  border-color: var(--logo-red);
}
.button:not(.button-outline):not(.button-white):hover {
  color: #fff;
  background: var(--logo-red-text);
  border-color: var(--logo-red-text);
}
.button-outline { color: var(--logo-navy); border-color: var(--logo-line); background: #fff; }
.button-outline:hover { color: var(--logo-red-text); border-color: var(--logo-red); background: var(--logo-red-tint); }
.button-white { color: var(--logo-red-text); background: #fff; border-color: #fff; }
.button-white:hover { color: #fff; background: var(--logo-red); border-color: var(--logo-red); }
.text-link { color: var(--logo-navy); }
.text-link:hover, .intro .text-link:hover { color: var(--logo-red-text); }
.eyebrow, .row-number, .application-card-index, .form-status {
  color: var(--logo-red-text);
}
.small-rule { background: var(--logo-red); }
.hero h1 { color: var(--logo-navy); }
.hero h1 span { color: var(--logo-red); }
.hero-copy > p { color: var(--logo-muted); }
.hero { background: #f5f6fa; }
.hero-shade {
  background: linear-gradient(90deg, #f5f6fa 0%, #f5f6fa 32%, #f5f6fad9 43%, #f5f6fa00 70%);
}
.hero-caption { color: #fff; background: #303f75e6; }
.image-label { background: var(--logo-navy); color: #fff; }

/* Neutral surfaces carry the palette without competing with project images. */
.section-soft, .page-hero, .application-page-heading .page-hero,
.istanbul-strip, .side-contact, .checklist, .contact-form,
.coverage-grid > div, .application-card-featured { background: var(--logo-soft); }
.page-hero p, .application-page-heading .page-hero p,
.prose p, .prose li { color: var(--logo-muted); }
.breadcrumbs, body:has(.brand-page) .breadcrumbs { color: var(--logo-muted); }
.breadcrumbs [aria-current], .breadcrumbs a:hover { color: var(--logo-red-text); }
.credentials strong { color: var(--logo-navy); }
.credentials span { color: var(--logo-muted); }
.service-row:hover { background: #f0f2f9; }
.service-row:hover h3, .editorial-card:hover h3,
.application-card:hover h2, .hub-card:hover h2 { color: var(--logo-red-text); }
.editorial-card:hover, .related-card:hover { border-color: #df252a70; }
.article-index { color: #8992b3; }
.row-plus { color: var(--logo-red-text); }
.checklist, .quote-block { border-left-color: var(--logo-red); }
.technical-note, .side-box, .contact-item, .source-links,
.field input, .field select, .field textarea { border-color: var(--logo-line); }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--logo-red); }
th { color: var(--logo-navy); background: var(--logo-soft); }
td { color: var(--logo-muted); }
.faq-list summary > span { color: var(--logo-red-text); }
.source-links a, .contact-item > a { color: var(--logo-red-text); }
.vrf-brand-logo .brand-home-link > span { border-color: var(--logo-line); }
.vrf-brand-logo .brand-home-link:hover > span { color: var(--logo-red-text); border-color: var(--logo-red); }

/* Larger bands use navy; pale text stays readable on their dark surface. */
.section-dark, .contact-band { background: var(--logo-navy); color: #fff; }
.contact-band { border-top: 3px solid var(--logo-red); }
.section-dark h1, .section-dark h2, .section-dark h3,
.contact-band h2 { color: #fff; }
.section-dark .eyebrow, .section-dark .row-number,
.sector-grid .row-number, .contact-band .eyebrow { color: #ffd1d4; }
.section-dark .text-link, .contact-band .contact-phone { color: #fff; }
.section-dark .text-link:hover, .sector-grid > a:hover h3 { color: #ffd1d4; }
.sector-grid, .sector-grid > a { border-color: #ffffff30; }
.sector-grid p, .section-dark .sector-foot { color: #e0e4f2; }
.contact-band .button-white { color: var(--logo-red-text); background: #fff; border-color: #fff; }
.contact-band .button-white:hover { color: #fff; background: var(--logo-red); border-color: var(--logo-red); }
.footer { background: var(--logo-navy-deep); color: #d9deed; }
.footer h3, .footer-operator { color: #fff; }
.footer-grid a:hover, .footer-bottom a:hover { color: #ffd1d4; }
.footer-bottom { border-color: #ffffff25; }

@media (max-width: 760px) {
  .hero-shade {
    background: linear-gradient(180deg, #f5f6fa 0%, #f5f6fa 49%, #f5f6fab3 59%, #f5f6fa00 80%);
  }
}