/* StreamControl · Landing page */
:root {
  --landing-bg: #080d18;
  --landing-surface: #101827;
  --landing-surface-2: #141f33;
  --landing-border: rgba(255,255,255,.085);
  --landing-text: #f7f9ff;
  --landing-muted: #aab6cd;
  --landing-primary: #6c82ff;
  --landing-primary-2: #8b6ff4;
  --landing-cyan: #59d4df;
  --landing-success: #3cc58b;
}

body.landing-page {
  margin: 0;
  background: var(--landing-bg) !important;
  color: var(--landing-text) !important;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  overflow-x: hidden;
}
body.landing-page h1,
body.landing-page h2,
body.landing-page h3,
body.landing-page h4,
body.landing-page h5,
body.landing-page h6 { color: var(--landing-text) !important; }
body.landing-page p { color: var(--landing-muted); }

.landing-nav {
  background: rgba(8,13,24,.78) !important;
  border-bottom: 1px solid var(--landing-border);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.landing-nav .navbar-brand { color: #fff !important; letter-spacing: -.035em; }
.landing-nav .nav-link { color: #bcc7db !important; font-weight: 650; }
.landing-nav .nav-link:hover { color: #fff !important; }
.brand-mark {
  width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px; color: #fff; background: linear-gradient(135deg,var(--landing-primary),var(--landing-primary-2));
  box-shadow: 0 9px 24px rgba(108,130,255,.28);
}

.btn-landing-primary {
  border: 0 !important; color: #fff !important; font-weight: 750 !important;
  background: linear-gradient(135deg,var(--landing-primary),var(--landing-primary-2)) !important;
  box-shadow: 0 10px 26px rgba(108,130,255,.24);
  border-radius: 12px !important;
}
.btn-landing-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 30px rgba(108,130,255,.32); }
.btn-landing-ghost {
  color: #dfe6f5 !important; border: 1px solid rgba(255,255,255,.14) !important; background: rgba(255,255,255,.03) !important;
  border-radius: 12px !important; font-weight: 700 !important;
}
.btn-landing-ghost:hover { background: rgba(255,255,255,.07) !important; border-color: rgba(255,255,255,.24) !important; }

.hero-section {
  position: relative; min-height: 720px; display: flex; align-items: center; padding: 9rem 0 5rem;
  background:
    radial-gradient(circle at 14% 22%, rgba(108,130,255,.24), transparent 33%),
    radial-gradient(circle at 82% 24%, rgba(89,212,223,.14), transparent 30%),
    linear-gradient(180deg,#0b1221 0%,#080d18 100%) !important;
  overflow: hidden;
}
.hero-section::before {
  content: ''; position: absolute; inset: 0; opacity: .16; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px), linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, #000 0%, transparent 82%);
}
.hero-content { position: relative; z-index: 2; }
.hero-kicker {
  display: inline-flex; align-items: center; gap: .55rem; padding: .48rem .8rem; border-radius: 999px;
  border: 1px solid rgba(108,130,255,.3); background: rgba(108,130,255,.09); color: #cbd4ff;
  font-size: .78rem; font-weight: 800; letter-spacing: .035em;
}
.hero-title { max-width: 820px; margin: 1.35rem auto 1.2rem; font-size: clamp(2.55rem,5.3vw,4.7rem); line-height: 1.04; letter-spacing: -.065em; font-weight: 850; }
.hero-title .gradient-text { background: linear-gradient(100deg,#a8b6ff,#6de2e8); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-copy { max-width: 790px; margin-inline: auto; font-size: clamp(1rem,1.4vw,1.18rem); line-height: 1.75; }
.hero-actions { display: flex; justify-content: center; gap: .75rem; flex-wrap: wrap; margin-top: 2rem; }
.hero-actions .btn { min-height: 52px; padding-inline: 1.35rem; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; }
.hero-trust { display: flex; justify-content: center; gap: 1rem 1.4rem; flex-wrap: wrap; margin-top: 1.7rem; color: #8f9db8; font-size: .82rem; }
.hero-trust span { display: inline-flex; align-items: center; gap: .42rem; }
.hero-trust i { color: var(--landing-success); }

.dashboard-preview {
  position: relative; z-index: 2; max-width: 980px; margin: 3.2rem auto 0; padding: .75rem;
  border: 1px solid rgba(255,255,255,.11); border-radius: 22px; background: rgba(255,255,255,.035);
  box-shadow: 0 35px 90px rgba(0,0,0,.34);
}
.preview-window { overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; background: #111a2a; }
.preview-toolbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem .9rem; border-bottom:1px solid rgba(255,255,255,.07); background:#0d1524; }
.preview-dots { display:flex; gap:.38rem; }.preview-dots span { width:8px;height:8px;border-radius:50%;background:#33405a; }.preview-dots span:first-child{background:#f06c75}.preview-dots span:nth-child(2){background:#e8b44a}.preview-dots span:nth-child(3){background:#42bd84}
.preview-layout { display:grid; grid-template-columns: 180px 1fr; min-height: 330px; }
.preview-sidebar { padding:1rem .8rem; border-right:1px solid rgba(255,255,255,.065); background:#0c1422; }
.preview-brand { height:34px; border-radius:9px; background:linear-gradient(135deg,rgba(108,130,255,.22),rgba(139,111,244,.18)); margin-bottom:1rem; }
.preview-menu-item { height:34px; margin:.35rem 0; border-radius:8px; background:rgba(255,255,255,.035); }.preview-menu-item.active{background:linear-gradient(135deg,rgba(108,130,255,.7),rgba(139,111,244,.62))}
.preview-content { padding:1rem; }
.preview-heading { width:42%; height:20px; border-radius:6px; background:#d7def0; opacity:.75; margin-bottom:1rem; }
.preview-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; }
.preview-kpi { min-height:78px; padding:.75rem; border:1px solid rgba(255,255,255,.07); border-radius:11px; background:#172238; }
.preview-kpi strong { display:block; color:#fff; font-size:1rem; }.preview-kpi span { color:#7f8ea8; font-size:.66rem; }
.preview-panels { display:grid; grid-template-columns:1.25fr .75fr; gap:.65rem; margin-top:.65rem; }
.preview-panel { min-height:155px; border:1px solid rgba(255,255,255,.07); border-radius:11px; background:#131e31; padding:.8rem; }
.preview-bars { display:flex; align-items:flex-end; gap:.42rem; height:98px; padding-top:.5rem; }.preview-bars span{flex:1;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#7288ff,#495fcf);opacity:.85}
.preview-list-line { height:12px; margin:.7rem 0; border-radius:4px; background:#26344e; }.preview-list-line:nth-child(2){width:82%}.preview-list-line:nth-child(3){width:68%}.preview-list-line:nth-child(4){width:90%}

.landing-section { position: relative; padding: 6.5rem 0; }
.landing-section.alt { background: #0b111d; border-block: 1px solid rgba(255,255,255,.055); }
.section-eyebrow { color: #9eaeff; font-size:.72rem; font-weight:850; text-transform:uppercase; letter-spacing:.11em; }
.section-title { max-width: 760px; margin:.65rem auto 1rem; font-size:clamp(1.9rem,3.2vw,2.8rem); font-weight:820; letter-spacing:-.045em; }
.section-lead { max-width:760px; margin-inline:auto; line-height:1.75; }

.feature-card, .step-card, .pricing-card, .usecase-card {
  height:100%; border:1px solid var(--landing-border); border-radius:18px; background:linear-gradient(145deg,rgba(20,31,51,.94),rgba(13,22,38,.96));
  box-shadow:0 16px 38px rgba(0,0,0,.12);
}
.feature-card { padding:1.35rem; transition: transform .22s ease,border-color .22s ease; }.feature-card:hover{transform:translateY(-4px);border-color:rgba(108,130,255,.34)}
.feature-icon { width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--landing-primary),var(--landing-primary-2));box-shadow:0 9px 22px rgba(108,130,255,.22);margin-bottom:1rem; }
.feature-card h3 { font-size:1rem; font-weight:780; margin-bottom:.55rem; }.feature-card p{font-size:.86rem;line-height:1.65;margin:0}

.workflow-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.85rem; margin-top:2.2rem; }
.step-card { padding:1.3rem; position:relative; overflow:hidden; }.step-number{display:inline-flex;width:34px;height:34px;border-radius:10px;align-items:center;justify-content:center;background:rgba(108,130,255,.12);border:1px solid rgba(108,130,255,.25);color:#b9c5ff;font-weight:850;margin-bottom:1rem}.step-card h3{font-size:.98rem;font-weight:780}.step-card p{font-size:.82rem;line-height:1.65;margin:0}

.usecase-card { padding:1.5rem; }.usecase-list{list-style:none;margin:1rem 0 0;padding:0}.usecase-list li{display:flex;gap:.65rem;padding:.55rem 0;color:#b2bed3;font-size:.86rem}.usecase-list i{color:var(--landing-success);margin-top:.15rem}

.pricing-card { padding:1.5rem; position:relative; }.pricing-card.popular{border-color:rgba(108,130,255,.66);box-shadow:0 20px 50px rgba(80,99,210,.18)}
.popular-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);white-space:nowrap;padding:.34rem .72rem;border-radius:999px;background:linear-gradient(135deg,var(--landing-primary),var(--landing-primary-2));color:#fff;font-size:.69rem;font-weight:800;box-shadow:0 7px 16px rgba(108,130,255,.28)}
.price-value{font-size:2.55rem;font-weight:850;letter-spacing:-.055em;color:#fff}.price-period{font-size:.8rem;color:#8897b4}.pricing-list{list-style:none;padding:0;margin:1.15rem 0 1.4rem}.pricing-list li{display:flex;gap:.55rem;align-items:flex-start;padding:.53rem 0;border-bottom:1px solid rgba(255,255,255,.055);color:#aebad0;font-size:.82rem}.pricing-list li:last-child{border-bottom:0}.pricing-list i{color:#64d5b0;margin-top:.15rem}

.landing-cta { padding:5rem 0; background:linear-gradient(135deg,#17223b,#11192a);border-top:1px solid rgba(255,255,255,.07); }
.landing-footer { padding:2rem 0; border-top:1px solid rgba(255,255,255,.06); background:#070b13; color:#8592aa; font-size:.82rem; }

@media (max-width: 991.98px) {
  .landing-nav .navbar-collapse { margin-top:.75rem;padding:.8rem;border:1px solid var(--landing-border);border-radius:14px;background:rgba(8,13,24,.97); }
  .preview-layout{grid-template-columns:125px 1fr}.preview-kpis{grid-template-columns:repeat(2,1fr)}.workflow-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 767.98px) {
  .hero-section{min-height:auto;padding:7.25rem .35rem 4rem}.dashboard-preview{margin-top:2.25rem}.preview-layout{grid-template-columns:1fr}.preview-sidebar{display:none}.preview-panels{grid-template-columns:1fr}.preview-panels .preview-panel:last-child{display:none}.landing-section{padding:4.5rem 0}.workflow-grid{grid-template-columns:1fr}.hero-actions .btn{width:100%}
}
@media (max-width: 575.98px) {
  .hero-title{font-size:clamp(2.2rem,12vw,3.1rem)}.preview-kpis{grid-template-columns:1fr 1fr}.preview-kpi{min-height:68px;padding:.6rem}.landing-section{padding:4rem 0}
}
.preview-bars span:nth-child(1){height:45%}.preview-bars span:nth-child(2){height:68%}.preview-bars span:nth-child(3){height:52%}.preview-bars span:nth-child(4){height:82%}.preview-bars span:nth-child(5){height:64%}.preview-bars span:nth-child(6){height:92%}.preview-bars span:nth-child(7){height:76%}