:root {
        /* Updated to match Hero: Cyan, Violet, Fuchsia */
        --primary-glow: conic-gradient(from 180deg at 50% 50%, #06b6d4 0deg, #8b5cf6 180deg, #d946ef 360deg);
      }
      body {
        font-family: 'Inter', sans-serif;
        background-color: #000000;
        color: #F3F4F6;
        overflow-x: hidden;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
      
      /* Noise Texture */
      .bg-noise {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 50;
        opacity: 0.03;
        background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
      }

      /* Sleek Scrollbar */
      ::-webkit-scrollbar {
        width: 8px;
      }
      ::-webkit-scrollbar-track {
        background: #050505;
      }
      ::-webkit-scrollbar-thumb {
        background: #262626;
        border-radius: 4px;
        border: 2px solid #050505;
      }
      ::-webkit-scrollbar-thumb:hover {
        background: #404040;
      }

      .text-balance {
        text-wrap: balance;
      }

      .font-inter-tight {
        font-family: 'Inter', sans-serif;
        letter-spacing: -0.04em;
      }

      /* Gradient Text Utilities */
      .gradient-text-hero {
         background: linear-gradient(135deg, #06b6d4 0%, #d946ef 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
      }
      
      /* Professional Button - Refined */
      .btn-primary {
        position: relative;
        background: #fff;
        color: #000;
        transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
        overflow: hidden;
        isolation: isolate;
      }
      .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 0 30px -5px rgba(255, 255, 255, 0.3);
      }
      .btn-primary::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(to bottom right, rgba(255,255,255,1), rgba(220,220,220,1));
        z-index: -1;
      }

      /* Bento Grid Card Styles - Base */
      .bento-card {
        background-color: rgba(10, 10, 10, 0.6);
        backdrop-filter: blur(20px);
        border: 1px solid rgba(255, 255, 255, 0.08);
        transition: border-color 0.3s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
      }
      
      /* Animations */
      @keyframes fade-in-up {
        from { opacity: 0; transform: translateY(20px); }
        to { opacity: 1; transform: translateY(0); }
      }
      .animate-fade-in-up {
        animation: fade-in-up 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        opacity: 0;
      }

      /* Scroll Animation */
      @keyframes scroll-up { from { transform: translateY(0); } to { transform: translateY(-50%); } }
      @keyframes scroll-down { from { transform: translateY(-50%); } to { transform: translateY(0); } }
      .animate-scroll-up { animation: scroll-up 80s linear infinite; }
      .animate-scroll-down { animation: scroll-down 80s linear infinite; }
      .animate-scroll-up:hover, .animate-scroll-down:hover { animation-play-state: paused; }
      
      .mask-image-fade {
        mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
        -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
      }

      /* Floating Words - Base */
      .floating-word {
        position: absolute;
        z-index: 0;
        pointer-events: none;
        user-select: none;
        will-change: transform, opacity;
        transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
      }

      /* Logo Animations (One-off loader) */
      @keyframes draw-outline { to { stroke-dashoffset: 0; } }
      @keyframes fade-in { to { opacity: 1; } }
      
      .logo-animated .logo-outline {
        stroke-dasharray: 1;
        stroke-dashoffset: 1;
        /* Force hardware acceleration */
        will-change: stroke-dashoffset;
        animation: draw-outline 1.5s cubic-bezier(0.5, 0, 0.5, 1) forwards;
      }
      .logo-animated .logo-fill-group {
        opacity: 0;
        will-change: opacity;
        animation: fade-in 0.7s ease-out 0.9s forwards;
      }

      /* NOTE: The Loop Animation for .logo-loop is now injected via JS below to allow variable control */

      .ml12 { opacity: 0; }
      .ml12 .letter { display: inline-block; line-height: 1em; opacity: 0; }
      .logo-container { cursor: pointer; user-select: none; }

      /* Loader */
      #loader {
        position: fixed; inset: 0; z-index: 9999; background-color: #000;
        display: flex; align-items: center; justify-content: center;
        transition: background-color 0.8s ease;
        will-change: background-color, opacity;
      }
      #loader-logo { 
        width: 220px; height: auto; position: relative; z-index: 1; 
        will-change: transform, filter; 
      }
      #root { opacity: 0; transition: opacity 1s ease; will-change: opacity; }
      
      @keyframes pulse-glow {
        0%, 100% { filter: drop-shadow(0 0 0px rgba(255,255,255,0)); }
        50% { filter: drop-shadow(0 0 15px rgba(255,255,255,0.3)); }
      }
      .pulsing { animation: pulse-glow 2s ease-in-out infinite; }
      
      #stardust-bg { position: absolute; inset: 0; z-index: 0; opacity: 0; transition: opacity 1s ease; }
      .star {
        position: absolute; background-color: rgba(255, 255, 255, 0.8); border-radius: 50%;
        animation: drift linear infinite;
        will-change: transform;
      }
      @keyframes drift {
        from { transform: translateY(-20px) translateX(var(--drift-x, 0)); }
        to { transform: translateY(105vh) translateX(var(--drift-x, 0)); }
      }