:root {
  --masthead-height: 76px;
  scroll-padding-top: calc(var(--masthead-height) + 16px);
}

.site-masthead {
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--ink);
  background: color-mix(in srgb, var(--ink) 94%, transparent);
  backdrop-filter: blur(14px);
}

.site-masthead .site-header { min-height: var(--masthead-height); }

[data-glint] { position: relative; }

.divider-ray {
  position: absolute;
  inset: -1px 0 auto;
  height: 1px;
  overflow: hidden;
  pointer-events: none;
}

[data-glint="bottom"] > .divider-ray { inset: auto 0 -1px; }

.divider-ray::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, var(--bronze) 9%, color-mix(in srgb, var(--bronze) 45%, var(--paper)) 13%, var(--bronze) 17%, transparent 27%);
  opacity: 0;
}

.divider-ray.is-active::after {
  animation: divider-sweep 3s cubic-bezier(.3,.4,.5,1) var(--sweep-delay, .22s) both;
}

.service-card:nth-child(even), .process-steps li:nth-child(even) { --sweep-delay: .52s; }
.motion-paused .divider-ray::after { animation-play-state: paused; }

@media (prefers-reduced-motion: no-preference) {
  .is-entering { animation: section-rise 760ms cubic-bezier(.2,.68,.3,1); }
  .process-steps > li.is-entering {
    animation: process-step-rise 620ms cubic-bezier(.2,.75,.25,1) calc(var(--step-order, 0) * var(--step-interval)) backwards;
  }
  .process-steps { --step-interval: 140ms; }
  .process-steps > li:nth-child(2) { --step-order: 1; }
  .process-steps > li:nth-child(3) { --step-order: 2; }
  .process-steps > li:nth-child(4) { --step-order: 3; }

  .phone-screen.is-entering { animation: phone-light 720ms ease-out; }
  .service-card.is-entering { animation: service-rise 820ms cubic-bezier(.2,.75,.25,1) backwards; }
  .partner-topic { --partner-slide-distance: clamp(14px, 2.6vw, 40px); }
  .partner-topic:nth-child(odd) { --partner-slide-offset: calc(-1 * var(--partner-slide-distance)); }
  .partner-topic.is-entering { animation: partner-topic-enter 720ms cubic-bezier(.2,.68,.3,1); }
  .motion-paused .is-entering { animation-play-state: paused; }
}

@media (min-width: 981px) and (prefers-reduced-motion: no-preference) {
  .service-card.is-entering:nth-child(even) { animation-delay: 120ms; }
}

@media (max-width: 1000px) {
  .process-steps { --step-interval: 75ms; }
}

@keyframes process-step-rise {
  from { opacity: .12; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes phone-light {
  from { filter: brightness(.52); }
  to { filter: brightness(1); }
}

@keyframes service-rise {
  from { opacity: 0; transform: translateY(52px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes section-rise {
  from { opacity: .48; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes partner-topic-enter {
  from { opacity: .42; transform: translateX(var(--partner-slide-offset, var(--partner-slide-distance))); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes divider-sweep {
  0% { transform: translateX(-27%); opacity: 0; }
  9% { opacity: 1; }
  82% { opacity: 1; }
  100% { transform: translateX(100%); opacity: 0; }
}

@media (max-width: 760px) {
  :root { --masthead-height: 62px; }
}

@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  .partner-topic.partner-motion {
    opacity: .65;
    transform: translateY(32px);
    transition: opacity 620ms cubic-bezier(.2,.68,.3,1), transform 620ms cubic-bezier(.2,.68,.3,1);
  }
  .partner-topic.partner-motion:is(.is-entering, :focus-within) {
    opacity: 1;
    transform: none;
    animation: none;
  }
  :is(.team-heading, .team-standards, .team-portraits, .next-step > div).is-entering {
    animation-duration: 380ms;
  }
}

@media (prefers-reduced-motion: reduce) {
  .divider-ray { display: none; }
}

@media (min-width: 981px) and (prefers-reduced-motion: no-preference) {
  .partner-stages > li.is-entering {
    animation: process-step-rise 620ms cubic-bezier(.2,.75,.25,1) calc(var(--partner-step, 0) * 80ms) backwards;
  }
  .partner-stages li:nth-child(2) { --partner-step: 1; }
  .partner-stages li:nth-child(3) { --partner-step: 2; }
  .partner-stages li:nth-child(4) { --partner-step: 3; }
  .partner-stages li:nth-child(5) { --partner-step: 4; }
  .partner-stages li:nth-child(6) { --partner-step: 5; }
}
