* { margin: 0; padding: 0; box-sizing: border-box; }
    
    :root {
      --bg-void: #000000;
      --bg-deep: #0A0A0F;
      --bg-card: #12121A;
      --neon-pink: #FF10F0;
      --neon-cyan: #00F5FF;
      --neon-purple: #B624FF;
      --neon-gold: #FFD700;
      --neon-lime: #39FF14;
      --neon-orange: #FF6600;
      --oil-slick: linear-gradient(135deg, #FF10F0 0%, #B624FF 15%, #00F5FF 30%, #39FF14 45%, #FFD700 60%, #FF6600 75%, #FF10F0 100%);
      --text-white: #FFFFFF;
      --text-silver: #E0E0E0;
      --text-gray: #808080;
    }
    
    body {
      font-family: 'Space Grotesk', sans-serif;
      background: var(--bg-void);
      color: var(--text-white);
      line-height: 1.6;
      overflow-x: hidden;
    }
    
    .neon-bg {
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: radial-gradient(ellipse at 20% 30%, rgba(255, 16, 240, 0.2) 0%, transparent 50%),
                  radial-gradient(ellipse at 80% 70%, rgba(0, 245, 255, 0.2) 0%, transparent 50%);
      pointer-events: none;
      z-index: 0;
    }
    
    .container {
      max-width: 1400px;
      margin: 0 auto;
      padding: 0 24px;
      position: relative;
      z-index: 1;
    }
    
    /* Navigation */
    nav {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 32px 0;
      border-bottom: 1px solid rgba(255, 16, 240, 0.2);
    }
    
    .logo {
      font-family: 'Playfair Display', serif;
      font-size: 24px;
      font-weight: 900;
      background: var(--oil-slick);
      background-size: 400% 400%;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    
    .nav-links {
      display: flex;
      gap: 40px;
      align-items: center;
    }
    
    .nav-links a {
      color: var(--text-silver);
      text-decoration: none;
      font-weight: 500;
      transition: color 0.3s;
    }
    
    .nav-links a:hover {
      color: var(--neon-cyan);
    }
    
    .btn {
      padding: 16px 32px;
      border: 2px solid;
      border-radius: 12px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      cursor: pointer;
      transition: all 0.3s;
      text-decoration: none;
      display: inline-block;
    }
    
    .btn-primary {
      background: rgba(0, 245, 255, 0.1);
      border-color: var(--neon-cyan);
      color: var(--neon-cyan);
      box-shadow: 0 0 20px rgba(0, 245, 255, 0.4);
    }
    
    .btn-primary:hover {
      background: rgba(0, 245, 255, 0.2);
      transform: translateY(-2px);
      box-shadow: 0 0 40px rgba(0, 245, 255, 0.6);
    }
    
    .btn-secondary {
      background: transparent;
      border-color: var(--neon-pink);
      color: var(--neon-pink);
    }
    
    /* Hero Section */
    .hero {
      text-align: center;
      padding: 120px 0 80px;
    }
    
    .hero-title {
      font-family: 'Playfair Display', serif;
      font-size: 84px;
      font-weight: 900;
      line-height: 1;
      margin-bottom: 24px;
      background: var(--oil-slick);
      background-size: 400% 400%;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    
    .hero-subtitle {
      font-size: 24px;
      color: var(--text-silver);
      margin-bottom: 48px;
      max-width: 800px;
      margin-left: auto;
      margin-right: auto;
    }
    
    .hero-cta {
      display: flex;
      gap: 24px;
      justify-content: center;
      margin-bottom: 64px;
    }
    
    .email-capture {
      display: flex;
      gap: 16px;
      max-width: 600px;
      margin: 0 auto;
    }
    
    .email-input {
      flex: 1;
      padding: 18px 24px;
      background: rgba(18, 18, 26, 0.6);
      border: 2px solid rgba(255, 16, 240, 0.3);
      border-radius: 12px;
      color: var(--text-white);
      font-size: 16px;
      font-family: 'Space Grotesk', sans-serif;
    }
    
    .email-input:focus {
      outline: none;
      border-color: var(--neon-cyan);
      box-shadow: 0 0 20px rgba(0, 245, 255, 0.3);
    }
    
    /* Stats Bar */
    .stats {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 32px;
      padding: 60px 0;
      border-top: 1px solid rgba(255, 16, 240, 0.2);
      border-bottom: 1px solid rgba(255, 16, 240, 0.2);
    }
    
    .stat {
      text-align: center;
    }
    
    .stat-value {
      font-family: 'JetBrains Mono', monospace;
      font-size: 48px;
      font-weight: 700;
      color: var(--neon-cyan);
      margin-bottom: 8px;
    }
    
    .stat-label {
      color: var(--text-silver);
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }
    
    /* How It Works */
    .how-it-works {
      display: grid;
      grid-template-columns: 1fr auto 1fr auto 1fr;
      gap: 24px;
      align-items: center;
      max-width: 1200px;
      margin: 0 auto;
    }
    
    .step-card {
      background: rgba(18, 18, 26, 0.6);
      backdrop-filter: blur(20px);
      border: 2px solid rgba(255, 16, 240, 0.2);
      border-radius: 20px;
      padding: 40px;
      text-align: center;
      transition: all 0.3s;
    }
    
    .step-card:hover {
      border-color: var(--neon-cyan);
      transform: translateY(-4px);
      box-shadow: 0 0 40px rgba(0, 245, 255, 0.3);
    }
    
    .step-number {
      font-family: 'JetBrains Mono', monospace;
      font-size: 48px;
      font-weight: 700;
      color: var(--neon-cyan);
      margin-bottom: 16px;
      opacity: 0.8;
    }
    
    .step-title {
      font-size: 22px;
      font-weight: 700;
      margin-bottom: 12px;
    }
    
    .step-desc {
      color: var(--text-silver);
      line-height: 1.8;
      font-size: 15px;
    }
    
    .step-arrow {
      font-size: 32px;
      color: var(--neon-pink);
      opacity: 0.6;
    }
    
    /* Section Titles */
    .section {
      padding: 100px 0;
    }
    
    .section-title {
      font-family: 'Playfair Display', serif;
      font-size: 56px;
      font-weight: 900;
      text-align: center;
      margin-bottom: 64px;
      background: var(--oil-slick);
      background-size: 400% 400%;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    
    /* Features Grid */
    .features {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 32px;
    }
    
    .feature-card {
      background: rgba(18, 18, 26, 0.6);
      backdrop-filter: blur(20px);
      border: 2px solid rgba(255, 16, 240, 0.2);
      border-radius: 20px;
      padding: 40px;
      transition: all 0.3s;
    }
    
    .feature-card:hover {
      border-color: var(--neon-cyan);
      transform: translateY(-4px);
      box-shadow: 0 0 40px rgba(0, 245, 255, 0.3);
    }
    
    .feature-icon {
      font-size: 48px;
      margin-bottom: 20px;
    }
    
    .feature-title {
      font-size: 24px;
      font-weight: 700;
      margin-bottom: 12px;
    }
    
    .feature-desc {
      color: var(--text-silver);
      line-height: 1.8;
    }
    
    /* Use Cases */
    .use-cases {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
      gap: 24px;
    }
    
    .use-case {
      background: rgba(18, 18, 26, 0.6);
      padding: 32px;
      border-radius: 16px;
      border: 2px solid transparent;
      border-image: var(--oil-slick);
      border-image-slice: 1;
    }
    
    /* Pricing */
    .pricing-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
      gap: 32px;
      margin-top: 60px;
    }
    
    .pricing-card {
      background: rgba(18, 18, 26, 0.8);
      backdrop-filter: blur(20px);
      border: 3px solid;
      border-radius: 24px;
      padding: 48px;
      text-align: center;
      position: relative;
    }
    
    .pricing-card.featured {
      border-color: var(--neon-cyan);
      box-shadow: 0 0 60px rgba(0, 245, 255, 0.4);
    }
    
    .pricing-card.basic {
      border-color: var(--neon-pink);
    }
    
    .pricing-card.enterprise {
      border-color: var(--neon-gold);
    }
    
    .pricing-badge {
      position: absolute;
      top: -16px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--neon-cyan);
      color: var(--bg-void);
      padding: 6px 20px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }
    
    .plan-name {
      font-size: 28px;
      font-weight: 700;
      margin-bottom: 16px;
    }
    
    .plan-price {
      font-family: 'JetBrains Mono', monospace;
      font-size: 56px;
      font-weight: 700;
      margin-bottom: 8px;
    }
    
    .plan-price span {
      font-size: 20px;
      color: var(--text-silver);
    }
    
    .plan-features {
      list-style: none;
      margin: 32px 0;
      text-align: left;
    }
    
    .plan-features li {
      padding: 12px 0;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .plan-features li:before {
      content: '✓ ';
      color: var(--neon-lime);
      font-weight: 700;
      margin-right: 8px;
    }
    
    /* Contact Form */
    .contact-form {
      max-width: 600px;
      margin: 0 auto;
      background: rgba(18, 18, 26, 0.6);
      backdrop-filter: blur(20px);
      padding: 48px;
      border-radius: 24px;
      border: 2px solid rgba(255, 16, 240, 0.2);
    }
    
    .form-group {
      margin-bottom: 24px;
    }
    
    .form-label {
      display: block;
      margin-bottom: 8px;
      font-weight: 600;
      text-transform: uppercase;
      font-size: 12px;
      letter-spacing: 0.1em;
      color: var(--neon-cyan);
    }
    
    .form-input,
    .form-textarea {
      width: 100%;
      padding: 16px;
      background: rgba(0, 0, 0, 0.4);
      border: 2px solid rgba(255, 16, 240, 0.3);
      border-radius: 8px;
      color: var(--text-white);
      font-family: 'Space Grotesk', sans-serif;
      font-size: 16px;
    }
    
    .form-textarea {
      min-height: 150px;
      resize: vertical;
    }
    
    .form-input:focus,
    .form-textarea:focus {
      outline: none;
      border-color: var(--neon-cyan);
      box-shadow: 0 0 20px rgba(0, 245, 255, 0.3);
    }
    
    /* Footer */
    footer {
      border-top: 1px solid rgba(255, 16, 240, 0.2);
      padding: 60px 0 40px;
      margin-top: 100px;
    }
    
    .footer-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 48px;
      margin-bottom: 48px;
    }
    
    .footer-section h4 {
      margin-bottom: 20px;
      color: var(--neon-cyan);
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }
    
    .footer-section ul {
      list-style: none;
    }
    
    .footer-section li {
      margin-bottom: 12px;
    }
    
    .footer-section a {
      color: var(--text-silver);
      text-decoration: none;
      transition: color 0.3s;
    }
    
    .footer-section a:hover {
      color: var(--neon-cyan);
    }
    
    .footer-bottom {
      text-align: center;
      padding-top: 32px;
      border-top: 1px solid rgba(255, 255, 255, 0.1);
      color: var(--text-gray);
      font-size: 14px;
    }
    
    /* Social Proof */
    .social-proof {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 48px;
      padding: 60px 0;
      border-top: 1px solid rgba(255, 16, 240, 0.2);
      border-bottom: 1px solid rgba(255, 16, 240, 0.2);
    }
    
    .badge-item {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 20px 32px;
      background: rgba(18, 18, 26, 0.6);
      border-radius: 16px;
      border: 2px solid rgba(57, 255, 20, 0.3);
    }
    
    .badge-item span {
      font-weight: 700;
      font-size: 18px;
      color: var(--neon-lime);
    }
    
    .testimonial {
      background: rgba(18, 18, 26, 0.6);
      backdrop-filter: blur(20px);
      border: 2px solid rgba(255, 16, 240, 0.2);
      border-radius: 20px;
      padding: 40px;
      max-width: 500px;
      margin: 0 auto;
    }
    
    .testimonial-quote {
      font-size: 20px;
      font-style: italic;
      color: var(--text-silver);
      line-height: 1.8;
      margin-bottom: 24px;
    }
    
    .testimonial-author {
      font-weight: 700;
      color: var(--neon-cyan);
    }
    
    .testimonial-role {
      font-size: 14px;
      color: var(--text-gray);
    }
    
    /* Roadmap */
    .roadmap {
      max-width: 800px;
      margin: 0 auto;
    }
    
    .roadmap-item {
      display: flex;
      gap: 32px;
      margin-bottom: 40px;
      padding: 32px;
      background: rgba(18, 18, 26, 0.6);
      border-radius: 16px;
      border-left: 4px solid var(--neon-cyan);
    }
    
    .roadmap-item.done {
      border-left-color: var(--neon-lime);
      opacity: 0.9;
    }
    
    .roadmap-item.upcoming {
      border-left-color: var(--neon-purple);
      opacity: 0.8;
    }
    
    .roadmap-date {
      font-family: 'JetBrains Mono', monospace;
      font-weight: 700;
      color: var(--neon-cyan);
      min-width: 100px;
    }
    
    .roadmap-content h4 {
      margin-bottom: 8px;
      font-size: 20px;
    }
    
    .roadmap-content p {
      color: var(--text-silver);
      line-height: 1.6;
    }
    
    /* Timeline */
    .timeline-item {
      display: flex;
      gap: 24px;
      margin-bottom: 40px;
      position: relative;
    }
    .timeline-item::before {
      content: '';
      position: absolute;
      left: 23px;
      top: 50px;
      width: 2px;
      height: calc(100% + 40px);
      background: linear-gradient(180deg, var(--neon-cyan), transparent);
    }
    .timeline-item:last-child::before { display: none; }
    .timeline-marker {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 700;
      font-size: 20px;
      flex-shrink: 0;
      box-shadow: 0 0 30px currentColor;
    }
    .timeline-content {
      flex: 1;
      background: rgba(18, 18, 26, 0.6);
      padding: 24px;
      border-radius: 12px;
      border: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    /* FAQ */
    .faq-item {
      margin-bottom: 16px;
      background: rgba(18, 18, 26, 0.6);
      border-radius: 12px;
      border: 1px solid rgba(255, 255, 255, 0.1);
      overflow: hidden;
      transition: all 0.3s;
    }
    .faq-item:hover { border-color: var(--neon-cyan); box-shadow: 0 0 20px rgba(0, 245, 255, 0.2); }
    .faq-question {
      width: 100%;
      padding: 24px;
      background: none;
      border: none;
      color: var(--text-white);
      font-size: 18px;
      font-weight: 600;
      text-align: left;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-family: 'Space Grotesk', sans-serif;
    }
    .faq-icon { font-size: 28px; font-weight: 300; color: var(--neon-cyan); transition: transform 0.3s; flex-shrink: 0; margin-left: 16px; }
    .faq-item.active .faq-icon { transform: rotate(45deg); }
    .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; padding: 0 24px; }
    .faq-item.active .faq-answer { max-height: 2000px; padding: 0 24px 24px; }
    .faq-answer p { margin-bottom: 16px; color: var(--text-silver); line-height: 1.8; }
    .faq-answer p:last-child { margin-bottom: 0; }
    .faq-answer strong { color: var(--text-white); }
    .faq-answer ul { margin: 12px 0; }
    .faq-answer li { margin-bottom: 8px; line-height: 1.6; }
    
    /* Responsive */
    @media (max-width: 768px) {
      .hero-title { font-size: 48px; }
      .section-title { font-size: 36px; }
      .nav-links { display: none; }
      .hero-cta { flex-direction: column; }
      .email-capture { flex-direction: column; }
      .how-it-works { grid-template-columns: 1fr; }
      .step-arrow { transform: rotate(90deg); }
    }