.lucide {
    stroke-width: 2px;
    stroke: currentColor;
}

.bg-gold-gradient {
    background: linear-gradient(135deg, #C5A059 0%, #F1D497 50%, #C5A059 100%);
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateX(40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.slide-animate {
    animation: slideIn 0.8s ease-out forwards;
}

.fade-in-up {
    animation: fadeInUp 0.6s ease-out forwards;
}

@keyframes progressWidth {
    from {
        width: 0%;
    }

    to {
        width: 100%;
    }
}

.progress-bar {
    animation: progressWidth 8s linear forwards;
}

@keyframes scrollLogos {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-33.33%);
    }
}

.logo-scroll {
    animation: scrollLogos 35s linear infinite;
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes v-progress {
    from {
        height: 0;
    }

    to {
        height: 100%;
    }
}

.v-progress-bar {
    animation: v-progress 8s linear forwards;
}

#main-nav {
    background: rgb(0 77 61 / 0.9) !important;
    backdrop-filter: blur(10px);
}


html.page-default-home #main-nav {
    background-color: transparent !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: 1px solid transparent;
    box-shadow: none;
    transition: background-color 420ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 420ms cubic-bezier(0.4, 0, 0.2, 1), backdrop-filter 420ms cubic-bezier(0.4, 0, 0.2, 1), border-color 420ms cubic-bezier(0.4, 0, 0.2, 1);
}

    html.page-default-home #main-nav.scrolled {
        color: white !important;
        background-color: rgb(15 87 73) !important;
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        box-shadow: 0 8px 28px rgba(0, 77, 61, 0.1);
        border-bottom-color: rgba(0, 77, 61, 0.08);
    }

        html.page-default-home #main-nav.scrolled .text-white\/80 {
            color: rgba(255, 255, 255, 0.78) !important;
        }


@media (prefers-reduced-motion: reduce) {
    html.page-default-home #main-nav {
        transition-duration: 0.01ms !important;
    }
}


#main-nav .main-nav-top-item .main-nav-active-bar {
    opacity: 0;
    transition: opacity 0.3s ease;
}

#main-nav .main-nav-top-item.nav-active .main-nav-active-bar {
    opacity: 1;
}

#main-nav .main-nav-top-item.nav-active > .relative .nav-section-trigger {
    color: #fff !important;
}

.animate-section:not(.is-visible) {
    opacity: 0;
    transform: translate3d(0, 2rem, 0);
    will-change: opacity, transform;
}

.animate-section.is-visible {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .animate-section:not(.is-visible),
    .animate-section.is-visible {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }
}


#timeline-progress {
    left: auto;
    right: 0;
    transition: width 850ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: width;
}

#timeline-track-inner {
    position: relative;
}

#timeline-year-slot {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 10;
}

@media (max-width: 767.98px) {
    #timeline-section {
        overflow-x: hidden;
        max-width: 100%;
    }

    #timeline-section > .container {
        max-width: 100%;
        min-width: 0;
    }

    #timeline-section .max-w-6xl {
        max-width: 100%;
        min-width: 0;
    }

    #timeline-track {
        box-sizing: border-box;
        width: auto;
        max-width: none;
        min-width: 0;
        margin-left: -1.5rem;
        margin-right: -1.5rem;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        scrollbar-width: thin;
        scrollbar-color: rgba(197, 160, 89, 0.85) rgba(255, 255, 255, 0.1);
        padding-bottom: 0.35rem;
    }

    #timeline-track::-webkit-scrollbar {
        height: 5px;
    }

    #timeline-track::-webkit-scrollbar-track {
        background: rgba(255, 255, 255, 0.08);
        border-radius: 9999px;
    }

    #timeline-track::-webkit-scrollbar-thumb {
        background: rgba(197, 160, 89, 0.85);
        border-radius: 9999px;
    }

    #timeline-track-inner {
        display: block;
        width: max-content;
        min-width: 100%;
        padding-top: 0.35rem;
        padding-bottom: 1.15rem;
    }

    #timeline-year-slot {
        justify-content: flex-start;
        gap: 1.25rem;
        width: max-content;
        min-width: 100%;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-sizing: border-box;
    }

    #timeline-track .timeline-year-btn {
        flex: 0 0 auto;
        max-width: none;
    }
}

@media (min-width: 768px) {
    #timeline-track {
        overflow: visible;
    }

    #timeline-track-inner,
    #timeline-year-slot {
        display: flex;
        width: 100%;
        min-width: 0;
        justify-content: space-between;
        align-items: center;
    }
}

#timeline-active-dot {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 9999px;
    background: #c5a059;
    box-shadow: 0 0 14px rgba(197, 160, 89, 0.85);
    transform: translateX(-50%);
    z-index: 25;
    opacity: 0;
    transition: left 850ms cubic-bezier(0.22, 1, 0.36, 1), top 850ms cubic-bezier(0.22, 1, 0.36, 1), opacity 220ms ease;
}

