/**
 * A.R.C Technology — Typography v6.0
 * "Resilient Orbit" — Bold, chunky, confident
 * Space Grotesk display titles, Inter body, JetBrains Mono labels
 */

/* ===========================
   HEADINGS — Bold neubrutalist
   =========================== */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: var(--font-bold);
  line-height: var(--leading-tight);
  color: var(--color-text);
  letter-spacing: -0.03em;
}

/* Space Grotesk tops out at 700 — 900 only ever rendered synthetic faux-bold */
h1 {
  font-size: var(--fs-hero);
  font-weight: var(--font-bold);
  line-height: var(--leading-none);
  letter-spacing: -0.04em;
}

h2 {
  font-size: var(--fs-4xl);
  font-weight: var(--font-bold);
}

h3 {
  font-size: var(--fs-2xl);
  font-weight: var(--font-bold);
}

h4 {
  font-size: var(--fs-xl);
  font-weight: var(--font-semibold);
}

h5 {
  font-size: var(--fs-lg);
  font-weight: var(--font-semibold);
}

h6 {
  font-size: var(--fs-body);
  font-weight: var(--font-semibold);
}

/* ===========================
   DISPLAY CLASS — Hero-level
   =========================== */
.display {
  font-family: var(--font-display);
  font-size: var(--fs-hero);
  font-weight: var(--font-bold);
  line-height: 0.95;
  letter-spacing: -0.05em;
}

/* ===========================
   GRADIENT TEXT
   Light-surface default (AA stops); dark islands get the vibrant original
   =========================== */
.text-gradient {
  background: var(--gradient-text);
  background-size: 200% 200%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradient-shift 4s ease infinite;
}

.section--dark .text-gradient,
.ai-highlight .text-gradient,
.card--dark .text-gradient,
.cta-section:not(.cta-section--light) .text-gradient {
  background-image: var(--gradient-text-vibrant);
}

@keyframes gradient-shift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .text-gradient {
    animation: none;
    background-position: 0% 50%;
  }
}

/* ===========================
   TITLE FONT UTILITY
   =========================== */
.title-font {
  font-family: var(--font-display);
}

/* ===========================
   BODY TEXT
   =========================== */
p {
  font-size: var(--fs-body);
  line-height: var(--leading-relaxed);
  color: var(--color-text-secondary);
}

.text-lg {
  font-size: var(--fs-lg);
  line-height: var(--leading-relaxed);
}

.text-xl {
  font-size: var(--fs-xl);
  line-height: var(--leading-relaxed);
}

/* ===========================
   LABELS — Mono uppercase
   =========================== */
.section-label {
  font-family: var(--font-display);
  font-size: var(--fs-sm);
  font-weight: var(--font-semibold);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--color-on-light-coral);
}

.section-label--teal {
  color: var(--color-on-light-teal);
}

.section-label--yellow {
  color: var(--color-on-light-yellow);
}

.section-label--light {
  color: var(--color-on-light-teal);
}

/* ===========================
   LINKS — Readable on light surfaces (:where keeps specificity low for footer/cookie overrides)
   =========================== */
:where(a:not(.btn):not(.nav__link):not(.mobile-menu__link):not(.mega-menu__item):not(.mega-menu__col-title):not(.mega-menu__view-all):not(.breadcrumb__link):not(.card):not(.card--link):not(.card__link):not(.footer__social-link):not(.skip-link)) {
  color: var(--color-link);
  text-decoration: none;
  font-weight: var(--font-medium);
  transition: color var(--transition-fast) ease;
  position: relative;
}

:where(a:not(.btn):not(.nav__link):not(.mobile-menu__link):not(.mega-menu__item):not(.mega-menu__col-title):not(.mega-menu__view-all):not(.breadcrumb__link):not(.card):not(.card--link):not(.card__link):not(.footer__social-link):not(.skip-link)):hover {
  color: var(--color-link-hover);
}

.section--dark :where(a:not(.btn):not(.card):not(.card--link)),
.bg-navy :where(a:not(.btn):not(.card):not(.card--link)) {
  color: var(--color-teal);
}

.section--dark :where(a:not(.btn):not(.card):not(.card--link)):hover,
.bg-navy :where(a:not(.btn):not(.card):not(.card--link)):hover {
  color: var(--color-white);
}

/* ===========================
   STRONG / EM
   =========================== */
strong, b {
  font-weight: var(--font-bold);
  color: var(--color-text);
}

em, i {
  font-style: italic;
}

/* ===========================
   CODE
   =========================== */
code {
  font-family: var(--font-mono);
  font-size: 0.875em;
  background: var(--color-teal-subtle);
  border: var(--border-thin) solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 0.15em 0.5em;
  color: var(--color-on-light-teal);
}

/* ===========================
   RESPONSIVE
   =========================== */
@media (max-width: 767px) {
  h1 { letter-spacing: -0.03em; }
  .display { line-height: 1; }
}