/* Static, merged contours keep text-stroke from exposing seams inside glyphs. */
@font-face {
  font-family: 'Xeon Outline Text';
  src: url('fonts/xeon-outline/xeon-outline-medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Extend the Ready to Build heading treatment across the homepage. */
h1.home-display,
h2.home-display,
h3.home-display,
.cap-card-title.home-display {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -0.055em;
  text-transform: uppercase;
}

.home-section-title {
  font-size: clamp(28px, 4vw, 52px);
}

#hero {
  min-height: max(760px, 100svh);
}

#hero .hero-slide {
  padding-top: 132px;
  padding-bottom: 200px;
}

/* Crossfade the photographs without layering two sets of lettering. */
#hero .hero-slide:not(.active) .hero-content {
  visibility: hidden;
}

#hero .hero-title {
  font-size: clamp(42px, 6.5vw, 88px);
  margin-bottom: 26px;
}

/* Outlined lettering stays on selected photographic slides. */
#hero .hero-title em {
  font-family: 'Xeon Outline Text', Arial, sans-serif;
  font-style: normal;
  letter-spacing: 0;
  line-height: 1.12;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.9);
}

#hero .hero-eyebrow {
  color: #d2d9e1;
  border-color: rgba(255, 255, 255, 0.24);
  background: rgba(8, 14, 21, 0.4);
  line-height: 1.5;
  margin-bottom: 26px;
}

#hero .hero-sub {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.8);
  max-width: 580px;
  margin-bottom: 30px;
  letter-spacing: 0;
}

#hero .hero-btn-primary,
#hero .hero-btn-ghost {
  font-weight: 500;
  letter-spacing: 0.04em;
}

.home-capability-title {
  font-size: clamp(22px, 2.8vw, 36px);
  color: #111;
  margin-bottom: 18px;
}

@media (max-width: 900px) {
  #hero { min-height: max(780px, 100svh); }
  /* Reserve separate space for the two-row statistics and slide controls. */
  #hero .hero-slide { padding-top: 100px; padding-bottom: 228px !important; }
  #hero .hero-controls { bottom: 154px; }
  #hero .hero-title { font-size: clamp(30px, 7.8vw, 64px) !important; line-height: 1.02 !important; }
  #hero .hero-eyebrow { max-width: 100%; font-size: 10px !important; letter-spacing: 0.12em; }
}

@media (max-width: 480px) {
  #hero .hero-title { font-size: clamp(27px, 7.8vw, 38px) !important; }
  #hero .hero-title em { -webkit-text-stroke-width: 0.8px; }
  #hero .hero-sub { font-size: 14px !important; }
  h1.home-display, h2.home-display, h3.home-display { letter-spacing: -0.05em; }
  .cap-card-title.home-display { font-size: 28px; }
  #our-capabilities .cap-card { padding: 36px 24px; }
}

@media (forced-colors: active) {
  #hero .hero-title em { color: CanvasText; -webkit-text-stroke: 0; }
}
