@keyframes omnia-fade-up-sm {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes omnia-fade-up-lg {
  from {
    opacity: 0;
    transform: translateY(24px) scale(.97);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes omnia-fade-only {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.hero-eyebrow {
  animation: .4s ease-out both omnia-fade-up-sm;
}

@keyframes omnia-word-up {
  from {
    transform: translateY(16px);
  }

  to {
    transform: translateY(0);
  }
}

.omnia-word {
  animation: .5s ease-out both omnia-word-up;
  display: inline-block;
}

.hero-subhead {
  animation: .4s ease-out .4s both omnia-fade-only;
}

.hero-cta {
  animation: .35s ease-out .55s both omnia-fade-up-sm;
}

.hero-cta-meta {
  animation: .4s ease-out .7s both omnia-fade-only;
}

.hero-visual {
  animation: .7s cubic-bezier(.16, 1, .3, 1) .3s both omnia-fade-up-lg;
}

.hero-evidence {
  animation: .5s ease-out .8s both omnia-fade-only;
}

.hero-evidence-chip {
  animation: .35s ease-out both omnia-fade-up-sm;
  animation-delay: calc(.9s + (var(--i, 0) * 40ms));
}

@keyframes hero-breathe {
  0%, 100% {
    background-image: radial-gradient(ellipse at 42% 50%,
      color-mix(in oklab, var(--color-canvas, #f5f1ea) 90%, var(--color-ember, #be5a38) 10%) 0%,
      var(--color-canvas, #f5f1ea) 62%);
  }

  50% {
    background-image: radial-gradient(ellipse at 58% 50%,
      color-mix(in oklab, var(--color-canvas, #f5f1ea) 90%, var(--color-ember, #be5a38) 10%) 0%,
      var(--color-canvas, #f5f1ea) 62%);
  }
}

.hero-section {
  animation: 12s ease-in-out infinite hero-breathe;
}

.section-animate {
  opacity: 0;
  will-change: opacity, transform;
  transition: opacity .5s ease-out, transform .5s ease-out;
  transform: translateY(24px);
}

.section-animate.is-in {
  opacity: 1;
  transform: translateY(0);
}

@keyframes omnia-fade-up {
  from {
    opacity: 0;
    transform: translateY(40px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.omnia-reveal {
  opacity: 0;
}

.omnia-reveal.is-in {
  animation: .5s ease-out forwards omnia-fade-up;
}

@keyframes omnia-bar-sweep {
  from {
    transform-origin: 0;
    transform: scaleX(0);
  }

  to {
    transform-origin: 0;
    transform: scaleX(1);
  }
}

.omnia-bar-sweep {
  animation: .5s ease-in-out both omnia-bar-sweep;
}

@keyframes omnia-card-cycle {
  0%, 28% {
    opacity: 1;
    transform: translate(0);
  }

  33%, 95% {
    opacity: 0;
    transform: translate(-6px, 6px);
  }

  100% {
    opacity: 1;
    transform: translate(0);
  }
}

.omnia-card-1 {
  animation: 6s ease-in-out infinite omnia-card-cycle;
}

.omnia-card-2 {
  animation: 6s ease-in-out 2s infinite omnia-card-cycle;
}

.omnia-card-3 {
  animation: 6s ease-in-out 4s infinite omnia-card-cycle;
}

@keyframes omnia-pulse-dot {
  0%, 100% {
    opacity: .4;
    transform: scale(.85);
  }

  50% {
    opacity: 1;
    transform: scale(1.1);
  }
}

.omnia-pulse-dot {
  animation: 1.8s ease-in-out infinite omnia-pulse-dot;
}

.omnia-grain {
  pointer-events: none;
  opacity: .03;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.8 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  position: absolute;
  inset: 0;
}

.omnia-display {
  font-family: var(--font-display-serif);
  font-variation-settings: "opsz" 144;
  font-feature-settings: "ss01", "ss02";
}

@media print {
  .omnia-need-card > div {
    color: #000 !important;
    background: #fff !important;
    border: 2px solid #000 !important;
  }

  .omnia-need-card > div p {
    color: #000 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-section, .hero-eyebrow, .hero-subhead, .hero-cta, .hero-cta-meta, .hero-visual, .hero-evidence, .hero-evidence-chip, .omnia-word, .omnia-reveal, .omnia-bar-sweep, .omnia-card-1, .omnia-card-2, .omnia-card-3, .omnia-pulse-dot, .section-animate, .section-animate.is-in {
    opacity: 1 !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
}
