/* EXZA Platform Blue – v146
   Static, fast and visually aligned with the DiagnostiX public platform page. */
:root {
  --exza-bg: #03050b;
  --exza-section: #060912;
  --exza-surface: #0b101c;
  --exza-surface-2: #101725;
  --exza-surface-3: #141d2d;
  --exza-text: #f5f8fc;
  --exza-muted: #9aa9bb;
  --exza-soft: #718198;
  --exza-accent: #2f8cff;
  --exza-accent-hover: #4a9cff;
  --exza-accent-soft: rgba(47, 140, 255, .14);
  --exza-success: #2f8cff;
  --exza-danger: #2f8cff;
  --exza-radius-sm: 14px;
  --exza-radius: 22px;
  --exza-radius-lg: 30px;
  --exza-max: 1220px;

  --bg: var(--exza-bg);
  --bg-2: var(--exza-section);
  --bg-3: var(--exza-surface);
  --card: var(--exza-surface);
  --card-strong: var(--exza-surface-2);
  --panel: var(--exza-surface);
  --panel-2: var(--exza-surface-2);
  --panel-3: var(--exza-surface-3);
  --line: transparent;
  --line-strong: transparent;
  --border: transparent;
  --stroke: transparent;
  --text: var(--exza-text);
  --muted: var(--exza-muted);
  --soft: var(--exza-soft);
  --cyan: var(--exza-accent);
  --blue: var(--exza-accent);
  --violet: var(--exza-accent);
  --pink: var(--exza-accent);
  --gold: var(--exza-accent);
  --yellow: var(--exza-accent);
  --green: var(--exza-success);
  --shadow: none;
  --max: var(--exza-max);
  --exza-link: var(--exza-accent);
  --exza-link-hover: var(--exza-accent-hover);
  --exza-link-soft-bg: var(--exza-accent-soft);
  --exza-link-soft-border: transparent;
  --exza-accent-gold: var(--exza-accent);
  --exza-accent-blue: var(--exza-accent);
  --exza-accent-green: var(--exza-accent);
  --exza-accent-orange: var(--exza-accent);
  --exza-accent-red: var(--exza-accent);
}

html {
  color-scheme: dark;
  scroll-behavior: auto !important;
  background: var(--exza-bg) !important;
}

*, *::before, *::after {
  box-sizing: border-box;
  animation:none;
  transition:none;
  scroll-behavior: auto !important;
}

