:root,
html[data-theme="light"] {
  --bg: #ffffff;
  --bg2: #ffffff;
  --bg3: #ffffff;
  --surface: #ffffff;
  --surface2: #ffffff;
  --card: #ffffff;
  --cardHover: #ffffff;
  --line: rgba(0, 0, 0, 0.09);
  --lineSoft: rgba(0, 0, 0, 0.06);
  --text: #111111;
  --muted: #555555;
  --soft: #777777;
  --top1: #ffffff;
  --top2: #ffffff;
  --top3: #ffffff;
  --topText: #111827;
  --accent: #111111;
  --accent2: #111111;
  --accentSoft: transparent;
  --doc-shadow: none;
  --shadow: none;
  --max: 860px;
}

html {
  background: #ffffff !important;
}

body {
  background: #ffffff !important;
  color: var(--text) !important;
  font-family: "Plus Jakarta Sans", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: optimizeLegibility !important;
}

a {
  color: inherit !important;
}

.topStrip {
  background: #ffffff !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: none !important;
}

.topStripInner {
  max-width: 1280px !important;
  padding: 18px 24px !important;
  gap: 20px !important;
}

.brand img {
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  width: 36px !important;
  height: 36px !important;
}

.brand span,
.navBtn,
.backBtn,
.miniBtn,
.ctaBtn,
.socialBtn,
.downloadBtn,
.readBtn,
.quickLinks a,
.eyebrow,
.tag,
.chip,
.badge,
.meta,
.articleMeta,
.specKey,
.stepNum,
.copyMsg,
.footerLine,
.statusBadge,
.label,
.summaryLabel,
.summaryValue,
.panelTitle {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
}

.brand span,
.navBtn,
.backBtn,
.miniBtn,
.ctaBtn,
.socialBtn,
.downloadBtn,
.readBtn,
.quickLinks a,
.eyebrow,
.tag,
.chip,
.badge,
.meta,
.articleMeta,
.specKey,
.stepNum,
.copyMsg,
.footerLine,
.statusBadge,
.label,
.summaryLabel,
.summaryValue,
.panelTitle {
  font-family: "Plus Jakarta Sans", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.brand span,
.navBtn,
.backBtn,
.miniBtn,
.ctaBtn,
.socialBtn,
.downloadBtn,
.readBtn {
  color: var(--text) !important;
}

.navRow,
.actionRow,
.ctaActions,
.topActions,
.socialActions,
.quickLinks {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
}

.navBtn,
.backBtn,
.miniBtn,
.ctaBtn,
.socialBtn,
.downloadBtn,
.readBtn,
.btnGhost,
.btnDisabled,
.quickLinks a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 8px 14px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  transform: none !important;
  transition: text-decoration-color 0.15s ease !important;
}

.navBtn:hover,
.backBtn:hover,
.miniBtn:hover,
.ctaBtn:hover,
.socialBtn:hover,
.downloadBtn:hover,
.readBtn:hover,
.btnGhost:hover,
.btnDisabled:hover,
.quickLinks a:hover {
  background: #f5f5f5 !important;
  border-color: var(--lineSoft) !important;
  box-shadow: none !important;
  color: var(--text) !important;
  text-decoration: none !important;
  transform: none !important;
}

.navBtn.activeBtn,
.navBtn.docsBtn,
.ctaBtn.primary,
.ctaBtn.secondary,
.socialBtn.primary,
.backBtn,
.btnGhost,
.btnDisabled {
  background: #111111 !important;
  border: 1px solid #111111 !important;
  color: #ffffff !important;
  box-shadow: none !important;
  cursor: pointer !important;
  filter: none !important;
  user-select: auto !important;
}

.hero {
  background: #ffffff !important;
  border-bottom: 1px solid var(--line) !important;
}

.hero img,
.hero video {
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}

.heroOverlay {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.64)) !important;
}

.heroContent {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  left: auto !important;
  max-width: var(--max) !important;
  padding: 28px 0 0 !important;
}

