/* WES Brand Identity v18 palette. Load after the page-specific styles.
   Photographic overlays retain their existing stops and opacity; only the
   tinted navy is replaced with the identity's neutral #232323 ink. */
:root {
  --red: #E11B22;
  --ink: #232323;
  --paper: #F7F6F2;
  --stone: #E5E3DE;
  --muted: #66645F;
  --line: #D3D0C9;
  --rule: #D3D0C9;
  --soft-rule: #E5E3DE;
}

.brand-page { --brand-navy: var(--ink); }
body { background: var(--paper); color: var(--ink); }

/* Shared desktop and mobile navigation. Solid ink prevents the photograph
   underneath the fixed header from introducing a blue tint. */
.header-shell,
.nav,
.brand-dropdown {
  background: var(--ink);
  color: var(--paper);
}
.header-shell { border-bottom-color: rgba(247, 246, 242, .14); }
.brand-dropdown {
  border-color: rgba(247, 246, 242, .15);
  box-shadow: 0 12px 24px rgba(35, 35, 35, .15);
}
.nav .brand-dropdown a { color: var(--paper); }
.nav .brand-dropdown a + a { border-top-color: rgba(247, 246, 242, .15); }
.brand-dropdown span { color: var(--stone); }
.nav .brand-dropdown a:hover,
.nav .brand-dropdown a:focus-visible {
  background: var(--stone);
  color: var(--red);
}
.nav .header-cta {
  border-color: var(--stone);
  color: var(--paper);
}
.nav .header-cta:hover,
.nav .header-cta:focus-visible {
  background: var(--red);
  border-color: var(--red);
  color: var(--paper);
}
.menu-button { color: var(--paper); border-color: rgba(247, 246, 242, .38); }

/* Home banner, solid brand panels, and the contact sections above the footer. */
.selected-hero,
.brand-hero,
.brand-photo-panel,
.brand-feature,
.brand-language,
.brand-contact,
.contact {
  background: var(--ink);
  color: var(--paper);
}
.selected-hero::after {
  background: linear-gradient(90deg,
    rgba(35, 35, 35, 0) 0%,
    rgba(35, 35, 35, 0) 38%,
    rgba(35, 35, 35, .04) 44%,
    rgba(35, 35, 35, .35) 52%,
    rgba(35, 35, 35, .78) 64%,
    rgba(35, 35, 35, .92) 82%,
    rgba(35, 35, 35, .94) 100%);
}
.selected-banner .eyebrow,
.hero-copy,
.hero-base b { color: var(--stone); }
.selected-banner h1 em,
.hero-actions .text-link,
.hero-base { color: var(--paper); }
.selected-banner h1 .hero-emphasis { color: var(--red); }
.selected-banner .eyebrow::before { background: var(--red); }
.hero-base::before { border-top-color: rgba(247, 246, 242, .31); }

/* WES and Sterna banners, including their individual photographic treatments. */
.brand-hero::after {
  background: linear-gradient(90deg,
    rgba(35, 35, 35, .95) 0%,
    rgba(35, 35, 35, .87) 35%,
    rgba(35, 35, 35, .45) 64%,
    rgba(35, 35, 35, .07) 100%);
}
.brand-hero--wes::after {
  background: linear-gradient(90deg,
    rgba(35, 35, 35, .88) 0%,
    rgba(35, 35, 35, .75) 30%,
    rgba(35, 35, 35, .38) 54%,
    rgba(35, 35, 35, .06) 75%,
    rgba(35, 35, 35, 0) 100%);
}
.brand-hero--sterna::after {
  background: linear-gradient(90deg,
    var(--ink) 0%, var(--ink) 31%,
    rgba(35, 35, 35, .87) 45%,
    rgba(35, 35, 35, .22) 72%,
    rgba(35, 35, 35, .07) 100%);
}
.brand-photo-panel::after {
  background: linear-gradient(180deg,
    rgba(35, 35, 35, .03) 12%,
    rgba(35, 35, 35, .20) 40%,
    rgba(35, 35, 35, .91) 100%);
}
.brand-page--wes .brand-photo-panel::after {
  background: linear-gradient(180deg,
    rgba(35, 35, 35, 0) 18%,
    rgba(35, 35, 35, .12) 43%,
    rgba(35, 35, 35, .85) 100%);
}
.brand-feature .brand-scope,
.brand-language-list,
.brand-language-list li { border-color: rgba(247, 246, 242, .15); }
.contact .eyebrow,
.contact-copy p { color: var(--stone); }

/* Shared buttons and supporting neutrals use the same palette as the chips. */
.button,
.hero-actions .button,
.button:hover,
.hero-actions .button:hover {
  background: var(--red);
  color: var(--paper);
}
.service-tab[aria-selected="true"] {
  background: var(--ink);
  color: var(--paper);
}
.service-tab[aria-selected="true"] b { color: var(--paper); }
#group .division-index,
.brand-breadcrumb span[aria-hidden] { color: var(--muted); }
#group .division-cta-icon { border-color: var(--line); }
#group .division-cta:hover .division-cta-icon { border-color: var(--red); }
.brand-logo { background: var(--paper); border-color: var(--line); }
.brand-logo:hover { border-color: var(--muted); }
.site-footer { background: var(--paper); color: var(--muted); }
.skip-link { background: var(--paper); color: var(--ink); }
.career-main h1 { text-shadow: 0 1px 12px rgba(35, 35, 35, .15); }

@media (max-width: 800px) {
  .nav { border-bottom-color: rgba(247, 246, 242, .19); }
  .brand-dropdown { box-shadow: none; }
  .brand-menu-trigger { border-color: rgba(247, 246, 242, .19); }
  .brand-menu-trigger[aria-expanded="true"] { border-color: var(--red); }
  .selected-hero::after {
    background: linear-gradient(180deg,
      rgba(35, 35, 35, .82) 0%,
      rgba(35, 35, 35, .82) 58%,
      rgba(35, 35, 35, .40) 100%);
  }
  .brand-hero::after {
    background: linear-gradient(90deg,
      rgba(35, 35, 35, .94),
      rgba(35, 35, 35, .66) 65%,
      rgba(35, 35, 35, .38));
  }
  .brand-hero--wes::after {
    background: linear-gradient(90deg,
      rgba(35, 35, 35, .88),
      rgba(35, 35, 35, .68) 65%,
      rgba(35, 35, 35, .24));
  }
  .brand-hero--sterna::after {
    background: linear-gradient(90deg,
      rgba(35, 35, 35, .94),
      rgba(35, 35, 35, .72) 65%,
      rgba(35, 35, 35, .40));
  }
}

@media (max-width: 540px) {
  .brand-hero::after,
  .brand-hero--sterna::after {
    background: linear-gradient(90deg,
      rgba(35, 35, 35, .93),
      rgba(35, 35, 35, .77));
  }
  .brand-hero--wes::after {
    background: linear-gradient(90deg,
      rgba(35, 35, 35, .85),
      rgba(35, 35, 35, .70));
  }
}
