/* Colonne d'à côté du formulaire de contact : planche nuit relevée, collante sur grand écran. Les étapes
   « après l'envoi » reprennent la frise des pages machines (timeline.css, --column). */
.contact-aside {
    display: grid;
    gap: var(--space-7);
    padding: var(--space-6) var(--space-5);
    border-radius: var(--radius-lg);
}

.contact-aside h2 {
    font-size: var(--text-xl);
}

.contact-aside .timeline {
    margin-top: var(--space-6);
}

.contact-aside__direct {
    display: grid;
    gap: var(--space-4);
    padding-top: var(--space-6);
    border-top: 1px solid var(--rule);
}

.contact-aside__links {
    display: grid;
    gap: var(--space-3);
}

.contact-aside__links li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--space-3);
    align-items: center;
    font-size: var(--text-sm);
}

.contact-aside__links p {
    color: var(--text-secondary);
}

.contact-aside__links .icon-ring {
    width: 2.25rem;
    height: 2.25rem;
}

.contact-aside__links .icon-ring::after {
    width: 1.125rem;
    height: 1.125rem;
}

@media (min-width: 60rem) {
    .contact-aside {
        position: sticky;
        top: calc(var(--header-height) + var(--space-5));
        padding: var(--space-7) var(--space-6);
    }
}