/* /support/connectors/: the support page's shell with a wider card for reading. */

.guide-card {
    max-width: 46rem;
    font-size: 1.12rem;
    line-height: 1.55;
}

.guide-card h2 {
    font-family: 'Crimson Text', Georgia, 'Times New Roman', serif;
    font-size: 1.55rem;
    color: #0c1f3d;
    margin: 2rem 0 0.5rem;
}

.guide-card h3 {
    font-family: 'Crimson Text', Georgia, 'Times New Roman', serif;
    font-size: 1.25rem;
    color: #0c1f3d;
    margin: 1.4rem 0 0.4rem;
}

.guide-card p,
.guide-card li {
    color: #334155;
}

.guide-card ol,
.guide-card ul {
    padding-left: 1.4rem;
}

.guide-card li {
    margin-bottom: 0.4rem;
}

.guide-card a {
    color: #0c1f3d;
}

.guide-card code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.88em;
    background: #f1f5f9;
    border-radius: 4px;
    padding: 0.05rem 0.3rem;
}

.guide-code {
    background: #f1f5f9;
    border-radius: 10px;
    padding: 0.8rem 1rem;
    overflow-x: auto;
}

.guide-code code {
    background: none;
    padding: 0;
}

.guide-note {
    font-size: 1rem;
    color: #64748b;
}

.guide-tools {
    width: 100%;
    border-collapse: collapse;
    margin: 0.75rem 0 0.5rem;
}

.guide-tools th,
.guide-tools td {
    text-align: left;
    padding: 0.65rem 0.5rem;
    border-bottom: 1px solid #e2e8f0;
    vertical-align: top;
}

.guide-tools th {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #64748b;
}

.guide-tools td strong {
    color: #0c1f3d;
}

.guide-tool-summary {
    display: block;
    font-size: 1rem;
    color: #475569;
    margin-top: 0.2rem;
}

.guide-cost {
    text-align: right;
    white-space: nowrap;
}

@media (max-width: 640px) {
    .guide-cost {
        white-space: normal;
    }
}
