/* --- Activity Timeline Layout --- */
.school-timeline { position: relative; padding: 20px 0; }
.school-timeline::before {
    content: ''; position: absolute; top: 0; bottom: 0; left: 24px;
    width: 4px; background: var(--primary); border-radius: 2px;
}
.timeline-dot {
    position: absolute; top: 34%; left: 24px; width: 24px; height: 24px;
    background: var(--accent-yellow); border: 4px solid #FFFFFF; border-radius: 50%;
    transform: translate(-50%, -50%); z-index: 2; box-shadow: var(--shadow-soft);
}
.timeline-row { position: relative; margin-bottom: 40px; width: 100%; }
.timeline-content { padding-left: 60px; width: 100%; box-sizing: border-box; }
.timeline-content .uk-card {
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
}
.timeline-content .uk-card:hover {
    transform: translateY(-12px) scale(1.02); 
    box-shadow: 0 30px 50px -15px rgba(0, 0, 0, 0.3), 0 0 30px rgba(37, 99, 235, 0.15) !important; 
    z-index: 10; position: relative;
}

@media (min-width: 960px) {
    .school-timeline::before, .timeline-dot { left: 50%; }
    .timeline-content { width: 50%; padding: 0; }
    .timeline-row:nth-child(odd) .timeline-content { padding-right: 50px; }
    .timeline-row:nth-child(even) .timeline-content { margin-left: 50%; padding-left: 50px; }
}

.timeline-date-opposite { display: none; }

@media (min-width: 960px) {
    .timeline-date-opposite {
        display: block; position: absolute; top: 34%; transform: translateY(-50%);
        width: 50%; box-sizing: border-box; font-size: 1.8rem; font-weight: 800; color: var(--accent-purple);
    }
    .timeline-row:nth-child(odd) .timeline-date-opposite { left: 50%; padding-left: 50px; text-align: left; }
    .timeline-row:nth-child(even) .timeline-date-opposite { right: 50%; padding-right: 50px; text-align: right; }
}