.timeline {
    background-color: var(--color-bg-secondary);
    position: relative;
    overflow: hidden;
}

.timeline::before,
.timeline::after {
    content: '';
    position: absolute;
    width: 180px;
    height: 180px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='%23B8860B'%3E%3Cpath d='M56.316 23.272c4.141 1.969 9.418 2.686 12.909 3.16 1.665.227 2.98.405 3.628.632a.497.497 0 0 0 .549-.152.499.499 0 0 0 .052-.566c-.136-.239-3.404-5.896-11.015-9.158-7.605-3.259-14.149-1.815-14.425-1.751a.5.5 0 0 0-.303.767c.122.178 3.018 4.413 8.605 7.068zm5.729-5.164c5.387 2.309 8.551 5.945 9.848 7.707a65.943 65.943 0 0 0-2.532-.373c-3.43-.467-8.614-1.172-12.614-3.072-4.079-1.939-6.704-4.825-7.724-6.092 1.935-.271 7.202-.665 13.022 1.83zm25.442 13.715c-.539-6.607-2.22-10.393-2.697-11.349a74.787 74.787 0 0 0 2.703-6.09.5.5 0 1 0-.931-.365 72.281 72.281 0 0 1-7.375 14.079c-2.357 1.343-5.268 2.481-8.383 3.44-1.355-.824-6.629-3.383-18.091-1.933-14.698 1.855-21.109 9.004-22.723 11.15l.378.329-.399-.301a.5.5 0 0 0 .356.799c.071.006 3.905.33 8.986.33 4.475 0 9.916-.251 14.604-1.19 9.417-1.886 17.185-8.097 17.262-8.159.039-.031.063-.074.09-.115 2.385-.746 4.654-1.6 6.665-2.575-9.915 13.79-23.453 22.244-35.826 27.4a27.342 27.342 0 0 1-1.483-.176c-3.601-.482-11.092-1.487-19.018.474-7.563 1.869-16.235 7.917-16.982 8.913a.63.63 0 0 0-.001.751c.688 1.005 6.68 2.587 13.284 2.587 2.837 0 5.789-.292 8.479-1.048 9.263-2.602 15.449-9.752 16.148-10.587a99.484 99.484 0 0 0 10.545-5.137c-1.253 3.075-5.535 9.857-8.872 13.144-.022-.014-.041-.03-.064-.044l-.001-.001a7.294 7.294 0 0 0-5.47-.85c-2.475.593-4.651 2.429-6.468 5.458-4.585 7.644-2.198 12.96.525 14.669.924.58 1.997.873 3.166.873a8.03 8.03 0 0 0 1.964-.256c3.29-.831 6.777-3.646 8.679-7.002 2.811-4.963 2.246-9.374-1.502-12.265 3.684-3.707 8.727-11.789 9.328-14.464a91.32 91.32 0 0 0 2.936-1.795c.406 1.247.602 4.088.764 6.435.06.874.119 1.716.185 2.467-1.239.155-2.957.897-4.469 2.367-1.488 1.445-3.262 4.066-3.261 8.341.001 8.099 4.092 11.902 7.893 12.01l.161.002c1.66 0 3.27-.725 4.662-2.102 2.396-2.368 3.902-6.368 3.838-10.19-.106-6.209-3.022-10.064-7.82-10.425-.069-.767-.13-1.635-.192-2.538-.229-3.337-.426-5.725-.903-6.924 5.11-3.345 10.09-7.369 14.621-12.21-1.53 5.426-3.186 15.112-1.983 25.428.763 6.532 2.087 11.293 2.798 13.85.191.688.332 1.19.393 1.493a.499.499 0 0 0 .965.059c1.446-4.367 3.901-15.419 3.306-22.397-.785-9.19-4.878-12.894-5.614-13.489.541-2.812 1.174-5.114 1.723-6.697a72.286 72.286 0 0 0 9.839-14.382c.64 1.511 1.839 4.95 2.278 10.222a6.857 6.857 0 0 0-4.235 2.041c-1.737 1.772-2.582 4.441-2.511 7.932.178 8.692 4.791 11.845 7.851 11.845h.004c1.567-.001 3.079-.718 4.372-2.071 2.278-2.385 3.693-6.553 3.521-10.372-.258-5.796-3.169-9.185-7.998-9.389zm-33.768 7.919c-8.347 1.671-19.152 1.128-22.366.914 2.224-2.614 8.52-8.422 21.484-10.06 9.364-1.181 14.48.404 16.573 1.354-10.833 3.101-23.417 4.152-23.586 4.165a.5.5 0 0 0 .039.998l.041-.002c.667-.054 12.136-1.013 22.608-3.86-2.861 1.928-8.439 5.218-14.793 6.491zm-8.051 38.807c-1.774 3.134-5.011 5.756-8.053 6.524-1.66.421-3.168.25-4.354-.495-2.39-1.499-4.414-6.28-.199-13.308 1.674-2.79 3.64-4.472 5.843-4.999a6.247 6.247 0 0 1 4.705.723c4.031 2.536 4.781 6.747 2.058 11.555zm20.405-8.684c.06 3.507-1.364 7.31-3.541 9.462-1.239 1.225-2.66 1.827-4.093 1.811-3.332-.094-6.919-3.579-6.92-11.01-.001-3.926 1.608-6.312 2.957-7.623 1.507-1.464 3.234-2.117 4.239-2.117l.063.001c4.536.131 7.195 3.585 7.295 9.476zm-39.956-2.053c-8.43 2.366-18.597.042-20.435-.98 1.561-1.353 9.258-6.582 16.164-8.289 7.542-1.865 14.719-.976 18.355-.492-12.857 5.066-24.135 6.628-28.226 7.051a.499.499 0 1 0 .104.994c4.106-.424 15.376-1.979 28.263-7.024-2.4 2.405-7.541 6.862-14.225 8.74zm51.145-11.544c.518 6.069-1.332 15.32-2.75 20.325-.714-2.568-1.984-7.215-2.721-13.531-.83-7.113-.28-13.928.64-19.206 1.187 1.185 4.186 4.877 4.831 12.412zm13.979-5.376c-1.101 1.151-2.362 1.761-3.649 1.762h-.004c-2.666 0-6.688-2.893-6.851-10.864-.065-3.212.684-5.639 2.226-7.212 1.613-1.646 3.518-1.774 4.063-1.774 4.501 0 7.22 3.081 7.461 8.452.159 3.563-1.144 7.436-3.246 9.636zm.441-12.535a.501.501 0 0 1 .312-.635.505.505 0 0 1 .635.312c.315.926.505 2.029.561 3.279.013.275-.2.51-.477.521l-.022.001a.499.499 0 0 1-.499-.478c-.053-1.154-.224-2.163-.51-3zm1.38 5.362c-.362 2.499-1.395 4.845-2.762 6.276a.5.5 0 0 1-.723-.692c1.229-1.286 2.161-3.428 2.494-5.728a.51.51 0 0 1 .566-.424.503.503 0 0 1 .425.568zM45.334 74.633a.5.5 0 0 1 .346.617c-.241.854-.625 1.748-1.143 2.659a.5.5 0 1 1-.87-.494c.477-.841.83-1.66 1.049-2.437a.501.501 0 0 1 .618-.345zm-2.159 4.436a.502.502 0 0 1 .062.705c-1.582 1.889-3.685 3.366-5.625 3.952a.502.502 0 0 1-.624-.334.499.499 0 0 1 .334-.623c1.762-.532 3.686-1.892 5.146-3.638a.504.504 0 0 1 .707-.062zm17.809-.732a.5.5 0 0 1-.006-.707c1.721-1.751 2.845-4.856 2.796-7.727a.5.5 0 0 1 .491-.509h.009a.5.5 0 0 1 .5.491c.053 3.122-1.187 6.516-3.083 8.445a.497.497 0 0 1-.356.149.489.489 0 0 1-.351-.142z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    opacity: 0.08;
    z-index: 0;
}

