/* Dark theme variables and base styles */
:root{
  --bg: #0B0F14; /* near-black */
  --surface: #0F1720; /* dark slate */
  --panel: #111418;
  --muted: #9AA4B2; /* muted text */
  --text: #E6EEF6; /* primary text */
  --muted-2: #7B8592;
  --primary: #6D28D9; /* deep indigo */
  --primary-600: #5B21B6;
  --secondary: #10B981; /* teal */
  --accent: #4C51BF;
  --border: rgba(255,255,255,0.06);
  --glass: rgba(255,255,255,0.03);
  --radius: 12px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  background: linear-gradient(180deg,var(--bg),#071018 85%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
}

a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Navigation */
nav{position:fixed;top:0;left:0;right:0;height:72px;display:flex;align-items:center;z-index:1000;background:linear-gradient(180deg, rgba(15,20,32,0.65), rgba(15,20,32,0.55));backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}
.nav-content{width:100%;max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 20px}
.nav-logo{font-weight:800;background:linear-gradient(90deg,var(--primary),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.nav-links{display:flex;gap:24px;align-items:center}
.nav-links a{color:var(--muted)}
.nav-btn{background:linear-gradient(90deg,var(--primary),var(--primary-600));color:white;padding:10px 18px;border-radius:10px;font-weight:700;border:none}

/* Hero */
.hero{padding:110px 20px 80px;text-align:center;background:transparent}
.hero-inner{max-width:960px;margin:0 auto}
.hero-icon{font-size:72px;display:inline-block;margin-bottom:18px}
.hero h1{font-size:48px;margin:12px 0 8px;color:var(--text);line-height:1.05}
.hero-subtitle{color:var(--muted);font-size:18px;margin-bottom:28px}
.hero-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero-bg{background-image: url('../../images/banner-lite.jpg');background-size:cover;background-position:center}
.btn{padding:12px 26px;border-radius:10px;font-weight:700;cursor:pointer}
.btn-primary{background:linear-gradient(90deg,var(--primary),var(--primary-600));color:white;border:none}
.btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border)}

/* Sections */
.section-title{font-size:32px;color:var(--text);margin-bottom:8px}
.section-subtitle{color:var(--muted);margin-bottom:36px}

.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.feature-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);padding:28px;border-radius:var(--radius);border:1px solid var(--border)}
.feature-title{font-size:20px;margin-bottom:8px}
.feature-desc{color:var(--muted)}

/* Pricing */
.pricing-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:30px;border-radius:12px;border:1px solid var(--border);text-align:center}
.pricing-price{font-size:40px;color:var(--primary);font-weight:800}
.pricing-badge{display:inline-block;padding:6px 12px;border-radius:999px;background:linear-gradient(90deg,var(--primary),var(--accent));color:white;font-weight:700;margin-bottom:12px}

/* Footer */
footer{background:transparent;padding:60px 20px 40px;border-top:1px solid var(--border);color:var(--muted)}
.footer-links a{color:var(--muted)}

/* Utilities */
.text-muted{color:var(--muted)}
.panel{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:20px;border-radius:var(--radius);border:1px solid var(--border)}

@media (max-width:768px){
  .hero h1{font-size:32px}
  .nav-links a{display:none}
  .nav-btn{padding:8px 12px}
}