/* Sorian Aerospace : Design System
   Global entry point. Consumers link this one file.
   Import order: fonts → tokens (colors, type, spacing, effects). */

@import url('./tokens/fonts.css');
@import url('./tokens/colors.css');
@import url('./tokens/typography.css');
@import url('./tokens/spacing.css');
@import url('./tokens/effects.css');

/* Shared editorial labels.
   Every page hero uses site-eyebrow. Every numbered section uses kicker.
   Keep these values centralized so local page styles cannot drift. */
.site-eyebrow,
.product.site-eyebrow,
.eyebrow.site-eyebrow {
  display: block;
  margin: 0 0 20px !important;
  color: var(--red) !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
}

.kicker {
  display: block;
  margin-bottom: 18px !important;
  color: var(--red) !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
}

/* Refined site scale. Page templates keep their individual compositions,
   while these shared caps prevent oversized display type and excess height. */
@media (min-width: 901px) {
  .hero {
    min-height: min(78vh, 760px) !important;
  }

  .hero h1 {
    font-size: clamp(44px, 5.2vw, 72px) !important;
    line-height: .98 !important;
    letter-spacing: -.032em !important;
  }

  .pad {
    padding-block: clamp(72px, 7vw, 108px) !important;
  }

  .ctaband h2 {
    font-size: clamp(36px, 4.6vw, 64px) !important;
  }
}

@media (max-width: 900px) {
  .hero h1 {
    font-size: clamp(40px, 8vw, 58px) !important;
    line-height: 1 !important;
    letter-spacing: -.03em !important;
  }

  .pad {
    padding-block: clamp(64px, 10vw, 88px) !important;
  }
}