#timeline-track.is-dot-visible #timeline-active-dot {
    opacity: 1;
}

.timeline-year-btn.active > div {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.35), 0 25px 50px -12px rgba(0, 0, 0, 0.35);
}

#timeline-content-panel {
    --animate-duration: 0.55s;
    transition: border-color 0.55s ease, box-shadow 0.55s ease;
}

@media (prefers-reduced-motion: reduce) {
    #timeline-progress,
    #timeline-active-dot,
    #timeline-content-panel {
        transition: none !important;
    }

        #timeline-content-panel.animate__animated {
            animation: none !important;
        }
}

#page-loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.75rem;
    background-color: rgb(15, 87, 73);
    transition: opacity 0.65s ease, visibility 0s linear 0s;
}

    #page-loader.is-hidden {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.65s ease, visibility 0s linear 0.65s;
    }

@keyframes loader-logo-pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
        filter: drop-shadow(0 0 14px rgba(197, 160, 89, 0.55)) drop-shadow(0 0 32px rgba(197, 160, 89, 0.35)) drop-shadow(0 0 48px rgba(241, 212, 151, 0.2)) drop-shadow(0 12px 28px rgba(0, 0, 0, 0.3));
    }

    50% {
        opacity: 0.94;
        transform: scale(1.06);
        filter: drop-shadow(0 0 22px rgba(197, 160, 89, 0.85)) drop-shadow(0 0 42px rgba(241, 212, 151, 0.45)) drop-shadow(0 0 64px rgba(197, 160, 89, 0.25)) drop-shadow(0 14px 32px rgba(0, 0, 0, 0.25));
    }
}

.page-loader-logo {
    width: clamp(7rem, 22vw, 11rem);
    height: auto;
    object-fit: contain;
    animation: loader-logo-pulse 3.4s ease-in-out infinite;
}

.page-loader-title {
    margin: 0;
    margin-top: 0.25rem;
    padding: 0 1.5rem;
    text-align: center;
    font-weight: 900;
    font-size: clamp(1.1rem, 3vw, 1.6rem);
    letter-spacing: 0.03em;
    color: rgba(255, 255, 255, 0.98);
    text-shadow: 0 0 20px rgba(197, 160, 89, 0.35), 0 2px 12px rgba(0, 0, 0, 0.25);
}

.page-loader-tagline {
    margin: 0;
    margin-top: -0.35rem;
    padding: 0 1.5rem;
    text-align: center;
    font-weight: 800;
    font-size: clamp(0.95rem, 2.6vw, 1.2rem);
    letter-spacing: 0.02em;
    color: rgba(241, 212, 151, 0.95);
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.2);
}

.page-loader-progress {
    width: min(11rem, 72vw);
    height: 3px;
    margin-top: -0.25rem;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.12);
    overflow: hidden;
}

.page-loader-progress-bar {
    display: block;
    height: 100%;
    width: 100%;
    border-radius: inherit;
    background: linear-gradient(270deg, #C5A059 0%, #F1D497 55%, #e8c77a 100%);
    transform: scaleX(0);
    transform-origin: 100% 50%;
    animation: page-loader-progress-fill 2s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}

@keyframes page-loader-progress-fill {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .page-loader-logo {
        animation: none;
        filter: drop-shadow(0 0 16px rgba(197, 160, 89, 0.65)) drop-shadow(0 0 36px rgba(197, 160, 89, 0.35)) drop-shadow(0 12px 28px rgba(0, 0, 0, 0.3));
    }

    #page-loader.is-hidden {
        transition: none;
    }

    .page-loader-progress-bar {
        animation: none;
        transform: scaleX(1);
    }
}

a:hover .fa-facebook-f {
    color: #1877f2;
}

a:hover .fa-twitter {
    color: #1da1f2;
}

a:hover .fa-youtube {
    color: #ff0000;
}

a:hover .fa-linkedin-in {
    color: #0077b5;
}


html {
    overflow-y: scroll;
    scrollbar-width: thin;
    scrollbar-color: #004d3d #eceff1;
}

body {
    scrollbar-width: thin;
    scrollbar-color: #004d3d #eceff1;
}

    html::-webkit-scrollbar,
    body::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    html::-webkit-scrollbar-track,
    body::-webkit-scrollbar-track {
        background-color: #eceff1;
    }

    html::-webkit-scrollbar-thumb,
    body::-webkit-scrollbar-thumb {
        background-color: #004d3d;
        border-radius: 6px;
        border: 2px solid #eceff1;
    }

        html::-webkit-scrollbar-thumb:hover,
        body::-webkit-scrollbar-thumb:hover {
            background-color: #00362b;
        }

.hidden-model {
    display: none !important;
}