/**
 * IDSA district page template — public pilot / documentation surfaces.
 * Scoped under .idsa-district-page
 */

.idsa-district-page {
    max-width: 100%;
}

.idsa-district-pilot-banner {
    margin: 0;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid #fde68a;
    background: #fffbeb;
    color: #92400e;
    font-size: 0.88rem;
    line-height: 1.55;
    font-weight: 600;
}

.idsa-district-empty {
    margin: 0 0 10px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px dashed #cbd5e1;
    background: #f8fafc;
    color: #475569;
    font-size: 0.9rem;
    line-height: 1.55;
}

.idsa-district-section-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: 20px;
    align-items: start;
}

.idsa-district-section-grid--reverse .idsa-district-section-media {
    order: -1;
}

.idsa-district-section-copy h2.section-title {
    margin-top: 0;
}

.idsa-district-section-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 12px;
}

.idsa-district-section-links a {
    font-size: 0.86rem;
    font-weight: 700;
    color: #0c4da2;
    text-decoration: none;
}

.idsa-district-section-links a:hover,
.idsa-district-section-links a:focus-visible {
    text-decoration: underline;
    outline: none;
}

.idsa-district-snapshot-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
    gap: 12px;
    margin-top: 12px;
}

.idsa-district-snapshot-card {
    padding: 14px;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: #fff;
}

.idsa-district-snapshot-card h3 {
    margin: 0 0 8px;
    font-size: 0.92rem;
    color: #0f172a;
}

.idsa-district-snapshot-card p {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1.5;
    color: #64748b;
}

.idsa-district-flywheel {
    display: grid;
    gap: 8px;
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
}

.idsa-district-flywheel li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    background: #fff;
    font-size: 0.9rem;
    color: #334155;
    font-weight: 600;
}

.idsa-district-flywheel li::before {
    content: "→";
    color: #94a3b8;
    font-weight: 700;
}

.idsa-district-flywheel li:first-child::before {
    content: "●";
    color: #0c4da2;
}

.idsa-district-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.idsa-district-cluster-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
    gap: 12px;
    margin-top: 12px;
}

.idsa-district-cluster-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: #fff;
    text-decoration: none;
    color: inherit;
    min-height: 44px;
}

.idsa-district-cluster-card strong {
    font-size: 0.95rem;
    color: #0f172a;
}

.idsa-district-cluster-meta {
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
}

.idsa-district-cluster-card:hover,
.idsa-district-cluster-card:focus-visible {
    border-color: #93c5fd;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
    outline: none;
}

.idsa-district-cluster-card.is-current {
    border-color: #0c4da2;
    background: #eff6ff;
}

.idsa-district-cluster-card.is-current .idsa-district-cluster-meta {
    color: #0c4da2;
}

.idsa-district-partner-growth-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
    gap: 12px;
    margin-top: 12px;
}

.idsa-district-partner-growth-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: #fff;
    text-decoration: none;
    color: inherit;
    min-height: 44px;
}

.idsa-district-partner-growth-card strong {
    font-size: 0.95rem;
    color: #0f172a;
}

.idsa-district-partner-growth-card span {
    font-size: 0.82rem;
    line-height: 1.5;
    color: #64748b;
    font-weight: 600;
}

.idsa-district-partner-growth-card:hover,
.idsa-district-partner-growth-card:focus-visible {
    border-color: #93c5fd;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
    outline: none;
}

.idsa-eco-media--gradient-district {
    background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
}

.idsa-eco-media--gradient-district-business {
    background: linear-gradient(135deg, #0f766e 0%, #14b8a6 100%);
}

.idsa-eco-media--gradient-district-manufacturing {
    background: linear-gradient(135deg, #115e59 0%, #0d9488 100%);
}

.idsa-eco-media--gradient-district-partner {
    background: linear-gradient(135deg, #9f1239 0%, #fb7185 100%);
}

@media (max-width: 768px) {
    .idsa-district-section-grid,
    .idsa-district-section-grid--reverse {
        grid-template-columns: 1fr;
    }

    .idsa-district-section-grid--reverse .idsa-district-section-media {
        order: 0;
    }

    .idsa-district-cta-actions .btn {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 375px) {
    .idsa-district-pilot-banner {
        font-size: 0.84rem;
    }

    .idsa-district-snapshot-grid {
        grid-template-columns: 1fr;
    }
}