.page-converter .seo-landing-content,
.page-converter .seo-tools {
    width: 100%;
    max-width: var(--home-content-width, 1080px);
    margin-right: auto;
    margin-left: auto;
}

.seo-section-shell,
.seo-section {
    width: 100%;
    border: 1px solid color-mix(in srgb, var(--ui-accent, #2563eb) 14%, var(--ui-border, #dce5f0));
    border-radius: 20px;
    background: var(--ui-surface, #fff);
    box-shadow: 0 12px 34px rgba(20, 38, 64, .07);
}

.seo-section {
    margin-bottom: 0;
    padding: clamp(1.25rem, 3vw, 1.75rem) !important;
}

.seo-breadcrumb {
    padding: .75rem 1rem;
    background: var(--ui-surface-soft, #f7fafe);
    box-shadow: none;
}

.seo-instruction-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.seo-instruction-card {
    display: flex;
    min-width: 0;
    gap: .875rem;
    padding: 1.125rem;
    border: 1px solid var(--ui-border, #dce5f0);
    border-radius: 16px;
    background: var(--ui-surface-soft, #f7fafe);
}

.seo-instruction-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(135deg, var(--primary, #2563eb), var(--primary-dark, #1d4ed8));
    font-weight: 700;
}

.seo-instruction-card p {
    line-height: 1.65;
}

.seo-benefit-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.seo-benefit-card {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 180px;
    flex-direction: column;
    padding: 1.25rem;
    border: 1px solid var(--ui-border, #dce5f0);
    border-radius: 16px;
    background: var(--ui-surface-soft, #f7fafe);
}

.seo-benefit-card p {
    line-height: 1.65;
}

.seo-benefit-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    margin-bottom: .75rem;
    border-radius: 10px;
    color: var(--primary, #2563eb);
    background: color-mix(in srgb, var(--primary, #2563eb) 12%, transparent);
}

.seo-faq-list {
    display: grid;
    gap: .75rem;
}

.seo-faq-item {
    border: 1px solid var(--ui-border, #dce5f0);
    border-radius: 14px;
    background: var(--ui-surface, #fff);
    overflow: clip;
}

.seo-faq-item summary {
    padding: 1rem 1.125rem;
    cursor: pointer;
    font-weight: 650;
    color: var(--ui-text, #172033);
}

.seo-faq-item p {
    margin: 0;
    padding: 0 1.125rem 1rem;
    color: var(--ui-text-muted, #64748b);
}

.seo-legal-note {
    display: flex;
    align-items: flex-start;
    gap: .875rem;
    border-color: color-mix(in srgb, var(--primary, #2563eb) 25%, var(--ui-border, #dce5f0));
    color: var(--ui-text-muted, #64748b);
    background: color-mix(in srgb, var(--primary, #2563eb) 6%, var(--ui-surface, #fff));
}

.seo-legal-note > i {
    flex: 0 0 auto;
    color: var(--primary, #2563eb);
    font-size: 1.35rem;
}

.seo-tools-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.seo-platform-hub-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    align-items: start;
}

.seo-platform-group {
    min-width: 0;
}

.seo-platform-title {
    margin: 0 0 .75rem;
    color: var(--ui-text-muted, #64748b);
    font-size: .82rem;
    font-weight: 750;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.seo-platform-group .seo-tools-grid {
    grid-template-columns: minmax(0, 1fr);
}

.seo-tool-card {
    display: flex;
    align-items: center;
    gap: .875rem;
    min-width: 0;
    min-height: 104px;
    height: 100%;
    padding: 1rem;
    border: 1px solid var(--ui-border, #dce5f0);
    border-radius: 16px;
    color: var(--ui-text, #172033);
    background: var(--ui-surface, #fff);
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.seo-tool-card > span:last-child {
    min-width: 0;
}

.seo-tool-card:hover,
.seo-tool-card:focus-visible {
    color: var(--ui-text, #172033);
    border-color: color-mix(in srgb, var(--primary, #2563eb) 55%, var(--ui-border, #dce5f0));
    box-shadow: 0 12px 28px rgba(15, 23, 42, .09);
    transform: translateY(-2px);
}

.seo-tool-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 2.75rem;
    border-radius: 13px;
    color: #fff;
    background: linear-gradient(135deg, var(--primary, #2563eb), var(--primary-dark, #1d4ed8));
}

.seo-tool-card strong,
.seo-tool-card small {
    display: block;
}

.seo-tool-card small {
    margin-top: .2rem;
    color: var(--ui-text-muted, #64748b);
}

[data-bs-theme="dark"] .seo-tool-card:hover,
[data-bs-theme="dark"] .seo-tool-card:focus-visible {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .28);
}

@media (max-width: 991.98px) {
    .seo-instruction-grid,
    .seo-benefit-grid,
    .seo-tools-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .seo-platform-hub-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .seo-platform-group .seo-tools-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .seo-benefit-card {
        min-height: 0;
    }
}

@media (max-width: 575.98px) {
    .seo-instruction-grid,
    .seo-benefit-grid,
    .seo-tools-grid,
    .seo-platform-hub-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .seo-section {
        padding: 1.1rem !important;
        border-radius: 16px;
    }

    .seo-breadcrumb {
        border-radius: 14px;
    }

    .seo-instruction-card,
    .seo-benefit-card,
    .seo-tool-card {
        min-height: 0;
    }
}
