:root {
  --color-caution-yellow: #b3182b;
  --color-midnight-steel: #16235c;
  --color-industrial-white: #e8e7e2;
  --color-carbon: #2b3145;
  --color-gunmetal: #454b61;
  --color-aluminum: #a9acb8;

  --font-univers: 'Manrope', 'Helvetica Neue', Arial, ui-sans-serif, system-ui, sans-serif;

  --radius-nav: 6px;
  --radius-cards: 9px;
  --radius-images: 16px;
  --radius-buttons: 6px;
  --radius-sections: 24px;

  --section-gap: 120px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-univers);
  font-weight: 400;
  background: var(--color-industrial-white);
  color: var(--color-midnight-steel);
  margin: 0;
}

.font-display {
  font-weight: 300;
  letter-spacing: -0.04em;
}

.section-gap { padding-top: var(--section-gap); padding-bottom: var(--section-gap); }
@media (max-width: 768px) {
  .section-gap { padding-top: 64px; padding-bottom: 64px; }
}

.nav-pill {
  background: var(--color-carbon);
  color: var(--color-industrial-white);
  border-radius: var(--radius-nav);
  padding: 5px 14px;
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
}

.nav-pill[aria-current="page"] {
  background: var(--color-caution-yellow);
  color: #fff;
}

.btn-yellow {
  background: var(--color-caution-yellow);
  color: #fff;
  border-radius: var(--radius-buttons);
  padding: 7px 16px;
  font-size: 14px;
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  border: none;
  cursor: pointer;
}
.btn-yellow:hover { filter: brightness(1.15); }
.btn-yellow:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

.hero-overlay {
  background: rgba(0, 0, 0, 0.55);
}

.card-dark {
  background: var(--color-carbon);
  border: 1px solid var(--color-gunmetal);
  border-radius: var(--radius-cards);
  padding: 24px;
}

.hairline { border-color: var(--color-gunmetal); }

.img-radius { border-radius: var(--radius-images); }

input, textarea, select {
  background: var(--color-industrial-white);
  border: 1px solid var(--color-gunmetal);
  border-radius: var(--radius-buttons);
  padding: 12px 14px;
  font-size: 16px;
  width: 100%;
  font-family: var(--font-univers);
}
input:focus, textarea:focus, select:focus {
  outline: 3px solid var(--color-caution-yellow);
  outline-offset: 1px;
  border-color: var(--color-midnight-steel);
}
label { font-size: 13px; font-weight: 400; color: var(--color-carbon); display: block; margin-bottom: 6px; }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--color-caution-yellow); color: #fff; padding: 12px 16px; border-radius: var(--radius-buttons);
}
.skip-link:focus { left: 16px; top: 16px; }

/* Sub-page hero (shorter, no full viewport height) */
.page-hero {
  background: var(--color-midnight-steel);
  padding-top: 160px;
  padding-bottom: 64px;
}

/* Mobile nav */
.mobile-nav-toggle {
  display: none;
  background: transparent;
  border: none;
  color: var(--color-industrial-white);
  padding: 8px;
  cursor: pointer;
}
@media (max-width: 767px) {
  .mobile-nav-toggle { display: inline-flex; }
}

#mobile-nav {
  display: none;
  flex-direction: column;
  gap: 8px;
  padding: 0 24px 20px;
  background: var(--color-midnight-steel);
}
#mobile-nav.open { display: flex; }
#mobile-nav a { color: var(--color-industrial-white); font-size: 15px; padding: 10px 4px; border-bottom: 1px solid var(--color-gunmetal); }