/* Explain: Container, grid, and spacing utility classes. - */
.section-pad {
    padding-block: clamp(5rem, 10vw, 8rem);
}

.container-wide {
    width: min(100% - 2.5rem, 1400px);
    margin-inline: auto;
}

.container-narrow {
    width: min(100% - 2rem, 900px);
    margin-inline: auto;
}

.anchor-offset {
    scroll-margin-top: 5rem;
}

.grid-tech {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.timeline-line::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--border-color);
}

@media (min-width: 768px) {
    .timeline-line::before {
        left: 50%;
        transform: translateX(-50%);
    }
}