:root {
  --ease-screen: cubic-bezier(.2,.8,.2,1);
  --header-surface-h: 120px;
}

html,
body,
main,
.problem-sprint-story,
.outcome-team-story {
  overflow-x: clip;
}

/* Fixed light navigation surface. Header content is vertically centered inside 120px. */
.site-header {
  top: 0 !important;
  height: var(--header-surface-h) !important;
  align-items: center !important;
  color: #000 !important;
  transition: none !important;
}

.site-header::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0 0 auto 0;
  width: 100vw;
  height: var(--header-surface-h);
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(0,0,0,.05);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  pointer-events: none;
}

.site-header[data-theme="dark"],
.site-header[data-theme="blue"],
.site-header[data-theme="light"] {
  color: #000 !important;
}

.site-header .brand { color: #000 !important; }

.site-header .desktop-nav a,
.site-header[data-theme="dark"] .desktop-nav a,
.site-header[data-theme="blue"] .desktop-nav a {
  color: rgba(0,0,0,.34) !important;
  transition: color .22s var(--ease-screen), opacity .22s var(--ease-screen) !important;
}

.site-header .desktop-nav a:hover { color: rgba(0,0,0,.72) !important; }
.site-header .desktop-nav a.is-active,
.site-header[data-theme="dark"] .desktop-nav a.is-active,
.site-header[data-theme="blue"] .desktop-nav a.is-active {
  color: #000 !important;
}

.site-header .nav-cta,
.site-header[data-theme="dark"] .nav-cta,
.site-header[data-theme="blue"] .nav-cta {
  color: var(--blue) !important;
}

.nav-indicator {
  height: 2px !important;
  border-radius: 999px;
  background: var(--blue) !important;
  transition:
    width .32s var(--ease-screen),
    transform .32s var(--ease-screen),
    opacity .2s var(--ease-screen) !important;
}

/* Normal document-flow scrolling. */
main,
.problem-sprint-story,
.outcome-team-story {
  position: relative;
  height: auto;
  min-height: 0;
  overflow: visible;
}

.section {
  position: relative;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

/* No transition layer between slides. */
.problems::before,
.sprints::before,
.outcomes::before,
.team::before {
  content: none !important;
}

.white-transition { display: none !important; }
.problem-path,
.problem-art { display: none !important; }

/* Keep service lines static. */
.sprint-line {
  transform: none !important;
  opacity: 1 !important;
}

/* Progressive text entrance, section by section. */
.reveal-item,
.reveal-item.is-visible {
  opacity: 1;
  transform: none;
  transition: none;
}

.progressive-item {
  opacity: 0;
  transform: translateY(10px);
  transition:
    opacity .58s var(--ease-screen),
    transform .58s var(--ease-screen);
  will-change: opacity, transform;
}

.progressive-item.is-progressive-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Hero service ticker. */
.hero-marquee {
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  top: 53.4%;
  overflow: hidden;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.8;
  font-weight: 400;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 3%, #000 97%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 3%, #000 97%, transparent 100%);
}

.hero-marquee-track {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: hero-marquee-scroll 42s linear infinite;
}

.hero-marquee-group {
  display: flex;
  align-items: center;
  flex: none;
  padding-right: 34px;
}

.hero-marquee-group span {
  display: inline-flex;
  align-items: center;
}

.hero-marquee-group span::after {
  content: "·";
  display: inline-block;
  margin: 0 28px;
  color: currentColor;
}

@keyframes hero-marquee-scroll {
  from { transform: translate3d(0,0,0); }
  to { transform: translate3d(-50%,0,0); }
}

/* Fingerprint: quiet opacity pulse only. */
.primary-cta::after { display: none !important; }
.primary-cta .fingerprint {
  animation: fingerprint-pulse 2.15s ease-in-out infinite;
  transform: none !important;
}

@keyframes fingerprint-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .46; }
}

