/* Scout landing (/tools/scout). Builds on tool-workbench.css + rank-landing.css + ai-visibility.css (shared .aiv-* pieces: stats, steps, tabs, compare);
   only this page's own pieces live here. The pricing cards (Livewire) still use the legacy scout.css classes, restyled at the bottom. */
.sc-landing { --sc-green: #27825e; --sc-green-soft: #e9f6ef; --sc-red: #c2413b; --sc-red-soft: #fdeceb; }
.sc-landing :is(#why, #how, #samples, #plans, #faq) { scroll-margin-top: 96px; }
.sc-landing :is(.sc-chat, .sc-focus, .sc-task, .sc-verify) p { text-align: start !important; }

/* Sonia chat mock (hero + samples) */
.sc-landing .sc-chat { display: grid; gap: 10px; padding: clamp(14px, 2vw, 22px); background: linear-gradient(170deg, #f7f9fc, #fff 60%); }
.sc-landing .sc-msg { max-width: 86%; padding: 10px 14px; border-radius: 16px; font-size: 13px; line-height: 1.9; color: var(--aiv-ink); }
.sc-landing .sc-msg b { display: block; margin-bottom: 2px; color: var(--aiv-blue); font-size: 11px; }
.sc-landing .sc-msg p { margin: 0; font-size: 13px !important; line-height: 1.9 !important; }
.sc-landing .sc-msg.is-bot { justify-self: start; border: 1px solid var(--aiv-line); border-start-start-radius: 4px; background: #fff; }
.sc-landing .sc-msg.is-user { justify-self: end; border-end-end-radius: 4px; background: var(--aiv-blue); color: #fff; direction: ltr; text-align: left; }
body.seolab-public .sc-landing .sc-msg.is-user p { color: #fff !important; }
.sc-landing .sc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
.sc-landing .sc-chips li { padding: 2px 10px; border-radius: 20px; background: #edf2f8; color: var(--aiv-blue); font-size: 11px; font-weight: 700; }
.sc-landing .sc-chips li.is-on { background: var(--aiv-gold-soft); color: #8a6700; outline: 1px solid #f3dc8a; }

/* Task card mock */
.sc-landing .sc-task { display: grid; gap: 10px; padding: clamp(16px, 2.2vw, 24px); border-top: 1px solid var(--aiv-line); background: #fff; }
.sc-landing .sc-task__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.sc-landing .sc-task__tags span { padding: 2px 10px; border-radius: 20px; background: #edf2f8; color: var(--aiv-blue); font-size: 11px; font-weight: 700; }
.sc-landing .sc-task__tags span.is-high { background: var(--sc-red-soft); color: var(--sc-red); }
.sc-landing .sc-task h4 { margin: 0; color: var(--aiv-ink); font-size: 15px; font-weight: 800; line-height: 1.8; }
.sc-landing .sc-task__meta { display: flex; flex-wrap: wrap; gap: 4px 16px; color: #7a8fa9; font-size: 11px; }
.sc-landing .sc-task__meta bdi { color: #4b5f7a; font-weight: 700; }
.sc-landing .sc-task p { margin: 0; color: #4b5f7a; font-size: 13px !important; line-height: 2 !important; }
.sc-landing .sc-task__accept { padding: 10px 14px; border-radius: 12px; background: var(--sc-green-soft); color: #1b5e43; font-size: 12px; line-height: 1.9; }
.sc-landing .sc-task__accept b { margin-inline-end: 4px; }
.sc-landing .sc-task__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.sc-landing .sc-task__actions span { padding: 7px 16px; border-radius: 10px; border: 1px solid #cfd9e8; color: #4b5f7a; font-size: 12px; font-weight: 700; }
.sc-landing .sc-task__actions span.is-primary { border-color: var(--aiv-blue); background: var(--aiv-blue); color: #fff; }

/* Verification mock */
.sc-landing .sc-verify { display: grid; gap: 10px; padding: clamp(14px, 2vw, 22px); background: linear-gradient(170deg, #f7f9fc, #fff 60%); }
.sc-landing .sc-verify__item { padding: 12px 14px; border: 1px solid var(--aiv-line); border-radius: 14px; background: #fff; font-size: 13px; line-height: 1.9; }
.sc-landing .sc-verify__item b { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; color: var(--aiv-ink); font-size: 13px; }
.sc-landing .sc-verify__item p { margin: 0; color: #4b5f7a; font-size: 12px !important; line-height: 1.9 !important; }
.sc-landing .sc-verify__item.is-ok { border-color: #bfe3d1; background: var(--sc-green-soft); }
.sc-landing .sc-verify__item.is-ok b::before { content: "✓"; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--sc-green); color: #fff; font-size: 12px; }
.sc-landing .sc-verify__item.is-fail { border-color: #f2c4c1; background: var(--sc-red-soft); }
.sc-landing .sc-verify__item.is-fail b::before { content: "!"; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--sc-red); color: #fff; font-size: 12px; }
.sc-landing .sc-verify__note { color: #8a9bb2; font-size: 11px; text-align: center; }

/* Why: one focus keyword at a time */
.sc-landing .sc-focus { padding: clamp(18px, 2.4vw, 26px); border: 1px solid #dce5f1; border-radius: 24px; background: linear-gradient(160deg, #f7f9fc, #fff 55%); box-shadow: 0 24px 64px #263f6314; }
.sc-landing .sc-focus__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; color: #7a8fa9; font-size: 11px; }
.sc-landing .sc-focus__head b { color: var(--aiv-ink); font-size: 13px; }
.sc-landing .sc-focus__rows { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.sc-landing .sc-focus__rows > li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 10px; padding: 12px 14px; border: 1px solid var(--aiv-line); border-radius: 14px; background: #fff; }
.sc-landing .sc-focus__rows strong { grid-column: 1; color: var(--aiv-ink); font-size: 13px; }
.sc-landing .sc-focus__rows small { grid-column: 1; color: #7a8fa9; font-size: 11px; }
.sc-landing .sc-focus__rows em { grid-column: 2; grid-row: 1 / span 2; align-self: center; padding: 3px 10px; border-radius: 20px; background: #edf2f8; color: var(--aiv-blue); font-size: 11px; font-style: normal; font-weight: 700; white-space: nowrap; }
.sc-landing .sc-focus__rows li.is-active { border-color: #f3dc8a; background: var(--aiv-gold-soft); }
.sc-landing .sc-focus__rows li.is-active em { background: var(--aiv-gold); color: #fff; }
.sc-landing .sc-focus__rows li.is-done em { background: var(--sc-green-soft); color: var(--sc-green); }
.sc-landing .sc-focus__note { margin-top: 12px; color: #8a9bb2; font-size: 11px; text-align: center; }

/* Samples: tab ids of this page (base styles come from ai-visibility.css) */
.sc-landing .aiv-tabs:has(input[value="task"]:checked) .aiv-tab[data-tab="task"],
.sc-landing .aiv-tabs:has(input[value="verify"]:checked) .aiv-tab[data-tab="verify"],
.sc-landing .aiv-tabs:has(input[value="dash"]:checked) .aiv-tab[data-tab="dash"],
.sc-landing .aiv-tabs:has(input[value="analyse"]:checked) .aiv-tab[data-tab="analyse"],
.sc-landing .aiv-tabs:has(input[value="kw"]:checked) .aiv-tab[data-tab="kw"],
.sc-landing .aiv-tabs:has(input[value="report"]:checked) .aiv-tab[data-tab="report"] { display: grid; animation: aiv-fade .35s ease; }
.sc-landing .aiv-tab .rank-preview > .sc-task,
.sc-landing .aiv-tab .rank-preview > .sc-verify { border-top: 0; }
.sc-landing .sc-samples__group { margin: 0 0 14px; color: #7a8fa9; font-size: 12px; text-align: center; }

/* Features: 8 cards → 4 columns on wide screens; colors for cards 7–8 (rank-landing.css defines 1–6) */
@media (min-width: 1200px) {
    .sc-landing .rank-features { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.sc-landing .rank-features .tool-card:nth-child(7) { --fc: #7357c9; --fs: #efeafb; }
.sc-landing .rank-features .tool-card:nth-child(8) { --fc: #b48600; --fs: #fff7d9; }


@media (max-width: 575px) {
    .sc-landing .sc-msg { max-width: 94%; }
}

/* Hero video (legacy /tools/scout content) */
.sc-landing .sc-video { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #0b1b33; }

/* Same height for the register button (Livewire, inside .wrapper) and the neighbouring link */
.sc-landing :is(.rank-hero__actions, .rank-final-cta > div) .wrapper { display: flex; }
.sc-landing :is(.rank-hero__actions, .rank-final-cta > div) .btn { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; min-height: 46px; border: 1px solid transparent; }
.sc-landing .rank-hero__actions .btn.btn-outline-primary { border-color: var(--aiv-blue); }
.sc-landing .rank-final-cta > div .btn.btn-outline-light { border-color: #ffffff80; }
/* Plain video, no browser frame */
.sc-landing .sc-video-plain { align-self: center; overflow: hidden; border-radius: 20px; box-shadow: 0 24px 64px #263f6322; }
.sc-landing .sc-video-plain .sc-video { border-radius: 0; }



/* Plans: duration switch + three compact cards (Livewire markup in livewire/guest/scout/{index,plan}.blade.php) */
.sc-landing .sc-cycle { display: flex; justify-content: center; width: fit-content; margin: 0 auto 26px; padding: 4px; border: 1px solid #dfe6f1; border-radius: 999px; background: #fff; box-shadow: 0 6px 20px #263f630d; }
.sc-landing .sc-cycle button { padding: 7px 20px; border: 0; border-radius: 999px; background: transparent; color: #5c6f88; font-size: 13px; font-weight: 700; cursor: pointer; transition: background .2s, color .2s; }
.sc-landing .sc-cycle button:hover { color: var(--aiv-blue); }
.sc-landing .sc-cycle button.is-active { background: var(--aiv-blue); color: #fff; }
.sc-landing .sc-plans-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; max-width: 1060px; margin: 0 auto; padding: 0 16px; transition: opacity .2s; }
.sc-landing .sc-plans-grid.is-loading { opacity: .45; pointer-events: none; }
.sc-landing .sc-plan { position: relative; display: flex; flex-direction: column; gap: 14px; padding: 22px 22px 20px; border: 1px solid #dfe6f1; border-radius: 20px; background: #fff; box-shadow: 0 12px 34px #263f630f; }
.sc-landing .sc-plan.is-popular { border-color: #f3dc8a; box-shadow: 0 18px 48px #b4860026; }
.sc-landing .sc-plan.is-popular::before { content: ""; position: absolute; inset: -1px -1px auto; height: 4px; border-radius: 20px 20px 0 0; background: linear-gradient(90deg, #ffd24d, var(--aiv-gold)); }
.sc-landing .sc-plan__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sc-landing .sc-plan__name { margin: 0; color: var(--aiv-ink); font-size: 18px; font-weight: 800; }
.sc-landing .sc-plan__badge { padding: 2px 12px; border-radius: 999px; background: var(--aiv-gold-soft); color: #8a6700; font-size: 11px; font-weight: 800; }
.sc-landing .sc-plan__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; padding-bottom: 14px; border-bottom: 1px dashed #dfe6f1; }
.sc-landing .sc-plan__price strong { color: var(--aiv-blue); font-size: 30px; font-weight: 800; line-height: 1.2; }
.sc-landing .sc-plan__price span { color: #7a8fa9; font-size: 12px; }
.sc-landing .sc-plan__price s { margin-inline-start: auto; color: #a3b1c4; font-size: 12px; }
.sc-landing .sc-plan__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.sc-landing .sc-plan__list li { display: flex; align-items: baseline; gap: 8px; padding: 4px 0; padding-inline-start: calc(var(--d, 0) * 16px); color: #3b4d66; font-size: 13px; line-height: 1.8; }
.sc-landing .sc-plan__list li span { flex: 0 0 auto; width: 16px; color: var(--sc-green); font-weight: 800; text-align: center; }
.sc-landing .sc-plan__list li.is-off { color: #a3b1c4; }
.sc-landing .sc-plan__list li.is-off span { color: #c3cedc; }
.sc-landing .sc-plan__list li.is-extra { display: none; }
.sc-landing .sc-plan.is-open .sc-plan__list li.is-extra { display: flex; }
.sc-landing .sc-plan__more { align-self: flex-start; padding: 0; border: 0; background: transparent; color: var(--aiv-blue); font-size: 12px; font-weight: 800; cursor: pointer; }
.sc-landing .sc-plan__more:hover { text-decoration: underline; }
.sc-landing .sc-plan__buy { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 2px; padding: 12px 16px; border: 0; border-radius: 12px; background: var(--aiv-blue); color: #fff; font-size: 14px; font-weight: 800; cursor: pointer; transition: filter .2s, transform .2s; }
.sc-landing .sc-plan__buy b { font-size: 14px; }
.sc-landing .sc-plan__buy small { font-size: 11px; font-weight: 600; opacity: .8; }
.sc-landing .sc-plan.is-popular .sc-plan__buy { background: linear-gradient(135deg, #f7be1b, #e3a500); color: #2b2100; }
.sc-landing .sc-plan__buy:hover { filter: brightness(1.08); transform: translateY(-1px); }
.sc-landing .sc-plan__buy:disabled { opacity: .6; pointer-events: none; }
/* Register button: no full-page overlay while Livewire works, just dim the button */
.sc-landing .btn.is-busy { opacity: .65; pointer-events: none; }
@media (max-width: 900px) {
    .sc-landing .sc-plans-grid { grid-template-columns: minmax(0, 1fr); max-width: 460px; }
}