/* Landing — Enterprise UI layer */
:root {
  color-scheme: light;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --border: #e2e8f0;
  --text: #0f172a;
  --muted: #64748b;
  --brand: #16a34a;
}

[data-theme="dark"] {
  color-scheme: dark;
  --surface: #0f172a;
  --surface-2: #111827;
  --border: #334155;
  --text: #f1f5f9;
  --muted: #94a3b8;
  --g-bg: #0b1f14;
  --line: #334155;
  --white: #0f172a;
}
[data-theme="dark"] body { background: var(--surface); color: var(--text); }
[data-theme="dark"] .header { background: rgba(15,23,42,.92); border-color: var(--border); }
[data-theme="dark"] .hero { background: linear-gradient(160deg,#0b1f14,#111827 50%,#0f172a); }
[data-theme="dark"] .sec-alt { background: var(--surface-2); }
[data-theme="dark"] .feat, [data-theme="dark"] .testi, [data-theme="dark"] .gh-showcase,
[data-theme="dark"] .faq-item, [data-theme="dark"] .preview-card { background: var(--surface); border-color: var(--border); }
[data-theme="dark"] .footer { background: #020617; }

.header-actions-extra { display: flex; align-items: center; gap: 8px; }
.theme-btn {
  width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 12px;
  background: var(--surface); color: var(--text); display: grid; place-items: center; cursor: pointer;
  transition: .2s;
}
.theme-btn:hover { border-color: var(--g-dark); color: var(--g-dark); }
.theme-btn i { width: 18px; height: 18px; }

.header { border-bottom: 1px solid transparent; }
.header.on { border-bottom-color: var(--line); }

.feat, .ben, .testi, .gh-showcase {
  transition: transform .25s ease, box-shadow .25s ease;
}
.feat:hover, .ben:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(15,23,42,.08);
}

:focus-visible { outline: 2px solid var(--g-dark); outline-offset: 2px; }

#nprogress .bar { background: var(--g-dark) !important; height: 3px !important; }