body { background: #03050b !important; }

.site-header-root { display: block; position: relative; z-index: 20; }

.site-nav {
  grid-template-columns: 340px minmax(0, 1fr) auto !important;
  min-height: 88px !important;
  padding: 18px 72px !important;
  gap: 20px !important;
  background: rgba(3, 5, 12, 0.96) !important;
}

.site-nav .brand {
  width: 340px !important;
  height: 66px !important;
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  overflow: visible !important;
}

.site-nav .brand-wordmark {
  display: inline-flex !important;
  align-items: center !important;
  color: #eaffff !important;
  font-size: 31px !important;
  font-weight: 950 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-shadow: 0 0 18px rgba(25, 231, 255, 0.42), 0 0 42px rgba(25, 231, 255, 0.18) !important;
}

.site-nav .brand::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 6px !important;
  width: 205px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #63f5ff, rgba(25, 231, 255, 0.2), transparent) !important;
  box-shadow: 0 0 16px rgba(25, 231, 255, 0.4) !important;
}

.site-nav nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.site-nav nav a,
.site-nav nav button {
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(99, 245, 255, 0.22) !important;
  border-radius: 999px !important;
  background: rgba(99, 245, 255, 0.045) !important;
  color: #dffcff !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: 0.02em !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  font: inherit !important;
  box-shadow: 0 0 0 1px rgba(25, 231, 255, 0.04), 0 10px 24px rgba(0, 0, 0, 0.18) !important;
  transition: border-color 180ms ease, background 180ms ease, color 180ms ease, transform 180ms ease !important;
}

