body {
      font-family: 'Plus Jakarta Sans', sans-serif;
      background-color: #f8fafc; /* slate-50 */
      color: #1e293b; /* slate-800 */
      -webkit-font-smoothing: antialiased;
    }

    /* Custom Utilities */
    .text-slate-500 { color: #64748b; }
    .text-slate-600 { color: #475569; }
    .text-slate-700 { color: #334155; }
    .text-slate-800 { color: #1e293b; }
    .text-slate-900 { color: #0f172a; }
    
    .bg-slate-50 { background-color: #f8fafc; }
    .bg-slate-100 { background-color: #f1f5f9; }
    
    .text-brand-600 { color: #2563eb; }
    .text-brand-700 { color: #1d4ed8; }
    .text-accent-400 { color: #34d399; }
    .text-accent-600 { color: #059669; }

    .fw-extrabold { font-weight: 800; }
    
    .tracking-tight { letter-spacing: -0.025em; }
    .tracking-widest { letter-spacing: 0.1em; }

    /* Gradients */
    .text-gradient {
      background: linear-gradient(to right, #2563eb, #059669); /* brand-600 to accent-600 */
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    
    .bg-gradient-brand {
      background: linear-gradient(to right, #2563eb, #1d4ed8); /* brand-600 to brand-700 */
      color: white;
      border: none;
    }
    .bg-gradient-brand:hover {
      background: linear-gradient(to right, #1d4ed8, #1e3a8a); /* brand-700 to brand-900 */
      color: white;
    }
    
    .bg-gradient-dark {
      background: linear-gradient(to top right, #0f172a, #020617); /* slate-900 to slate-950 */
      color: white;
    }

    /* Components */
    .hero-glow {
      background: radial-gradient(circle at 50% 50%, rgba(37, 99, 235, 0.12) 0%, transparent 60%);
      background-color: #fff;
    }

    .badge-brand {
      background-color: #f0f9ff; /* brand-50 */
      color: #1d4ed8; /* brand-700 */
      border: 1px solid #e0f2fe; /* brand-100 */
    }

    .card-custom {
      border-radius: 1.5rem;
      box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
      border: 1px solid #e2e8f0; /* slate-200 */
      background-color: #fff;
    }

    .btn-custom {
      border-radius: 0.75rem;
      padding: 1rem 2rem;
      font-weight: 700;
      transition: all 0.3s ease;
    }
    .btn-custom:hover {
      transform: translateY(-2px);
    }

    .icon-circle-rose {
      width: 24px;
      height: 24px;
      background-color: #fff1f2; /* rose-50 */
      color: #f43f5e; /* rose-500 */
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
    }

    .icon-circle-accent {
      width: 24px;
      height: 24px;
      background-color: rgba(16, 185, 129, 0.1);
      color: #059669; /* accent-600 */
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
    }

    /* Custom Form Range */
    input[type=range] {
      -webkit-appearance: none;
      width: 100%;
      background: transparent;
    }
    input[type=range]::-webkit-slider-thumb {
      -webkit-appearance: none;
      height: 16px;
      width: 16px;
      border-radius: 50%;
      background: #2563eb; /* brand-600 */
      cursor: pointer;
      margin-top: -6px; 
    }
    input[type=range]::-webkit-slider-runnable-track {
      width: 100%;
      height: 4px;
      cursor: pointer;
      background: #e2e8f0; /* slate-200 */
      border-radius: 4px;
    }

    /* Accordion Customizations */
    .faq-btn {
      background-color: #f8fafc; /* slate-50 */
      transition: background-color 0.3s;
      border: none;
      width: 100%;
      text-align: left;
    }
    .faq-btn:hover { background-color: #f1f5f9; /* slate-100 */ }
    .faq-answer {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-in-out;
      background-color: #fff;
    }
    .faq-icon {
      transition: transform 0.3s ease;
    }

    .custom-scrollbar::-webkit-scrollbar { width: 6px; height: 6px; }
    .custom-scrollbar::-webkit-scrollbar-track { background: #f1f1f1; }
    .custom-scrollbar::-webkit-scrollbar-thumb { background: #cbd5e1; /* slate-300 */ border-radius: 4px; }
    .custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #94a3b8; /* slate-400 */ }