:root {
    --black: #000;
    --white: #fff;
    --red: #862633;
    --gray: #F3F3F3;
    --dark-gray: #E5E5E5;
    --light-red: #9E4154;
}

@font-face {
    font-family: 'Poppins';
    src: url("/assets/fonts/Poppins-Light.ttf");
}

@font-face {
    font-family: 'Poppins-Bold';
    src: url("/assets/fonts/Poppins-Bold.ttf");
}

@font-face {
    font-family: 'LectorFSL';
    src: url("/assets/fonts/LectorFSL-Regular.otf");
}

@font-face {
    font-family: 'LectorFSL-Bold';
    src: url("/assets/fonts/LectorFSL-Bold.otf");
}


.poppins-bold {
    font-family: 'Poppins-Bold';
}

.poppins {
    font-family: 'Poppins';
}

.lector {
    font-family: 'LectorFSL';
}

.lector-bold {
    font-family: 'LectorFSL-Bold';
}


body {
    font-family: 'Times New Roman', Times, serif;
}


.colored-background {
    background: #A52C45;
    background: radial-gradient(circle, rgba(165, 44, 69, 1) 10%, rgba(255, 255, 255, 1) 45%);
}

.shadow-box-light-red {
    box-shadow: 0 10px 20px #E5E5E5, 0 4px 10px rgba(158, 65, 84, 0.2);
}

.header-background {
    background-image: url('/assets/images/header.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.opacity-background {
    background-image: url('/assets/images/bg-opacity.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Hamburger Menu Styles */
#mobile-menu.open {
    transform: translateX(-100%) !important;
}

#hamburger-btn.active .hamburger-line:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

#hamburger-btn.active .hamburger-line:nth-child(2) {
    opacity: 0;
}

#hamburger-btn.active .hamburger-line:nth-child(3) {
    transform: rotate(-45deg) translate(7px, -6px);
}

/* Navbar scroll transitions */
nav {
    transition: background-color 0.6s ease-in-out, box-shadow 0.6s ease-in-out;
}

/* Navbar scrolled state */
nav.scrolled {
    background-color: var(--white);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Speaker image selection */
.speaker-img {
    transition: transform 0.3s ease-in-out;
    transform: scale(1);
}

.speaker-img:hover,
.speaker-img.selected {
    transform: scale(1.1);
}

/* Speaker Carousel Styles */
.speaker-carousel-container {
    width: 100%;
    position: relative;
}

.speaker-carousel-track {
    display: flex;
    will-change: transform;
}

.speaker-carousel-slide {
    min-width: 100%;
}

.carousel-dot.active {
    opacity: 1 !important;
}