/* base.css */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@500;700&family=Press+Start+2P&display=swap');

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--bg-primary);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
}

/* Links — reset browser default blue */
a {
  color: inherit;
  text-decoration: none;
}

/* Headings — base defaults (components override these) */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.2;
}

::selection {
  background-color: var(--accent);
  color: var(--bg-primary);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: var(--bg-primary);
}

::-webkit-scrollbar-thumb {
  background: var(--bg-elevated);
  border-radius: var(--radius-full);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--accent);
}

/* ═══════════════════════════════════════════
   INITIAL ANIMATION STATES
   Prevents flash of content before GSAP runs.
   GSAP will override these on init.
   ═══════════════════════════════════════════ */
.hero__subheadline,
.hero__cta,
.hero__scroll-indicator {
  opacity: 0;
}

.process__step {
  opacity: 0;
  transform: translateY(30px);
}

.about__quote,
.about__body {
  opacity: 0;
}

.capability-card {
  opacity: 0;
  transform: translateY(40px);
}

.project-card {
  opacity: 0;
  transform: translateY(30px);
}

.intake-form__group {
  opacity: 0;
  transform: translateY(20px);
}

.footer__headline {
  clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
}

.footer__body,
.footer__ctas {
  opacity: 0;
}

/* When GSAP is missing or reduced-motion, reveal all content */
.is-revealed {
  opacity: 1 !important;
  transform: translateY(0) translateX(0) !important;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%) !important;
}

/* ═══════════════════════════════════════════
   LENIS SMOOTH SCROLL RESET
   ═══════════════════════════════════════════ */
html.lenis, html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}