/* ─────────────────────────────────────────────
   Page : Catalogue des stations /station/carte
   ───────────────────────────────────────────── */

/* ── Hero ── */
.hero--station-catalogue {
    min-height: 380px;
    padding: 40px 0 60px;
}

.hero--station-catalogue .hero__container {
    position: relative;
    z-index: 2;
    max-width: var(--container-max-width, 1400px);
    width: 100%;
    padding: 0 40px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hero--station-catalogue .heading {
    opacity: 1;
    transform: none;
    pointer-events: auto;
}

@media (max-width: 768px) {
    .hero--station-catalogue {
        min-height: 220px;
    }
}

/* ── Contenu principal — aligne sur les marges du hero (40px) ── */
.station-catalogue__content {
    margin: 0 40px;
    padding: 3rem 0 4rem;
}

@media (max-width: 768px) {
    .station-catalogue__content {
        margin: 0 16px;
    }
}

/* ── Grille 4 colonnes ── */
.station-catalogue__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

@media (max-width: 1100px) {
    .station-catalogue__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .station-catalogue__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .station-catalogue__grid {
        grid-template-columns: 1fr;
    }
}

/* ── Card station ── */
.station-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: #fff;
    border: 1px solid var(--neutral-200, #e5e7eb);
    border-radius: 0.75rem;
    padding: 1.25rem 1.5rem;
    transition: box-shadow 0.2s ease;
}

.station-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

/* ── Entête card ── */
.station-card__header {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.station-card__name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-text, #111827);
    margin: 0;
    line-height: 1.3;
}

.station-card__country {
    font-size: 0.8125rem;
    color: var(--neutral-500, #6b7280);
    margin: 0;
}

/* ── Altitudes ── */
.station-card__altitudes {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    flex: 1;
}

.station-card__alt-row {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.875rem;
    margin: 0;
    color: var(--color-text, #111827);
}

.station-card__alt-icon {
    color: var(--color-primary, #d97706);
    width: 1rem;
    text-align: center;
    flex-shrink: 0;
}

.station-card__alt-label {
    color: var(--neutral-600, #4b5563);
}

.station-card__alt-value {
    color: var(--color-primary, #d97706);
    font-weight: 600;
}

/* ── Footer card (CTA) ── */
.station-card__footer {
    padding-top: 0.25rem;
}

.station-card__cta {
    display: inline-block;
    width: 100%;
    text-align: center;
}

/* ── États loader / fin ── */
.station-catalogue__loader,
.station-catalogue__end {
    grid-column: 1 / -1;
    text-align: center;
    padding: 2rem 0;
    color: var(--neutral-500, #6b7280);
}

/* ── Empty state ── */
.station-catalogue__empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 3rem;
    color: var(--neutral-500, #6b7280);
}