.site-nav nav a:hover,
.site-nav nav a:focus-visible,
.site-nav nav button:hover,
.site-nav nav button:focus-visible,
.site-nav nav .is-active,
.site-nav nav [aria-current="page"] {
  border-color: rgba(99, 245, 255, 0.72) !important;
  background: rgba(99, 245, 255, 0.11) !important;
  color: #63f5ff !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}

.site-nav__actions {
  display: flex !important;
  align-items: center !important;
  justify-self: end !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
}

.site-nav__actions:empty {
  display: none !important;
}

.site-nav__actions .site-nav-button {
  min-width: 0 !important;
  min-height: 48px !important;
  padding: 0 24px !important;
  border-radius: 9px !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.site-nav__actions .secondary {
  border-color: #19e7ff !important;
  background: rgba(25, 231, 255, 0.035) !important;
  box-shadow: 0 0 0 1px rgba(25, 231, 255, 0.18), 0 0 24px rgba(25, 231, 255, 0.12) !important;
}

.site-nav__actions .secondary:hover,
.site-nav__actions .secondary:focus-visible {
  background: rgba(25, 231, 255, 0.09) !important;
}

.site-nav__actions .primary {
  box-shadow: 0 12px 28px rgba(25, 231, 255, 0.24) !important;
}

.hero { min-height: 690px !important; padding: 68px 82px 48px !important; grid-template-columns: 520px 1fr !important; overflow: hidden !important; }
.hero::before, .hero::after { content: none !important; display: none !important; background: none !important; box-shadow: none !important; filter: none !important; }
.hero h1 { font-size: clamp(46px, 4.8vw, 72px) !important; line-height: 1.08 !important; }
.lead { font-size: 20px !important; }
.hero-panel { align-self: end !important; padding: 0 !important; min-height: 140px !important; background: transparent !important; }
.metric-grid { grid-template-columns: repeat(3, minmax(180px, 1fr)) !important; gap: 0 !important; }
.metric-grid div { border: 0 !important; border-left: 1px solid rgba(255,255,255,.1) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.product-page { width: min(100% - 140px, 1500px) !important; min-height: auto !important; padding: 44px 0 28px !important; }
.split-page { grid-template-columns: 1fr !important; }
.product-page > div:first-child { max-width: 760px; }
.feature-grid { grid-template-columns: repeat(3, 1fr) !important; }
.feature-grid article { min-height: 190px; }

/* Public Scan tracker fixes */
#scan .live-ai-screen { grid-template-rows: auto auto auto !important; min-height: 470px !important; gap: 12px !important; }
#scan .tracker-map { min-height: 248px !important; }
#scan .readout-panel, #scan .current-read, #scan [class*="current-read"], #scan [class*="readout"] { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }
#scan .ai-avatar { width: 28px !important; height: 28px !important; font-size: 8px !important; box-shadow: 0 0 16px rgba(99,245,255,.68), 0 0 34px rgba(25,231,255,.24) !important; z-index: 8 !important; animation: aiMove 10s ease-in-out infinite !important; }
#scan .ai-avatar::after { content: "AI-ACME 482917635104" !important; left: 34px !important; top: -1px !important; min-width: 126px !important; padding: 5px 7px !important; font-size: 9px !important; }
#scan .ai-avatar::before { content: ""; position: absolute !important; left: 34px !important; top: 25px !important; min-width: 164px !important; min-height: 28px !important; padding: 7px 9px !important; border: 1px solid rgba(99,245,255,.32) !important; border-radius: 12px !important; color: #dffcff !important; background: rgba(3,9,18,.92) !important; font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size: 9px !important; line-height: 1.25 !important; letter-spacing: .02em !important; opacity: 0; transform: translateY(5px); white-space: pre-line !important; animation: aiFilePop 10s steps(1, end) infinite !important; box-shadow: 0 0 24px rgba(25,231,255,.18) !important; }
#scan .ai-path::after { content: "" !important; position: absolute !important; width: 82px !important; height: 2px !important; left: -24px !important; top: 18px !important; border-radius: 999px !important; background: linear-gradient(90deg, transparent, rgba(99,245,255,.84), rgba(99,245,255,.18)) !important; box-shadow: 0 0 14px rgba(99,245,255,.42) !important; transform-origin: right center !important; animation: scanTrailFollow 10s ease-in-out infinite !important; }
#scan .file-node { color: transparent !important; min-width: 108px !important; min-height: 44px !important; padding: 9px 10px !important; overflow: visible !important; font-size: 0 !important; background: rgba(3,9,18,.70) !important; }
#scan .file-node small, #scan .file-node span, #scan .file-node b, #scan .file-node em { display: none !important; }
#scan .file-node::before { display: block !important; color: #dffcff !important; font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size: 10px !important; line-height: 1.25 !important; opacity: 0 !important; transform: scale(.96); }
#scan .file-node::after { display: block !important; margin-top: 3px !important; color: #63f5ff !important; font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size: 9px !important; line-height: 1.2 !important; opacity: 0 !important; transform: scale(.96); }
#scan .node-a { left: 7% !important; top: 16% !important; animation: nodePulseA 10s ease-in-out infinite !important; }
#scan .node-b { right: 15% !important; top: 16% !important; animation: nodePulseB 10s ease-in-out infinite !important; }
#scan .node-c { left: 11% !important; bottom: 18% !important; animation: nodePulseC 10s ease-in-out infinite !important; }
#scan .node-d { right: 12% !important; bottom: 18% !important; animation: nodePulseD 10s ease-in-out infinite !important; }
#scan .node-a::before { content: "/vault/contracts/acme.pdf" !important; animation: scanNodeRevealA 10s steps(1, end) infinite !important; }
#scan .node-a::after { content: "reading file" !important; animation: scanNodeRevealA 10s steps(1, end) infinite !important; }
#scan .node-b::before { content: "/receipts/deploy-014.rcpt" !important; animation: scanNodeRevealB 10s steps(1, end) infinite !important; }
#scan .node-b::after { content: "validating receipt" !important; animation: scanNodeRevealB 10s steps(1, end) infinite !important; }
#scan .node-c::before { content: "/memory/customer-notes.json" !important; animation: scanNodeRevealC 10s steps(1, end) infinite !important; }
#scan .node-c::after { content: "memory opened" !important; animation: scanNodeRevealC 10s steps(1, end) infinite !important; }
#scan .node-d::before { content: "/runtime/worker-events.log" !important; animation: scanNodeRevealD 10s steps(1, end) infinite !important; }
#scan .node-d::after { content: "checking runtime" !important; animation: scanNodeRevealD 10s steps(1, end) infinite !important; }
@keyframes aiMove { 0%,8%,100%{left:8%;top:18%;} 25%,33%{left:69%;top:18%;} 50%,58%{left:72%;top:66%;} 75%,83%{left:12%;top:66%;} }
@keyframes scanTrailFollow { 0%,8%,100%{left:-24px;top:18px;transform:rotate(8deg);} 25%,33%{left:50%;top:18px;transform:rotate(0deg);} 50%,58%{left:58%;top:62%;transform:rotate(70deg);} 75%,83%{left:-10px;top:66%;transform:rotate(180deg);} }
@keyframes nodePulseA { 0%,8%,100%{border-color:rgba(99,245,255,.75); box-shadow:0 0 28px rgba(25,231,255,.26);} 9%,99%{border-color:rgba(99,245,255,.18); box-shadow:0 14px 34px rgba(0,0,0,.28);} }
@keyframes nodePulseB { 0%,24%,34%,100%{border-color:rgba(99,245,255,.18); box-shadow:0 14px 34px rgba(0,0,0,.28);} 25%,33%{border-color:rgba(99,245,255,.75); box-shadow:0 0 28px rgba(25,231,255,.26);} }
@keyframes nodePulseD { 0%,49%,59%,100%{border-color:rgba(99,245,255,.18); box-shadow:0 14px 34px rgba(0,0,0,.28);} 50%,58%{border-color:rgba(99,245,255,.75); box-shadow:0 0 28px rgba(25,231,255,.26);} }
@keyframes nodePulseC { 0%,74%,84%,100%{border-color:rgba(99,245,255,.18); box-shadow:0 14px 34px rgba(0,0,0,.28);} 75%,83%{border-color:rgba(99,245,255,.75); box-shadow:0 0 28px rgba(25,231,255,.26);} }
@keyframes scanNodeRevealA { 0%,8%,100%{opacity:1; transform:scale(1);} 9%,99%{opacity:0; transform:scale(.96);} }
@keyframes scanNodeRevealB { 0%,24%,34%,100%{opacity:0; transform:scale(.96);} 25%,33%{opacity:1; transform:scale(1);} }
@keyframes scanNodeRevealD { 0%,49%,59%,100%{opacity:0; transform:scale(.96);} 50%,58%{opacity:1; transform:scale(1);} }
@keyframes scanNodeRevealC { 0%,74%,84%,100%{opacity:0; transform:scale(.96);} 75%,83%{opacity:1; transform:scale(1);} }
@keyframes aiFilePop { 0%,8%,100%{content:"Tracking: /vault/contracts/acme.pdf\A reading file"; opacity:1; transform:translateY(0);} 9%,24%,34%,49%,59%,74%,84%,99%{content:""; opacity:0; transform:translateY(5px);} 25%,33%{content:"Tracking: /receipts/deploy-014.rcpt\A validating receipt"; opacity:1; transform:translateY(0);} 50%,58%{content:"Tracking: /runtime/worker-events.log\A checking runtime"; opacity:1; transform:translateY(0);} 75%,83%{content:"Tracking: /memory/customer-notes.json\A memory opened"; opacity:1; transform:translateY(0);} }

/* Bottom pricing section */
#pricing {
  width: min(100% - 72px, 1500px) !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: start !important;
  gap: 34px !important;
  padding-top: 72px !important;
  padding-bottom: 96px !important;
  overflow: visible !important;
}
#pricing .section-copy { max-width: 860px !important; }
#pricing .section-copy .eyebrow { font-size: 13px !important; }
#pricing .section-copy .eyebrow::before,
#pricing .section-copy h2::before,
#pricing .section-copy p::before,
#pricing .actions .primary::before,
#pricing .pricing-grid::before,
#pricing .pricing-grid::after,
#pricing .pricing-card::before,
#pricing .pricing-card::after { content: none !important; display: none !important; }
#pricing .section-copy h2 { max-width: 820px !important; font-size: clamp(40px, 4.7vw, 62px) !important; line-height: 1.04 !important; letter-spacing: -0.055em !important; }
#pricing .section-copy p { max-width: 900px !important; color: var(--muted) !important; font-size: 19px !important; line-height: 1.55 !important; }
#pricing .actions .primary { font-size: 15px !important; }
#pricing .pricing-grid {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
}
#pricing .pricing-card {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 20px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(99,245,255,.18) !important;
  background: rgba(9,15,30,.78) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.28) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  overflow: visible !important;
}
#pricing .pricing-card.featured { border-color: rgba(99,245,255,.48) !important; box-shadow: 0 0 34px rgba(25,231,255,.18), 0 18px 50px rgba(0,0,0,.30) !important; }
#pricing .pricing-card span,
#pricing .pricing-card h3,
#pricing .pricing-card strong,
#pricing .pricing-card p,
#pricing .pricing-card ul { display: block !important; min-width: 0 !important; overflow-wrap: anywhere !important; }
#pricing .pricing-card span { color: #63f5ff !important; font-size: 11px !important; font-weight: 950 !important; letter-spacing: .1em !important; text-transform: uppercase !important; }
#pricing .pricing-card h3 { margin: 0 !important; color: #eaffff !important; font-size: clamp(18px, 1.35vw, 21px) !important; line-height: 1.22 !important; }
#pricing .pricing-card strong { color: #fff !important; font-size: clamp(24px, 2vw, 30px) !important; line-height: 1.1 !important; }
#pricing .pricing-card strong small { color: var(--muted) !important; font-size: 11px !important; font-weight: 800 !important; }
#pricing .pricing-card p { margin: 0 !important; color: var(--muted) !important; font-size: 13px !important; line-height: 1.48 !important; }
#pricing .pricing-card ul { margin: 0 !important; padding: 0 !important; list-style: none !important; display: grid !important; align-content: start !important; gap: 8px !important; }
#pricing .pricing-card li { color: #dffcff !important; font-size: 12px !important; line-height: 1.34 !important; overflow-wrap: anywhere !important; }
#pricing .pricing-card li::before { content: "✓" !important; color: #63f5ff !important; margin-right: 7px !important; }

@media (max-width: 1180px) {
  .site-nav { grid-template-columns: 1fr !important; gap: 14px !important; }
  .site-nav nav { justify-content: flex-start !important; }
  .site-nav__actions { justify-self: start !important; }
  #pricing .pricing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 980px) {
  .site-nav { grid-template-columns: 1fr !important; padding: 18px 24px !important; }
  .site-nav .brand { width: 300px !important; height: 58px !important; }
  .site-nav .brand-wordmark { font-size: 25px !important; }
  .site-nav .brand::after { width: 170px !important; }
  .hero { grid-template-columns: 1fr !important; padding: 44px 24px !important; }
  .product-page { width: min(100% - 36px, 1500px); padding: 42px 0; }
  .metric-grid { grid-template-columns: 1fr; }
  .feature-grid { grid-template-columns: 1fr !important; }
  #pricing { width: min(100% - 36px, 1500px) !important; }
  #pricing .pricing-grid { grid-template-columns: 1fr !important; }
  #scan .ai-avatar::after, #scan .ai-avatar::before { display: none !important; }
}

@media (max-width: 620px) {
  .site-nav nav a,
  .site-nav nav button { min-height: 36px !important; padding: 0 11px !important; font-size: 11px !important; }
}