.page-branches {
    background:
        linear-gradient(180deg, rgba(0, 214, 255, 0.08), transparent 42%),
        linear-gradient(135deg, var(--color-void), #08121a);
}

.branch-selector {
    width: min(100%, var(--content-max));
    margin: 0 auto;
    padding: clamp(2rem, 6vw, 5rem) clamp(1rem, 4vw, 2rem);
}

.branch-selector__intro {
    max-width: 850px;
    margin-bottom: 2rem;
}

.branch-selector__kicker {
    margin-bottom: 0.75rem;
    color: var(--color-green);
    font-size: 0.9rem;
    font-weight: 900;
    text-transform: uppercase;
}

.branch-selector h1 {
    margin-bottom: 1rem;
}

.branch-selector__intro p {
    color: var(--color-silver);
    font-size: 1.05rem;
}

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

.branch-card--association {
    background:
        linear-gradient(180deg, rgba(0, 214, 255, 0.12), rgba(7, 17, 25, 0.88)),
        rgba(7, 17, 25, 0.82);
}

.branch-card--foundation {
    background:
        linear-gradient(180deg, rgba(216, 227, 236, 0.09), rgba(7, 17, 25, 0.88)),
        rgba(7, 17, 25, 0.82);
}

.branch-card--operations {
    background:
        linear-gradient(180deg, rgba(77, 226, 125, 0.08), rgba(7, 17, 25, 0.88)),
        rgba(7, 17, 25, 0.82);
}

@media (max-width: 960px) {
    .branch-selector__grid {
        grid-template-columns: 1fr;
    }

    .branch-card {
        min-height: 280px;
    }
}