/* Hallmark · component: shared inner-page banner · genre: modern-minimal · macrostructure: component-only
 * tone: restrained industrial · anchor hue: MOSINTER green · fingerprint: image-backed centered masthead
 * states: breadcrumb default · hover · focus · active · disabled · contrast: pass (40–41) · pre-emit critique: P5 H5 E5 S5 R5 V4
 */
:root {
  --mos-header-stack-height: 9.6875rem;
  --mos-banner-min-height: 22.5rem;
  --mos-banner-title-max: 56rem;
  --mos-banner-copy-max: 45rem;
  --mos-banner-space-sm: .5rem;
  --mos-banner-space-md: .75rem;
  --mos-banner-space-lg: 2.5rem;
  --mos-banner-space-xl: 3rem;
  --mos-banner-ink: var(--mos-header-ink, oklch(96% 0.008 250));
  --mos-banner-muted: var(--mos-header-muted, oklch(84% 0.012 250));
  --mos-banner-accent: var(--mos-header-accent, oklch(58.365% 0.12409 131.416));
  --mos-banner-accent-strong: var(--mos-header-accent-strong, oklch(54.123% 0.12997 132.225));
  --mos-banner-focus: var(--mos-header-focus, oklch(76% 0.12 131.416));
  --mos-banner-title-size: clamp(2.5rem, 3vw + 1rem, 3.125rem);
  --mos-banner-copy-size: 1.0625rem;
  --mos-banner-position: center center;
  --mos-banner-position-mobile: var(--mos-banner-position);
}

html,
body {
  overflow-x: clip;
}

.site-header + .page-content {
  padding-block-start: var(--mos-header-stack-height);
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) {
  position: relative;
  isolation: isolate;
  display: block;
  width: 100%;
  height: auto;
  min-height: var(--mos-banner-min-height);
  padding: 0 !important;
  overflow: hidden;
  background-position: var(--mos-banner-position);
  background-size: cover;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) > .overlay-main {
  inset: 0;
  width: auto;
  height: auto;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) > .container {
  display: flex;
  height: auto;
  min-height: var(--mos-banner-min-height);
  align-items: center;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-bnr-inr-entry {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: var(--mos-banner-min-height);
  padding: var(--mos-banner-space-lg) 0 3.5rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .banner-title-outer,
.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .banner-title-name {
  width: 100%;
  min-width: 0;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .banner-title-name {
  max-width: var(--mos-banner-title-max);
  margin-inline: auto;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-bnr-inr-entry h1 {
  min-width: 0;
  margin-block-end: var(--mos-banner-space-md);
  color: var(--mos-banner-ink);
  font-size: var(--mos-banner-title-size);
  font-style: normal;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-bnr-inr-entry p {
  max-width: var(--mos-banner-copy-max);
  margin: 0 auto;
  color: var(--mos-banner-muted);
  font-size: var(--mos-banner-copy-size);
  line-height: 1.65;
}

/* Group Overview has a distinct content wrapper; normalize it to the shared banner rhythm. */
.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .mos-about-hero-copy {
  display: flex;
  width: 100%;
  min-width: 0;
  max-width: var(--mos-banner-title-max);
  margin-inline: auto;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-align: center;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-breadcrumb {
  display: flex;
  margin-block-start: var(--mos-banner-space-sm);
  flex-wrap: wrap;
  justify-content: center;
  gap: .125rem var(--mos-banner-space-sm);
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-breadcrumb li a {
  color: var(--mos-banner-ink);
  white-space: nowrap;
  transition: color 180ms cubic-bezier(.16, 1, .3, 1);
}

@media (hover: hover) and (pointer: fine) {
  .wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-breadcrumb li a:hover {
    color: var(--mos-banner-accent);
  }
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-breadcrumb li a:focus-visible {
  color: var(--mos-banner-accent);
  outline: 2px solid var(--mos-banner-focus);
  outline-offset: 3px;
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-breadcrumb li a:active {
  color: var(--mos-banner-accent-strong);
}

.wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-breadcrumb li a[aria-disabled="true"] {
  opacity: .55;
  cursor: not-allowed;
  pointer-events: none;
}

@media (max-width: 61.9375rem) {
  :root {
    --mos-header-stack-height: 9.8125rem;
  }
}

@media (max-width: 47.9375rem) {
  :root {
    --mos-header-stack-height: 11.875rem;
    --mos-banner-min-height: 23.75rem;
    --mos-banner-title-size: 2.3125rem;
    --mos-banner-copy-size: .875rem;
  }

  .wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) {
    background-position: var(--mos-banner-position-mobile);
  }

  .wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-bnr-inr-entry {
    padding-block: 2.5rem 3.25rem;
  }

  .wt-bnr-inr:has(> .overlay-main.site-bg-secondry.opacity-07) .wt-breadcrumb li {
    font-size: 1.0625rem;
  }
}