/*
  DESKTOP GEOMETRY
  Standard screens follow the 1024px master; Problems and Outcomes intentionally use
  the shorter 850/1024 ratio. Vertical geometry is height-based so content never overlaps
  neighboring sections on wide desktops.
*/
@media (min-width: 821px) {
  :root {
    --section-h: max(100svh, 900px);
    --short-section-h: calc(var(--section-h) * .830078125);
    --outcomes-h: var(--short-section-h);
    --problems-h: var(--short-section-h);
  }

  .section,
  .section-inner {
    min-height: var(--section-h);
  }

  /* Problems mirrors Outcomes spacing and scale. */
  .problems {
    min-height: var(--problems-h) !important;
    height: var(--problems-h) !important;
  }

  .problems-inner {
    min-height: var(--problems-h) !important;
    height: var(--problems-h) !important;
    padding: 0 var(--page-x) !important;
  }

  .problems-eyebrow {
    position: absolute;
    left: var(--page-x);
    top: 33.0588235294%;
    margin: 0;
    color: rgba(255,255,255,.50);
  }

  .problem-copy {
    position: absolute !important;
    left: var(--page-x) !important;
    right: var(--page-x);
    top: 39.5294117647% !important;
    display: grid !important;
    gap: 0 !important;
    margin: 0 !important;
  }

  .problem-line {
    font-size: clamp(38px, 3.333vw, 48px) !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;
  }

  /* Sprints — position all major blocks from the section height. */
  .sprints-inner {
    padding: 0 var(--page-x) !important;
  }

  .sprints-heading {
    position: absolute;
    top: calc(var(--section-h) * .166015625);
    left: var(--page-x);
    right: var(--page-x);
    margin: 0 !important;
  }

  .sprints-heading .eyebrow {
    margin: 0 0 clamp(28px, 3.515625vh, 36px) !important;
  }

  .sprint-list {
    position: absolute;
    top: calc(var(--section-h) * .357421875);
    left: var(--page-x);
    right: 0;
    gap: 39px;
  }

  .sprints-terms {
    position: absolute;
    top: calc(var(--section-h) * .6796875);
    left: var(--page-x);
    margin: 0 !important;
  }

  .sprints .primary-cta {
    position: absolute;
    top: calc(var(--section-h) * .7470703125);
    left: var(--page-x);
    margin: 0 !important;
  }

  /* Outcomes uses the same short-section rhythm. */
  .outcomes {
    min-height: var(--outcomes-h) !important;
    height: var(--outcomes-h) !important;
  }

  .outcomes-inner {
    min-height: var(--outcomes-h) !important;
    height: var(--outcomes-h) !important;
    padding: 0 var(--page-x) !important;
  }

  .outcomes .eyebrow {
    position: absolute;
    left: var(--page-x);
    top: 33.0588235294%;
    margin: 0;
  }

  .outcome-list {
    position: absolute;
    left: var(--page-x);
    top: 39.5294117647%;
    width: min(1137px, calc(100vw - (2 * var(--page-x))));
    max-width: calc(100vw - (2 * var(--page-x)));
    margin: 0 !important;
  }

  /* Safety: interactive blocks never escape into the next section. */
  .hero,
  .problems,
  .sprints,
  .outcomes,
  .team {
    overflow: clip;
  }
}

@media (max-width: 820px) {
  :root { --header-surface-h: 76px; }
  .site-header { height: var(--header-surface-h) !important; }
  .hero-marquee {
    top: 55%;
    font-size: 13px;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .hero-marquee-track { animation-duration: 34s; }
  .hero-marquee-group span::after { margin-inline: 20px; }
  .problems-eyebrow {
    position: absolute;
    left: var(--page-x);
    top: 18%;
    color: rgba(255,255,255,.50);
  }
}

@media (prefers-reduced-motion: reduce) {
  .progressive-item,
  .progressive-item.is-progressive-visible {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .primary-cta .fingerprint { animation: none; }
  .hero-marquee-track { animation: none; transform: none; }
  .hero-marquee-group:last-child { display: none; }
}