body {
  min-height: 100vh;
  margin: 0;
  color: var(--exza-text) !important;
  background: var(--exza-bg) !important;
  background-image: none !important;
  background-attachment: scroll !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body::before,
body::after,
.hero::before,
.hero::after,
.section::before,
.section::after,
.hero-orb,
.visual-glow,
.community-phone::before,
.glass-card::before,
.glass-card::after,
.hero-demo-card::before,
.hero-demo-card::after,
.adapter-support-card::before,
.adapter-support-card::after,
.compat-panel::before,
.compat-panel::after,
.cta-panel::before,
.cta-panel::after,
.legal-card::before,
.legal-card::after,
.story-phone::before,
.story-phone::after,
.community-phone-shell::before,
.community-phone-shell::after,
.stat::before,
.stat::after,
.filters::before,
.filters::after,
.results-wrap::before,
.results-wrap::after,
.info-wrap::before,
.info-wrap::after,
.faq-item::before,
.faq-item::after,
.column::before,
.column::after,
.rule-card::before,
.rule-card::after,
.notice::before,
.notice::after,
.contact::before,
.contact::after,
.footer-card::before,
.footer-card::after,
.table-wrap::before,
.table-wrap::after {
  display: none !important;
  content: none !important;
}

img {
  max-width: 100%;
}

.container {
  width: min(var(--exza-max), calc(100% - 48px)) !important;
  margin-inline: auto !important;
}

.section {
  padding: 92px 0 !important;
  background: var(--exza-bg) !important;
}

.section:nth-of-type(even),
.community-showcase,
.legal-shell {
  background: var(--exza-section) !important;
}

/* Header – same calm platform structure, without blur or scroll effects. */
.nav-wrap {
  position: relative !important;
  top: 0 !important;
  z-index: 80 !important;
  background: #03050b !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.nav {
  min-height: 76px !important;
  padding: 8px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 28px !important;
}

.nav .brand {
  width: auto !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  margin-right: auto !important;
  text-decoration: none !important;
}

.brand-mark {
  width: 214px !important;
  height: 72px !important;
  min-width: 214px !important;
  flex: 0 0 214px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("assets/exza-logo-header.webp") center / contain no-repeat !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.brand-mark::before,
.brand-mark::after,
.nav .brand > span:not(.brand-mark) {
  display: none !important;
}

.nav-links {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
}

.nav-links a,
.legal-links a {
  padding: 8px 0 !important;
  color: #b5c0ce !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  text-decoration: none !important;
  opacity: 1 !important;
}

.nav-links a:hover,
.nav-links a.active,
.legal-links a:hover,
.legal-links a.active {
  color: #fff !important;
  background: transparent !important;
  border: 0 !important;
  transform: none !important;
}

.language-switch,
.lang-switch,
.langbar {
  min-height: 42px !important;
  padding: 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  background: var(--exza-surface) !important;
  border: 0 !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

.language-switch__divider {
  display: none !important;
}

.language-switch__btn,
.lang-switch button,
.langbar button {
  min-width: 40px !important;
  height: 34px !important;
  padding: 0 10px !important;
  display: inline-grid !important;
  place-items: center !important;
  color: var(--exza-muted) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  line-height: 1 !important;
}

.language-switch__btn.is-active,
.language-switch__btn[aria-pressed="true"],
.lang-switch button.active,
.langbar button.active {
  color: #fff !important;
  background: var(--exza-accent) !important;
}

/* Typography */
.hero {
  padding: 82px 0 64px !important;
  overflow: visible !important;
  background: var(--exza-bg) !important;
}

.hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, .92fr) minmax(500px, 1.08fr) !important;
  gap: 64px !important;
  align-items: center !important;
}

.hero h1,
h1,
.section-title,
.legal-hero .section-title {
  color: var(--exza-text) !important;
  text-wrap: balance;
}

.hero h1 {
  max-width: 760px !important;
  margin: 20px 0 22px !important;
  font-size: clamp(48px, 5.4vw, 76px) !important;
  line-height: 1.01 !important;
  letter-spacing: -.052em !important;
}

.section-title {
  margin-top: 14px !important;
  font-size: clamp(34px, 4vw, 52px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.042em !important;
}

.hero .lead,
.lead,
.section-copy,
.legal-content,
.footer-copy,
.cta-text,
.faq-a,
.muted,
.copy,
.sub,
.note {
  color: var(--exza-muted) !important;
}

.hero .lead {
  max-width: 720px !important;
  margin: 0 !important;
  font-size: 19px !important;
  line-height: 1.7 !important;
}

.eyebrow,
.hero-demo-eyebrow,
.browser-preview__eyebrow {
  color: #5ba7ff !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.pill,
.badge,
.tag,
.footer-badge,
.hero-demo-badge,
.adapter-support-badge,
.screen-badge,
.count-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #c7d4e3 !important;
  background: var(--exza-surface) !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.dot,
.community-title i,
.count-badge .dot {
  background: var(--exza-accent) !important;
  box-shadow: none !important;
}

/* Buttons and links */
.btn,
button,
.cookie-btn {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 14px !important;
  box-shadow: none !important;
  transform: none !important;
}

.btn-primary,
button.primary,
.cookie-btn--primary {
  color: #fff !important;
  background: var(--exza-accent) !important;
  border: 0 !important;
}

.btn-primary:hover,
button.primary:hover,
.cookie-btn--primary:hover {
  color: #fff !important;
  background: var(--exza-accent-hover) !important;
}

.btn-secondary,
button:not(.primary),
.cookie-btn:not(.cookie-btn--primary) {
  color: #eef4fb !important;
  background: #111827 !important;
  border: 0 !important;
}

.btn-secondary:hover,
button:not(.primary):hover,
.cookie-btn:not(.cookie-btn--primary):hover {
  background: #172236 !important;
}

main a:not(.btn):not(.brand),
footer a:not(.btn):not(.brand),
.legal-content a,
.support-link,
.hero-inline-links a,
.footer-links a {
  color: #72b8ff !important;
  text-decoration-color: rgba(114, 184, 255, .55) !important;
}

main a:not(.btn):not(.brand):hover,
footer a:not(.btn):not(.brand):hover,
.legal-content a:hover,
.support-link:hover,
.hero-inline-links a:hover,
.footer-links a:hover {
  color: #9ccfff !important;
}

/* Unified cards – no outer lines, no hover outlines, no colored strips. */
.hero-demo-card,
.adapter-support-card,
.glass-card,
.stat,
.story-phone,
.story-step,
.step-card,
.compat-panel,
.compat-item,
.support-box,
.cta-panel,
.legal-card,
.footer-card,
.faq-item,
.community-feature-card,
.community-phone-shell,
.community-chat-preview,
.community-problem-card,
.adapter-support-box,
.adapter-example-card,
.coding-box,
.ui-card,
.meter,
.spark-wrap,
.cookie-banner,
.floating-card,
.phone-shell,
.table-wrap,
.results-wrap,
.filters,
.info-wrap,
.column,
.contact,
.list div,
.mini-card,
.support-chip,
.product-card,
.feature-card,
.card,
.panel,
.box,
.notice,
.rule-card,
.note,
.highlight,
.toc,
.kv {
  background: var(--exza-surface) !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.glass-card:hover,
.stat:hover,
.step-card:hover,
.story-step:hover,
.compat-panel:hover,
.hero-demo-card:hover,
.adapter-support-card:hover,
.community-feature-card:hover,
.community-phone-shell:hover,
.community-chat-preview:hover,
.coding-box:hover,
.faq-item:hover,
.adapter-support-box:hover,
.adapter-example-card:hover,
.compat-item:hover,
.rule-card:hover,
.card:hover {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Perfectly centered icon/number tiles. */
.feature-icon,
.step-bubble,
.story-step-index,
.community-feature-card > span:first-child,
.community-avatar,
.community-mini-avatar,
.screen-icon,
.browser-step__number,
.browser-preview__logo-mark,
.k,
.list div::before {
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  padding: 0 !important;
  margin-inline: 0 !important;
  color: #fff !important;
  background: #14243a !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

.feature-icon,
.step-bubble,
.story-step-index,
.community-feature-card > span:first-child,
.screen-icon,
.browser-step__number {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  border-radius: 15px !important;
}

.browser-step__number,
.story-step-index,
.step-bubble,
.k {
  font-variant-numeric: tabular-nums;
}

/* Hero browser start panel */
.hero-cta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 32px !important;
}

.hero-demo-card.browser-start-panel {
  margin-top: 28px !important;
  padding: 24px !important;
  border-radius: 24px !important;
  background: var(--exza-surface) !important;
}

.browser-start-panel__head,
.browser-start-panel__compat {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 22px !important;
}

.browser-start-panel__head h2 {
  margin: 7px 0 0 !important;
  font-size: 25px !important;
  letter-spacing: -.025em !important;
}

.browser-start-panel__steps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 20px !important;
}

.browser-step {
  min-height: 170px !important;
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  background: var(--exza-surface-2) !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

.browser-step strong {
  display: block !important;
  margin-top: 18px !important;
  color: var(--exza-text) !important;
  font-size: 15px !important;
}

.browser-step > span:last-child {
  display: block !important;
  margin-top: 7px !important;
  color: var(--exza-muted) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

.browser-start-panel__compat {
  margin-top: 10px !important;
  padding: 16px 18px !important;
  background: var(--exza-surface-2) !important;
  border: 0 !important;
  border-radius: 16px !important;
}

.browser-compat-copy {
  color: var(--exza-muted) !important;
  font-size: 13px !important;
}

.browser-compat-copy strong {
  color: var(--exza-text) !important;
}

.browser-compat-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 7px !important;
}

.browser-compat-tag {
  display: inline-grid !important;
  place-items: center !important;
  min-height: 30px !important;
  padding: 0 11px !important;
  color: #a8ddff !important;
  background: #14243a !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.hero-inline-links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  margin-top: 17px !important;
}

/* Static platform preview */
.hero-visual {
  position: relative !important;
  top: auto !important;
  transform: none !important;
}

.browser-preview {
  overflow: hidden !important;
  background: #080d17 !important;
  border: 0 !important;
  border-radius: 30px !important;
  box-shadow: none !important;
}

.browser-preview__chrome {
  min-height: 58px !important;
  padding: 0 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  background: #080d17 !important;
  border: 0 !important;
}

.browser-preview__dots {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.browser-preview__dots i {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #293547 !important;
}

.browser-preview__address {
  flex: 1 !important;
  min-width: 0 !important;
  padding: 9px 13px !important;
  overflow: hidden !important;
  color: #91a2b5 !important;
  background: #101725 !important;
  border: 0 !important;
  border-radius: 11px !important;
  font-size: 10px !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.browser-preview__body {
  min-height: 520px !important;
  display: grid !important;
  grid-template-columns: 126px 1fr !important;
  overflow: hidden !important;
  background: #0d1421 !important;
  border: 0 !important;
  border-radius: 22px !important;
}

.browser-preview__sidebar {
  padding: 20px 12px !important;
  background: #0a101b !important;
  border: 0 !important;
}

.browser-preview__logo {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 18px !important;
}

.browser-preview__logo-mark {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 11px !important;
  background: var(--exza-accent) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

.browser-preview__logo-text strong,
.browser-preview__logo-text span {
  display: block !important;
}

.browser-preview__logo-text strong {
  color: #fff !important;
  font-size: 10px !important;
}

.browser-preview__logo-text span {
  color: #718198 !important;
  font-size: 7px !important;
}

.browser-preview__nav {
  display: grid !important;
  gap: 7px !important;
}

.browser-preview__nav span {
  padding: 10px 11px !important;
  color: #73849a !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 10px !important;
  font-size: 10px !important;
}

.browser-preview__nav span.active {
  color: #fff !important;
  background: #17253a !important;
}

.browser-preview__content {
  padding: 22px !important;
}

.browser-preview__topline {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

.browser-preview__content h3 {
  margin: 5px 0 1px !important;
  color: #fff !important;
  font-size: 23px !important;
}

.browser-preview__live {
  min-height: 28px !important;
  padding: 0 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #72b8ff !important;
  background: #14243a !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 850 !important;
}

.browser-preview__live i {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #72b8ff !important;
  box-shadow: none !important;
}

.browser-preview__summary {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin-top: 20px !important;
}

.browser-summary-card,
.browser-preview__vehicle,
.browser-sensor {
  background: #121b2a !important;
  border: 0 !important;
  box-shadow: none !important;
}

.browser-summary-card {
  padding: 13px !important;
  border-radius: 13px !important;
}

.browser-summary-card span,
.browser-preview__vehicle span,
.browser-sensor__head {
  color: #74869c !important;
  font-size: 10px !important;
}

.browser-summary-card strong,
.browser-summary-card small {
  display: block !important;
}

.browser-summary-card strong {
  margin-top: 4px !important;
  color: #fff !important;
  font-size: 13px !important;
}

.browser-summary-card small {
  margin-top: 4px !important;
  color: #718198 !important;
  font-size: 9px !important;
}

.browser-preview__vehicle {
  margin-top: 10px !important;
  padding: 13px 15px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  border-radius: 13px !important;
}

.browser-preview__vehicle strong {
  display: block !important;
  margin-top: 4px !important;
  color: #fff !important;
  font-size: 13px !important;
}

.browser-preview__vehicle em {
  color: #72b8ff !important;
  font-size: 9px !important;
  font-style: normal !important;
}

.browser-preview__sensors {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin-top: 10px !important;
}

.browser-sensor {
  min-height: 96px !important;
  padding: 13px !important;
  border-radius: 13px !important;
}

.browser-sensor__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

.browser-sensor strong {
  display: block !important;
  margin-top: 10px !important;
  color: #fff !important;
  font-size: 20px !important;
  letter-spacing: -.035em !important;
}

.browser-sensor strong small {
  color: #718198 !important;
  font-size: 9px !important;
  font-weight: 600 !important;
}

.browser-sensor__bar {
  height: 4px !important;
  margin-top: 13px !important;
  overflow: hidden !important;
  background: #243044 !important;
  border: 0 !important;
  border-radius: 99px !important;
}

.browser-sensor__bar i {
  display: block !important;
  width: var(--value, 60%) !important;
  height: 100% !important;
  background: var(--exza-accent) !important;
  border-radius: inherit !important;
  box-shadow: none !important;
}

.browser-preview__actions {
  display: flex !important;
  gap: 8px !important;
  margin-top: 12px !important;
}

.browser-preview__actions span {
  flex: 1 !important;
  min-height: 36px !important;
  padding: 0 10px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: var(--exza-accent) !important;
  border: 0 !important;
  border-radius: 11px !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

.browser-preview__actions span:last-child {
  color: #d8e2ee !important;
  background: #172236 !important;
}

.browser-preview__foot {
  padding: 14px 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  color: #718198 !important;
  background: #080d17 !important;
  border: 0 !important;
  font-size: 10px !important;
}

.browser-preview__foot strong {
  color: #fff !important;
}

/* Homepage sections */
.stats {
  margin-top: 58px !important;
}

.stats-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.stat {
  padding: 24px !important;
  border-radius: 20px !important;
}

.stat strong {
  color: #72b8ff !important;
}

.community-showcase {
  border: 0 !important;
}

.community-feature-card,
.story-step,
.step-card,
.compat-item,
.coding-box,
.adapter-support-box,
.adapter-example-card,
.faq-item,
.rule-card,
.column,
.contact {
  border-radius: 20px !important;
}

.story-step.active {
  background: var(--exza-surface-2) !important;
  border: 0 !important;
  transform: none !important;
}

.phone-shot,
.floating-card,
.parallax-card,
.reveal,
.reveal.visible {
  opacity: 1 !important;
  transform: none !important;
  animation:none;
  transition:none;
}

/* Forms, FAQ, tables and legal pages */
input[type="search"],
input[type="text"],
input[type="email"],
textarea,
select {
  color: var(--exza-text) !important;
  background: var(--exza-surface-2) !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

input:focus,
textarea:focus,
select:focus,
button:focus-visible,
a:focus-visible {
  outline: 2px solid var(--exza-accent) !important;
  outline-offset: 3px !important;
  box-shadow: none !important;
}

thead th {
  color: #e5eef7 !important;
  background: var(--exza-surface-2) !important;
  border: 0 !important;
}

tbody td {
  color: #a8b8c9 !important;
  border-color: rgba(255,255,255,.04) !important;
}

tbody tr:hover {
  background: var(--exza-surface-2) !important;
}

.legal-hero {
  padding-top: 64px !important;
  background: var(--exza-bg) !important;
}

.legal-card {
  border-radius: 26px !important;
}

.column,
.contact {
  background: var(--exza-surface-2) !important;
}

.rule-card .badge,
.legal-content .badge {
  color: #a8ddff !important;
  background: #14243a !important;
  border: 0 !important;
  box-shadow: none !important;
}

.hr,
hr {
  border: 0 !important;
  height: 1px !important;
  background: rgba(255,255,255,.05) !important;
}

/* Cookie UI follows the same blue palette without costly filters/effects. */
.cookie-banner,
.cookie-panel,
.cookie-modal,
.cookie-preferences {
  background: var(--exza-surface) !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.cookie-slider,
.cookie-switch input:checked + .cookie-slider {
  border: 0 !important;
  box-shadow: none !important;
  background: var(--exza-accent) !important;
}

.cookie-slider::before,
.cookie-slider::after {
  box-shadow: none !important;
}

/* Footer */
footer,
.footer {
  color: var(--exza-muted) !important;
  background: var(--exza-bg) !important;
  border: 0 !important;
  box-shadow: none !important;
}

.footer-grid,
.foot-note {
  border-color: rgba(255,255,255,.05) !important;
}

.footer-title {
  color: #eef4fb !important;
}

/* Performance: do not render heavy below-the-fold sections before they are near the viewport. */
@supports (content-visibility: auto) {
  main > .section,
  main > section:not(.hero),
  .legal-shell,
  footer {
    content-visibility: auto;
    contain-intrinsic-size: 1px 780px;
  }
}

@media (max-width: 1080px) {
  .nav-links {
    display: none !important;
  }

  .hero-grid {
    grid-template-columns: 1fr !important;
    gap: 42px !important;
  }

  .hero-visual {
    width: 100% !important;
    max-width: 760px !important;
    margin: 0 !important;
  }

  .browser-preview__body {
    min-height: 500px !important;
  }

  .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .container {
    width: min(100% - 28px, var(--exza-max)) !important;
  }

  .section {
    padding: 62px 0 !important;
  }

  .nav {
    min-height: 68px !important;
    gap: 10px !important;
  }

  .brand-mark {
    width: 166px !important;
    height: 58px !important;
    min-width: 166px !important;
    flex-basis: 166px !important;
  }

  .hero {
    padding: 54px 0 46px !important;
  }

  .hero h1 {
    font-size: 42px !important;
  }

  .hero .lead {
    font-size: 16px !important;
  }

  .browser-start-panel__steps {
    grid-template-columns: 1fr !important;
  }

  .browser-step {
    min-height: auto !important;
  }

  .browser-start-panel__compat {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  .browser-compat-tags {
    justify-content: flex-start !important;
  }

  .browser-preview {
    padding: 11px !important;
    border-radius: 22px !important;
  }

  .browser-preview__body {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
  }

  .browser-preview__sidebar {
    display: none !important;
  }

  .browser-preview__content {
    padding: 16px !important;
  }

  .browser-preview__summary,
  .browser-preview__sensors {
    grid-template-columns: 1fr !important;
  }

  .browser-preview__foot {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

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

@media (max-width: 520px) {
  .container {
    width: calc(100% - 22px) !important;
  }

  .nav {
    padding: 6px 0 !important;
  }

  .brand-mark {
    width: 142px !important;
    height: 52px !important;
    min-width: 142px !important;
    flex-basis: 142px !important;
  }

  .language-switch,
  .lang-switch,
  .langbar {
    min-height: 38px !important;
  }

  .language-switch__btn,
  .lang-switch button,
  .langbar button {
    min-width: 34px !important;
    height: 30px !important;
    padding: 0 8px !important;
  }

  .hero h1 {
    font-size: clamp(38px, 10.8vw, 44px) !important;
    line-height: 1.02 !important;
    letter-spacing: -.045em !important;
  }

  .hero-cta {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .hero-cta .btn,
  .community-actions .btn {
    width: 100% !important;
  }

  .hero-demo-card.browser-start-panel {
    padding: 16px !important;
  }

  .browser-start-panel__head {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  .browser-preview__chrome {
    min-height: 46px !important;
    padding-inline: 6px !important;
  }

  .browser-preview__content h3 {
    font-size: 21px !important;
  }

  .browser-preview__actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .legal-card,
  .footer-card,
  .filters,
  .results-wrap,
  .info-wrap {
    padding: 20px !important;
  }
}

/* v146 final specificity pass: keep every card in the same blue platform system. */
body .stats-grid .stat:nth-child(n),
body .stats .stat:nth-child(n),
body .grid-2 .glass-card:nth-child(n),
body .community-feature-grid .community-feature-card:nth-child(n),
body .timeline .step-card:nth-child(n),
body .story-steps .story-step:nth-child(n),
body .compat-list .compat-item:nth-child(n),
body .faq-list .faq-item:nth-child(n),
body .dual-column .column:nth-child(n),
body .column .rule-card:nth-of-type(n),
body .coding-panel-grid .coding-box:nth-child(n),
body .adapter-example-row .adapter-example-card:nth-child(n),
body .filters,
body .results-wrap,
body .info-wrap {
  --card-accent: var(--exza-accent) !important;
  --accent: var(--exza-accent) !important;
  color: inherit !important;
  background: var(--exza-surface) !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

body .community-feature-grid .community-feature-card:nth-child(n) > span:first-child,
body .story-steps .story-step:nth-child(n) .story-step-index,
body .timeline .step-card:nth-child(n) .step-bubble,
body .coding-panel-grid .coding-box:nth-child(n) .feature-icon,
body .faq-list .faq-item:nth-child(n) .badge,
body .column .rule-card:nth-of-type(n) .badge {
  color: #fff !important;
  background: #14243a !important;
  border: 0 !important;
  box-shadow: none !important;
}

body .stats-grid .stat:nth-child(n) strong,
body .stats .stat:nth-child(n) strong,
body .big-number,
body .count-badge,
body .highlight,
body .ok {
  color: #72b8ff !important;
}

/* The logo and language control always share one horizontal header row. */
.nav {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
}

.brand-mark {
  display: block !important;
  object-fit: contain !important;
  object-position: left center !important;
  background: none !important;
}

.nav > .language-switch[data-language-switch],
.nav .language-switch[data-language-switch] {
  align-self: center !important;
  margin: 0 0 0 auto !important;
}

@media (max-width: 980px) {
  .nav {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  .nav .brand {
    width: auto !important;
    min-width: 0 !important;
  }
  .nav > .language-switch[data-language-switch],
  .nav .language-switch[data-language-switch] {
    align-self: center !important;
    margin-left: auto !important;
  }
}


/* v146 performance guard: no sticky/scroll effects and blue-only accents. */
.nav-wrap {
  position: relative !important;
  top: auto !important;
}
html, body, main, section, [class*="scroll"], [class*="reveal"] {
  scroll-behavior: auto !important;
  scroll-snap-type: none !important;
}
.reveal, .story-step, .story-visual, [data-reveal] {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
.ok, .success, .danger, .warning, .browser-preview__live,
.status-good, .status-warning, .status-danger {
  color: #72b8ff !important;
}
.browser-preview__live i, .status-dot, .ok-dot, .success-dot {
  background: #2f8cff !important;
  box-shadow: none !important;
}


/* Centered step content and icon tiles on every device. */
.browser-step {
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
}
.browser-step__number {
  margin: 0 auto !important;
}
.browser-step strong,
.browser-step > span:last-child {
  width: 100% !important;
  text-align: center !important;
}
.feature-icon,
.step-bubble,
.story-step-index,
.community-feature-card > span:first-child,
.screen-icon,
.browser-step__number {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Final logo sizing: clearly visible without changing the platform-style header. */
.nav {
  min-height: 96px !important;
}
.brand-mark {
  width: 220px !important;
  height: 96px !important;
  min-width: 220px !important;
  flex-basis: 220px !important;
}
@media (max-width: 520px) {
  .nav {
    min-height: 92px !important;
  }
  .brand-mark {
    width: 164px !important;
    height: 84px !important;
    min-width: 164px !important;
    flex-basis: 164px !important;
  }
}