html {
      scroll-behavior: smooth;
    }

    body {
      background: #f7fafc;
      color: #07111f;
      overflow-x: hidden;
    }

    ::selection {
      background: rgba(16, 184, 198, .22);
    }

    .glass {
      background: rgba(255, 255, 255, .82);
      border: 1px solid rgba(255, 255, 255, .52);
      backdrop-filter: blur(18px);
    }

    .nav-link {
      position: relative;
    }

    .nav-link::after {
      background: #10b8c6;
      bottom: -8px;
      content: "";
      height: 2px;
      left: 0;
      position: absolute;
      transform: scaleX(0);
      transform-origin: right;
      transition: transform .28s ease;
      width: 100%;
    }

    .nav-link:hover::after,
    .nav-link:focus-visible::after {
      transform: scaleX(1);
      transform-origin: left;
    }

    .premium-gradient {
      background:
        linear-gradient(115deg, rgba(7, 17, 31, .88) 0%, rgba(7, 17, 31, .64) 46%, rgba(16, 184, 198, .12) 100%),
        linear-gradient(180deg, rgba(7, 17, 31, .08), rgba(7, 17, 31, .88));
    }

    .reveal {
      opacity: 0;
      transform: translateY(26px);
      transition: opacity .7s ease, transform .7s ease;
    }

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

    .magnetic-card {
      transform: translateY(0);
      transition: border-color .28s ease, box-shadow .28s ease, transform .28s ease;
    }

    .magnetic-card:hover {
      border-color: rgba(16, 184, 198, .45);
      box-shadow: 0 24px 70px rgba(7, 17, 31, .14);
      transform: translateY(-8px);
    }

    .image-zoom img {
      transition: transform .75s ease;
    }

    .image-zoom:hover img {
      transform: scale(1.06);
    }

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

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

    .hero-image {
      animation: heroDrift 18s ease-in-out infinite alternate;
    }

    @keyframes heroDrift {
      from { transform: scale(1.02) translate3d(0, 0, 0); }
      to { transform: scale(1.08) translate3d(-1.4%, 1%, 0); }
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
      }

      .reveal {
        opacity: 1;
        transform: none;
      }
    }