/* Motion is progressive enhancement: visible HTML remains the default. */
@keyframes hero-enter {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes underline-enter {
  from { transform: rotate(-3deg) scaleX(0); }
  to { transform: rotate(-3deg) scaleX(1); }
}
@keyframes path-current { to { stroke-dashoffset: -100; } }
@keyframes gentle-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
@keyframes star-turn {
  0%, 100% { rotate: -8deg; scale: 1; }
  50% { rotate: 8deg; scale: .87; }
}
@keyframes petal-breathe {
  0%, 100% { scale: 1; }
  50% { scale: .96; }
}
.motion-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-shrink: 0;
  padding: 6px 4px;
  min-height: 30px;
  background: transparent;
  border: 0;
  border-radius: 4px;
  font: 11px/1.4 var(--font);
  color: #778b7d;
  white-space: nowrap;
}
.motion-toggle:hover { color: var(--green); background: #dce8de66; }
.motion-toggle-icon { width: 8px; height: 10px; border-inline: 2px solid currentColor; }
.motion-toggle[aria-pressed='true'] .motion-toggle-icon { width: 9px; height: 10px; border: 0; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); }
@media (prefers-reduced-motion: no-preference) {
  .hero-title-line { animation: hero-enter .85s cubic-bezier(.2,.7,.2,1) backwards; }
  .hero-title-line:nth-child(2) { animation-delay: .13s; }
  .hero-copy > .announcement { animation: hero-enter .7s .02s backwards; }
  .hero-copy > .hero-eyebrow { animation: hero-enter .7s .08s backwards; }
  .hero-copy > .hero-description { animation: hero-enter .8s .25s backwards; }
  .hero-copy > .button-row { animation: hero-enter .8s .34s backwards; }
  .hero-copy > .hero-footnote { animation: hero-enter .8s .42s backwards; }
  .hero-emphasis::after { transform-origin: left center; animation: underline-enter 1s .48s backwards; }
  .illustrated-hero-copy, .hero-visual { animation: hero-enter .85s .06s backwards; }
  .hero-visual { animation-delay: .18s; }
  .motion-running .landscape-glint { animation: path-current 12s linear infinite; }
  .motion-running .landscape-left .landscape-glint { animation-delay: -5s; animation-direction: reverse; }
  .motion-running .landscape-star { animation: star-turn 8s ease-in-out infinite; }
  .motion-running .visual-float { animation: gentle-float 6s ease-in-out infinite; }
  .motion-running .connection-glint { animation: path-current 5.5s linear infinite; }
  .motion-running .connection-glint:nth-of-type(3) { animation-delay: -1.8s; }
  .motion-running .connection-glint:nth-of-type(4) { animation-delay: -3.6s; }
  .motion-running .ecosystem-petal { animation: petal-breathe 7s ease-in-out infinite; }
  .motion-running .petal-system, .motion-running .petal-service { animation-delay: -3.5s; }
  .reveal-pending { opacity: 0; translate: 0 20px; transition: opacity .65s ease, translate .65s cubic-bezier(.2,.7,.2,1); }
  .reveal-pending.is-revealed { opacity: 1; translate: 0 0; }
}
.motion-paused .landscape-glint,
.motion-paused .landscape-star,
.motion-paused .visual-float,
.motion-paused .connection-glint,
.motion-paused .ecosystem-petal { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .hero *, .hero *::after, .illustrated-hero *, .illustrated-hero *::after { animation: none !important; }
  .reveal-pending { opacity: 1; translate: none; transition: none; }
  .plan-destination { transition: none; }
  .plan-destination:hover { transform: none; }
  .motion-toggle { display: none; }
}
@media print { .reveal-pending { opacity: 1; translate: none; } }