.heroCard {
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.container {
  max-width: var(--max) !important;
  padding: 56px 24px 80px !important;
}

.eyebrow {
  color: var(--soft) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}

h1,
h2,
h3,
h4 {
  color: var(--text) !important;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

h1 {
  max-width: var(--max) !important;
  font-size: clamp(34px, 7vw, 58px) !important;
  line-height: 1.04 !important;
  font-weight: 900 !important;
  margin-bottom: 14px !important;
}

.lead,
.heroLead,
.entryText,
p,
ul,
ol,
li {
  color: var(--muted) !important;
}

p,
ul,
ol {
  font-size: 15px !important;
  line-height: 1.85 !important;
}

h2 {
  font-size: clamp(24px, 4vw, 32px) !important;
  line-height: 1.14 !important;
  font-weight: 900 !important;
}

h3 {
  font-weight: 850 !important;
}

.quickLinks {
  margin-top: 28px !important;
}

.quickLinks a {
  color: var(--text) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--line) !important;
  text-underline-offset: 4px !important;
}

.heroLead {
  color: var(--muted) !important;
}

.divider {
  display: block !important;
  height: 1px !important;
  margin: 42px 0 !important;
  border: 0 !important;
  background: var(--line) !important;
}

section {
  margin-top: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  scroll-margin-top: 110px !important;
}

main > section + .divider,
main > .divider + section,
main > .divider + .statusCard,
main > .divider + .billingGrid,
main > .divider + .summaryBox,
main > .divider + .resultsBox,
main > .divider + .ctaBox,
main > .divider + .socialBox,
main > .divider + .infoBox,
main > .divider + .downloadBox {
  margin-top: 0 !important;
}

.blogList,
.summaryList,
.steps,
.resultsGrid,
.trustGrid,
.grid,
.platformGrid,
.supportCards,
.specGrid,
.refGrid,
.severityGrid,
.split,
.stats,
.billingGrid,
.fieldGrid {
  display: block !important;
  grid-template-columns: 1fr !important;
  columns: 1 !important;
}

.summaryBox,
.resultsBox,
.ctaBox,
.socialBox,
.infoBox,
.downloadBox,
.statusCard,
.summaryItem,
.resultCard,
.trustCard,
.card,
.step,
.platformCard,
.supportCard,
.specRow,
.refItem,
.sev,
.miniPanel,
.stat,
.blogEntry,
.panel,
.quoteBox,
.noticeBox {
  margin: 0 0 18px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.quoteBox p {
  color: var(--muted) !important;
}

.blogThumb {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 0 18px !important;
  background: transparent !important;
}

.tag,
.chip,
.badge,
.statusBadge,
.offsaleTag,
.stepNum {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 5px 10px !important;
  border: 1px solid var(--lineSoft) !important;
  border-radius: 999px !important;
  background: #fafafa !important;
  color: var(--soft) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
}

.articleMeta,
.meta,
.statusNote,
.panelSub,
.summaryMeta,
.tiny,
.footerLine {
  color: var(--soft) !important;
}

.field,
.fakeInput,
.fakeBox {
  width: 100% !important;
}

.fakeInput,
.fakeBox,
code {
  background: #f7f7f7 !important;
  border: 1px solid var(--lineSoft) !important;
  border-radius: 7px !important;
  padding: 2px 6px !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

.lockedOverlay {
  display: none !important;
}

.footerLine {
  margin-top: 42px !important;
  padding-top: 22px !important;
  border-top: 1px solid var(--lineSoft) !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--soft) !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
}

.rebrand-note,
.registration-note {
  color: inherit !important;
}

.rebrand-note a,
.registration-note a {
  color: var(--text) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.navPanel {
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  background: #ffffff !important;
  border-left: 1px solid var(--line) !important;
  box-shadow: -18px 0 60px rgba(0, 0, 0, 0.08) !important;
}

.navPanel.open {
  transform: translateX(0) !important;
}

.panelLinks {
  padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
}

.panelLink {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 46px !important;
  flex: 0 0 auto !important;
  border-radius: 10px !important;
  color: var(--text) !important;
  background: transparent !important;
}

.panelLink:hover,
.activePanelLink {
  background: #f5f5f5 !important;
  color: var(--text) !important;
  border-color: var(--lineSoft) !important;
}

body.navOpen {
  overflow: hidden !important;
}

@media (max-width: 920px) {
  .topStripInner {
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .navWrap {
    width: 100% !important;
  }

  .container,
  .heroContent {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}

@media (max-width: 700px) {
  .topStripInner,
  .container,
  .heroContent {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .hero img,
  .hero video {
    height: 220px !important;
  }
}
