/* Blackrack global light/dark theme overrides. Loaded after page-local CSS. */

:root {
  color-scheme: dark light;
}

html[data-theme="dark"] {
  color-scheme: dark;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f8fafc;
  --bg2: #eef3f8;
  --card: #ffffff;
  --surface: #f3f7fb;
  --surface2: #e7eef7;
  --ink: #07111f;
  --text: #07111f;
  --muted: #405266;
  --text-muted: #405266;
  --dim: #68788a;
  --border: #d5dfeb;
  --bhi: #0a5fc4;
  --border-hi: #8ab3e8;
  --accent: #075fc9;
  --accent2: #0a4ea3;
  --accent-hover: #034994;
  --ok: #087f5b;
  --warn: #3556c8;
  --danger: #b4234d;
  --err: #b4234d;
  --shadow: 0 16px 34px rgba(16, 32, 48, .08);
  --shadow-tight: 0 8px 18px rgba(16, 32, 48, .06);
  --blue-wash: #eaf3ff;
}

html[data-theme="light"],
html[data-theme="light"] body {
  background: var(--bg) !important;
  color: var(--ink);
}

html[data-theme="light"] body::after {
  opacity: 0 !important;
}

html[data-theme="light"] a {
  color: inherit;
}

html[data-theme="light"] .shell,
html[data-theme="light"] main,
html[data-theme="light"] .page-shell {
  background: linear-gradient(180deg, #fbfcfe 0%, #f4f7fb 46%, #ffffff 100%) !important;
}

html[data-theme="light"] .shell::before,
html[data-theme="light"] .bg-grid::before {
  background-image:
    linear-gradient(rgba(70, 92, 118, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(70, 92, 118, .055) 1px, transparent 1px) !important;
  mask-image: linear-gradient(180deg, black 0%, rgba(0, 0, 0, .58) 40%, transparent 86%) !important;
  -webkit-mask-image: linear-gradient(180deg, black 0%, rgba(0, 0, 0, .58) 40%, transparent 86%) !important;
}

html[data-theme="light"] .bg-grid::after {
  background: linear-gradient(180deg, rgba(255, 255, 255, .2), var(--bg) 82%) !important;
}

html[data-theme="light"] .nav {
  background: #ffffff !important;
  border-bottom-color: var(--border) !important;
  box-shadow: 0 1px 0 rgba(16, 32, 48, .04);
  backdrop-filter: none !important;
}

html[data-theme="light"] .brand-icon path:last-child {
  fill: var(--accent);
}

html[data-theme="light"] .grad,
html[data-theme="light"] .hero-h1 .grad,
html[data-theme="light"] .page-h1 .grad,
html[data-theme="light"] .section-title .grad,
html[data-theme="light"] .cta-title .grad,
html[data-theme="light"] .cta-h2 .grad {
  background: none !important;
  color: var(--accent) !important;
  -webkit-text-fill-color: var(--accent) !important;
}

html[data-theme="light"] .nav-a,
html[data-theme="light"] .drawer-a,
html[data-theme="light"] .footer-a,
html[data-theme="light"] .lang-btn,
html[data-theme="light"] .cur-select,
html[data-theme="light"] .br-region,
html[data-theme="light"] .br-region button {
  color: var(--muted);
}

html[data-theme="light"] .nav-a:hover,
html[data-theme="light"] .nav-a.active,
html[data-theme="light"] .drawer-a:hover,
html[data-theme="light"] .drawer-a:focus-visible,
html[data-theme="light"] .footer-a:hover,
html[data-theme="light"] .lang-btn:hover,
html[data-theme="light"] .cur-select:hover,
html[data-theme="light"] .br-region button:hover {
  color: var(--ink);
}

html[data-theme="light"] .nav-cta,
html[data-theme="light"] .drawer-cta-a,
html[data-theme="light"] .btn--primary,
html[data-theme="light"] .price-card.featured .price-cta,
html[data-theme="light"] .plan-badge,
html[data-theme="light"] .btn-submit,
html[data-theme="light"] .btn-link--primary,
html[data-theme="light"] .br-consent-btn--primary,
html[data-theme="light"] .cookie-btn,
html[data-theme="light"] .cfb-btn {
  border-color: var(--accent) !important;
  background: var(--accent) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html[data-theme="light"] .nav-cta:hover,
html[data-theme="light"] .drawer-cta-a:hover,
html[data-theme="light"] .drawer-cta-a:focus-visible,
html[data-theme="light"] .btn--primary:hover,
html[data-theme="light"] .price-card.featured .price-cta:hover,
html[data-theme="light"] .btn-submit:hover,
html[data-theme="light"] .btn-link--primary:hover,
html[data-theme="light"] .br-consent-btn--primary:hover,
html[data-theme="light"] .cfb-btn:hover {
  border-color: var(--accent-hover) !important;
  background: var(--accent-hover) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .nav-a::after {
  background: var(--accent) !important;
}

html[data-theme="light"] .nav-burger span {
  background: var(--ink) !important;
}

html[data-theme="light"] .nav-drawer {
  background: #ffffff !important;
  border-top-color: var(--border) !important;
  box-shadow: 0 18px 34px rgba(16, 32, 48, .1);
  backdrop-filter: none !important;
}

html[data-theme="light"] .drawer-a {
  color: var(--ink) !important;
  border-color: transparent !important;
  border-bottom-color: var(--border) !important;
  background: transparent !important;
}

html[data-theme="light"] .drawer-a:hover,
html[data-theme="light"] .drawer-a:focus-visible {
  color: var(--accent) !important;
  border-color: var(--border-hi) !important;
  background: var(--blue-wash) !important;
}

html[data-theme="light"] .drawer-a::after {
  opacity: .52;
}

html[data-theme="light"] .drawer-a:hover::after,
html[data-theme="light"] .drawer-a:focus-visible::after {
  opacity: .9;
}

html[data-theme="light"] .drawer-chip,
html[data-theme="light"] .nav-drawer .drawer-select.cur-select,
html[data-theme="light"] .lang-btn,
html[data-theme="light"] .cur-select,
html[data-theme="light"] .br-region button {
  border-color: var(--border) !important;
  background-color: #ffffff !important;
  color: var(--muted) !important;
}

html[data-theme="light"] .drawer-chip.active,
html[data-theme="light"][lang="en"] .drawer-chip[data-set-lang="en"],
html[data-theme="light"][lang="es"] .drawer-chip[data-set-lang="es"],
html[data-theme="light"] .lang-btn.active,
html[data-theme="light"] .br-region button.active {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
  background: var(--blue-wash) !important;
}

html[data-theme="light"] .nav-drawer .drawer-select.cur-select option,
html[data-theme="light"] select option {
  background: #ffffff;
  color: var(--ink);
}

html[data-theme="light"] .card,
html[data-theme="light"] .footer-card,
html[data-theme="light"] .panel,
html[data-theme="light"] .tile,
html[data-theme="light"] .step,
html[data-theme="light"] .feature,
html[data-theme="light"] .entry-card,
html[data-theme="light"] .product-card,
html[data-theme="light"] .bento-tile,
html[data-theme="light"] .faq-card,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .skill-card,
html[data-theme="light"] .trust-card,
html[data-theme="light"] .trust-item,
html[data-theme="light"] .price-card,
html[data-theme="light"] .pricing-card,
html[data-theme="light"] .plan-card,
html[data-theme="light"] .plan,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .form-panel,
html[data-theme="light"] .doc-card,
html[data-theme="light"] .toc,
html[data-theme="light"] .toc-card,
html[data-theme="light"] .legal-card,
html[data-theme="light"] .case-card,
html[data-theme="light"] .metric,
html[data-theme="light"] .matrix-card,
html[data-theme="light"] .terminal-demo,
html[data-theme="light"] .arch,
html[data-theme="light"] .hstep,
html[data-theme="light"] .comp-item,
html[data-theme="light"] .intent-copy,
html[data-theme="light"] .contact-funnel-banner,
html[data-theme="light"] .sla-strip,
html[data-theme="light"] .guarantee,
html[data-theme="light"] .guarantee-box,
html[data-theme="light"] .trust-strip,
html[data-theme="light"] .br-consent,
html[data-theme="light"] .br-toast {
  background: var(--card) !important;
  border-color: var(--border) !important;
  box-shadow: var(--shadow);
  backdrop-filter: none !important;
}

html[data-theme="light"] .entry-card::before,
html[data-theme="light"] .product-card::before,
html[data-theme="light"] .bento-tile::before,
html[data-theme="light"] .price-card::before,
html[data-theme="light"] .plan::before,
html[data-theme="light"] .case-card::before,
html[data-theme="light"] .panel::before,
html[data-theme="light"] .form-panel::before,
html[data-theme="light"] .cta-card::before,
html[data-theme="light"] .guarantee::before {
  background: linear-gradient(180deg, rgba(7, 95, 201, .035), transparent 42%) !important;
}

html[data-theme="light"] .entry-card:hover,
html[data-theme="light"] .product-card:hover,
html[data-theme="light"] .bento-tile:hover,
html[data-theme="light"] .price-card:hover,
html[data-theme="light"] .plan:hover,
html[data-theme="light"] .case-card:hover,
html[data-theme="light"] .panel:hover,
html[data-theme="light"] .faq-card:hover,
html[data-theme="light"] .faq-item:hover,
html[data-theme="light"] .intent-card:hover {
  border-color: var(--border-hi) !important;
  box-shadow: var(--shadow-tight) !important;
}

html[data-theme="light"] .band,
html[data-theme="light"] .alt-section,
html[data-theme="light"] .bento-section.band {
  background: var(--surface2) !important;
  border-top-color: var(--border) !important;
  border-bottom-color: var(--border) !important;
}

html[data-theme="light"] .hero,
html[data-theme="light"] .page-header,
html[data-theme="light"] .page {
  color: var(--ink);
}

html[data-theme="light"] .hero-lead,
html[data-theme="light"] .page-lead,
html[data-theme="light"] .section-lead,
html[data-theme="light"] .cta-lead,
html[data-theme="light"] .panel-body,
html[data-theme="light"] .entry-desc,
html[data-theme="light"] .product-desc,
html[data-theme="light"] .bento-desc,
html[data-theme="light"] .case-sub,
html[data-theme="light"] .case-item,
html[data-theme="light"] .price-desc,
html[data-theme="light"] .plan-tagline,
html[data-theme="light"] .faq-a,
html[data-theme="light"] .trust-body,
html[data-theme="light"] .guarantee-body,
html[data-theme="light"] .success-body,
html[data-theme="light"] .contact-alt-item,
html[data-theme="light"] .cookie-text,
html[data-theme="light"] .br-consent-text {
  color: var(--muted) !important;
}

html[data-theme="light"] .kicker,
html[data-theme="light"] .entry-label,
html[data-theme="light"] .product-label,
html[data-theme="light"] .bento-label,
html[data-theme="light"] .case-tag,
html[data-theme="light"] .panel-title,
html[data-theme="light"] .plan-label,
html[data-theme="light"] .sla-val,
html[data-theme="light"] .res-region,
html[data-theme="light"] .guarantee-title,
html[data-theme="light"] .field label,
html[data-theme="light"] .price-feature::before,
html[data-theme="light"] .case-item::before,
html[data-theme="light"] .terminal-prompt,
html[data-theme="light"] .terminal-cursor,
html[data-theme="light"] .entry-link,
html[data-theme="light"] .faq-link,
html[data-theme="light"] .referral-line a {
  color: var(--accent) !important;
}

html[data-theme="light"] .kicker::before,
html[data-theme="light"] .page-header .eyebrow::before,
html[data-theme="light"] .status-dot,
html[data-theme="light"] .scarcity-line::before,
html[data-theme="light"] .marquee-pill-dot {
  background: var(--accent) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .btn--ghost,
html[data-theme="light"] .price-cta,
html[data-theme="light"] .plan-cta a,
html[data-theme="light"] .btn-alt,
html[data-theme="light"] .btn-link,
html[data-theme="light"] .ghost,
html[data-theme="light"] .pill,
html[data-theme="light"] .tag,
html[data-theme="light"] .chip,
html[data-theme="light"] .marquee-pill,
html[data-theme="light"] .page-header .eyebrow,
html[data-theme="light"] .billing-pill,
html[data-theme="light"] .billing-pill button.active,
html[data-theme="light"] .intent-card,
html[data-theme="light"] .br-consent-row,
html[data-theme="light"] code,
html[data-theme="light"] pre {
  background: var(--surface) !important;
  border-color: var(--border) !important;
  color: var(--ink);
}

html[data-theme="light"] .price-cta:hover,
html[data-theme="light"] .plan-cta a:hover,
html[data-theme="light"] .btn--ghost:hover,
html[data-theme="light"] .btn-alt:hover,
html[data-theme="light"] .btn-link:hover,
html[data-theme="light"] .br-consent-btn--ghost:hover {
  background: var(--blue-wash) !important;
  border-color: var(--border-hi) !important;
  color: var(--accent) !important;
}

html[data-theme="light"] .price-card.featured,
html[data-theme="light"] .plan--hi {
  background: #f7fbff !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 1px rgba(7, 95, 201, .1), var(--shadow) !important;
}

html[data-theme="light"] .price-badge,
html[data-theme="light"] .plan--hi::after,
html[data-theme="light"] .hstep::before {
  background: var(--accent) !important;
  color: #ffffff !important;
}

html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select {
  background-color: #ffffff !important;
  border-color: var(--border) !important;
  color: var(--ink) !important;
}

html[data-theme="light"] input:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] .field input:focus,
html[data-theme="light"] .field textarea:focus,
html[data-theme="light"] .cur-select:focus-visible {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(7, 95, 201, .12) !important;
  outline-color: var(--accent) !important;
}

html[data-theme="light"] .field input.err,
html[data-theme="light"] .field textarea.err {
  border-color: rgba(180, 35, 77, .62) !important;
}

html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder {
  color: #7a8999;
}

html[data-theme="light"] table,
html[data-theme="light"] th,
html[data-theme="light"] td {
  border-color: var(--border) !important;
}

html[data-theme="light"] th {
  background: var(--surface) !important;
}

html[data-theme="light"] tbody tr,
html[data-theme="light"] .alt-table td,
html[data-theme="light"] .sla-table td {
  border-bottom-color: var(--border) !important;
}

html[data-theme="light"] tbody tr:hover,
html[data-theme="light"] .alt-table tr:hover td,
html[data-theme="light"] .sla-table tr:hover td {
  background: var(--blue-wash) !important;
}

html[data-theme="light"] .col-hi,
html[data-theme="light"] .alt-col,
html[data-theme="light"] .alt-col-h,
html[data-theme="light"] .arch-box,
html[data-theme="light"] .arch-box--hi,
html[data-theme="light"] .intent-card.selected {
  background: var(--blue-wash) !important;
  border-color: var(--border-hi) !important;
}

html[data-theme="light"] .arch-arrow {
  background: var(--border) !important;
}

html[data-theme="light"] .tier-label--advanced,
html[data-theme="light"] .skill-tag--request {
  color: var(--warn) !important;
  border-color: #b7c4f5 !important;
  background: #eef2ff !important;
}

html[data-theme="light"] .marquee-wrap::before {
  background: linear-gradient(90deg, var(--bg), transparent);
}

html[data-theme="light"] .marquee-wrap::after {
  background: linear-gradient(-90deg, var(--bg), transparent);
}

html[data-theme="light"] #__bundler_thumbnail,
html[data-theme="light"] #__bundler_loading {
  background: #f7fbff !important;
  color: var(--muted) !important;
}

html[data-theme="light"] #__bundler_thumbnail rect[fill="#03050a"] {
  fill: #f7fbff;
}

.theme-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid var(--border, rgba(0, 198, 255, .13));
  border-radius: 6px;
  background: rgba(0, 198, 255, .045);
  color: var(--muted, #88a5c2);
  cursor: pointer;
  transition: color .14s, border-color .14s, background .14s, transform .14s;
}

.theme-toggle:hover {
  color: var(--ink, #e8f4ff);
  border-color: var(--bhi, rgba(0, 198, 255, .32));
  transform: translateY(-1px);
}

.theme-toggle:focus-visible {
  outline: 2px solid var(--accent, #00c6ff);
  outline-offset: 2px;
}

.theme-toggle__icon {
  position: relative;
  width: .86rem;
  height: .86rem;
  border-radius: 999px;
  border: 1.5px solid currentColor;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.theme-toggle__icon::before,
.theme-toggle__icon::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  border-radius: inherit;
  transition: opacity .18s ease, transform .18s ease;
}

html[data-theme="dark"] .theme-toggle__icon {
  border-color: transparent;
  box-shadow: inset -.28rem -.12rem 0 .02rem currentColor;
  background: transparent;
}

html[data-theme="light"] .theme-toggle {
  background: rgba(0, 114, 255, .055);
}

html[data-theme="light"] .theme-toggle__icon {
  background: currentColor;
  box-shadow: 0 0 0 .22rem rgba(0, 114, 255, .1);
}

html[data-theme="light"] .theme-toggle__icon::before {
  width: 1.22rem;
  height: 1.22rem;
  border: 1px solid currentColor;
  opacity: .55;
}

.theme-toggle__text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.br-region .theme-toggle {
  width: 2.05rem;
  height: 2.05rem;
}

.pricing-currency {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  margin-top: 0;
  font-family: var(--mono, monospace);
  font-size: .6rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted, #88a5c2);
}

.pricing-currency .cur-select {
  min-height: 1.85rem;
  margin-left: 0;
  border-radius: 999px;
}

.footer-mark {
  font-family: var(--mono, monospace);
  font-size: .62rem;
  letter-spacing: .14em;
  line-height: 1;
  text-transform: uppercase;
  color: var(--accent, #00c6ff);
  white-space: nowrap;
}

.footer-utility {
  padding: .65rem 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 960px) {
  .drawer-tools {
    grid-template-columns: 1fr 2.65rem !important;
    align-items: stretch;
  }

  .theme-toggle--drawer {
    width: 100%;
    height: 2.65rem;
    min-height: 2.65rem;
    border-color: rgba(0, 198, 255, .22);
    background: transparent;
  }

  html[data-theme="light"] .theme-toggle--drawer {
    border-color: rgba(0, 100, 170, .22);
    background: rgba(255, 255, 255, .62);
  }
}

@media (max-width: 430px) {
  .drawer-tools {
    grid-template-columns: 1fr !important;
  }

  .theme-toggle--drawer {
    width: 100%;
  }
}

/* Blackrack system layer: compact, technical controls and surfaces. */
:root {
  --br-radius-sm: 4px;
  --br-radius-md: 6px;
  --br-radius-lg: 8px;
  --br-focus-ring: 0 0 0 2px rgba(0, 198, 255, .42);
  --br-control-border: var(--border, rgba(0, 198, 255, .16));
  --br-control-border-hover: var(--bhi, rgba(0, 198, 255, .38));
  --br-control-bg: rgba(0, 198, 255, .045);
  --br-control-bg-hover: rgba(0, 198, 255, .09);
  --br-control-bg-active: linear-gradient(135deg, rgba(0, 198, 255, .22), rgba(0, 114, 255, .24));
  --br-control-text: var(--muted, #88a5c2);
  --br-control-text-strong: var(--ink, #e8f4ff);
  --br-card-bg: var(--card, rgba(10, 18, 34, .82));
  --br-card-bg-hi: rgba(0, 114, 255, .075);
  --br-card-border: var(--border, rgba(0, 198, 255, .14));
  --br-card-border-hover: var(--bhi, rgba(0, 198, 255, .34));
  --br-card-shadow: 0 18px 54px rgba(0, 0, 0, .28);
  --br-card-shadow-hi: 0 20px 60px rgba(0, 114, 255, .16);
}

html[data-theme="light"] {
  --br-focus-ring: 0 0 0 3px #cfe0f7;
  --br-control-border: var(--border);
  --br-control-border-hover: var(--border-hi);
  --br-control-bg: #ffffff;
  --br-control-bg-hover: var(--blue-wash);
  --br-control-bg-active: var(--blue-wash);
  --br-control-text: var(--muted, #42617d);
  --br-control-text-strong: var(--ink, #081522);
  --br-card-bg: var(--card);
  --br-card-bg-hi: #f7fbff;
  --br-card-border: var(--border);
  --br-card-border-hover: var(--border-hi);
  --br-card-shadow: var(--shadow);
  --br-card-shadow-hi: var(--shadow);
}

html[data-theme="dark"] .brand-icon path:last-child,
html:not([data-theme="light"]) .brand-icon path:last-child {
  fill: var(--accent2, #0072ff);
}

.btn,
.nav-cta,
.drawer-cta-a,
.footer-a,
.lang-btn,
.cur-select,
.br-region button,
.br-consent-btn,
.price-cta,
.plan-cta a,
.cookie-btn {
  border-radius: var(--br-radius-md) !important;
  border: 1px solid var(--br-control-border) !important;
  font-family: var(--mono, monospace);
  letter-spacing: .08em;
  text-decoration: none;
  transition:
    background .16s ease,
    border-color .16s ease,
    color .16s ease,
    box-shadow .16s ease,
    transform .16s ease,
    filter .16s ease !important;
}

.btn,
.nav-cta,
.drawer-cta-a,
.br-consent-btn,
.price-cta,
.plan-cta a,
.cookie-btn {
  min-height: 2.55rem;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}

.footer-a,
.lang-btn,
.cur-select,
.br-region button {
  min-height: 2rem;
  background: var(--br-control-bg) !important;
  color: var(--br-control-text) !important;
}

.btn--ghost,
.footer-a,
.lang-btn,
.cur-select,
.br-region button,
.br-consent-btn--ghost,
.br-consent-btn--text,
.price-cta,
.plan-cta a {
  background: var(--br-control-bg) !important;
  color: var(--br-control-text-strong) !important;
}

.btn--primary,
.br-consent-btn--primary,
.price-card.featured .price-cta,
.plan--hi .plan-cta a {
  border-color: rgba(0, 198, 255, .42) !important;
  background: linear-gradient(135deg, var(--accent, #00c6ff), var(--accent2, #0072ff)) !important;
  color: #021018 !important;
  box-shadow: 0 14px 34px rgba(0, 114, 255, .22) !important;
}

.nav-cta,
.drawer-cta-a {
  border-color: rgba(0, 198, 255, .36) !important;
  background: var(--br-control-bg) !important;
  color: var(--accent, #00c6ff) !important;
  box-shadow: none !important;
}

.lang-btn.active,
.br-region button.active,
html[lang="en"] .drawer-chip[data-set-lang="en"],
html[lang="es"] .drawer-chip[data-set-lang="es"] {
  border-color: var(--accent, #00c6ff) !important;
  background: var(--br-control-bg-active) !important;
  color: var(--br-control-text-strong) !important;
}

.btn:hover,
.nav-cta:hover,
.drawer-cta-a:hover,
.footer-a:hover,
.lang-btn:hover,
.cur-select:hover,
.br-region button:hover,
.br-consent-btn:hover,
.price-cta:hover,
.plan-cta a:hover,
.cookie-btn:hover {
  border-color: var(--br-control-border-hover) !important;
  background: var(--br-control-bg-hover) !important;
  color: var(--br-control-text-strong) !important;
  transform: translateY(-1px);
}

.btn--primary:hover,
.br-consent-btn--primary:hover,
.price-card.featured .price-cta:hover,
.plan--hi .plan-cta a:hover {
  border-color: rgba(0, 198, 255, .62) !important;
  background: linear-gradient(135deg, #23d0ff, var(--accent2, #0072ff)) !important;
  color: #021018 !important;
  filter: none !important;
  box-shadow: 0 16px 38px rgba(0, 114, 255, .28) !important;
}

.btn:focus-visible,
.nav-cta:focus-visible,
.drawer-cta-a:focus-visible,
.footer-a:focus-visible,
.lang-btn:focus-visible,
.cur-select:focus-visible,
.br-region button:focus-visible,
.br-consent-btn:focus-visible,
.price-cta:focus-visible,
.plan-cta a:focus-visible,
.cookie-btn:focus-visible,
.nav-burger:focus-visible,
.drawer-chip:focus-visible {
  outline: none !important;
  box-shadow: var(--br-focus-ring) !important;
}

.kicker,
.page-header .eyebrow,
.plan-label,
.product-label,
.entry-label,
.panel-label,
.guarantee-title,
.price-name,
.sla-label,
.toc-title,
.section-kicker {
  color: var(--accent, #00c6ff) !important;
  letter-spacing: .1em;
}

.kicker::before,
.page-header .eyebrow::before,
.scarcity-line::before {
  background: var(--accent, #00c6ff) !important;
  box-shadow: 0 0 0 4px rgba(0, 198, 255, .12) !important;
  animation: br-kicker-pulse 2.4s ease-in-out infinite !important;
}

.page-header .eyebrow,
.plan-badge,
.price-badge,
.billing-save-badge,
.pill,
.tag,
.chip,
.drawer-chip {
  border-radius: var(--br-radius-md) !important;
}

.plan-badge,
.price-badge,
.billing-save-badge {
  background: linear-gradient(135deg, var(--accent, #00c6ff), var(--accent2, #0072ff)) !important;
  color: #021018 !important;
}

.card,
.footer-card,
.panel,
.tile,
.step,
.feature,
.skill-card,
.trust-card,
.price-card,
.pricing-card,
.plan,
.plan-card,
.entry-card,
.product-card,
.contact-card,
.doc-card,
.toc,
.toc-card,
.legal-card,
.case-card,
.metric,
.matrix-card,
.cta-card,
.faq-item,
.sla-strip,
.guarantee-box,
.arch,
.hstep,
.comp-item,
.hiw-card,
.pt-card,
.br-consent,
.br-toast {
  border-radius: var(--br-radius-lg) !important;
  border-color: var(--br-card-border) !important;
  background: var(--br-card-bg) !important;
  box-shadow: var(--br-card-shadow) !important;
}

.price-card.featured,
.plan--hi,
.cta-card {
  border-color: var(--br-card-border-hover) !important;
  background: var(--br-card-bg-hi) !important;
  box-shadow: var(--br-card-shadow-hi) !important;
}

.card:hover,
.panel:hover,
.tile:hover,
.feature:hover,
.skill-card:hover,
.trust-card:hover,
.price-card:hover,
.pricing-card:hover,
.plan:hover,
.entry-card:hover,
.product-card:hover,
.contact-card:hover,
.doc-card:hover,
.legal-card:hover,
.case-card:hover,
.matrix-card:hover,
.faq-item:hover,
.hstep:hover,
.comp-item:hover,
.hiw-card:hover,
.pt-card:hover {
  border-color: var(--br-card-border-hover) !important;
}

.billing-pill,
.pricing-currency {
  border-radius: var(--br-radius-md) !important;
  border: 1px solid var(--br-control-border) !important;
  background: rgba(0, 0, 0, .18) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .billing-pill,
html[data-theme="light"] .pricing-currency {
  background: rgba(255, 255, 255, .58) !important;
}

.billing-pill button,
.pricing-currency .cur-select {
  border-radius: var(--br-radius-sm) !important;
}

.billing-pill button {
  color: var(--br-control-text) !important;
}

.billing-pill button:hover:not(.active) {
  background: var(--br-control-bg-hover) !important;
  color: var(--br-control-text-strong) !important;
}

.billing-pill button.active {
  background: var(--br-control-bg-active) !important;
  color: var(--br-control-text-strong) !important;
  box-shadow: inset 0 0 0 1px rgba(0, 198, 255, .2) !important;
}

.pricing-currency .cur-select {
  background-color: var(--br-control-bg) !important;
  color: var(--br-control-text-strong) !important;
}

.footer {
  border-top-color: var(--br-card-border) !important;
}

.footer-card {
  align-items: center;
}

.footer-links,
.br-region {
  gap: .45rem;
}

@media (max-width: 960px) {
  .nav-burger,
  .drawer-chip,
  .nav-drawer .drawer-select.cur-select,
  .theme-toggle--drawer {
    border-radius: var(--br-radius-md) !important;
    border-color: var(--br-control-border) !important;
    background: var(--br-control-bg) !important;
  }

  .drawer-chip,
  .nav-drawer .drawer-select.cur-select {
    color: var(--br-control-text) !important;
  }

  .drawer-chip:hover,
  .nav-drawer .drawer-select.cur-select:hover,
  .nav-drawer .drawer-select.cur-select:focus-visible {
    border-color: var(--br-control-border-hover) !important;
    background: var(--br-control-bg-hover) !important;
    color: var(--br-control-text-strong) !important;
  }
}

@media (max-width: 540px) {
  .btn,
  .nav-cta,
  .drawer-cta-a,
  .br-consent-btn,
  .price-cta,
  .plan-cta a,
  .cookie-btn {
    min-height: 2.75rem;
    padding-inline: 1rem;
  }

  .footer-card {
    align-items: center !important;
    text-align: center;
  }

  .footer-links,
  .br-region {
    justify-content: center;
  }

  .footer-a,
  .lang-btn,
  .cur-select,
  .br-region button {
    min-height: 2.25rem;
  }
}

@keyframes br-kicker-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 4px rgba(0, 198, 255, .12);
  }

  50% {
    box-shadow: 0 0 0 7px rgba(0, 198, 255, .045);
  }
}

/* Mobile-first stability pass. This file loads after page-local CSS. */
html[data-theme="light"] .cost-card,
html[data-theme="light"] .trust-strip,
html[data-theme="light"] .plan-ideal,
html[data-theme="light"] .guarantee-box {
  background: var(--card) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] .feat-item,
html[data-theme="light"] .cost-copy,
html[data-theme="light"] .compare-lead,
html[data-theme="light"] .price-disclaimer,
html[data-theme="light"] .price-note,
html[data-theme="light"] .trust-item,
html[data-theme="light"] .billing-note,
html[data-theme="light"] .plan-ideal,
html[data-theme="light"] .sla-label,
html[data-theme="light"] .hero-note,
html[data-theme="light"] .hero-meta,
html[data-theme="light"] .cta-meta {
  color: var(--muted) !important;
}

html[data-theme="light"] .feat-muted {
  opacity: .78 !important;
}

html[data-theme="light"] .callout p {
  color: #31506c !important;
}

html[data-theme="light"] .callout p strong {
  color: #06324d !important;
}

html[data-theme="light"] .callout-ok {
  background: #eefbf6 !important;
  border-color: rgba(0, 143, 106, .22) !important;
  border-left-color: #008f6a !important;
}

html[data-theme="light"] .band,
html[data-theme="light"] section.band,
html[data-theme="light"] .bento-section.band,
html[data-theme="light"] .demo-section.band,
html[data-theme="light"] .compare-section.band {
  background: var(--surface2) !important;
}

@media (max-width: 960px) {
  html,
  body {
    overflow-x: hidden;
  }

  .shell,
  .page-shell,
  main,
  section,
  .wrap,
  .wrap--mid {
    min-width: 0 !important;
  }

  .wrap,
  .wrap--mid {
    width: min(100% - 2rem, 960px) !important;
  }

  .hero,
  .page-header {
    padding-top: 3.25rem !important;
    padding-bottom: 2.5rem !important;
  }

  .section,
  .bento-section,
  .integrations-section,
  .demo-section,
  .hiw-section,
  .cta-section,
  .compare-section,
  .faq-section,
  .vs-section {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  .hero-h1,
  .page-h1 {
    max-width: min(100%, 12.5ch) !important;
    font-size: 2.55rem !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    overflow: visible !important;
    text-wrap: balance;
    word-break: normal;
    overflow-wrap: normal;
  }

  .page-header .page-h1,
  .page-header .page-lead,
  .page-header .eyebrow {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .section-title,
  .compare-title,
  .cta-h2 {
    font-size: 2rem !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    overflow: visible !important;
    text-wrap: balance;
    word-break: normal;
  }

  .hero-h1 .grad,
  .page-h1 .grad,
  .section-title .grad,
  .compare-title .grad,
  .cta-h2 .grad {
    display: inline-block;
    padding-bottom: .08em;
    margin-bottom: -.08em;
    line-height: inherit;
    overflow: visible;
  }

  .hero-lead,
  .page-lead,
  .section-lead,
  .cta-lead {
    max-width: 62ch !important;
    font-size: .98rem !important;
    line-height: 1.68 !important;
  }

  .hero-actions,
  .cta-actions,
  .cta-acts {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .65rem !important;
    align-items: stretch !important;
  }

  .hero-actions .btn,
  .cta-actions .btn,
  .cta-acts .btn,
  .plan-cta a,
  .price-cta {
    width: 100% !important;
  }

  .entry-grid,
  .product-grid,
  .bento-grid,
  .cap-grid,
  .pricing-grid,
  .plans-grid,
  .costs-grid,
  .faq-grid,
  .trust-grid,
  .case-grid,
  .matrix-grid,
  .skills-grid,
  .features-grid {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    max-width: none !important;
  }

  .plan,
  .price-card,
  .entry-card,
  .product-card,
  .bento-tile,
  .faq-item,
  .cost-card,
  .trust-card,
  .panel,
  .tile,
  .skill-card,
  .matrix-card,
  .case-card {
    padding: 1.25rem !important;
  }

  .plan:hover,
  .price-card:hover,
  .entry-card:hover,
  .product-card:hover,
  .bento-tile:hover {
    transform: none !important;
  }

  .plan--hi,
  .plan--hi:hover {
    transform: none !important;
  }

  .plans-grid,
  .pricing-grid {
    margin-inline: auto !important;
  }

  .plan-price,
  .plan-section,
  .plan-tagline,
  .plan-ideal {
    margin-bottom: 1rem !important;
  }

  .price-main {
    font-size: 2.45rem !important;
    letter-spacing: 0 !important;
    line-height: 1.05 !important;
  }

  .plan-section:last-of-type {
    margin-bottom: 1.15rem !important;
  }

  .billing-toggle,
  .pricing-controls {
    width: 100%;
  }

  .pricing-controls {
    align-items: stretch !important;
  }

  .billing-pill,
  .pricing-currency {
    width: 100% !important;
  }

  .billing-pill {
    justify-content: stretch !important;
  }

  .billing-pill button {
    flex: 1 1 0;
    justify-content: center;
    min-width: 0;
    white-space: normal !important;
    line-height: 1.2;
    text-align: center;
  }

  .billing-save-badge {
    white-space: nowrap;
  }

  .pricing-currency {
    display: grid !important;
    grid-template-columns: 1fr minmax(7rem, auto);
    padding: .35rem .35rem .35rem .75rem !important;
    text-align: left;
  }

  .pricing-currency .cur-select {
    width: 100% !important;
  }

  .guarantee-box {
    padding: 1.25rem !important;
    gap: .9rem !important;
  }

  .trust-strip {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .75rem !important;
    padding: 1rem !important;
    text-align: left;
  }

  .sla-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .75rem !important;
    padding: 1.15rem !important;
    margin-bottom: 2.5rem !important;
  }

  .table-wrap {
    margin-inline: -1rem;
    padding-inline: 1rem;
    scrollbar-width: thin;
  }

  .table-wrap table {
    min-width: 42rem;
  }

  .cta-card {
    padding: 2rem 1.25rem !important;
    margin-bottom: 2.5rem !important;
  }

  .footer {
    padding: 1rem 0 !important;
  }

  .footer-card {
    gap: .75rem !important;
    padding: .85rem !important;
  }

  .footer-mark {
    width: 100%;
    text-align: center;
  }

  .footer-links,
  .br-region {
    gap: .35rem !important;
  }

  .footer-a,
  .lang-btn,
  .cur-select,
  .br-region button {
    min-height: 2.15rem !important;
    padding: .32rem .55rem !important;
    font-size: .54rem !important;
    letter-spacing: .06em !important;
  }
}

@media (max-width: 540px) {
  .wrap,
  .wrap--mid {
    width: min(100% - 1.25rem, 540px) !important;
  }

  .hero,
  .page-header {
    padding-top: 2.75rem !important;
    padding-bottom: 2rem !important;
  }

  .section,
  .bento-section,
  .integrations-section,
  .demo-section,
  .hiw-section,
  .cta-section,
  .compare-section,
  .faq-section,
  .vs-section {
    padding-top: 2.4rem !important;
    padding-bottom: 2.4rem !important;
  }

  .hero-h1,
  .page-h1 {
    font-size: 2.15rem !important;
    line-height: 1.1 !important;
    max-width: 100% !important;
  }

  .section-title,
  .compare-title,
  .cta-h2 {
    font-size: 1.75rem !important;
    line-height: 1.14 !important;
  }

  .hero-lead,
  .page-lead,
  .section-lead,
  .cta-lead {
    font-size: .94rem !important;
    line-height: 1.64 !important;
  }

  .plan,
  .price-card,
  .entry-card,
  .product-card,
  .bento-tile,
  .faq-item,
  .cost-card,
  .trust-card,
  .panel,
  .tile,
  .skill-card,
  .matrix-card,
  .case-card {
    padding: 1rem !important;
  }

  .billing-pill {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .2rem !important;
  }

  .billing-pill button {
    min-height: 2.35rem;
  }

  .pricing-currency {
    grid-template-columns: 1fr;
    gap: .35rem !important;
  }

  .scarcity-line {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    line-height: 1.45 !important;
  }

  .guarantee-box {
    display: grid !important;
    grid-template-columns: 1fr;
  }

  .sla-strip {
    grid-template-columns: 1fr !important;
  }

  .footer-card {
    padding: .75rem !important;
  }

  .footer-links {
    width: 100%;
  }

  .footer-a {
    flex: 1 1 auto;
  }
}

@media (max-width: 360px) {
  .hero-h1,
  .page-h1 {
    font-size: 1.95rem !important;
  }

  .section-title,
  .compare-title,
  .cta-h2 {
    font-size: 1.58rem !important;
  }

  .footer-a,
  .lang-btn,
  .cur-select,
  .br-region button {
    font-size: .5rem !important;
    padding-inline: .42rem !important;
  }
}

/* Final light pass: editorial, opaque, solid-blue controls. */
html[data-theme="light"] .btn--primary,
html[data-theme="light"] .br-consent-btn--primary,
html[data-theme="light"] .price-card.featured .price-cta,
html[data-theme="light"] .plan--hi .plan-cta a,
html[data-theme="light"] .nav-cta,
html[data-theme="light"] .drawer-cta-a,
html[data-theme="light"] .btn-submit,
html[data-theme="light"] .btn-link--primary,
html[data-theme="light"] .cookie-btn,
html[data-theme="light"] .cfb-btn {
  border-color: var(--accent) !important;
  background: var(--accent) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-theme="light"] .btn--primary:hover,
html[data-theme="light"] .br-consent-btn--primary:hover,
html[data-theme="light"] .price-card.featured .price-cta:hover,
html[data-theme="light"] .plan--hi .plan-cta a:hover,
html[data-theme="light"] .nav-cta:hover,
html[data-theme="light"] .drawer-cta-a:hover,
html[data-theme="light"] .btn-submit:hover,
html[data-theme="light"] .btn-link--primary:hover,
html[data-theme="light"] .cookie-btn:hover,
html[data-theme="light"] .cfb-btn:hover {
  border-color: var(--accent-hover) !important;
  background: var(--accent-hover) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html[data-theme="light"] .btn--ghost,
html[data-theme="light"] .footer-a,
html[data-theme="light"] .lang-btn,
html[data-theme="light"] .cur-select,
html[data-theme="light"] .br-region button,
html[data-theme="light"] .br-consent-btn--ghost,
html[data-theme="light"] .br-consent-btn--text,
html[data-theme="light"] .price-cta,
html[data-theme="light"] .plan-cta a,
html[data-theme="light"] .billing-pill,
html[data-theme="light"] .pricing-currency,
html[data-theme="light"] .drawer-chip,
html[data-theme="light"] .nav-burger,
html[data-theme="light"] .theme-toggle {
  border-color: var(--border) !important;
  background: #ffffff !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .btn--ghost:hover,
html[data-theme="light"] .footer-a:hover,
html[data-theme="light"] .lang-btn:hover,
html[data-theme="light"] .cur-select:hover,
html[data-theme="light"] .br-region button:hover,
html[data-theme="light"] .br-consent-btn--ghost:hover,
html[data-theme="light"] .br-consent-btn--text:hover,
html[data-theme="light"] .price-cta:hover,
html[data-theme="light"] .plan-cta a:hover,
html[data-theme="light"] .drawer-chip:hover,
html[data-theme="light"] .theme-toggle:hover {
  border-color: var(--border-hi) !important;
  background: var(--blue-wash) !important;
  color: var(--accent) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .lang-btn.active,
html[data-theme="light"] .br-region button.active,
html[data-theme="light"] .billing-pill button.active,
html[data-theme="light"][lang="en"] .drawer-chip[data-set-lang="en"],
html[data-theme="light"][lang="es"] .drawer-chip[data-set-lang="es"] {
  border-color: var(--accent) !important;
  background: var(--blue-wash) !important;
  color: var(--accent) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .kicker::before,
html[data-theme="light"] .page-header .eyebrow::before,
html[data-theme="light"] .scarcity-line::before,
html[data-theme="light"] .status-dot {
  box-shadow: none !important;
  animation: none !important;
}

html[data-theme="light"] .plan-badge,
html[data-theme="light"] .price-badge,
html[data-theme="light"] .billing-save-badge {
  background: var(--accent) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .billing-pill,
html[data-theme="light"] .pricing-currency {
  background: #ffffff !important;
}

html[data-theme="light"] .theme-toggle__icon {
  box-shadow: none !important;
}

/* Trust comparison table: stronger contrast in both light and dark themes. */
.alt-section .alt-scroll {
  --alt-bg: rgba(5, 13, 24, .78);
  --alt-head: rgba(7, 18, 32, .96);
  --alt-line: rgba(85, 178, 255, .16);
  --alt-row: rgba(255, 255, 255, .024);
  --alt-row-hover: rgba(0, 198, 255, .055);
  --alt-first: #eef7ff;
  --alt-muted: #9eb4c9;
  --alt-good: #78f2ad;
  --alt-bad: #ff6f78;
  --alt-warn: #ffc15a;
  --alt-blue-col: rgba(0, 198, 255, .085);
  --alt-blue-col-head: rgba(0, 198, 255, .13);
  border: 1px solid var(--alt-line);
  background:
    linear-gradient(180deg, rgba(0, 198, 255, .055), transparent 16rem),
    var(--alt-bg);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .22);
  margin-top: 2rem;
  overflow-x: auto;
  scrollbar-width: thin;
}

.alt-section .alt-table {
  min-width: 760px;
  margin-top: 0;
  border-collapse: separate;
  border-spacing: 0;
}

.alt-section .alt-table th,
.alt-section .alt-table td {
  border-bottom: 1px solid var(--alt-line) !important;
}

.alt-section .alt-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--alt-head) !important;
  color: var(--alt-muted);
  padding: .92rem 1rem;
}

.alt-section .alt-table th:first-child,
.alt-section .alt-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--alt-bg) !important;
  color: var(--alt-first);
  box-shadow: 1px 0 0 var(--alt-line);
}

.alt-section .alt-table th:first-child {
  z-index: 3;
  background: var(--alt-head) !important;
}

.alt-section .alt-table td {
  background: transparent !important;
  color: var(--alt-muted);
  padding: .78rem 1rem;
  line-height: 1.45;
}

.alt-section .alt-table tbody tr:nth-child(even) td {
  background: var(--alt-row) !important;
}

.alt-section .alt-table tr:hover td {
  background: var(--alt-row-hover) !important;
}

.alt-section .alt-table th.alt-hl,
.alt-section .alt-table .alt-col,
.alt-section .alt-table .alt-col-h {
  background: var(--alt-blue-col) !important;
  border-left: 1px solid rgba(0, 198, 255, .28) !important;
  border-right: 1px solid rgba(0, 198, 255, .28) !important;
}

.alt-section .alt-table th.alt-hl,
.alt-section .alt-table .alt-col-h {
  background: var(--alt-blue-col-head) !important;
  color: var(--accent) !important;
}

.alt-section .alt-table td.alt-yes,
.alt-section .alt-table td.alt-no,
.alt-section .alt-table td.alt-mid {
  font-weight: 650;
}

.alt-section .alt-table td.alt-yes { color: var(--alt-good) !important; }
.alt-section .alt-table td.alt-no { color: var(--alt-bad) !important; }
.alt-section .alt-table td.alt-mid { color: var(--alt-warn) !important; }

html[data-theme="light"] .alt-section .alt-scroll {
  --alt-bg: rgba(255, 255, 255, .9);
  --alt-head: #f7fbff;
  --alt-line: #c7d8ec;
  --alt-row: rgba(7, 95, 201, .035);
  --alt-row-hover: rgba(7, 95, 201, .075);
  --alt-first: #07111f;
  --alt-muted: #364b61;
  --alt-good: #067a52;
  --alt-bad: #b4234d;
  --alt-warn: #946000;
  --alt-blue-col: rgba(7, 95, 201, .075);
  --alt-blue-col-head: rgba(7, 95, 201, .115);
  box-shadow: 0 18px 38px rgba(22, 43, 66, .08);
}