/* Public content uses the same navy, blue, glass and editorial type as the lander. */
body.seo-page,
body.marketing-content-page {
  --vf-content-blue: #64bcff;
  --vf-content-link: #a9d8ff;
  --vf-content-panel: rgba(255, 255, 255, .045);
  background:
    radial-gradient(780px 440px at 84% 0%, rgba(23, 150, 227, .17), transparent 68%),
    linear-gradient(118deg, #08121f, #07101b 52%, #061520);
  color: #f8fafc;
  font-family: "Inter", sans-serif;
}
.seo-page .seo-hero {
  background:
    radial-gradient(780px 440px at 84% 20%, rgba(23, 150, 227, .2), transparent 68%),
    linear-gradient(118deg, #08121f, #07101b 52%, #061520);
  padding-top: 148px;
}
.seo-page .seo-section { background: #08121f; }
.seo-page .seo-band { background: #0b1827; }
.seo-page .seo-final-cta {
  background: radial-gradient(640px 320px at 50% 100%, rgba(23, 150, 227, .18), transparent 75%), #07101b;
}
.seo-page .seo-eyebrow { color: var(--vf-content-blue); }
.seo-page .hinge-editorial { padding-top: 148px; color: #d7e1ed; }
.seo-page .hinge-editorial h1,
.seo-page .hinge-editorial h2 {
  font-family: "Instrument Serif", Georgia, serif;
  font-weight: 400;
  color: #f8fbff;
}
.seo-page .hinge-editorial h1 {
  font-size: clamp(3rem, 5.6vw, 4.8rem);
  line-height: 1.02;
  text-wrap: balance;
}
.seo-page .hinge-editorial h2 { font-size: clamp(2rem, 3.8vw, 2.8rem); line-height: 1.15; }
.seo-page :is(.seo-copy-stack, .seo-info-card p, .seo-check-list, .seo-comparison-table, .seo-faq, .seo-faq-list) a,
.seo-page .hinge-editorial a:not(.seo-primary-cta):not(.seo-secondary-cta):not(.guide-style-card) {
  color: var(--vf-content-link);
  text-decoration-color: rgba(100, 188, 255, .55);
  text-underline-offset: .22em;
}
.seo-page .seo-info-card h3 a:hover { color: var(--vf-content-blue); }
.seo-page a:focus-visible,
.seo-page .guide-style-track:focus-visible { outline: 3px solid #8ccfff; outline-offset: 4px; }
.seo-page .seo-primary-cta {
  background: linear-gradient(180deg, #f7fbff, #dfeeff);
  border: 1px solid rgba(255, 255, 255, .46);
  border-radius: 999px;
  color: #07101a;
  box-shadow: 0 15px 36px rgba(0, 0, 0, .24), 0 0 34px rgba(147, 213, 255, .08);
}
.seo-page .seo-primary-cta:hover { background: #fff; color: #07101a; }
.seo-page .seo-secondary-cta { border-radius: 999px; background: rgba(255, 255, 255, .06); }
.seo-page :is(.seo-info-card, .seo-step, .seo-faq details, .seo-faq-list details) {
  background: var(--vf-content-panel);
  border-color: rgba(255, 255, 255, .14);
  border-radius: 18px;
}
.seo-page .seo-step span {
  color: #a9d8ff;
  background: rgba(47, 159, 255, .12);
  border-color: rgba(100, 188, 255, .3);
}
.seo-page .seo-comparison-table th { background: rgba(47, 159, 255, .12); }
.seo-page .seo-check-list li::before { color: var(--vf-content-blue); }
.seo-page .guide-author-note { border-left-color: var(--vf-content-blue); color: #b9cadc; }
.seo-page .guide-style-track { scrollbar-color: #64bcff #152436; }
.seo-page .guide-figure img { background: #101c2b; }
.seo-page footer { background: #050b13; }

/* Standalone pages keep their content layouts beneath the shared fixed bar. */
.marketing-content-page { padding-top: calc(92px + env(safe-area-inset-top, 0px)); }
.marketing-content-page .filter-shell { top: calc(92px + env(safe-area-inset-top, 0px)); }
.marketing-content-page .skip-link { z-index: 1100; }
.marketing-content-page .privacy-container {
  background: transparent;
  color: #d7e1ed;
  margin-top: 28px;
}
.marketing-content-page .privacy-container :is(h1, h2, h3) { color: #f8fbff; }
.marketing-content-page .privacy-container a { color: #a9d8ff; }
.marketing-content-page .privacy-container .last-updated { color: #a7b8cb; }
@media (max-width: 1050px) {
  .seo-page .seo-hero { padding-top: 116px; }
  .seo-page .hinge-editorial { padding-top: 112px; }
  .marketing-content-page { padding-top: calc(76px + env(safe-area-inset-top, 0px)); }
  .marketing-content-page .filter-shell { top: calc(76px + env(safe-area-inset-top, 0px)); }
}
.marketing-content-page .privacy-container :is(p, li, strong) { color: #d7e1ed; }
.marketing-content-page .privacy-container .back-link { border-color: rgba(255, 255, 255, .14); }
.marketing-content-page .privacy-container .back-link a { color: #a9d8ff; }