/* ===============
   SAARTHI AI Landing Styles
   Palette: Indigo, Emerald, White + futuristic gradients
=============== */
:root {
  --clr-bg: #0d0f17;
  --clr-surface: #141827;
  --clr-surface-alt: #1c2233;
  --clr-indigo: #4b3fe4;
  --clr-indigo-accent: #6d5bf7;
  --clr-emerald: #10b981;
  --clr-emerald-accent: #34d399;
  --clr-text: #f5f7fa;
  --clr-text-dim: #9aa3b5;
  --clr-danger: #ef4444;
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 28px;
  --shadow-soft: 0 4px 16px -4px rgba(0,0,0,.4), 0 2px 4px -1px rgba(0,0,0,.3);
  --grad-hero: radial-gradient(circle at 30% 20%, #4b3fe4 0%, rgba(75,63,228,0) 60%), radial-gradient(circle at 70% 60%, #10b981 0%, rgba(16,185,129,0) 55%);
  --grad-accent: linear-gradient(135deg, #4b3fe4, #10b981);
  --grad-card: linear-gradient(145deg, rgba(75,63,228,0.12), rgba(16,185,129,0.12));
  --transition: 0.55s cubic-bezier(.16,.8,.24,1);
  font-size: 16px;
}

/* Light theme overrides */
[data-theme="light"] {
  --clr-bg: #f5f8fb;
  --clr-surface: #ffffff;
  --clr-surface-alt: #eef2f7;
  --clr-text: #1a2332;
  --clr-text-dim: #5d6a7c;
  --grad-hero: radial-gradient(circle at 25% 25%, rgba(75,63,228,0.35) 0%, rgba(75,63,228,0) 55%), radial-gradient(circle at 70% 70%, rgba(16,185,129,0.35) 0%, rgba(16,185,129,0) 60%);
  --grad-card: linear-gradient(145deg, rgba(75,63,228,0.08), rgba(16,185,129,0.08));
  --shadow-soft: 0 4px 14px -4px rgba(0,0,0,.15), 0 2px 4px -1px rgba(0,0,0,.08);
}

* { box-sizing: border-box; }
html, body { margin:0; padding:0; }
body {
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
  background: var(--clr-bg);
  color: var(--clr-text);
  -webkit-font-smoothing: antialiased;
  transition: background .6s ease, color .6s ease;
}

h1, h2, h3, h4 { font-family: 'Poppins', 'Inter', sans-serif; font-weight:600; line-height:1.15; margin:0 0 .6em; }
p { line-height:1.6; margin:0 0 1em; }
ul { margin:0; padding:0; list-style: none; }
a { color: var(--clr-emerald); text-decoration:none; }
a:hover { color: var(--clr-indigo-accent); }

.visually-hidden { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }

/* Layout */
.container { width: min(1180px, 92%); margin-inline:auto; }

header.site-header { position:sticky; top:0; z-index:40; background:rgba(13,15,23,0.7); backdrop-filter: blur(14px); border-bottom:1px solid rgba(255,255,255,0.05); }
[data-theme="light"] header.site-header { background:rgba(255,255,255,0.7); border-bottom:1px solid rgba(0,0,0,0.06); }
.nav-bar { display:flex; justify-content:space-between; align-items:center; padding:0.9rem 0; }
.logo { font-size:1.25rem; font-weight:700; letter-spacing:.5px; }
.logo span { background:var(--grad-accent); -webkit-background-clip:text; background-clip:text; color:transparent; }
.main-nav ul { display:flex; gap:1.4rem; align-items:center; }
.main-nav a { font-weight:500; font-size:.95rem; padding:.4rem .8rem; border-radius: var(--radius-sm); transition:color .3s, background .3s; }
.main-nav a:hover { background:rgba(255,255,255,0.06); }

/* Buttons */
.btn { --btn-bg: var(--clr-surface-alt); --btn-color: var(--clr-text); display:inline-flex; align-items:center; justify-content:center; gap:.5rem; font-weight:600; letter-spacing:.4px; padding:.85rem 1.4rem; border-radius: var(--radius-lg); position:relative; overflow:hidden; transition:var(--transition); background:var(--btn-bg); color:var(--btn-color); border:1px solid rgba(255,255,255,0.1); box-shadow: var(--shadow-soft); }
.btn.primary { --btn-bg: var(--grad-accent); border:none; }
.btn.secondary { --btn-bg: linear-gradient(135deg, #1f2937, #111827); }
.btn.outline { background:transparent; border:1px solid rgba(255,255,255,0.3); }
[data-theme="light"] .btn.outline { border:1px solid rgba(0,0,0,0.25); }
.btn.small { padding:.55rem 1rem; font-size:.8rem; }
.btn.large { padding:1rem 1.8rem; font-size:1rem; }
.btn:hover { transform: translateY(-3px); box-shadow:0 10px 25px -8px rgba(0,0,0,.55), 0 4px 8px -2px rgba(0,0,0,.4); }
.btn:active { transform:translateY(0); }

/* Hero */
.hero { position:relative; padding: clamp(4rem, 9vw, 8rem) 0 4rem; overflow:hidden; }
.hero-bg-gradient { position:absolute; inset:0; background:var(--grad-hero); opacity:.9; filter: blur(60px) saturate(140%); pointer-events:none; }
.hero-grid { display:grid; gap:3rem; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); align-items:center; position:relative; }
.hero-text h1 { font-size: clamp(2.2rem, 4.2vw, 3.4rem); }
.gradient-text { background: var(--grad-accent); -webkit-background-clip:text; background-clip:text; color:transparent; }
.tagline { font-size:1.15rem; max-width:620px; color:var(--clr-text-dim); }
.hero-ctas { display:flex; gap:1.2rem; flex-wrap:wrap; margin-top:1.2rem; }
.hero-media { position:relative; }
.hero-video { width:100%; aspect-ratio: 16 / 9; border-radius: var(--radius-md); background:#111; border:1px solid rgba(255,255,255,0.08); box-shadow:0 15px 40px -10px rgba(0,0,0,.55); }
.scroll-indicator { position:absolute; bottom:1rem; left:50%; transform:translateX(-50%); font-size:1.4rem; opacity:.5; animation: floatY 3.5s ease-in-out infinite; }
@keyframes floatY { 0%,100% { transform:translate(-50%, 0);} 50% { transform:translate(-50%, -10px);} }

/* Sections */
section { scroll-margin-top:90px; }
.section-head { text-align:center; margin-bottom:2.2rem; }
.section-head p { color:var(--clr-text-dim); max-width:680px; margin-inline:auto; }

/* Features */
.features { padding:5rem 0 4rem; background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)); position:relative; }
.feature-grid { display:grid; gap:1.8rem; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.feature-card { background: var(--grad-card); border:1px solid rgba(255,255,255,0.08); padding:1.4rem 1.4rem 1.8rem; border-radius: var(--radius-md); position:relative; overflow:hidden; display:flex; flex-direction:column; gap:.6rem; backdrop-filter: blur(6px); transition:var(--transition); }
[data-theme="light"] .feature-card { border:1px solid rgba(0,0,0,0.08); }
.feature-card:before { content:""; position:absolute; inset:0; background:linear-gradient(120deg, rgba(255,255,255,0.08), transparent 45%); opacity:0; transition:.6s; }
.feature-card:hover { transform:translateY(-6px); }
.feature-card:hover:before { opacity:1; }
.feature-card h3 { margin:.2rem 0 .4rem; font-size:1.07rem; }
.feature-card p { font-size:.9rem; color:var(--clr-text-dim); }
.icon-wrap { width:46px; height:46px; border-radius:14px; background:linear-gradient(135deg, #1f2538, #121722); border:1px solid rgba(255,255,255,0.1); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 8px 18px -6px rgba(0,0,0,.55); }
.avatar-gradient { background:linear-gradient(135deg, #4b3fe4, #6d5bf7); }
.graph-gradient { background:linear-gradient(135deg, #10b981, #34d399); }
.trust-gradient { background:linear-gradient(135deg, #4b3fe4, #10b981); }
.shield-gradient { background:linear-gradient(135deg, #6d5bf7, #10b981); }

/* Placeholder tags styling */
gif, illustration { display:block; width:100%; min-height:140px; background:repeating-linear-gradient(45deg, rgba(255,255,255,0.08) 0 10px, rgba(255,255,255,0.04) 10px 20px); border:1px dashed rgba(255,255,255,0.25); border-radius: var(--radius-sm); margin-top:.8rem; position:relative; overflow:hidden; }
gif:before, illustration:before { content: attr(aria-label); position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:.7rem; text-transform:uppercase; letter-spacing:1px; color:var(--clr-text-dim); }

/* Demo Section */
.demo { padding:5rem 0 4.5rem; }
.demo-media { max-width:1020px; }
.demo-video { width:100%; border-radius: var(--radius-lg); border:1px solid rgba(255,255,255,0.1); background:#000; box-shadow:0 25px 55px -15px rgba(0,0,0,.65); }
.comparison { display:grid; gap:2rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top:3rem; }
.comparison-block { background:var(--clr-surface); border:1px solid rgba(255,255,255,0.06); padding:1.4rem 1.4rem 1.6rem; border-radius: var(--radius-md); position:relative; }
[data-theme="light"] .comparison-block { border:1px solid rgba(0,0,0,0.08); }
.comparison-block h3 { margin:0 0 .8rem; font-size:1.05rem; }
.comparison-block ul { list-style:disc; margin-left:1.1rem; }
.comparison-block li { font-size:.85rem; margin:.4rem 0; color:var(--clr-text-dim); }

/* Why Section */
.why { padding:5rem 0 4rem; background:linear-gradient(180deg, rgba(16,185,129,0.08), rgba(75,63,228,0.08)); position:relative; }
.bullet-grid { display:grid; gap:1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-top:.5rem; }
.bullet-grid li { background:var(--clr-surface-alt); border:1px solid rgba(255,255,255,0.07); padding:1rem 1.1rem; border-radius: var(--radius-md); font-size:.85rem; line-height:1.4; position:relative; overflow:hidden; }
[data-theme="light"] .bullet-grid li { border:1px solid rgba(0,0,0,0.08); }
.bullet-grid li:before { content:""; position:absolute; inset:0; background:linear-gradient(120deg, rgba(75,63,228,0.18), rgba(16,185,129,0.18)); opacity:0; transition:var(--transition); }
.bullet-grid li:hover:before { opacity:.5; }
.testimonials { margin-top:3.5rem; text-align:center; }
.testimonial-grid { display:grid; gap:1.4rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin-top:1.5rem; }
.testimonial { height:120px; }

/* CTA Bottom */
.cta-bottom { padding:5rem 0 5.5rem; background: radial-gradient(circle at 50% 10%, rgba(75,63,228,0.35), rgba(13,15,23,0) 70%), radial-gradient(circle at 50% 50%, rgba(16,185,129,0.28), rgba(13,15,23,0) 75%); position:relative; }
.cta-inner { text-align:center; max-width:860px; }
.cta-inner h2 { font-size: clamp(2rem, 3vw, 2.6rem); }
.cta-inner p { color:var(--clr-text-dim); font-size:1rem; }
.cta-actions { display:flex; gap:1.2rem; justify-content:center; flex-wrap:wrap; margin:1.4rem 0 1.6rem; }
.social-proof { font-size:.75rem; letter-spacing:.6px; text-transform:uppercase; color:var(--clr-text-dim); }
.social-proof span { color:var(--clr-text); }

/* Footer */
.site-footer { background:#0b0d14; border-top:1px solid rgba(255,255,255,0.05); padding-top:3.2rem; }
[data-theme="light"] .site-footer { background:#ffffff; border-top:1px solid rgba(0,0,0,0.06); }
.footer-grid { display:grid; gap:2.2rem; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.foot-block h4 { margin:0 0 .7rem; font-size:.95rem; letter-spacing:.5px; }
.foot-tagline { font-size:.8rem; color:var(--clr-text-dim); }
.newsletter { display:flex; gap:.6rem; }
.newsletter input { flex:1; background:#1a2130; border:1px solid rgba(255,255,255,0.15); border-radius: var(--radius-lg); color:var(--clr-text); padding:.7rem .9rem; font-size:.8rem; }
.newsletter input:focus { outline:2px solid var(--clr-indigo); outline-offset:1px; }
.social-links { display:flex; flex-direction:column; gap:.4rem; }
.social-links a { font-size:.8rem; color:var(--clr-text-dim); }
.social-links a:hover { color:var(--clr-text); }
.disclaimer { font-size:.65rem; line-height:1.4; color:var(--clr-text-dim); }
.sub-footer { text-align:center; padding:1.2rem 0; margin-top:2.5rem; font-size:.65rem; color:var(--clr-text-dim); background:#07080d; }
[data-theme="light"] .sub-footer { background:#eef2f7; }

/* Theme Toggle */
.theme-toggle { font-size:.8rem; line-height:1; width:42px; height:42px; padding:0; display:inline-flex; align-items:center; justify-content:center; }
.theme-toggle:focus { outline:2px solid var(--clr-indigo); outline-offset:2px; }
[data-theme="light"] .theme-toggle { background:transparent; }

/* Reveal Animations */
[data-reveal] { opacity:0; transform:translateY(30px); transition:var(--transition); }
[data-reveal].is-visible { opacity:1; transform:translateY(0); }

/* Responsive */
@media (max-width: 780px) {
  .hero { padding:5rem 0 3rem; }
  .nav-bar { gap:1rem; }
  .main-nav ul { gap:.6rem; }
  .hero-ctas { flex-direction:column; align-items:stretch; }
  .newsletter { flex-direction:column; }
}

@media (max-width: 520px) {
  .hero-text h1 { font-size:2.1rem; }
  .btn.large { font-size:.9rem; }
}