/* || Events & Promotions */
.promos { 
    background-color: var(--extra-light); 
    padding-block: 3rem; 
    overflow: hidden; 
}

.promos :is(.section_header, .section_description) { 
    padding-inline: 1rem; 
    margin-bottom: 1rem; 
}

.section_subheader { 
    text-align: center; 
    font-size: 1.5rem; 
    font-weight: 200; 
    color: var(--text-dark); 
    margin-top: 2rem; 
}

.promos_container { 
    padding-top: 0rem; 
    max-width: var(--max-width); 
    margin: auto; 
}

.events_wrapper, .promos_wrapper {
	margin-top: 1.5rem; 
    display: flex; 
    width: 300%; 
    align-items: center; 
    gap: 1rem; 
    animation: scroll-left 10s linear infinite;
}

.promo_card { 
    display: flex; 
    flex: 0 0 25%; 
    padding-inline: 1rem; 
    text-align: center; 
    max-width: 400px; 
    min-width: 220px; 
    flex-direction: column; 
}

.promo_card img { 
    max-width: 300px; 
    margin-bottom: 1rem; 
    border: 0.375rem solid var(--white); 
    box-shadow: 0 0 20px rgba(0, 0, 0, .1); 
    border-radius: .75rem; 
}

.promo_card h4 { 
    font-size: 1.2rem; 
    font-weight: 600; 
    color: var(--text-dark); 
}

.promo_card p { 
    width: 100%; 
    font-size: 1rem; 
    font-weight: 500; 
    color: var(--text-light); 
    line-height: 1.5rem; 
    margin-top: 0.5rem; 
}

.promo_btns { 
    display: flex; 
    justify-content: center; 
    padding-top: 2rem; 
    padding-bottom: 2rem; 
}

.promo_btns .btn { 
    background-color: transparent; 
    border: 2px solid var(--text-dark); 
    padding: 0.55rem 1.25rem; 
}

.promo_btns .btn:hover { 
    background-color: var(--primary-color); 
    transition: 1s; 
    border-radius: 100px; 
    color: var(--text-dark); 
}

@keyframes scroll-left { to { transform: translateX(calc(-50%)); } }