/* ZEK BRIDGE theme switcher */
:root {
  --theme-surface: #0d1116;
  --theme-surface-raised: #121821;
  --theme-border: rgba(255,255,255,.12);
  --theme-copy: #f2f0ed;
  --theme-muted: #a8adb5;
  --theme-accent: #1688e8;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(22,136,232,.34);
  border-radius: 4px;
  background: rgba(22,136,232,.08);
  color: #dfeaf5;
  cursor: pointer;
  font: 700 10px/1 'Space Grotesk', sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.theme-toggle:hover { background: rgba(22,136,232,.18); border-color: #1688e8; transform: translateY(-1px); }
@keyframes zekButtonPulse { 0%, 54%, 100% { box-shadow: 0 5px 22px rgba(22,136,232,.24), 0 0 0 0 rgba(22,136,232,.42); } 72% { box-shadow: 0 8px 34px rgba(22,136,232,.48), 0 0 0 17px rgba(22,136,232,0); } }
#heroBtnDemo { animation: zekButtonPulse 5.2s ease-in-out infinite; }
#heroBtnDemo:hover { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { #heroBtnDemo { animation: none; } }
.promo-code-panel { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.78fr); gap:10px 34px; align-items:center; width:min(900px,100%); margin:28px auto 30px; padding:26px 28px; border:1px solid rgba(22,136,232,.3); border-radius:8px; background:linear-gradient(135deg,rgba(22,136,232,.09),rgba(255,255,255,.02)); box-shadow:0 14px 38px rgba(0,0,0,.18); }
.promo-code-copy { min-width:0; }
.promo-code-label { display:block; margin-bottom:7px; color:#1688E8; font:10px 'JetBrains Mono',monospace; letter-spacing:.16em; text-transform:uppercase; }
.promo-code-copy h3 { margin:0 0 6px; color:#F2F0ED; font-size:16px; }
.promo-code-copy p { margin:0; color:#94918B; font-size:12px; line-height:1.55; }
.promo-code-form { display:flex; gap:8px; align-items:center; justify-content:flex-end; }
.promo-code-form input { width:190px; height:38px; padding:0 11px; border:1px solid rgba(242,240,237,.18); border-radius:4px; background:#101112; color:#F2F0ED; font:12px 'Space Grotesk',sans-serif; outline:none; }
.promo-code-form input:focus { border-color:#1688E8; box-shadow:0 0 0 3px rgba(22,136,232,.12); }
.promo-code-form button { height:38px; padding:0 14px; border:1px solid #1688E8; border-radius:4px; background:#1688E8; color:#fff; font:600 11px 'Space Grotesk',sans-serif; cursor:pointer; }
.promo-code-form button:hover { background:#2B9AF4; }
.promo-code-status { min-height:16px; margin:12px 0 0 !important; color:#F59E0B !important; font:11px 'JetBrains Mono',monospace !important; }
.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.pricing-card.starter .pricing-features li:nth-child(2), .pricing-card.pro .pricing-features li:nth-child(2) { display:none !important; }
.dashboard-panel:nth-child(2) .dashboard-info-row:nth-child(2) { display:none !important; }
.pricing-token-note { display:none !important; }
.token-card, .token-resource-panel, .resource-hero, .resource-stat-grid, .overview-metric:has(#overviewPlanTokens) { display:none !important; }
.faq-list .faq-item:nth-child(14) { display: none !important; }
.demo-card-stats .demo-stat:nth-child(4) { display: none !important; }
.overview-metric small { display:block; margin-top:5px; color: var(--text-muted); font-size:10px; }
html[data-theme="light"] .promo-code-panel { background:linear-gradient(135deg,rgba(22,136,232,.09),#f8fbff); border-color:rgba(22,136,232,.28); }
html[data-theme="light"] .promo-code-copy h3 { color:#17202b; }
html[data-theme="light"] .promo-code-copy p { color:#526170; }
html[data-theme="light"] .promo-code-form input { background:#fff; color:#17202b; border-color:rgba(23,32,43,.2); }
@media (max-width:760px) { .promo-code-panel { grid-template-columns:1fr; gap:16px; margin-top:22px; padding:22px 18px; } .promo-code-form { width:100%; justify-content:stretch; } .promo-code-form input { flex:1; width:auto; min-width:0; } }
.theme-toggle-icon { font-size: 15px; line-height: 1; letter-spacing: 0; }
.theme-toggle-label { white-space: nowrap; }
.mobile-nav-break { display: none; }

html[data-theme="light"] body {
  background: #eef3f8 !important;
  color: #17202b !important;
}
html[data-theme="light"] body::before,
html[data-theme="light"] body::after { opacity: .18 !important; }
html[data-theme="light"] nav {
  background: rgba(248,251,255,.9) !important;
  border-bottom-color: rgba(23,32,43,.14) !important;
  box-shadow: 0 10px 32px rgba(22,51,82,.1) !important;
}
html[data-theme="light"] .nav-brand-text .brand-bridge,
html[data-theme="light"] .nav-links a,
html[data-theme="light"] .nav-status { color: #263746 !important; }
html[data-theme="light"] .nav-links a:hover { color: #1688e8 !important; }
html[data-theme="light"] .nav-download { background: #1688e8 !important; border-color: #1688e8 !important; color: #fff !important; }
html[data-theme="light"] .theme-toggle { background: rgba(22,136,232,.1); color: #15578d; }
html[data-theme="light"] .company-dropdown,
html[data-theme="light"] .auth-modal,
html[data-theme="light"] .pricing-card,
html[data-theme="light"] .feature-card,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .dashboard-card,
html[data-theme="light"] .resource-card,
html[data-theme="light"] .panel,
html[data-theme="light"] .card {
  background: #f8fbff !important;
  border-color: rgba(23,32,43,.16) !important;
  color: #17202b !important;
}
html[data-theme="light"] .hero,
html[data-theme="light"] section,
html[data-theme="light"] main { color: #17202b; }
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] .hero-title { color: #17202b !important; }
html[data-theme="light"] p,
html[data-theme="light"] .muted,
html[data-theme="light"] .section-copy,
html[data-theme="light"] .hero-subtitle { color: #526170 !important; }
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select { background: #fff !important; color: #17202b !important; border-color: rgba(23,32,43,.2) !important; }
html[data-theme="light"] footer { background: #e2eaf2 !important; border-color: rgba(23,32,43,.12) !important; color: #526170 !important; }

/* Full-page light mode overrides for the landing page's original dark surfaces. */
html[data-theme="light"] {
  --bg-primary: #eef3f8;
  --bg-secondary: #e5edf5;
  --text-primary: #17202b;
  --text-secondary: #40566b;
  --text-muted: #637486;
  --glass-bg: rgba(255,255,255,.82);
  --glass-border: rgba(23,32,43,.14);
  --glow-cyan: #1688e8;
  --glow-purple: #596fd9;
  color-scheme: light;
}
html[data-theme="light"] .content { background: #eef3f8 !important; }
html[data-theme="light"] .hero {
  background: radial-gradient(circle at 78% 18%, rgba(22,136,232,.12), transparent 34%), #eef3f8 !important;
}
html[data-theme="light"] .hero-code-background,
html[data-theme="light"] .hero-pixel-canvas { opacity: .08 !important; }
html[data-theme="light"] .section,
html[data-theme="light"] .features-section,
html[data-theme="light"] .demo-section,
html[data-theme="light"] .pricing-section,
html[data-theme="light"] .faq-section,
html[data-theme="light"] .contact-section,
html[data-theme="light"] .terminal-section { background: transparent !important; }
html[data-theme="light"] .feature-card,
html[data-theme="light"] .pricing-card,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .hero-stats,
html[data-theme="light"] .demo-workspace,
html[data-theme="light"] .demo-card,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .subscription-assurance,
html[data-theme="light"] [class*="panel"],
html[data-theme="light"] [class*="workspace"] {
  background: #f8fbff !important;
  color: #17202b !important;
  border-color: rgba(23,32,43,.15) !important;
  box-shadow: 0 12px 32px rgba(22,51,82,.07) !important;
}
html[data-theme="light"] .section-header h2,
html[data-theme="light"] .section-header h2 span,
html[data-theme="light"] .pricing-card h3,
html[data-theme="light"] .feature-card h3,
html[data-theme="light"] .faq-question,
html[data-theme="light"] .hero-stat-value { color: #17202b !important; -webkit-text-fill-color: #17202b !important; text-shadow: none !important; }
html[data-theme="light"] .section-header p,
html[data-theme="light"] .feature-card p,
html[data-theme="light"] .pricing-card p,
html[data-theme="light"] .faq-answer,
html[data-theme="light"] .hero-stat-label,
html[data-theme="light"] .demo-topbar-title,
html[data-theme="light"] .demo-card-status-text { color: #526170 !important; }
html[data-theme="light"] .demo-sidebar,
html[data-theme="light"] .demo-card-header,
html[data-theme="light"] .demo-main-header { background: #e9f0f7 !important; }
html[data-theme="light"] .demo-main,
html[data-theme="light"] .demo-body { background: #f8fbff !important; }
html[data-theme="light"] footer a { color: #40566b !important; }
html[data-theme="light"] #features,
html[data-theme="light"] #pricing,
html[data-theme="light"] .demo-section,
html[data-theme="light"] .terminal-section,
html[data-theme="light"] .faq-section,
html[data-theme="light"] .cta-section {
  background: #eef3f8 !important;
}
html[data-theme="light"] .dashboard-sidebar { background: #e4ecf4 !important; border-right-color: rgba(23,32,43,.14) !important; }
html[data-theme="light"] .dashboard-main { background: radial-gradient(circle at 75% 0%, rgba(22,136,232,.12), transparent 35%), #eef3f8 !important; }
html[data-theme="light"] .resource-hero,
html[data-theme="light"] .contact-section,
html[data-theme="light"] .subscription-assurance-item { background: #f8fbff !important; color: #17202b !important; }
html[data-theme="light"] .demo-sidebar,
html[data-theme="light"] .demo-topbar,
html[data-theme="light"] .demo-ai,
html[data-theme="light"] .terminal-demo-body { background: #e6eef6 !important; color: #17202b !important; }
html[data-theme="light"] .btn-secondary,
html[data-theme="light"] .dashboard-action,
html[data-theme="light"] .dashboard-menu,
html[data-theme="light"] .company-trigger,
html[data-theme="light"] .faq-question,
html[data-theme="light"] .contact-email,
html[data-theme="light"] .dashboard-sidebar-help { color: #17202b !important; }
html[data-theme="light"] .btn-secondary { border-color: rgba(23,32,43,.24) !important; }
html[data-theme="light"] .dashboard-view,
html[data-theme="light"] .dashboard-view h1,
html[data-theme="light"] .dashboard-view h2,
html[data-theme="light"] .dashboard-view h3,
html[data-theme="light"] .dashboard-view strong,
html[data-theme="light"] .dashboard-summary-card strong,
html[data-theme="light"] .overview-plan-card h3,
html[data-theme="light"] .overview-metric strong,
html[data-theme="light"] .resource-hero h3,
html[data-theme="light"] .resource-stat strong,
html[data-theme="light"] .contact-section h2,
html[data-theme="light"] .contact-form h3,
html[data-theme="light"] .contact-support-card h3 { color: #17202b !important; }
html[data-theme="light"] .dashboard-summary-card,
html[data-theme="light"] .overview-metric,
html[data-theme="light"] .resource-stat,
html[data-theme="light"] .dashboard-panel,
html[data-theme="light"] .contact-support-card,
html[data-theme="light"] .contact-form { background: #f8fbff !important; border-color: rgba(23,32,43,.15) !important; }
html[data-theme="light"] .dashboard-menu.active,
html[data-theme="light"] .dashboard-home-button { color: #17202b !important; background: #dce8f3 !important; border-color: rgba(23,32,43,.16) !important; }
html[data-theme="light"] .dashboard-info-row span:last-child,
html[data-theme="light"] .dashboard-timeline-item span { color: #17202b !important; }
html[data-theme="light"] .contact-form input,
html[data-theme="light"] .contact-form textarea,
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select { background: #fff !important; color: #17202b !important; border-color: rgba(23,32,43,.2) !important; }
html[data-theme="light"] .nav-actions #dashboardBtn { background: #fff !important; color: #17202b !important; border-color: rgba(23,32,43,.2) !important; }
html[data-theme="light"] .nav-actions > .nav-download:last-child,
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .dashboard-action.primary,
html[data-theme="light"] .contact-form button { color: #fff !important; }
html[data-theme="light"] .overview-plan-card {
  background: linear-gradient(135deg, rgba(22,136,232,.12), rgba(248,251,255,.98) 62%) !important;
  border-color: rgba(22,136,232,.42) !important;
  box-shadow: 0 18px 48px rgba(22,51,82,.1) !important;
}
html[data-theme="light"] .overview-plan-card h3,
html[data-theme="light"] .overview-plan-card p { color: #17202b !important; }
html[data-theme="light"] .overview-plan-card::after { border-color: rgba(22,136,232,.24); box-shadow: 0 0 0 14px rgba(22,136,232,.05), 0 0 0 28px rgba(22,136,232,.025); }
html[data-theme="light"] .overview-plan-badge { color: #15803d !important; background: rgba(34,197,94,.1) !important; border-color: rgba(21,128,61,.28) !important; }

@media (max-width: 760px) {
  .theme-toggle { min-height: 32px; padding: 0 9px; }
  .theme-toggle-label { display: none; }
  .theme-toggle-icon { font-size: 16px; }
}

/* GruvDark / Gruvbox Dark theme */
html[data-theme="gruvdark"] {
  --bg-primary: #282828;
  --bg-secondary: #3c3836;
  --text-primary: #ebdbb2;
  --text-secondary: #d5c4a1;
  --text-muted: #a89984;
  --glass-bg: rgba(60, 56, 54, .86);
  --glass-border: rgba(235, 219, 178, .18);
  --glow-cyan: #83a598;
  --glow-purple: #d3869b;
  --glow-blue: #458588;
  color-scheme: dark;
  background: #282828;
}
html[data-theme="gruvdark"] body,
html[data-theme="gruvdark"] .content { background: #282828 !important; color: #ebdbb2 !important; }
html[data-theme="gruvdark"] nav { background: rgba(40,40,40,.94) !important; border-bottom-color: rgba(131,165,152,.38) !important; box-shadow: 0 10px 32px rgba(0,0,0,.32) !important; }
html[data-theme="gruvdark"] .nav-brand-text .brand-bridge,
html[data-theme="gruvdark"] .nav-links a,
html[data-theme="gruvdark"] .nav-status { color: #d5c4a1 !important; }
html[data-theme="gruvdark"] .nav-links,
html[data-theme="gruvdark"] .theme-toggle { background: rgba(60,56,54,.8) !important; border-color: rgba(131,165,152,.5) !important; color: #ebdbb2 !important; }
html[data-theme="gruvdark"] .nav-links a:hover,
html[data-theme="gruvdark"] .nav-download { color: #b8bb26 !important; }
html[data-theme="gruvdark"] .hero,
html[data-theme="gruvdark"] section,
html[data-theme="gruvdark"] main,
html[data-theme="gruvdark"] footer { background: #282828 !important; color: #ebdbb2 !important; }
html[data-theme="gruvdark"] .hero { background: radial-gradient(circle at 78% 18%, rgba(131,165,152,.16), transparent 34%), #282828 !important; }
html[data-theme="gruvdark"] h1,
html[data-theme="gruvdark"] h2,
html[data-theme="gruvdark"] h3,
html[data-theme="gruvdark"] h4,
html[data-theme="gruvdark"] .hero-title,
html[data-theme="gruvdark"] .section-header h2 { color: #ebdbb2 !important; }
html[data-theme="gruvdark"] p,
html[data-theme="gruvdark"] .muted,
html[data-theme="gruvdark"] .section-copy,
html[data-theme="gruvdark"] .hero-subtitle { color: #bdae93 !important; }
html[data-theme="gruvdark"] .feature-card,
html[data-theme="gruvdark"] .pricing-card,
html[data-theme="gruvdark"] .faq-item,
html[data-theme="gruvdark"] .contact-card,
html[data-theme="gruvdark"] .demo-workspace,
html[data-theme="gruvdark"] .demo-card,
html[data-theme="gruvdark"] .panel,
html[data-theme="gruvdark"] .card,
html[data-theme="gruvdark"] [class*="panel"],
html[data-theme="gruvdark"] [class*="workspace"] { background: #3c3836 !important; color: #ebdbb2 !important; border-color: rgba(235,219,178,.18) !important; box-shadow: 0 12px 32px rgba(0,0,0,.2) !important; }
html[data-theme="gruvdark"] input,
html[data-theme="gruvdark"] textarea,
html[data-theme="gruvdark"] select { background: #282828 !important; color: #ebdbb2 !important; border-color: rgba(235,219,178,.25) !important; }
html[data-theme="gruvdark"] .btn-primary,
html[data-theme="gruvdark"] .nav-download,
html[data-theme="gruvdark"] .contact-form button { background: #458588 !important; border-color: #458588 !important; color: #fbf1c7 !important; }
html[data-theme="gruvdark"] .btn-secondary { color: #ebdbb2 !important; border-color: rgba(235,219,178,.3) !important; }
html[data-theme="gruvdark"] .hero-code-background,
html[data-theme="gruvdark"] .hero-pixel-canvas { opacity: .2 !important; }

/* Gruvbox orange accent: warm highlights without overpowering the dark palette. */
html[data-theme="gruvdark"] {
  --gruv-orange: #fe8019;
  --gruv-orange-soft: #d65d0e;
  --glow-cyan: #fe8019;
  --glow-purple: #d3869b;
}
html[data-theme="gruvdark"] .nav-brand-text .brand-zek,
html[data-theme="gruvdark"] .nav-links a:hover,
html[data-theme="gruvdark"] .hero-subtitle,
html[data-theme="gruvdark"] .section-tag,
html[data-theme="gruvdark"] .promo-code-label { color: #fe8019 !important; }
html[data-theme="gruvdark"] .nav-download,
html[data-theme="gruvdark"] .btn-primary,
html[data-theme="gruvdark"] .contact-form button,
html[data-theme="gruvdark"] #heroBtnDemo {
  background: #d65d0e !important;
  border-color: #fe8019 !important;
  color: #fff3d4 !important;
  box-shadow: 0 8px 24px rgba(214,93,14,.28) !important;
}
html[data-theme="gruvdark"] .nav-download:hover,
html[data-theme="gruvdark"] .btn-primary:hover,
html[data-theme="gruvdark"] .contact-form button:hover,
html[data-theme="gruvdark"] #heroBtnDemo:hover { background: #fe8019 !important; border-color: #fe8019 !important; }
html[data-theme="gruvdark"] .theme-toggle,
html[data-theme="gruvdark"] .hero-badge,
html[data-theme="gruvdark"] .section-tag,
html[data-theme="gruvdark"] .promo-code-panel { border-color: rgba(254,128,25,.48) !important; }
html[data-theme="gruvdark"] .hero-badge-dot,
html[data-theme="gruvdark"] .hero h1::after { background: #fe8019 !important; }
html[data-theme="gruvdark"] .hero h1 .zek,
html[data-theme="gruvdark"] .hero h1 em { color: #fe8019 !important; -webkit-text-fill-color: #fe8019 !important; }
html[data-theme="gruvdark"] .hero::before { background: radial-gradient(circle, rgba(254,128,25,.16), transparent 68%) !important; }
html[data-theme="gruvdark"] .feature-card:nth-child(4n+1),
html[data-theme="gruvdark"] .pricing-card:nth-child(4n+1) { border-top-color: #fe8019 !important; }

/* GruvDark pricing section: one consistent surface for Starter, Pro and Max. */
html[data-theme="gruvdark"] .pricing-card,
html[data-theme="gruvdark"] .pricing-card.starter,
html[data-theme="gruvdark"] .pricing-card.pro,
html[data-theme="gruvdark"] .pricing-card.max,
html[data-theme="gruvdark"] .pricing-card.featured {
  background: #3c3836 !important;
  background-image: none !important;
  border: 1px solid rgba(235,219,178,.2) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.24) !important;
}
html[data-theme="gruvdark"] .pricing-card.featured { border-color: rgba(254,128,25,.62) !important; }
html[data-theme="gruvdark"] .pricing-card.featured::after { background: radial-gradient(circle, rgba(254,128,25,.08), transparent 62%) !important; }
html[data-theme="gruvdark"] .pricing-card .pricing-name,
html[data-theme="gruvdark"] .pricing-card .pricing-plan-chip { color: #fe8019 !important; }
html[data-theme="gruvdark"] .pricing-card .pricing-features li { color: #d5c4a1 !important; }
html[data-theme="gruvdark"] .pricing-card .pricing-features li .check { color: #b8bb26 !important; }
html[data-theme="gruvdark"] .pricing-card .pricing-note { border-top-color: rgba(235,219,178,.18) !important; color: #a89984 !important; }
html[data-theme="gruvdark"] .subscription-assurance { background: #504945 !important; border-color: rgba(235,219,178,.2) !important; }
html[data-theme="gruvdark"] .subscription-assurance-item { background: #282828 !important; }
html[data-theme="gruvdark"] .subscription-assurance-item::before { background: #fe8019 !important; }
html[data-theme="gruvdark"] .subscription-assurance-index { color: #fe8019 !important; }
html[data-theme="gruvdark"] .promo-code-form button { background: #d65d0e !important; border-color: #fe8019 !important; color: #fff3d4 !important; }
html[data-theme="gruvdark"] .promo-code-form button:hover { background: #fe8019 !important; }

/* PayPal owns the checkout iframe, so harmonize its external surface without touching its internals. */
html[data-theme="gruvdark"] .paypal-button-wrap {
  padding: 0 1px;
  border-radius: 4px;
  background: #3c3836;
  overflow: hidden;
}
html[data-theme="gruvdark"] .paypal-button-wrap iframe {
  filter: brightness(.78) saturate(.9) contrast(1.04);
}

/* Final mobile layout pass. The landing page stays usable on narrow phones. */
@media (max-width: 760px) {
  html, body { width: 100%; min-width: 0; overflow-x: hidden !important; }
  nav {
    height: auto !important;
    min-height: 58px !important;
    padding: 8px 10px 6px !important;
    align-items: center !important;
    align-content: center !important;
    gap: 6px !important;
  }
  .nav-brand { flex: 1 1 auto !important; min-width: 0 !important; gap: 6px !important; }
  .nav-brand img { width: 34px !important; height: 34px !important; }
  .nav-brand-text { font-size: 12px !important; letter-spacing: 1.8px !important; gap: 5px !important; }
  .nav-actions { flex: 0 0 auto !important; min-width: 0 !important; gap: 4px !important; }
  .nav-actions .theme-toggle { min-width: 34px !important; width: 34px !important; padding: 0 !important; }
  .nav-actions .theme-toggle-label { display: none !important; }
  .nav-actions .language-switcher { width: 82px !important; height: 32px !important; padding: 0 5px !important; font-size: 9px !important; }
  .nav-actions .nav-download { height: 32px !important; min-width: 0 !important; padding: 0 9px !important; font-size: 8px !important; white-space: nowrap !important; }
  .nav-links {
    display: flex !important;
    flex: 0 0 100% !important;
    order: 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    padding: 2px 0 4px !important;
    border-radius: 0 !important;
    background: transparent !important;
    scrollbar-width: none !important;
  }
  .nav-links::-webkit-scrollbar { display: none !important; }
  .nav-links a, .nav-links .company-menu, .nav-links .company-trigger {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }
  .nav-links a, .nav-links .company-trigger { padding: 8px 10px !important; font-size: 10px !important; letter-spacing: .04em !important; }
  .company-dropdown { top: 100% !important; right: 0 !important; position: absolute !important; }
  .announcement-ribbon { top: 112px !important; z-index: 90 !important; }
  .hero {
    min-height: auto !important;
    padding: 155px 16px 58px !important;
    align-items: stretch !important;
    text-align: left !important;
  }
  .hero-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 32px !important;
  }
  .hero-copy { width: 100% !important; max-width: 100% !important; }
  .hero h1, .hero-idea-title { max-width: 100% !important; font-size: clamp(40px, 12vw, 58px) !important; line-height: .98 !important; letter-spacing: -.06em !important; }
  .hero-subtitle { font-size: 10px !important; letter-spacing: .2em !important; }
  .hero-desc { max-width: 100% !important; font-size: 14px !important; line-height: 1.6 !important; }
  .hero-actions { display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; max-width: 330px !important; gap: 10px !important; }
  .hero-actions a { width: 100% !important; min-height: 48px !important; }
  .hero-trust { display: grid !important; grid-template-columns: 1fr 1fr !important; width: 100% !important; gap: 8px !important; }
  .hero-trust span { min-width: 0 !important; padding: 8px 6px !important; font-size: 8px !important; text-align: center !important; }
  .hero-product { display: block !important; width: 100% !important; min-width: 0 !important; min-height: 240px !important; order: 2 !important; }
  .hero-console { width: 100% !important; max-width: 100% !important; transform: none !important; }
  .hero-console-body { grid-template-columns: 1fr !important; }
  .hero-console-sidebar { display: none !important; }
  .hero-console-main { min-width: 0 !important; padding: 18px !important; }
  .pricing-grid, .features-grid, .subscription-assurance { width: 100% !important; max-width: 100% !important; }
  .pricing-card, .feature-card { width: 100% !important; min-width: 0 !important; }
  .faq-list { width: 100% !important; }
  .faq-question { padding: 18px 0 !important; font-size: 14px !important; line-height: 1.35 !important; }
  .faq-answer { padding-right: 0 !important; font-size: 13px !important; overflow-wrap: anywhere !important; }
}
@media (max-width: 420px) {
  nav { padding-left: 8px !important; padding-right: 8px !important; padding-bottom: 4px !important; }
  .nav-brand-text { font-size: 11px !important; letter-spacing: 1.5px !important; }
  .nav-actions .nav-download { padding: 0 8px !important; }
  .nav-links {
    flex-wrap: wrap !important;
    overflow: visible !important;
    height: auto !important;
    row-gap: 0 !important;
    justify-content: space-around !important;
  }
  .nav-links .mobile-nav-break { display: block !important; flex: 0 0 100% !important; width: 100% !important; height: 0 !important; padding: 0 !important; }
  .nav-links > a { padding-left: 7px !important; padding-right: 7px !important; font-size: 9px !important; }
  .nav-links .company-menu,
  .nav-links .ecosystem-trigger { margin-top: 0 !important; }
  .nav-links .company-menu { margin-left: auto !important; }
  .nav-links .ecosystem-trigger { margin-right: auto !important; }
  .nav-links > a,
  .nav-links .company-menu { flex: 0 0 auto !important; }
  .nav-links .company-menu { display: block !important; }
  .nav-links .company-trigger { padding-left: 12px !important; padding-right: 12px !important; }
  .hero { padding-top: 150px !important; }
  .hero h1, .hero-idea-title { font-size: clamp(38px, 11.5vw, 52px) !important; }
  .hero-product { min-height: 220px !important; }
}

/* Keep the hero as one continuous surface in every theme. */
html[data-theme="dark"] .hero::after,
html[data-theme="light"] .hero::after,
html[data-theme="gruvdark"] .hero::after {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  background: transparent !important;
}