/* Shared visual polish and motion */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 100;
  pointer-events: none;
  opacity: .025;
  background-image: repeating-linear-gradient(0deg, #062d3b 0, #062d3b 1px, transparent 1px, transparent 4px);
  mix-blend-mode: multiply;
}

.site-header {
  position: sticky;
  top: 0;
  background-color: color-mix(in srgb, var(--cream) 88%, transparent);
  backdrop-filter: blur(16px);
  box-shadow: 0 1px 0 rgba(6, 45, 59, .08);
}

.partners-header {
  background-color: rgba(6, 45, 59, .9);
}

.motion-ready .site-header {
  animation: headerDrop .65s cubic-bezier(.2, .8, .2, 1) both;
}

.motion-ready .hero-copy > *,
.motion-ready .why-title > *,
.motion-ready .partners-copy > *,
.motion-ready .clinics-hero > div:first-child > * {
  opacity: 0;
  animation: riseIn .8s cubic-bezier(.2, .8, .2, 1) forwards;
}

.motion-ready .hero-copy > *:nth-child(2),
.motion-ready .why-title > *:nth-child(2),
.motion-ready .partners-copy > *:nth-child(2),
.motion-ready .clinics-hero > div:first-child > *:nth-child(2) { animation-delay: .1s; }
.motion-ready .hero-copy > *:nth-child(3),
.motion-ready .partners-copy > *:nth-child(3),
.motion-ready .clinics-hero > div:first-child > *:nth-child(3) { animation-delay: .2s; }
.motion-ready .hero-copy > *:nth-child(4),
.motion-ready .partners-copy > *:nth-child(4) { animation-delay: .3s; }
.motion-ready .hero-copy > *:nth-child(5) { animation-delay: .4s; }

.motion-ready .hero-visual,
.motion-ready .route-card,
.motion-ready .data-field,
.motion-ready .resistance-story,
.motion-ready .care-map,
.motion-ready .signal-console {
  opacity: 0;
  animation: imageReveal 1s .22s cubic-bezier(.2, .8, .2, 1) forwards;
}

.reveal {
  opacity: 0;
  transform: translateY(38px);
  transition: opacity .75s ease, transform .75s cubic-bezier(.2, .8, .2, 1);
  transition-delay: var(--reveal-delay, 0ms);
}

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

.ussd-card { animation: cardFloat 4.5s ease-in-out infinite; }
.floating-dial { animation: gentlePulse 2.8s ease-in-out infinite; }
.brand-mark { animation: markBreathe 4s ease-in-out infinite; }
.cycle-center { animation: cycleFloat 4s ease-in-out infinite; }
.cycle-wheel .arrow { animation: arrowPulse 1.8s ease-in-out infinite; }
.cycle-wheel .arrow:nth-of-type(2) { animation-delay: .3s; }
.cycle-wheel .arrow:nth-of-type(3) { animation-delay: .6s; }
.cycle-wheel .arrow:nth-of-type(4) { animation-delay: .9s; }
.pulse { animation: signalPulse 2s ease-out infinite; }
.p2 { animation-delay: .5s; }.p3 { animation-delay: 1s; }.p4 { animation-delay: 1.5s; }
.data-globe::after { animation: slowSpin 18s linear infinite; }
.data-globe::before { animation: reverseSpin 13s linear infinite; }

.primary-button,
.orange-button,
.nav-action,
.partner-nav-cta,
.contact-cell a,
.form-submit button {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.primary-button::before,
.orange-button::before,
.form-submit button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(110deg, transparent 25%, rgba(255,255,255,.25) 48%, transparent 72%);
  transform: translateX(-120%);
  transition: transform .65s ease;
}

.primary-button:hover::before,
.orange-button:hover::before,
.form-submit button:hover::before { transform: translateX(120%); }

.steps-grid article,
.problem-solution article,
.bridge-flow article,
.partner-grid article,
.clinic-row {
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.steps-grid article:hover,
.bridge-flow article:hover,
.partner-grid article:hover {
  transform: translateY(-8px);
  box-shadow: 0 22px 45px rgba(6,45,59,.14);
}

.steps-grid article:nth-child(2):hover { transform: translateY(-20px); }
.clinic-row:hover { transform: translateX(5px); box-shadow: inset 4px 0 0 var(--orange); }
.problem-card:hover { transform: rotate(-.5deg) translateY(-5px); }
.solution-card:hover { transform: rotate(.5deg) translateY(-5px); }

.home-hero,
.why-hero,
.clinics-hero,
.partners-hero {
  position: relative;
  isolation: isolate;
}

.home-hero::before,
.why-hero::before,
.clinics-hero::before,
.partners-hero::before {
  content: "";
  position: absolute;
  width: 430px;
  height: 430px;
  left: -210px;
  top: 20%;
  z-index: -1;
  border: 1px solid rgba(242,106,46,.2);
  border-radius: 50%;
  box-shadow: 0 0 0 70px rgba(242,106,46,.035), 0 0 0 140px rgba(242,106,46,.02);
  animation: orbDrift 9s ease-in-out infinite;
}

.hero-visual img { transform: scale(1.03); transition: transform 1.2s ease; }
.hero-visual:hover img { transform: scale(1.08); }
.route-card::before {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(242,106,46,.14);
  border-radius: inherit;
  pointer-events: none;
}

@keyframes headerDrop { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes riseIn { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: translateY(0); } }
@keyframes imageReveal { from { opacity: 0; transform: translateX(35px) scale(.96); } to { opacity: 1; transform: translateX(0) scale(1); } }
@keyframes cardFloat { 0%, 100% { transform: translateY(0) rotate(-.3deg); } 50% { transform: translateY(-10px) rotate(.4deg); } }
@keyframes gentlePulse { 0%, 100% { box-shadow: 0 10px 32px rgba(7,45,59,.28); } 50% { box-shadow: 0 14px 42px rgba(242,106,46,.42); } }
@keyframes markBreathe { 0%, 100% { transform: rotate(-5deg) scale(1); } 50% { transform: rotate(2deg) scale(1.06); } }
@keyframes cycleFloat { 0%, 100% { transform: rotate(-6deg) translateY(0); } 50% { transform: rotate(-2deg) translateY(-8px); } }
@keyframes arrowPulse { 0%, 100% { opacity: .45; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.15); } }
@keyframes signalPulse { 0% { box-shadow: 0 0 0 0 rgba(123,224,184,.5); } 70% { box-shadow: 0 0 0 14px rgba(123,224,184,0); } 100% { box-shadow: 0 0 0 0 rgba(123,224,184,0); } }
@keyframes slowSpin { to { transform: rotate(360deg); } }
@keyframes reverseSpin { to { transform: rotate(-360deg); } }
@keyframes orbDrift { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-24px) scale(1.04); } }

@media (prefers-reduced-motion: reduce) {
  .motion-ready *, .reveal, .ussd-card, .floating-dial, .brand-mark, .cycle-center, .arrow, .pulse, .data-globe::before, .data-globe::after {
    animation: none !important;
    transition: none !important;
  }
  .motion-ready .hero-copy > *, .motion-ready .why-title > *, .motion-ready .partners-copy > *, .motion-ready .clinics-hero > div:first-child > *, .motion-ready .hero-visual, .motion-ready .route-card, .motion-ready .data-field, .motion-ready .resistance-story, .motion-ready .care-map, .motion-ready .signal-console, .reveal {
    opacity: 1;
    transform: none;
  }
}