/* Stage 9 — Problem / Error / Long-tail authority */
.s9-problem-authority {
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%)
}

.s9-diagnostic-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 28px
}

.s9-diagnostic-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    padding: 20px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .06)
}

.s9-diagnostic-card h3 {
    margin: 0 0 10px;
    font-size: 1rem;
    color: #111827
}

.s9-diagnostic-card p {
    margin: 0;
    color: #4b5563;
    line-height: 1.7
}

.s9-problem-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-top: 24px
}

.s9-note-box,
.s9-warning-box {
    border-radius: 20px;
    padding: 22px;
    border: 1px solid #e5e7eb;
    background: #fff
}

.s9-warning-box {
    border-color: #fed7aa;
    background: #fffaf5
}

.s9-note-box h3,
.s9-warning-box h3 {
    margin: 7px 0 14px;
    font-size: 1.08rem
}

.s9-note-box ul,
.s9-warning-box ul {
    margin: 0;
    padding-left: 20px;
    color: #374151
}

.s9-note-box li,
.s9-warning-box li {
    margin: 8px 0;
    line-height: 1.6
}

.s9-network-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 24px
}

.s9-network-box {
    background: #0f172a;
    border-radius: 18px;
    padding: 20px;
    color: #fff
}

.s9-network-box>strong {
    display: block;
    margin-bottom: 12px;
    font-size: 1rem
}

.s9-link-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.s9-link-cloud a {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    color: #fff;
    text-decoration: none;
    font-size: .88rem;
    line-height: 1.25;
    background: rgba(255, 255, 255, .06)
}

.s9-link-cloud a:hover {
    background: rgba(255, 255, 255, .14)
}

.s9-link-cloud .s9-all-link {
    border-style: dashed
}

@media (max-width:980px) {
    .s9-diagnostic-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .s9-network-grid {
        grid-template-columns: 1fr
    }
}

@media (max-width:680px) {

    .s9-diagnostic-grid,
    .s9-problem-split {
        grid-template-columns: 1fr
    }

    .s9-diagnostic-card,
    .s9-note-box,
    .s9-warning-box,
    .s9-network-box {
        border-radius: 16px;
        padding: 18px
    }
}