/* Home page structure modelled on verifyall.ai (25 Oct 2026): centred hero,
   chip strip, full-width visual, alternating white / tinted bands with a
   hairline between them, left-aligned section heads, rounded-xl cards,
   three guide cards, tinted FAQ, centred CTA band, black footer.
   Colors stay AEOTrack's (theme.css); type follows VerifyAll (Sora + Figtree). */
:root { --va-tint: #f7f7fd; --va-line: #e7e8f2; --va-ink: #0f172a; }
body { font-family: var(--font-body); font-size: 16px; color: var(--text); }
h1, h2, h3, h4 { font-family: var(--font-heading); letter-spacing: -0.02em; }

/* Bands */
main > section { border-bottom: 1px solid var(--va-line); }
main > .section, main > .va-section, main > .trust-section { padding: 3rem 0; background: #fff; }
@media (min-width: 1024px) { main > .section, main > .va-section, main > .trust-section { padding: 4rem 0; } }
#how-it-works, #first-check, #worth-it, main > .trust-section { background: var(--va-tint); }
main .section-header { text-align: left; max-width: 46rem; margin: 0 0 2rem; }
main .section-header h2, main > section h2 { font-size: 1.875rem; line-height: 1.2; font-weight: 600; color: var(--va-ink); margin-bottom: 1rem; }
@media (min-width: 1024px) { main .section-header h2, main > section h2 { font-size: 2.25rem; } }
main .section-header p { font-size: 1.0625rem; line-height: 1.6; color: var(--text-muted); }

/* Hero: centred, one column */
.va-hero { padding: 8rem 0 3.5rem; background: #fff; text-align: center; }
@media (min-width: 1024px) { .va-hero { padding: 10rem 0 5rem; } }
.va-hero .hero-v2-grid { display: block; max-width: 56rem; margin: 0 auto; }
.va-hero .hero-v2-copy { max-width: none; margin: 0 auto; }
.va-hero .hero-eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: .75rem; font-weight: 600; color: var(--primary); margin-bottom: 1rem; }
.va-hero h1 { font-size: 28px; line-height: 1.12; font-weight: 600; max-width: 56rem; margin: 0 auto 1.5rem; color: var(--va-ink); }
@media (min-width: 640px) { .va-hero h1 { font-size: 40px; } }
@media (min-width: 1024px) { .va-hero h1 { font-size: 52px; } }
.va-hero .hero-answer { max-width: 42rem; margin: 0 auto 2rem; font-size: 1.0625rem; line-height: 1.65; color: var(--text-muted); }
.va-hero .hero-badge { margin: 0 auto 1.25rem; }
.va-hero .aeo-embed { max-width: 36rem; margin: 0 auto; }
.va-hero .aeo-embed-fine, .va-hero .hero-v2-price { font-size: .8125rem; color: var(--text-muted); }
.va-hero .hero-v2-secondary { justify-content: center; flex-direction: column; align-items: center; gap: .75rem; margin-top: 1.25rem; }
.va-hero .hero-v2-secondary .btn-outline { border-radius: 12px !important; font-weight: 600; font-size: 15px; padding: .75rem 1.5rem; background: #fff; }
.va-hero .aeo-embed-form button { border-radius: 12px; font-weight: 600; font-size: 15px; }

/* Chip strip under the hero */
main > .proof-strip { background: #fff; padding: 0 0 3rem; border-bottom: 1px solid var(--va-line); }
.proof-strip .container { max-width: 52rem; text-align: center; }
.proof-strip .proof-line { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: var(--text-muted); margin-bottom: 1rem; }
.proof-strip .proof-engines { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.25rem; padding: 1rem 1.5rem; border: 1px solid var(--va-line); border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.04); }

/* Visual band */
.va-visual { padding-top: 0 !important; }
.va-visual .hero-v2-result { max-width: 46rem; margin: 0 auto; }

/* Cards: rounded-xl, hairline, primary on hover */
.step-card, .feature-card, .why-card, .worth-card, .scenario, .stat-item, .faq-item, .va-guide, .ex-result, .ans-card {
  border-radius: 12px !important; border: 1px solid var(--va-line) !important; background: #fff; box-shadow: none; }
.step-card:hover, .feature-card:hover, .why-card:hover, .worth-card:hover, .va-guide:hover { border-color: var(--primary) !important; }
.step-card h3, .feature-card h3, .why-card h3, .worth-card h3, .va-guide h3 { font-size: 1.0625rem; font-weight: 600; }
.step-card p, .feature-card p, .why-card p, .worth-card p { font-size: .9375rem; line-height: 1.6; color: var(--text-muted); }

/* Trust grid ("Why AEOTrack" pattern) */
main > .trust-section .trust-title { text-align: center; margin-bottom: 2.5rem; }

/* Guides */
.va-head-row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: 2rem; }
.va-head-row h2 { margin: 0 !important; }
.va-link { color: var(--primary); font-weight: 600; text-decoration: none; font-size: .9375rem; }
.va-guide-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .va-guide-grid { grid-template-columns: repeat(3, 1fr); } }
.va-guide { display: block; padding: 1.5rem; text-decoration: none; color: inherit; }
.va-guide p { font-size: .9375rem; color: var(--text-muted); margin-top: .5rem; line-height: 1.6; }

/* FAQ band: white to tint to white */
main > #faq { background: linear-gradient(to bottom, #fff, var(--va-tint), #fff); }

/* Final CTA band: centred on white, no card chrome */
main > .final-cta { background: #fff; padding: 3rem 0; text-align: center; }
main > .final-cta .final-cta-card { background: transparent; box-shadow: none; border: 0; }
main > .final-cta .final-cta-card h2 { color: var(--va-ink); }
main > .final-cta .final-cta-card p { color: var(--text-muted); }
main > .final-cta .btn-primary { border-radius: 12px !important; }

/* Footer: black, as on verifyall.ai */
.site-footer { background: #000 !important; }

/* Inline home-page styles are more specific; the centred hero needs these. */
.va-hero, .va-hero .hero-v2-copy { text-align: center !important; }
.va-hero { background: #fff !important; }
.va-hero .hero-v2-copy > *, .va-hero h1, .va-hero .hero-answer, .va-hero .aeo-embed, .va-hero .aeo-embed-fine { margin-left: auto !important; margin-right: auto !important; }
.va-hero .hero-badge { display: inline-flex !important; }
.va-hero .aeo-embed-form { justify-content: center; }
.va-hero .hero-v2-price { text-align: center !important; }
.proof-strip .proof-line { max-width: 40rem; margin-left: auto; margin-right: auto; }
.va-hero h1 { font-weight: 600 !important; }

/* ---------- Enterprise polish (25 Oct 2026) ----------
   Restrained: no gradients or glows, no shadows, 1px borders, one radius
   scale (8px cards and buttons, 6px pills), brand color only on CTAs,
   links and small accents, no decorative icons, no hover lift. */
.gradient-hero, .hero, .va-hero, .pricing-hero, .final-cta, .final-cta-card, .trust-section { background-image: none !important; }
.gradient-hero::before, .gradient-hero::after, .hero::before, .hero::after, .final-cta-card::before, .final-cta-card::after { display: none !important; }
main *, .site-header .btn-primary, .site-header .btn-outline { box-shadow: none !important; text-shadow: none !important; }
main [class*="glow"], main .orb, main .blob { display: none !important; }
main h1, main h2, main h3 { background: none !important; -webkit-text-fill-color: currentColor !important; }

main .step-card, main .feature-card, main .why-card, main .worth-card, main .stat-item, main .faq-item,
main .va-guide, main .ex-result, main .ans-card, main .pricing-card, main .note, main .roi, main .scenario {
  border-radius: 8px !important; border: 1px solid var(--va-line) !important; background: #fff !important; transform: none !important; }
main .step-card:hover, main .feature-card:hover, main .why-card:hover, main .worth-card:hover, main .pricing-card:hover { transform: none !important; }
main .pricing-card.highlighted { border-color: var(--primary) !important; }

/* Buttons: one shape */
main .btn-primary, main .btn-outline, main .aeo-embed-form button, main .pricing-cta, .site-header .btn-primary, .site-header .btn-outline {
  border-radius: 8px !important; transform: none !important; transition: background-color .15s, border-color .15s !important; }
@media (prefers-reduced-motion: reduce) {
  main .btn-primary, main .btn-outline, main .aeo-embed-form button, main .pricing-cta, .site-header .btn-primary, .site-header .btn-outline { transition: none !important; }
}
main .aeo-embed-form input { border-radius: 8px !important; }

/* Pills and chips: flat, few */
main .hero-badge, main .integrations-badge, main .chip, main .tag, main .save-badge, main .ex-pill, .proof-strip .proof-engines span {
  border-radius: 6px !important; background: transparent !important; border: 1px solid var(--va-line) !important; color: var(--text-muted) !important; font-weight: 500; }
main .ex-pill.warn { color: #9a3412 !important; border-color: #fed7aa !important; }
.proof-strip .proof-engines { border: 0 !important; padding: 0 !important; background: transparent !important; }
.proof-strip .proof-engines span { border: 0 !important; color: var(--text) !important; font-weight: 600; font-size: .9375rem; }

/* No decorative icons or numbered bubbles */
main .feature-icon, main .step-card .step-icon, main .why-icon { display: none !important; }
main .step-number { width: auto !important; height: auto !important; background: none !important; color: var(--primary) !important; border: 0 !important;
  font-family: var(--font-heading); font-size: .875rem !important; font-weight: 600; margin-bottom: .5rem; justify-content: flex-start !important; }
main .step-number::before { content: "Step "; }

/* Motion off */
main .animate-in, main [class*="animate"] { animation: none !important; opacity: 1 !important; transform: none !important; }

/* Pricing preamble: left-aligned head, plans higher */
main > .pricing-hero { padding: 7rem 0 3rem !important; background: #fff !important; }
.pricing-hero h1 { font-size: 2.25rem !important; font-weight: 600 !important; line-height: 1.15; max-width: 44rem; }
.pricing-hero .lede { font-size: 1.0625rem; color: var(--text-muted); max-width: 40rem; }

/* ---------- Homepage refinements (25 Oct 2026, round 3) ---------- */
/* Hairline dividers only: no heavy section or footer borders */
main > section, main > .proof-strip { border-bottom: 0 !important; border-top: 0 !important; }
main > section + section { box-shadow: inset 0 1px 0 var(--va-line) !important; }
.site-footer, .site-footer * { border-top-color: rgba(255,255,255,.08) !important; }
.site-footer { border-top: 0 !important; }
main > .final-cta { border-bottom: 0 !important; }

/* Engine logo row */
main > .proof-strip { padding: 2.5rem 0 3rem !important; background: #fff !important; }
.proof-strip .proof-line { margin: 0 0 1.25rem; font-size: .8125rem; font-weight: 500; letter-spacing: .02em; color: var(--text-muted); text-align: center; }
.engine-logos { list-style: none; margin: 0 auto; padding: 0; max-width: 880px; display: grid; grid-template-columns: repeat(5, 1fr);
  border: 1px solid var(--va-line); border-radius: 8px; }
.engine-logos li { display: flex; align-items: center; justify-content: center; gap: .5rem; height: 64px; color: #4b5563;
  font-family: var(--font-heading); font-weight: 600; font-size: 1rem; }
.engine-logos li + li { border-left: 1px solid var(--va-line); }
.engine-logos .engine-wordmark { font-size: 1.0625rem; letter-spacing: -.01em; }
@media (max-width: 640px) { .engine-logos { grid-template-columns: repeat(2, 1fr); }
  .engine-logos li { border-left: 0 !important; border-top: 1px solid var(--va-line); } .engine-logos li:nth-child(-n+2) { border-top: 0; }
  .engine-logos li:nth-child(even) { border-left: 1px solid var(--va-line) !important; } }

/* Five things: equal small cards */
#features .features-grid.five { display: grid !important; grid-template-columns: repeat(5, minmax(0,1fr)) !important; gap: 1rem !important; }
@media (max-width: 1100px) { #features .features-grid.five { grid-template-columns: repeat(3, minmax(0,1fr)) !important; } }
@media (max-width: 720px) { #features .features-grid.five { grid-template-columns: 1fr 1fr !important; } }
@media (max-width: 480px) { #features .features-grid.five { grid-template-columns: 1fr !important; } }
#features .feature-card { padding: 1.25rem !important; height: 100%; display: flex; flex-direction: column; text-align: left !important; }
#features .feature-card h3 { font-size: 1rem !important; font-weight: 600; margin: 0 0 .5rem !important; line-height: 1.3; }
#features .feature-card p { font-size: .875rem !important; line-height: 1.55; color: var(--text-muted); margin: 0; }
main { padding-bottom: 0 !important; margin-bottom: 0 !important; }
main > .final-cta, main > .final-cta .container { margin-bottom: 0 !important; }
main > .final-cta .final-cta-card .btn-primary, main > .final-cta .final-cta-card a.btn { background: var(--primary) !important; color: #fff !important; border: 1px solid var(--primary) !important; border-radius: 8px !important; }
main > .va-visual { padding-top: 3rem !important; }
#features .feature-card { background: #fff !important; }
body .site-footer { margin-top: 0 !important; }
body main > .final-cta a.btn-primary { box-shadow: none !important; }

/* ---------- Round 4: one hero product visual (25 Oct 2026) ---------- */
main > .va-hero { padding-bottom: 2.5rem !important; }
main > .va-visual { padding: 0 0 4rem !important; background: #fff !important; box-shadow: none !important; }
main > .va-visual .hero-v2-result { max-width: 1080px !important; margin: 0 auto !important; }
.hv-window { padding: 0 !important; overflow: hidden; text-align: left; border: 1px solid #dcdde8 !important; border-radius: 12px !important; background: #fff !important; }
.hv-bar { display: flex; align-items: center; gap: .75rem; padding: .75rem 1.25rem; border-bottom: 1px solid var(--va-line); background: #fafafc; }
.hv-bar .ans-label { margin: 0 !important; flex: 1; font-size: .75rem; color: var(--text-muted); text-transform: none; letter-spacing: 0; }
.hv-bar .ans-engine { font-family: var(--font-heading); font-weight: 600; font-size: .875rem; }
.hv-grid { display: grid; grid-template-columns: 1.5fr 1fr; }
.hv-answer { padding: 1.5rem 1.75rem; }
.hv-answer .ans-body { margin: .75rem 0 0 !important; background: transparent !important; border: 0 !important; padding: 0 !important; font-size: .9375rem; line-height: 1.6; }
.hv-insight { padding: 1.5rem 1.75rem; border-left: 1px solid var(--va-line); background: #fbfbfe; }
.hv-k { font-size: .75rem; font-weight: 600; color: var(--text-muted); margin: 0 0 .75rem; }
.hv-rivals { margin: 0 0 1.5rem; padding: 0; list-style: none; counter-reset: r; }
.hv-rivals li { counter-increment: r; display: flex; gap: .75rem; padding: .625rem 0; border-bottom: 1px solid var(--va-line); font-family: var(--font-heading); font-weight: 600; font-size: 1rem; color: var(--text); }
.hv-rivals li::before { content: counter(r); color: var(--text-muted); font-weight: 500; width: 1rem; }
.hv-insight .ex-fix { margin: 0 !important; padding: 1rem !important; border: 1px solid var(--primary) !important; border-left-width: 3px !important; border-radius: 8px; background: #fff !important; font-size: .875rem; line-height: 1.5; }
.hv-insight .ex-fix strong { display: block; color: var(--primary); margin-bottom: .25rem; font-size: .8125rem; }
.va-visual .ex-note { text-align: center; font-size: .75rem; color: var(--text-muted); margin-top: .75rem; }
@media (max-width: 800px) { .hv-grid { grid-template-columns: 1fr; } .hv-insight { border-left: 0; border-top: 1px solid var(--va-line); } .hv-bar .ans-label { display: none; } }
#why .why-card { padding: 1.5rem !important; }
/* Understand section: two-column statement */
main > .va-understand { padding: 4.5rem 0 !important; background: #fff !important; }
.va-understand-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; border-top: 1px solid var(--va-line); padding-top: 2.5rem; }
.va-understand-grid h2 { margin: 0; font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 600; line-height: 1.15; letter-spacing: -.02em; color: var(--text); }
.va-understand-grid p { margin: 0; font-size: 1.1875rem; line-height: 1.6; color: var(--text-muted); max-width: 32rem; }
@media (max-width: 800px) { .va-understand-grid { grid-template-columns: 1fr; gap: 1rem; } }
/* Product showcase: one framed app window */
main > .va-showcase { padding: 1rem 0 5rem; background: #fff; }
.va-showcase-head { text-align: center; max-width: 40rem; margin: 0 auto 2rem; }
.va-showcase-head h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 600; margin: 0 0 .5rem; letter-spacing: -.02em; }
.va-showcase-head p { margin: 0; color: var(--text-muted); font-size: 1.0625rem; }
.va-window { max-width: 1200px; margin: 0 auto; border: 1px solid #dcdde8; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 1px 2px rgba(15,18,34,.04), 0 24px 48px -24px rgba(15,18,34,.18) !important; }
.va-window-bar { display: flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-bottom: 1px solid var(--va-line); background: #fafafc; }
.va-window-bar span { width: 10px; height: 10px; border-radius: 50%; background: #e2e3ec; }
.va-window-bar em { margin: 0 auto; font-style: normal; font-size: .75rem; color: var(--text-muted); transform: translateX(-20px); }
.va-window img { display: block; width: 100%; height: auto; }
.va-video { position: relative; aspect-ratio: 16 / 9; background: #0f1222; }
.va-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
/* "Tap for sound" over the explainer while it plays muted (explainer-video.js) */
.va-sound { position: absolute; left: 50%; bottom: 3.5rem; transform: translateX(-50%); display: inline-flex; align-items: center; gap: .5rem; padding: .55rem 1rem; border: 0; border-radius: 999px; background: rgba(15, 18, 34, .85); color: #fff; font-family: inherit; font-size: .875rem; font-weight: 600; line-height: 1; cursor: pointer; box-shadow: 0 4px 16px rgba(0, 0, 0, .25); }
.va-sound[hidden] { display: none; }
.va-sound:hover { background: rgba(15, 18, 34, .97); }
.va-sound:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.va-sound svg { width: 1.125rem; height: 1.125rem; flex: none; }
@media (max-width: 600px) { .va-sound { bottom: .75rem; padding: .5rem .85rem; font-size: .8125rem; } }
.va-window-note { text-align: center; font-size: .75rem; color: var(--text-muted); margin: .875rem 0 0; }
/* Understand: one divider only (the section seam), content always visible */
main > .va-understand { box-shadow: none !important; border-top: 1px solid var(--va-line) !important; }
.va-understand-grid { border-top: 0 !important; padding-top: 0 !important; }
.va-understand-grid h2, .va-understand-grid p { opacity: 1 !important; visibility: visible !important; transform: none !important; }
.va-understand-grid h2 { color: var(--va-ink, #0f1222) !important; }
.va-understand-grid p { color: #4b5563 !important; }
main > .va-showcase { padding: 5rem 0 !important; border-top: 1px solid var(--va-line); box-shadow: none !important; }