/* Ad landing page for the $27 AI Visibility Report. Mobile first, no site navigation. */
.lp { background: var(--canvas); color: var(--ink); font-family: var(--font); }
.lp-wrap { width: min(calc(100% - 2rem), 760px); margin-inline: auto; }

.lp-top { position: sticky; top: 0; z-index: 10; background: rgba(247,250,249,.92); border-bottom: 1px solid var(--line); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.lp-top-inner { display: flex; align-items: center; justify-content: space-between; min-height: 3.6rem; }
.lp-top .brand { display: inline-flex; align-items: center; gap: .5rem; font-weight: 800; letter-spacing: -.03em; }
.lp-top-tag { color: var(--teal); font-family: var(--mono); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.lp-hero { padding: 2.6rem 0 2.8rem; background-color: var(--canvas); background-image: linear-gradient(rgba(11,118,110,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(11,118,110,.05) 1px, transparent 1px); background-size: 40px 40px; }
.lp-hero .eyebrow { font-size: .7rem; }
.lp-hero h1 { margin-bottom: 1rem; font-size: clamp(2.4rem, 9vw, 4.2rem); line-height: .98; letter-spacing: -.055em; text-wrap: balance; }
.lp-lead { max-width: 640px; color: var(--ink-soft); font-size: 1.08rem; line-height: 1.55; }

.lp-buy { margin-top: 1.6rem; padding: 1.25rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.lp-price { display: flex; align-items: center; gap: .9rem; margin-bottom: 1rem; }
.lp-price strong { font-size: 3rem; line-height: 1; letter-spacing: -.05em; }
.lp-price span { color: var(--muted); font-size: .9rem; line-height: 1.35; }
.lp-cta { width: 100%; font-size: 1.05rem; }
.lp-assure { display: grid; gap: .35rem; margin: 1rem 0 0; padding: 0; list-style: none; color: var(--ink-soft); font-size: .92rem; }
.lp-assure li::before { content: "✓"; margin-right: .45rem; color: var(--teal); font-weight: 800; }

.lp-video { padding: 0 0 2.5rem; }
.lp-video video { width: 100%; border-radius: var(--radius); background: #000; box-shadow: var(--shadow-lg); }

.lp-section { padding: 3rem 0; }
.lp-soft { background: var(--soft); }
.lp-section h2 { margin-bottom: 1.2rem; font-size: clamp(1.8rem, 6vw, 2.6rem); letter-spacing: -.045em; }

.lp-split { display: grid; gap: 2rem; }
.lp-list { display: grid; gap: .9rem; margin: 0; padding: 0; list-style: none; }
.lp-list li { padding-left: 1.6rem; color: var(--ink-soft); line-height: 1.5; }
.lp-list li::before { float: left; margin-left: -1.6rem; color: var(--teal); font-weight: 800; content: "✓"; }
.lp-list strong { color: var(--ink); }

.lp-report { position: relative; margin: 0; padding: 1.4rem; background: var(--paper); border: 1px solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow-float); }
.lp-report-tag { position: absolute; top: 1rem; right: 1rem; margin: 0; padding: .2rem .55rem; color: var(--teal-dark); background: var(--teal-light); border-radius: 999px; font-family: var(--mono); font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.lp-report-title { margin-bottom: .2rem; font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.lp-report-biz { margin-bottom: .8rem; color: var(--muted); font-size: .85rem; }
.lp-blur { filter: blur(4px); user-select: none; }
.lp-report-score { margin-bottom: .9rem; color: #b42318; font-size: .95rem; font-weight: 700; }
.lp-report-score span { font-size: 3.2rem; line-height: 1; letter-spacing: -.05em; }
.lp-report-rows { margin: 0 0 1rem; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.lp-report-rows li { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--line); font-size: .92rem; }
.lp-report-rows em { font-style: normal; font-weight: 700; }
.lp-report-rows .bad { color: #b42318; }
.lp-report-rows .mid { color: #b54708; }
.lp-report-sub { margin-bottom: .4rem; font-weight: 750; }
.lp-report-fixes { margin: 0 0 .8rem; padding-left: 1.2rem; color: var(--ink-soft); font-size: .9rem; }
.lp-report figcaption { color: var(--muted); font-size: .75rem; }

.lp-steps { display: grid; gap: .9rem; margin: 0; padding: 0; list-style: none; counter-reset: step; }
.lp-steps li { position: relative; padding: 1rem 1rem 1rem 3.4rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--ink-soft); line-height: 1.5; counter-increment: step; }
.lp-steps li::before { position: absolute; top: 1rem; left: 1rem; display: grid; place-items: center; width: 1.7rem; height: 1.7rem; color: #fff; background: var(--teal); border-radius: 50%; font-size: .8rem; font-weight: 800; content: counter(step); }
.lp-steps strong { color: var(--ink); }

.lp-stats { display: grid; gap: .8rem; }
.lp-stats p { margin: 0; padding: 1rem 1.1rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--ink-soft); }
.lp-stats strong { display: block; color: var(--ink); font-size: 1.6rem; letter-spacing: -.04em; }
.lp-source { margin-top: .8rem; color: var(--muted); font-size: .78rem; }

.lp-about { display: grid; gap: 1.4rem; align-items: start; }
.lp-about img { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; box-shadow: var(--shadow-sm); }
.lp-about p { color: var(--ink-soft); line-height: 1.55; }
.lp-fine { color: var(--muted) !important; font-size: .78rem; }

.lp-guarantee { padding: 1.6rem; color: #fff; background: var(--teal-dark); border-radius: var(--radius); }
.lp-guarantee h2 { color: #fff; }
.lp-guarantee p { margin-bottom: .6rem; color: rgba(255,255,255,.88); line-height: 1.55; }

.lp-faq details { padding: 1rem 0; border-bottom: 1px solid var(--line-strong); }
.lp-faq summary { cursor: pointer; font-weight: 750; }
.lp-faq details p { margin: .7rem 0 0; color: var(--ink-soft); line-height: 1.55; }

.lp-final { padding: 3.4rem 0; color: #fff; background: var(--night); text-align: center; }
.lp-final h2 { margin-bottom: .7rem; color: #fff; font-size: clamp(1.8rem, 6vw, 2.6rem); letter-spacing: -.045em; }
.lp-final p { color: rgba(255,255,255,.8); }
.lp-final .lp-cta { max-width: 420px; margin-top: .6rem; }
.lp-notice { margin-top: 1rem; font-size: .9rem; }
.lp-notice a { text-decoration: underline; }

.lp-foot { padding: 1.6rem 0 2.4rem; color: var(--muted); background: var(--night); font-size: .8rem; text-align: center; }
.lp-foot a { text-decoration: underline; }

@media (min-width: 760px) {
  .lp-hero { padding: 4rem 0; }
  .lp-buy { display: grid; grid-template-columns: auto 1fr; gap: 1rem 1.5rem; align-items: center; }
  .lp-price { margin: 0; }
  .lp-assure { grid-column: 1 / -1; grid-template-columns: repeat(3, auto); justify-content: start; gap: 1.2rem; }
  .lp-split { grid-template-columns: 1fr 1fr; align-items: center; }
  .lp-stats { grid-template-columns: repeat(3, 1fr); }
  .lp-about { grid-template-columns: 140px 1fr; }
  .lp-about img { width: 140px; height: 140px; }
}

/* v2: proof, guarantees, trust, sticky mobile CTA */
.lp-trust { margin: .9rem 0 0; color: var(--muted); font-size: .8rem; text-align: center; }
.lp-trust-dark { color: rgba(255,255,255,.65); }
.lp-proof { padding: 0 0 2.6rem; background: var(--canvas); }
.lp-talk { margin: 0; }
.lp-talk img { width: 100%; height: auto; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.lp-talk figcaption { margin-top: .7rem; color: var(--ink-soft); font-size: .92rem; line-height: 1.5; }
.lp-guarantees { display: grid; gap: 1rem; margin-top: 1.6rem; }
.lp-guarantee h3 { margin-bottom: .5rem; color: #fff; font-size: 1.25rem; }
.lp-g-tag { margin-bottom: .4rem !important; color: var(--lime) !important; font-family: var(--mono); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.lp-sticky { position: fixed; right: 0; bottom: 0; left: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom)); background: rgba(255,255,255,.97); border-top: 1px solid var(--line); box-shadow: 0 -8px 24px rgba(17,35,32,.08); transform: translateY(110%); transition: transform .2s; }
.lp-sticky.is-on { transform: translateY(0); }
.lp-sticky span { color: var(--ink-soft); font-size: .9rem; }
.lp-sticky-btn { min-height: 2.8rem; padding: .6rem 1.1rem; }
@media (min-width: 760px) {
  .lp-guarantees { grid-template-columns: 1fr 1fr; }
  .lp-sticky { display: none; }
}
@media (max-width: 759px) { .lp-foot { padding-bottom: 5.5rem; } }
.lp-yt { color: var(--teal-dark); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* v3: payment logos, guarantee seal, real report image */
.lp-price { position: relative; }
.lp-seal-sm { width: 74px; height: 74px; margin-left: auto; flex: none; }
.lp-pay { display: flex; justify-content: center; align-items: center; gap: .9rem; margin-top: .9rem; color: #8a9a96; }
.lp-pay-icon svg { display: block; width: 26px; height: 26px; }
.lp-pay-dark { color: rgba(255,255,255,.55); }
.lp-trust svg { vertical-align: -2px; margin-right: .2rem; }
.lp-report-img { margin: 0; }
.lp-report-img img { width: 100%; height: auto; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); box-shadow: var(--shadow-float); }
.lp-report-img figcaption { margin-top: .6rem; color: var(--muted); font-size: .78rem; }
.lp-seal-wrap { display: flex; justify-content: center; margin-top: 1.6rem; }
.lp-seal-wrap .lp-seal { width: 150px; height: 150px; }

/* v4: centered direct-response layout */
.lp-wrap { width: min(calc(100% - 2rem), 720px); }
.lp-center { text-align: center; }
.lp-center .eyebrow, .lp-center-row { justify-content: center; }
.lp-center h1, .lp-center h2, .lp-center-text { margin-inline: auto; text-align: center; text-wrap: balance; }
.lp-center .lp-lead { margin-inline: auto; }
.lp-lead + .lp-lead { margin-top: .9rem; }
.lp-hero h1 { max-width: 13ch; }
.lp-strong { color: var(--ink) !important; font-weight: 700; }

/* buy box: stacked and centered at every width */
.lp-buy { max-width: 520px; margin-inline: auto; text-align: center; }
.lp-price { justify-content: center; text-align: left; }
.lp-seal-sm { margin-left: .4rem; }
.lp-assure { justify-items: center; }
@media (min-width: 760px) {
  .lp-buy { display: block; }
  .lp-price { margin-bottom: 1rem; }
  .lp-assure { grid-template-columns: 1fr; justify-content: center; gap: .35rem; }
}

/* long text stays left-aligned inside centered cards */
.lp-card { max-width: 600px; margin: 0 auto 1.8rem; padding: 1.3rem 1.3rem 1.3rem 1.2rem; text-align: left; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.lp-steps { max-width: 600px; margin-inline: auto; text-align: left; }
.lp-report-img { max-width: 600px; margin-inline: auto; }
.lp-talk figcaption { max-width: 560px; margin-inline: auto; }

.lp-stats { margin: 1.6rem auto 0; max-width: 680px; }
.lp-stats p { text-align: center; }
.lp-stats-hit { margin-bottom: 1.6rem; }
.lp-stats-hit strong { color: #b42318; font-size: 2.1rem; }

.lp-guarantee { text-align: left; }
.lp-about { display: block; }
.lp-about img { display: block; margin: 0 auto 1.2rem; }
@media (min-width: 760px) { .lp-about { display: block; } }

.lp-faq { max-width: 640px; }
.lp-faq h2 { text-align: center; }
.lp-final h2 { max-width: 20ch; margin-inline: auto; text-wrap: balance; }
.lp-assure { width: fit-content; margin-inline: auto; justify-items: start; text-align: left; }
.lp-cta-mid { max-width: 420px; margin-top: 1.6rem; }

/* v5: how AI picks + job math */
.lp-after { margin-top: 1.4rem; }
.lp-steps + .lp-after { color: var(--ink); font-weight: 700; }
.lp-lead + .lp-steps { margin-top: 1.4rem; }
.lp-math { display: grid; gap: .9rem; max-width: 440px; margin: 1.6rem auto; padding: 1.4rem 1.2rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.lp-math-in { display: grid; gap: .5rem; justify-items: center; color: var(--ink-soft); font-size: .95rem; font-weight: 600; }
.lp-math-in span { display: inline-flex; align-items: center; gap: .3rem; padding: .35rem .9rem; border: 2px solid var(--teal); border-radius: var(--radius-sm); background: #fff; }
.lp-math-in b { color: var(--ink); font-size: 1.6rem; }
.lp-math-in input { width: 6.5ch; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: inherit; font-size: 1.8rem; font-weight: 800; letter-spacing: -.03em; text-align: center; -moz-appearance: textfield; }
.lp-math-in input::-webkit-outer-spin-button, .lp-math-in input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.lp-math-in span:focus-within { box-shadow: 0 0 0 4px rgba(11,118,110,.15); }
.lp-math-op { margin: 0; color: var(--muted); font-size: .95rem; }
.lp-math-out { margin: 0; color: var(--ink-soft); font-size: 1.05rem; }
.lp-math-out strong { display: block; color: var(--teal-dark); font-size: 2.8rem; line-height: 1.05; letter-spacing: -.05em; }
.lp-math-op { font-size: 1.3rem; line-height: 1; }
#lp-jobs { width: 4ch; }

/* v6: hero video (click to play) */
.lp-vsl { position: relative; max-width: 640px; margin: 1.4rem auto 0; border-radius: var(--radius); overflow: hidden; background: #0e1f1d; box-shadow: var(--shadow-lg); aspect-ratio: 16 / 9; }
.lp-vsl video { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-vsl-play { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; width: 100%; border: 0; background: rgba(14,31,29,.28); color: #12211f; cursor: pointer; font: inherit; }
.lp-vsl-play svg { box-sizing: content-box; padding: 1rem; border-radius: 50%; background: #ffdd00; box-shadow: 0 8px 24px rgba(0,0,0,.35); }
.lp-vsl-play span { padding: .3rem .8rem; border-radius: 999px; background: #ffdd00; font-size: .9rem; font-weight: 800; }
.lp-vsl-play:hover svg, .lp-vsl-play:focus-visible svg { transform: scale(1.06); }
.lp-vsl-play[hidden] { display: none; }

/* v7: social proof badge above the headline */
.lp-badge { display: inline-flex; align-items: center; gap: .4rem; margin: 0 0 1rem; padding: .4rem .9rem; border-radius: 999px; background: #ffdd00; color: #12211f; font-size: .88rem; font-weight: 800; }

/* v8: two-sentence headline */
.lp-hero h1 { max-width: 17ch; font-size: clamp(2rem, 7.4vw, 3.5rem); line-height: 1.04; }
.lp-hero h1 span { display: block; margin-top: .35em; color: var(--teal); }

/* v9: 100% satisfaction guarantee leads, full width */
@media (min-width: 760px) { .lp-guarantee-main { grid-column: 1 / -1; } }

/* v10: tighter phone hero so the price and button come sooner; sticky CTA shows from the first screen */
@media (max-width: 759px) {
  .lp-hero { padding-top: 1.4rem; }
  .lp-badge { margin-bottom: .7rem; }
  .lp-hero .eyebrow { margin-bottom: .7rem; }
  .lp-hero h1 { margin-bottom: .7rem; }
  .lp-hero .lp-lead { font-size: 1rem; }
  .lp-vsl { margin-top: 1rem; }
  .lp-buy { margin-top: 1.1rem; }
  .lp-sticky-btn { font-weight: 800; }
}
.lp-cta-top { max-width: 420px; margin-top: 1.1rem; }
.lp-top-note { margin: .55rem 0 0; color: var(--muted); font-size: .82rem; }

/* v11: no gap between the header and the hero */
.lp-hero { padding-top: 1.2rem; }
@media (min-width: 760px) { .lp-hero { padding-top: 1.6rem; } }

/* v12: no header on the ad page; page starts at the badge */
.lp-hero { padding-top: 1.6rem; }
@media (min-width: 760px) { .lp-hero { padding-top: 2.2rem; } }

/* v13: each headline sentence on one line on desktop */
@media (min-width: 760px) {
  .lp-hero h1 { max-width: none; font-size: 2.3rem; white-space: nowrap; }
  .lp-hero h1 span { margin-top: .3em; }
}

/* v14: first headline sentence bigger on desktop; it may run wider than the text column */
@media (min-width: 760px) {
  .lp-hero h1 { width: max-content; max-width: calc(100vw - 2rem); margin-inline: auto; font-size: min(3.2rem, 4vw); }
  .lp-hero h1 span { font-size: min(2.3rem, 3.5vw); }
}

/* v15: the desktop headline is wider than its column, so centre it on the page, not the column */
@media (min-width: 760px) { .lp-hero h1 { position: relative; left: 50%; transform: translateX(-50%); } }