/* Shared presentation for Seolab's keyword discovery and rank tools. */
.seolab-tool-page { color: #263f63; }
.seolab-tool-page .tool-hero__copy { max-width: 590px; }
.seolab-tool-page .tool-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 22px; }
.seolab-tool-page .btn { padding: 12px 22px; border-radius: 11px; font-weight: 700; line-height: 1.8; white-space: normal; }
.seolab-tool-page .btn-primary { color: #fff; background: #345686; border-color: #345686; }
.seolab-tool-page .btn-primary:hover { background: #263f63; border-color: #263f63; }
.seolab-tool-page .btn:disabled { cursor: wait; opacity: .65; }
.seolab-tool-page .tool-text-link { display: inline-block; border: 0; padding: 0; background: transparent; color: #345686; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 5px; line-height: 1.9; }
.seolab-tool-page .tool-hero__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.seolab-tool-page .tool-hero__tags span { padding: 6px 10px; border: 1px solid #ffffffa8; background: #ffffff85; border-radius: 8px; font-size: 11px; }
body.seolab-public .seolab-tool-page .tool-panel { width: 100%; max-width: 520px; margin-inline-start: auto; overflow: visible; max-height: none; border-radius: 22px; box-shadow: 0 24px 64px #263f6324; }
.seolab-tool-page .tool-panel__heading { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.seolab-tool-page .tool-panel__heading h2 { margin: 4px 0 0; font-weight: 800; }
.seolab-tool-page .tool-panel__icon { display: grid; place-items: center; flex: 0 0 48px; width: 48px; height: 48px; border-radius: 15px; color: #345686; background: #edf2f8; font-size: 28px; }
.seolab-tool-page .tool-kicker { display: block; color: #657f9f; font-size: 11px; font-weight: 700; letter-spacing: .03em; margin-bottom: 6px; }
.seolab-tool-page .tool-form { display: grid; gap: 16px; }
.seolab-tool-page .form-label { display: block; margin-bottom: 8px; font-size: 13px; color: #344963; }
.seolab-tool-page .form-control { min-height: 48px; padding: 10px 14px; border: 1px solid #dce4ef; border-radius: 10px; background: #f8fafc; color: #182b46; }
.seolab-tool-page .form-control:focus { background: #fff; border-color: #6d8eb9; box-shadow: 0 0 0 4px #34568612; }
body.seolab-public .seolab-tool-page .tool-hero .tool-panel__note { margin: 16px 0 0; font-size: 11px !important; color: #64748b !important; line-height: 1.9 !important; }
.seolab-tool-page .tool-error { display: block; color: #b42334 !important; font-size: 12px !important; line-height: 1.9; margin-top: 8px; }
.seolab-tool-page .tool-mini-process { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 18px; padding-top: 16px; border-top: 1px solid #e2e8f0; font-size: 11px; }
.seolab-tool-page .tool-mini-process i { font-style: normal; color: #9daec3; }
.seolab-tool-page .tool-rank-result { display: flex; align-items: center; gap: 18px; padding: 14px; margin-top: 18px; border: 1px solid #d8e5d9; border-radius: 12px; background: #f2f8f3; }
.seolab-tool-page .tool-rank-result strong { display: block; color: #226546; font-size: 22px; }
.seolab-tool-page .tool-rank-result span { font-size: 10px; }
body.seolab-public .seolab-tool-page .tool-rank-result p { margin: 0; font-size: 12px !important; }
.seolab-tool-page .tool-section { padding-block: clamp(40px, 6vw, 80px); scroll-margin-top: 90px; }
.seolab-tool-page .tool-section--tinted { background: #f5f7fb; }
.seolab-tool-page .tool-section__heading { max-width: 760px; margin-bottom: 32px; }
.seolab-tool-page :is(.tool-section, .tool-cta) h2 { margin: 0 0 14px; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.8; font-weight: 800; }
.seolab-tool-page .tool-section p { font-size: 15px; line-height: 2; color: #5c6f88; margin-bottom: 14px; }
.seolab-tool-page .tool-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.seolab-tool-page .tool-card { padding: 28px; border: 1px solid #e2e8f0; border-radius: 18px; background: #fff; }
.seolab-tool-page .tool-card__number { display: block; margin-bottom: 24px; font-size: 12px; color: #7e94b1; }
.seolab-tool-page .tool-section h3 { font-size: 17px; font-weight: 800; line-height: 1.9; margin-bottom: 12px; }
.seolab-tool-page .tool-card p { margin: 0; font-size: 14px; }
.seolab-tool-page .tool-product-preview { margin-top: 36px; border: 1px solid #dce4ef; border-radius: 20px; background: #fff; overflow: hidden; box-shadow: 0 20px 60px #263f630d; }
.seolab-tool-page .tool-product-preview__title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 24px; background: #f5f7fb; border-bottom: 1px solid #e2e8f0; }
.seolab-tool-page .tool-product-preview__title span { color: #64748b; font-size: 11px; }
.seolab-tool-page .tool-table-wrap { width: 100%; overflow-x: auto; }
.seolab-tool-page table { width: 100%; min-width: 620px; border-collapse: collapse; text-align: right; font-size: 13px; }
.seolab-tool-page :is(th, td) { padding: 18px 24px; border-bottom: 1px solid #e8edf4; line-height: 1.8; }
.seolab-tool-page thead th { color: #6d819e; font-size: 12px; font-weight: 600; }
.seolab-tool-page tbody tr:last-child :is(th, td) { border-bottom: 0; }
.seolab-tool-page .tool-preview-table svg { display: block; width: 100px; height: 28px; direction: ltr; }
.seolab-tool-page .tool-preview-table path { fill: none; stroke: #238660; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.seolab-tool-page .tool-preview-table .is-declining path { stroke: #ba4954; }
.seolab-tool-page .tool-trend-up { color: #226546; }
.seolab-tool-page .tool-trend-down { color: #b42334; }
.seolab-tool-page .tool-step-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; padding: 0; margin: 0; list-style: none; }
.seolab-tool-page .tool-step-grid li > span { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #cbd8e9; border-radius: 50%; margin-bottom: 20px; background: #fff; }
.seolab-tool-page .tool-editorial { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 48px; padding-block: 32px; }
.seolab-tool-page .tool-cta { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 32px; margin-top: 32px; border: 1px solid #dce5f1; border-radius: 20px; background: linear-gradient(120deg, #f5f8fc, #e7eef7); }
.seolab-tool-page .tool-cta h2 { font-size: 21px; margin-bottom: 8px; }
.seolab-tool-page .tool-cta p { font-size: 13px; margin: 0; }
.seolab-tool-page .tool-cta .btn { flex-shrink: 0; }
.seolab-tool-page .tool-faq { max-width: 860px; margin: 64px auto 0; }
.seolab-tool-page .tool-faq details { border-bottom: 1px solid #e2e8f0; padding: 20px 0; }
.seolab-tool-page .tool-faq summary { cursor: pointer; font-size: 15px; font-weight: 700; line-height: 1.9; }
.seolab-tool-page .tool-faq details[open] summary { margin-bottom: 16px; color: #345686; }
.seolab-tool-page .tool-faq p { margin-bottom: 0; font-size: 14px; }
.seolab-tool-page .tool-keyword-list { display: flex; flex-wrap: wrap; gap: 12px; }
.seolab-tool-page .tool-keyword-list > span { padding: 10px 16px; background: #edf2f8; border: 1px solid #dce5f1; border-radius: 10px; line-height: 1.9; font-size: 14px; overflow-wrap: anywhere; }
.seolab-tool-page .tool-research-steps { display: grid; gap: 32px; margin: 0; padding: 0; list-style: none; }
.seolab-tool-page .tool-research-steps li { display: flex; align-items: flex-start; gap: 24px; padding-bottom: 28px; border-bottom: 1px solid #dfe7f1; }
.seolab-tool-page .tool-research-steps li:last-child { border-bottom: 0; padding-bottom: 0; }
.seolab-tool-page .tool-research-steps li > span { display: grid; place-items: center; flex: 0 0 40px; height: 40px; border-radius: 12px; background: #e5edf8; color: #345686; }
.seolab-tool-page .tool-research-steps p { max-width: 880px; margin: 0; }
.seolab-tool-page .tool-example-table { border: 1px solid #e2e8f0; border-radius: 16px; margin-bottom: 32px; }
.seolab-tool-page .tool-checklist { padding-right: 20px; margin: 0; color: #5c6f88; font-size: 14px; line-height: 2.1; }
.seolab-tool-page .tool-checklist li { margin-bottom: 12px; }
.seolab-tool-page .tool-source-note { margin: 40px 0 0; font-size: 12px !important; }
.seolab-tool-page :is(a, button, summary):focus-visible { outline: 2px solid #345686; outline-offset: 4px; }
@media(max-width: 991px) {
    body.seolab-public .seolab-tool-page .tool-panel { max-width: 620px; margin-inline: auto; }
    .seolab-tool-page .tool-feature-grid { gap: 14px; }
    .seolab-tool-page .tool-card { padding: 20px; }
    .seolab-tool-page .tool-editorial { gap: 24px; }
    .seolab-tool-page .tool-hero__tags { margin-top: 14px; }
    .seolab-tool-page .tool-hero__actions { margin-top: 14px; gap: 12px; }
    .seolab-tool-page .tool-hero__actions .btn { font-size: 13px; padding: 10px 16px; }
    body.seolab-public .seolab-tool-page .tool-panel__heading h2 { font-size: 17px; }
    .seolab-tool-page .tool-panel__heading { margin-bottom: 14px; }
    .seolab-tool-page .tool-form { gap: 12px; }
}
@media(max-width: 575px) {
    .seolab-tool-page .tool-feature-grid, .seolab-tool-page .tool-step-grid, .seolab-tool-page .tool-editorial { grid-template-columns: minmax(0, 1fr); }
    .seolab-tool-page .tool-hero__tags { display: none; }
    body.seolab-public .seolab-tool-page .tool-hero .seolab-page-hero__eyebrow { font-size: 11px; }
    .seolab-tool-page .tool-hero__actions .tool-text-link { font-size: 11px; }
    .seolab-tool-page .tool-panel__icon { width: 40px; height: 40px; flex-basis: 40px; font-size: 25px; }
    .seolab-tool-page .tool-panel__heading { gap: 10px; }
    .seolab-tool-page .tool-mini-process { margin-top: 12px; padding-top: 12px; }
    .seolab-tool-page .tool-card__number { margin-bottom: 14px; }
    .seolab-tool-page .tool-cta { flex-direction: column; align-items: stretch; padding: 24px; }
    .seolab-tool-page .tool-research-steps li { gap: 16px; }
    .seolab-tool-page .tool-research-steps li > span { flex-basis: 32px; height: 32px; border-radius: 9px; }
    .seolab-tool-page .tool-faq { margin-top: 48px; }
}
body.seolab-public .seolab-tool-page .tool-hero .tool-error { color: #b42334 !important; }
@media(max-width: 575px) {
    .seolab-tool-page .tool-hero > .container { padding-inline: 0; }
}
@media(max-width: 359px) {
    .seolab-tool-page .tool-hero__actions > .tool-text-link { display: none; }
    .seolab-tool-page .tool-panel__icon { width: 32px; height: 32px; flex-basis: 32px; font-size: 22px; }
    body.seolab-public .seolab-tool-page .tool-panel__heading h2 { font-size: 15px; }
    .seolab-tool-page .tool-panel__heading { margin-bottom: 10px; }
    .seolab-tool-page .tool-form { gap: 8px; }
    .seolab-tool-page .tool-form .form-label { font-size: 12px; margin-bottom: 5px; line-height: 1.7; }
    .seolab-tool-page .tool-form .btn { font-size: 13px; padding-block: 10px; }
    body.seolab-public .seolab-tool-page .tool-hero .tool-panel__note { margin-top: 10px; font-size: 10px !important; line-height: 1.7 !important; }
}
@media(max-width: 359px) {
    body.seolab-public .rank-tool-page .tool-hero:has(> .seolab-hero-breadcrumbs) { padding-block: 56px 16px !important; }
    body.seolab-public .rank-tool-page .tool-hero__copy > .seolab-page-hero__eyebrow { display: none; }
    body.seolab-public .rank-tool-page .tool-hero__copy > p { font-size: 13px !important; line-height: 1.8 !important; }
    body.seolab-public .rank-tool-page .tool-hero .seolab-hero__split { gap: 12px; }
}