html {
    scroll-behavior: smooth;
  }

  body {
    font-family: Arial, sans-serif;
  }

  h1, h2, h3, h4, .font-display {
    font-family: 'Poppins', sans-serif;
  }

  [data-reveal] {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s ease, transform 0.7s ease;
  }

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

  .hero-orb {
    filter: blur(90px);
    opacity: 0.22;
    pointer-events: none;
  }

  .floating-soft {
    animation: floatSoft 6s ease-in-out infinite;
  }
  .hero-bubble {
    position: absolute;
    border-radius: 9999px;
    pointer-events: none;
    z-index: 0;
    will-change: transform;
    filter: blur(12px);
    opacity: 0.14;
  }

  .hero-bubble-1 {
    width: 170px;
    height: 170px;
    top: -1rem;
    right: 1rem;
    background: radial-gradient(
      circle at 30% 30%,
      rgba(240, 182, 79, 0.48),
      rgba(240, 182, 79, 0.16)
    );
    animation: heroBubbleFloatOne 12s ease-in-out infinite;
  }

  .hero-bubble-2 {
    width: 110px;
    height: 110px;
    top: 5.5rem;
    right: 7rem;
    background: radial-gradient(
      circle at 35% 35%,
      rgba(255, 255, 255, 0.16),
      rgba(255, 255, 255, 0.04)
    );
    animation: heroBubbleFloatTwo 15s ease-in-out infinite;
  }

  @keyframes heroBubbleFloatOne {
    0% {
      transform: translate3d(0, 0, 0) scale(1);
    }
    25% {
      transform: translate3d(-14px, 10px, 0) scale(1.03);
    }
    50% {
      transform: translate3d(-6px, 28px, 0) scale(0.98);
    }
    75% {
      transform: translate3d(10px, 12px, 0) scale(1.01);
    }
    100% {
      transform: translate3d(0, 0, 0) scale(1);
    }
  }

  @keyframes heroBubbleFloatTwo {
    0% {
      transform: translate3d(0, 0, 0) scale(1);
    }
    20% {
      transform: translate3d(10px, -8px, 0) scale(1.03);
    }
    50% {
      transform: translate3d(-10px, 12px, 0) scale(0.97);
    }
    80% {
      transform: translate3d(8px, 8px, 0) scale(1.01);
    }
    100% {
      transform: translate3d(0, 0, 0) scale(1);
    }
  }
  .parallax-layer {
    transform: translate3d(var(--px, 0), var(--py, 0), 0);
    transition: transform 0.18s linear;
    will-change: transform;
  }

  .glass-card {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .marquee-track {
    width: max-content;
    animation: marquee 24s linear infinite;
  }

  @keyframes floatSoft {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-12px); }
  }

  @keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  }

  @media (prefers-reduced-motion: reduce) {
    * {
      animation: none !important;
      transition: none !important;
      scroll-behavior: auto !important;
    }

    [data-reveal] {
      opacity: 1 !important;
      transform: none !important;
    }
  }