/* Onda Invest — base styles
   Ported verbatim from the design's <helmet> block, plus the reveal initial
   state and the .dir wrapper toggle that replaces the canvas <sc-if> runtime. */

* { box-sizing: border-box; -webkit-font-smoothing: antialiased; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #04181C; }
::selection { background: #C2A35A; color: #0A2342; }

@keyframes ondaScrollCue { 0%, 100% { transform: translateY(0); opacity: .35 } 50% { transform: translateY(9px); opacity: 1 } }
@keyframes ondaMarquee { from { transform: translateX(0) } to { transform: translateX(-50%) } }
@keyframes ondaFloat { 0%, 100% { transform: translateY(0) } 50% { transform: translateY(-14px) } }
@keyframes ondaRise { from { opacity: 0; transform: translateY(28px) } to { opacity: 1; transform: translateY(0) } }

/* reveal-on-scroll — CSS-driven (robust even when rAF is throttled in a
   background tab). Cubic ease-out over .9s matches the original DCLogic tween. */
[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity .9s cubic-bezier(.215, .61, .355, 1),
              transform .9s cubic-bezier(.215, .61, .355, 1);
  will-change: opacity, transform;
}
[data-reveal][data-in] { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-reveal] { opacity: 1; transform: none; transition: none; }
}