/* Page Loader */
      #page-loader {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, #ffffff 0%, #f0f9ff 25%, #fef3f8 50%, #f7ffe6 75%, #ffffff 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 99999;
        transition: opacity 0.5s ease, visibility 0.5s ease;
      }
      
      #page-loader.hidden {
        opacity: 0;
        visibility: hidden;
      }
      
      .hash-loader {
        font-size: 120px;
        font-weight: 900;
        font-family: 'Space Grotesk', system-ui, -apple-system, sans-serif;
        background: linear-gradient(135deg, #68cecf 0%, #a0cd45 25%, #f876c0 50%, #f8c63f 75%, #68cecf 100%);
        background-size: 300% 300%;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        animation: gradientShift 3s ease infinite, pulse 2s ease-in-out infinite;
      }
      
      @keyframes pulse {
        0%, 100% { transform: scale(1); opacity: 0.8; }
        50% { transform: scale(1.1); opacity: 1; }
      }

      /* Cursor Glow Effect */
      #cursor-glow {
        position: fixed;
        width: 400px;
        height: 400px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(104, 206, 207, 0.3) 0%, rgba(248, 118, 192, 0.25) 25%, rgba(160, 205, 69, 0.25) 50%, rgba(248, 198, 63, 0.2) 75%, transparent 100%);
        pointer-events: none;
        z-index: 9998;
        transform: translate(-50%, -50%);
        transition: opacity 0.3s ease;
        opacity: 0;
        filter: blur(60px);
      }

      #cursor-glow.active {
        opacity: 1;
      }
      
      /* Tab content visibility */
      .service-content {
        display: none;
      }
      .service-content.active {
        display: block;
      }
      
      /* Scrollable tabs styling */
      .services-tabs {
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: rgba(104, 206, 207, 0.3) transparent;
      }
      
      .services-tabs::-webkit-scrollbar {
        height: 6px;
      }
      
      .services-tabs::-webkit-scrollbar-track {
        background: transparent;
        border-radius: 10px;
      }
      
      .services-tabs::-webkit-scrollbar-thumb {
        background: linear-gradient(90deg, #68cecf, #f876c0, #a0cd45);
        border-radius: 10px;
      }
      
      .services-tabs::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(90deg, #a0cd45, #f876c0, #68cecf);
      }
      
      /* Smooth scroll behavior */
      .services-tabs {
        scroll-behavior: smooth;
      }
      
      /* Hero Section Modern Animations */
      @keyframes gradientShift {
        0%, 100% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
      }
      
      @keyframes float {
        0%, 100% { transform: translateY(0px) rotate(0deg); }
        50% { transform: translateY(-20px) rotate(5deg); }
      }
      
      @keyframes floatSlow {
        0%, 100% { transform: translateY(0px) translateX(0px); }
        50% { transform: translateY(-30px) translateX(10px); }
      }
      
      @keyframes pulse {
        0%, 100% { opacity: 0.6; transform: scale(1); }
        50% { opacity: 1; transform: scale(1.05); }
      }
      
      @keyframes shimmer {
        0% { background-position: -1000px 0; }
        100% { background-position: 1000px 0; }
      }
      
      .hero-gradient-bg {
        background: linear-gradient(135deg, #ffffff 0%, #f0f9ff 25%, #fef3f8 50%, #f7ffe6 75%, #ffffff 100%);
        background-size: 400% 400%;
        animation: gradientShift 15s ease infinite;
      }
      
      .floating-element {
        animation: float 6s ease-in-out infinite;
      }
      
      .floating-slow {
        animation: floatSlow 8s ease-in-out infinite;
      }
      
      .shimmer-text {
        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
        background-size: 200% 100%;
        animation: shimmer 3s infinite;
      }
      
      .magnetic-button {
        transition: transform 0.2s ease;
      }
      
      .magnetic-button:hover {
        transform: scale(1.05);
      }
      
      .hero-card-hover {
        transition: all 0.3s ease;
      }
      
      .hero-card-hover:hover {
        transform: translateY(-8px);
        box-shadow: 0 20px 60px rgba(104, 206, 207, 0.2);
      }
      
      /* Glassy Badge Hover Effect */
      .glassy-badge {
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
      }
      
      .glassy-badge:hover {
        transform: scale(1.1);
        background: rgba(104, 206, 207, 0.25);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        box-shadow: 0 8px 32px rgba(104, 206, 207, 0.3);
        border: 1px solid rgba(104, 206, 207, 0.6);
      }
      
      /* Float Bubbles Animation */
      @keyframes floatBubbles {
        0%, 100% {
          transform: translate(0, 0) scale(1);
        }
        25% {
          transform: translate(20px, -15px) scale(1.02);
        }
        50% {
          transform: translate(-15px, -25px) scale(0.98);
        }
        75% {
          transform: translate(15px, -10px) scale(1.01);
        }
      }
      
      /* Float Chat Bubble Animation */
      @keyframes floatChat {
        0%, 100% {
          transform: translateY(0) rotate(0deg);
        }
        25% {
          transform: translateY(-10px) rotate(2deg);
        }
        50% {
          transform: translateY(-20px) rotate(-2deg);
        }
        75% {
          transform: translateY(-10px) rotate(1deg);
        }
      }

      .why-bubbles-wrap {
        z-index: 0;
      }

      .why-bubbles-image {
        width: min(100%, 56rem);
        object-fit: contain;
      }

      .chat-bubble-wrap {
        max-width: 10rem;
      }

      .chat-bubble-image {
        object-fit: contain;
      }
      
      /* Gradient Layer Animations */
      @keyframes float-layer-1 {
        0%, 100% {
          transform: translate(0, 0) scale(1);
        }
        33% {
          transform: translate(50px, -30px) scale(1.1);
        }
        66% {
          transform: translate(-30px, 40px) scale(0.95);
        }
      }
      
      @keyframes float-layer-2 {
        0%, 100% {
          transform: translate(0, 0) scale(1) rotate(0deg);
        }
        50% {
          transform: translate(-40px, 50px) scale(1.15) rotate(10deg);
        }
      }
      
      @keyframes float-layer-3 {
        0%, 100% {
          transform: translate(0, 0) scale(1);
        }
        40% {
          transform: translate(-50px, -40px) scale(1.08);
        }
        80% {
          transform: translate(30px, 35px) scale(0.92);
        }
      }
      
      @keyframes float-layer-4 {
        0%, 100% {
          transform: translate(0, 0) scale(1) rotate(0deg);
        }
        33% {
          transform: translate(40px, -35px) scale(1.12) rotate(-8deg);
        }
        66% {
          transform: translate(-25px, 45px) scale(0.9) rotate(5deg);
        }
      }
      
      @keyframes float-layer-5 {
        0%, 100% {
          transform: translate(0, 0) scale(1);
        }
        25% {
          transform: translate(35px, 40px) scale(1.1);
        }
        50% {
          transform: translate(-40px, -30px) scale(0.95);
        }
        75% {
          transform: translate(30px, -35px) scale(1.05);
        }
      }
      
      /* 5s Looping Growth Engine Animation */
      @keyframes growthEngine {
        0% {
          transform: scale(0.8) rotate(0deg);
          opacity: 0;
        }
        20% {
          transform: scale(1.2) rotate(72deg);
          opacity: 0.6;
        }
        40% {
          transform: scale(1) rotate(144deg);
          opacity: 0.8;
        }
        60% {
          transform: scale(1.3) rotate(216deg);
          opacity: 0.5;
        }
        80% {
          transform: scale(0.9) rotate(288deg);
          opacity: 0.7;
        }
        100% {
          transform: scale(0.8) rotate(360deg);
          opacity: 0;
        }
      }
      
      @keyframes orbitGrowth {
        0% {
          transform: rotate(0deg) translateX(150px) rotate(0deg);
        }
        100% {
          transform: rotate(360deg) translateX(150px) rotate(-360deg);
        }
      }
      
      @keyframes pulseGrow {
        0%, 100% {
          transform: scale(0.5);
          opacity: 0.3;
        }
        50% {
          transform: scale(1.5);
          opacity: 0.8;
        }
      }
      
      @keyframes waveRipple {
        0% {
          transform: scale(0.5);
          opacity: 0.8;
        }
        100% {
          transform: scale(2.5);
          opacity: 0;
        }
      }
      
      @keyframes dataFlow {
        0% {
          transform: translateY(0) translateX(0);
          opacity: 0;
        }
        20% {
          opacity: 0.6;
        }
        80% {
          opacity: 0.6;
        }
        100% {
          transform: translateY(-100px) translateX(50px);
          opacity: 0;
        }
      }
      
      /* Mobile Menu Styles */
      #mobile-menu {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-out;
      }
      
      #mobile-menu.active {
        max-height: 400px;
      }
      
      .hamburger-line {
        transition: all 0.3s ease;
      }
      
      #hamburger-btn.active .hamburger-line:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
      }
      
      #hamburger-btn.active .hamburger-line:nth-child(2) {
        opacity: 0;
      }
      
      #hamburger-btn.active .hamburger-line:nth-child(3) {
        transform: rotate(-45deg) translate(7px, -6px);
      }

          /* ── WWD Duda-style layout ── */
          .wwd-slide {
            display: flex;
            align-items: stretch;
            height: 100vh;
            overflow: hidden;
          }
          .wwd-col-left {
            flex-basis: 50%;
            position: relative;
            z-index: 1;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            overflow: hidden;
            padding: 6vw 6vw 10vw;
          }
          .wwd-col-right {
            flex-basis: 50%;
            position: relative;
            overflow: hidden;
          }
          .wwd-col-right-inner {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 160vh;
          }
          .wwd-col-right-inner img {
            object-fit: cover;
            width: 100%;
            height: 100%;
          }
          .wwd-title {
            margin: 1.5rem 0 2vw;
            font-size: clamp(2rem, 4.5vw, 5.5rem);
            font-weight: 800;
            line-height: 1;
            letter-spacing: -0.04em;
            color: #111827;
            font-family: 'Space Grotesk', sans-serif;
          }
          .wwd-title-line {
            overflow: hidden;
          }
          .wwd-title-line:nth-of-type(even) { margin-top: -0.8vw; }
          .wwd-title-line-inner { display: block; }
          .wwd-content-wrap {
            display: flex;
            justify-content: flex-end;
          }
          .wwd-text-block {
            max-width: 22vw;
            order: 2;
            margin-left: 32px;
          }
          .wwd-sub {
            font-size: 1rem;
            font-weight: 600;
            color: #374151;
            margin-bottom: 0.6rem;
          }
          .wwd-desc {
            font-size: 0.93rem;
            color: #4b5563;
            line-height: 1.7;
            margin-bottom: 0.75rem;
          }
          .wwd-list {
            list-style: none;
            padding: 0;
            margin: 0 0 0.75rem;
          }
          .wwd-list li {
            font-size: 0.86rem;
            color: #4b5563;
            display: flex;
            align-items: center;
            gap: 0.45rem;
            padding: 0.15rem 0;
          }
          .wwd-note {
            font-size: 0.9rem;
            color: #111827;
            font-weight: 600;
            display: inline-flex;
            padding: 0.55rem 0.9rem;
            border-radius: 9999px;
            background: rgba(255,255,255,0.8);
            border: 1px solid rgba(0,0,0,0.1);
          }
          .wwd-scroll-link {
            position: absolute;
            right: -113px;
            bottom: 3.5vw;
            display: block;
            width: 140px;
            height: 140px;
            background: #111827;
            overflow: hidden;
            text-decoration: none;
            cursor: pointer;
          }
          .wwd-scroll-line {
            position: absolute;
            left: 26px;
            bottom: 0;
            width: 1px;
            height: 100%;
          }
          /* Indicator */
          .wwd-indicator {
            position: fixed;
            right: 2rem;
            top: 50%;
            transform: translateY(-50%);
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0.55rem;
            z-index: 500;
            pointer-events: none;
            opacity: 0;
            transition: opacity 0.4s ease;
          }
          .wwd-indicator.wwd-indicator--visible {
            opacity: 1;
            pointer-events: all;
          }
          .wwd-indicator-dot {
            width: 9px;
            height: 9px;
            border-radius: 50%;
            background: rgba(0,0,0,0.18);
            cursor: pointer;
            transition: transform 0.4s ease, background 0.4s ease;
          }
          .wwd-indicator-dot.active {
            transform: scale(2);
          }
          /* Section header */
          .wwd-header-wrap {
            text-align: center;
            padding: 5rem 1.5rem 3rem;
            background: #ffffff;
          }
          @media (max-width: 768px) {
            .wwd-slide {
              display: block;
              height: auto;
              min-height: 100vh;
              position: relative;
            }
            .wwd-col-left {
              flex-basis: unset;
              width: 85%;
              padding: 7rem 1.2rem 3.5rem;
              min-height: 65vh;
              position: relative;
              z-index: 1;
            }
            .wwd-col-right {
              flex-basis: unset;
              position: absolute;
              z-index: 0;
              left: 0;
              top: 0;
              width: 100%;
              height: 100%;
            }
            .wwd-title { font-size: clamp(1.7rem, 8vw, 3rem); }
            .wwd-text-block { max-width: 80vw; margin-left: 0; }
            .wwd-content-wrap { flex-direction: column; }
            .wwd-scroll-link { display: none; }
            .wwd-indicator { right: 0.5rem; }

              .why-bubbles-wrap {
                align-items: flex-start;
                padding-top: 2rem;
              }

              .why-bubbles-image {
                width: 145%;
                max-width: none;
                opacity: 0.14;
                transform: translateY(-10px);
              }

              .chat-bubble-wrap {
                top: 0.75rem;
                right: 0.75rem;
                width: 4.75rem;
                max-width: 4.75rem;
              }

              .chat-bubble-image {
                opacity: 0.6;
              }
          }
          /* ── Keep old classes from potential references ── */
          .wwd-noir-main { display: none; }

          @keyframes pulse {
            0%, 100% { opacity: 1; transform: scale(1); }
            50% { opacity: 0.5; transform: scale(1.2); }
          }