.timeline::before {
    top: -20px;
    left: -40px;
    transform: rotate(15deg);
}

.timeline::after {
    bottom: -20px;
    right: -40px;
    transform: rotate(-165deg);
}

.timeline__track {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-lg);
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--space-lg);
    position: relative;
}

.timeline__track::before {
    content: '';
    position: absolute;
    top: 50%;
    left: var(--space-xl);
    right: var(--space-xl);
    height: 2px;
    background: var(--color-primary);
    opacity: 0.3;
    z-index: 1;
}

@media (max-width: 1023px) {
    .timeline__track::before {
        display: none;
    }
}

.timeline__item-wrap {
    width: calc(50% - var(--space-md));
    position: relative;
    z-index: 2;
}

@media (min-width: 768px) {
    .timeline__item-wrap {
        width: calc(33.333% - var(--space-lg));
    }
}

@media (min-width: 1024px) {
    .timeline__item-wrap {
        width: auto;
        flex: 1;
        max-width: 180px;
    }
}

.timeline__item {
    background: var(--color-bg-surface);
    padding: var(--space-lg);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 160px;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    border: 1px solid var(--color-border);
    transition: box-shadow var(--transition-fast);
}

.timeline__item:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.timeline__marker {
    width: 40px;
    height: 40px;
    background: var(--color-primary);
    opacity: 0.1;
    margin-bottom: var(--space-sm);
}

.timeline__time {
    display: block;
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    line-height: 1;
    margin-bottom: var(--space-xs);
}

.timeline__title {
    font-family: var(--font-heading);
    font-size: 0.95rem;
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-heading);
    margin-bottom: var(--space-2xs);
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.timeline__description {
    font-size: 0.85rem;
    color: var(--color-text-body);
    line-height: 1.5;
    margin: 0;
    max-width: 180px;
}