/* style.css */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#0a0a0c;--bg2:#111114;--bg3:#18181c;
  --green:#22c55e;--green-dim:#16a34a;--green-glow:rgba(34,197,94,.15);
  --amber:#f59e0b;--amber-dim:#d97706;--amber-glow:rgba(245,158,11,.12);
  --red:#ef4444;
  --text:#e4e4e7;--text-dim:#71717a;--text-faint:#3f3f46;
  --border:#27272a;--border-lit:#3f3f46;
  --mono:'JetBrains Mono',monospace;--sans:'Outfit',sans-serif;
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.7;overflow-x:hidden}
a{color:var(--green);text-decoration:none;transition:color .2s}
a:hover{color:var(--amber)}
body::before{content:'';position:fixed;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.03) 2px,rgba(0,0,0,.03) 4px);pointer-events:none;z-index:9999}
.grid-bg{position:fixed;inset:0;background-image:linear-gradient(rgba(34,197,94,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(34,197,94,.03) 1px,transparent 1px);background-size:60px 60px;pointer-events:none;z-index:-1}
.container{max-width:1100px;margin:0 auto;padding:0 24px}
nav{position:sticky;top:0;z-index:100;background:rgba(10,10,12,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
nav .inner{display:flex;align-items:center;justify-content:space-between;padding:16px 0}
.logo{font-family:var(--mono);font-weight:700;font-size:18px;letter-spacing:-.5px}
.logo span{color:var(--green)}
.nav-right{display:flex;align-items:center;gap:24px}
nav ul{display:flex;gap:28px;list-style:none}
nav a{color:var(--text-dim);font-size:14px;font-weight:500;letter-spacing:.3px;text-transform:uppercase}
nav a:hover{color:var(--green)}
.lang-toggle{display:flex;align-items:center;background:var(--bg3);border:1px solid var(--border);border-radius:6px;overflow:hidden;font-family:var(--mono);font-size:12px;cursor:pointer;user-select:none}
.lang-toggle button{padding:5px 10px;background:transparent;border:none;color:var(--text-dim);cursor:pointer;transition:all .2s;font-family:var(--mono);font-size:12px;font-weight:500}
.lang-toggle button.active{background:var(--green);color:#0a0a0c}
.hero{padding:120px 0 80px;text-align:center;position:relative}
.hero::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:600px;height:300px;background:radial-gradient(ellipse,var(--green-glow),transparent 70%);pointer-events:none}
.status-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:20px;background:var(--green-glow);border:1px solid rgba(34,197,94,.2);font-family:var(--mono);font-size:13px;color:var(--green);margin-bottom:32px}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--green);animation:pulse 2s ease infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
h1{font-family:var(--mono);font-size:clamp(36px,6vw,64px);font-weight:700;line-height:1.1;letter-spacing:-2px;margin-bottom:20px}
h1 .accent{color:var(--green)}
.hero p{font-size:18px;color:var(--text-dim);max-width:560px;margin:0 auto 40px;line-height:1.6}
.cta-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;border-radius:8px;font-size:15px;font-weight:600;transition:all .2s;cursor:pointer;border:none}
.btn-primary{background:var(--green);color:#0a0a0c}
.btn-primary:hover{background:var(--green-dim);color:#0a0a0c;transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border-lit)}
.btn-ghost:hover{border-color:var(--green);color:var(--green);transform:translateY(-1px)}
.btn-invite{background:rgba(88,101,242,.15);color:#7289da;border:1px solid rgba(88,101,242,.35);box-shadow:0 0 20px rgba(88,101,242,.08)}
.btn-invite:hover{background:rgba(88,101,242,.25);color:#99aaf5;border-color:rgba(88,101,242,.6);transform:translateY(-1px);box-shadow:0 0 28px rgba(88,101,242,.15)}
.terminal{max-width:700px;margin:60px auto 0;background:var(--bg2);border:1px solid var(--border);border-radius:12px;overflow:hidden;text-align:left}
.terminal-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--bg3);border-bottom:1px solid var(--border)}
.terminal-dot{width:10px;height:10px;border-radius:50%}
.terminal-bar span{font-family:var(--mono);font-size:12px;color:var(--text-dim);margin-left:auto}
.terminal-body{padding:20px;font-family:var(--mono);font-size:13px;line-height:2}
.terminal-body .prompt{color:var(--green)}
.terminal-body .cmd{color:var(--text)}
.terminal-body .output{color:var(--text-dim)}
.terminal-body .highlight{color:var(--amber)}
section{padding:100px 0}
.section-label{font-family:var(--mono);font-size:13px;color:var(--green);text-transform:uppercase;letter-spacing:2px;margin-bottom:12px}
h2{font-family:var(--mono);font-size:clamp(28px,4vw,40px);font-weight:700;letter-spacing:-1px;margin-bottom:16px}
.section-desc{font-size:17px;color:var(--text-dim);max-width:600px;margin-bottom:48px}
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.feature-card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:28px;transition:border-color .3s,transform .3s}
.feature-card:hover{border-color:var(--green);transform:translateY(-2px)}
.feature-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:16px}
.feature-icon.green{background:var(--green-glow);border:1px solid rgba(34,197,94,.2)}
.feature-icon.amber{background:var(--amber-glow);border:1px solid rgba(245,158,11,.2)}
.feature-card h3{font-family:var(--mono);font-size:16px;font-weight:600;margin-bottom:8px}
.feature-card p{font-size:14px;color:var(--text-dim);line-height:1.6}
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;max-width:900px;margin:0 auto;}
.price-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 32px;
  position: relative;
  overflow: hidden;
  display: flex;             /* NEW */
  flex-direction: column;    /* NEW */
}
.price-card.featured{border-color:var(--green)}
.price-card.featured::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--green),var(--amber))}
.badge-best {
  position: absolute;
  top: 16px;
  right: 16px;
  background: var(--amber-glow);
  color: var(--amber);
  padding: 4px 10px;
  border-radius: 20px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  border: 1px solid rgba(245, 158, 11, 0.2);
}
.price-tag{font-family:var(--mono);font-size:13px;color:var(--green);margin-bottom:8px}
.price-amount{font-family:var(--mono);font-size:36px;font-weight:700;margin-bottom:4px}
.price-period{font-size:14px;color:var(--text-dim);margin-bottom:24px}
.price-features {
  list-style: none;
  margin-bottom: 28px;
  flex-grow: 1;              
}
.price-features li{font-size:14px;color:var(--text-dim);padding:6px 0;display:flex;align-items:center;gap:8px}
.price-features li::before{content:'✓';color:var(--green);font-weight:700}
.steps{max-width:600px}
.step{display:flex;gap:20px;padding:24px 0;border-bottom:1px solid var(--border)}
.step:last-child{border-bottom:none}
.step-num{width:36px;height:36px;border-radius:50%;flex-shrink:0;background:var(--green-glow);border:1px solid rgba(34,197,94,.2);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:14px;font-weight:700;color:var(--green)}
.step h3{font-family:var(--mono);font-size:15px;font-weight:600;margin-bottom:4px}
.step p{font-size:14px;color:var(--text-dim)}
.step code{display:inline-block;margin-top:8px;padding:4px 10px;border-radius:6px;background:var(--bg3);border:1px solid var(--border);font-family:var(--mono);font-size:12px;color:var(--amber)}
footer{padding:40px 0;border-top:1px solid var(--border);text-align:center}
footer p{font-size:13px;color:var(--text-faint)}
footer a{color:var(--text-dim)}
@media(max-width: 640px) {
  nav ul { gap: 16px; }
  nav a { font-size: 12px; }
  .nav-right { gap: 12px; }
  .hero { padding: 80px 0 60px; }
  section { padding: 60px 0; }
  .features-grid { grid-template-columns: 1fr; }
  
  /* The Pricing Grid Mobile Fix */
  .pricing-grid { 
    grid-template-columns: 1fr; 
    gap: 16px; 
    max-width: 100%;
  }
  .price-card {
    padding: 24px; /* Slightly less padding for smaller screens */
  }
}