@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&family=Space+Grotesk:wght@600;700&display=swap");

/* ShiftXR spatial studio typography system. Loaded after page-level styles. */
:root {
  --font-heading: "Space Grotesk", sans-serif;
  --font-sans: "Inter", sans-serif;
  --font-body: var(--font-sans);
  --font-mono: "JetBrains Mono", monospace;
  --font-label: var(--font-mono);
  --type-heading: #0f172a;
  --type-body: #475569;
  --type-strong: #334155;
  --type-accent: #0284c7;
}

body.dark-theme,
body.dark-mode {
  --type-heading: #f8fafc;
  --type-body: #94a3b8;
  --type-strong: #cbd5e1;
  --type-accent: #22d3ee;
}

html,
body {
  font-family: var(--font-sans) !important;
}

body {
  color: var(--type-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
}

button,
input,
select,
textarea {
  font-family: var(--font-sans) !important;
}

h1,
h2,
h3,
.headline-xl,
.headline-lg,
.headline-md,
.service-hero-title,
.shiftxr-global-cta__title,
.shiftxr-global-cta__form-title {
  color: var(--type-heading);
  font-family: var(--font-heading) !important;
  letter-spacing: -0.02em !important;
}

h1,
.headline-xl,
.service-hero-title {
  font-size: 60px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
}

h2,
.headline-lg,
.shiftxr-global-cta__title {
  font-size: 36px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

h3,
.headline-md,
.problem-title,
.outcome-feature-title {
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

p,
li {
  font-family: var(--font-sans);
}

.body-lg,
.section-intro .body-lg,
.section-lead,
.hero-subtitle,
.hero-description {
  color: var(--type-body) !important;
  font-family: var(--font-sans) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

.hero-section .body-lg,
.service-hero-copy,
.service-hero-copy p {
  font-size: 20px !important;
  line-height: 1.6 !important;
}

.eyebrow,
.hero-kicker,
.feature-kicker,
.eyebrow-chip,
.gap-analysis-label,
.industry-index,
.industry-number,
.industry-tag-label,
.step-number,
.tech-badge,
.shiftxr-global-cta__eyebrow,
.industry-modal__eyebrow,
[class*="section-kicker"],
[class*="section-label"],
[class*="card-index"] {
  color: var(--type-accent) !important;
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.industry-index,
.industry-number,
.step-number {
  font-size: 14px !important;
}

.service-card h3,
.industry-card h3,
.usecase-card h3,
.feature-card h3,
.benefit-card h3,
.problem-card h3,
.outcome-card h3,
.industry-title {
  color: var(--type-heading) !important;
  font-family: var(--font-heading) !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
}

.service-card p,
.industry-card p,
.usecase-card p,
.feature-card p,
.benefit-card p,
.problem-card p,
.outcome-card p,
.industry-description,
.outcome-copy {
  color: var(--type-body) !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

.learn-more,
.card-link,
.usecase-link,
.service-link {
  color: var(--type-accent) !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.home-page .feature-panel .headline-lg,
.product-title {
  font-family: var(--font-heading) !important;
  font-size: 48px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}

.home-page .feature-panel .body-lg,
.product-subheading {
  color: var(--type-strong) !important;
  font-family: var(--font-sans) !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
}

.home-page .feature-panel .list li,
.benefits-list li,
.check-list li,
.shiftxr-global-cta__checks li {
  color: var(--type-strong) !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

.field label,
.consultation-modal label,
.industry-modal__field label,
.shiftxr-global-cta__field label {
  color: var(--type-strong) !important;
  font-family: var(--font-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

.field input,
.field select,
.field textarea,
.consultation-modal input,
.consultation-modal select,
.consultation-modal textarea,
.industry-modal input,
.industry-modal select,
.industry-modal textarea,
.shiftxr-global-cta input,
.shiftxr-global-cta select,
.shiftxr-global-cta textarea {
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

.button,
.btn,
button[type="submit"] {
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

.trust-strip .eyebrow,
.home-page .trust-strip .eyebrow {
  color: var(--type-body) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
}

/* The Services page ships legacy high-specificity utility overrides. */
body.services-page {
  color: var(--type-body) !important;
  font-family: var(--font-sans) !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
}

body.services-page main h1 {
  font-family: var(--font-heading) !important;
  font-size: 60px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}

body.services-page main h2 {
  font-family: var(--font-heading) !important;
  font-size: 36px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
}

body.services-page main h3,
body.services-page main h3.text-base,
body.services-page main h3.text-lg,
body.services-page main h3.text-xl,
body.services-page main h3.font-bold {
  font-family: var(--font-heading) !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
}

body.services-page main p,
body.services-page main li {
  font-family: var(--font-sans) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

body.services-page main .service-hero-copy {
  color: var(--type-body) !important;
  font-size: 20px !important;
  line-height: 1.6 !important;
}

body.services-page main .problem-card p,
body.services-page main .outcome-card p,
body.services-page main .text-sm {
  font-size: 14px !important;
  line-height: 1.6 !important;
}

body.services-page main .inline-flex.tracking-wide,
body.services-page main .industry-kicker,
body.services-page main .tech-kicker {
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

@media (max-width: 767px) {
  h1,
  .headline-xl,
  .service-hero-title {
    font-size: 36px !important;
    line-height: 1.1 !important;
  }

  h2,
  .headline-lg,
  .shiftxr-global-cta__title {
    font-size: 30px !important;
    line-height: 1.2 !important;
  }

  .body-lg,
  .section-intro .body-lg,
  .section-lead,
  .hero-subtitle,
  .hero-description,
  .hero-section .body-lg,
  .service-hero-copy,
  .service-hero-copy p {
    font-size: 18px !important;
  }

  .home-page .feature-panel .headline-lg,
  .product-title {
    font-size: 30px !important;
  }

  body.services-page main h1 {
    font-size: 36px !important;
  }

  body.services-page main h2 {
    font-size: 30px !important;
    line-height: 1.2 !important;
  }

  body.services-page main .service-hero-copy {
    font-size: 18px !important;
  }
}
