* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            background-color: #000;
            color: #fff;
            font-family: 'Arial', sans-serif;
            overflow-x: hidden;
            overflow-y: hidden; /* prevent vertical scroll inside iframe */
            height: 100vh; /* ensure it fits exactly in the iframe */
        }

        .awards-section {
            position: relative;
            background: #000;
            width: 100%;
            max-width: 100vw;
            overflow-x: hidden;
        }

        .awards-container {
            position: sticky;
            top: 0;
            height: 100vh;
            overflow: hidden;
            overflow-x: hidden;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 0 20px;
            gap: 24px;
        }

        .section-title {
            position: absolute;
            top: 70px;
            left: 50%;
            transform: translateX(-50%);
            font-size: 2.5rem;
            font-weight: bold;
            color: #fff;
            z-index: 100;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
            letter-spacing: 2px;
            text-align: center;
        }

        .timeline-wrapper {
            width: 100%;
            height: auto;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: visible;
            max-width: 100vw;
        }

        /* Remove timeline line and its dots */
        .timeline-line {
            display: none;
        }

        /* Auto-scrolling carousel for awards */
        .awards-carousel {
            --items: 11;
            --carousel-duration: 30s;
            --carousel-width: min(92vw, 1200px);
            --carousel-item-width: 18rem;
            --carousel-item-height: 24rem;
            --carousel-item-gap: 1.2rem;
            position: relative;
            width: var(--carousel-width);
            height: var(--carousel-item-height);
            overflow: clip;
            -webkit-mask-image: linear-gradient(to right, transparent, black 10% 90%, transparent);
            mask-image: linear-gradient(to right, transparent, black 10% 90%, transparent);
        }

/* Tap pause/resume support */
.awards-carousel.paused > .award-card { animation-play-state: paused; }
@media (hover: hover) and (pointer: fine) {
    .awards-carousel:hover > .award-card { animation-play-state: paused; }
}
@media (hover: none) {
    .awards-carousel:hover > .award-card { animation-play-state: running; }
}

        .awards-carousel .award-card {
            position: absolute;
            top: 0;
            left: calc(100% + var(--carousel-item-gap));
            width: var(--carousel-item-width);
            height: var(--carousel-item-height);
            background: rgba(20, 20, 20, 0.15);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 15px;
            padding: 24px 18px;
            text-align: center;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8);
            backdrop-filter: blur(10px);
            overflow: hidden;
            opacity: 1;
            pointer-events: auto;
            filter: none;
            will-change: transform;
            animation-name: awards-marquee;
            animation-duration: var(--carousel-duration);
            animation-timing-function: linear;
            animation-iteration-count: infinite;
            animation-delay: calc((var(--carousel-duration) / var(--items)) * var(--i) * -1);
        }

        .awards-carousel .award-card:nth-child(1) { --i: 0; }
        .awards-carousel .award-card:nth-child(2) { --i: 1; }
        .awards-carousel .award-card:nth-child(3) { --i: 2; }
        .awards-carousel .award-card:nth-child(4) { --i: 3; }
        .awards-carousel .award-card:nth-child(5) { --i: 4; }
        .awards-carousel .award-card:nth-child(6) { --i: 5; }
        .awards-carousel .award-card:nth-child(7) { --i: 6; }
        .awards-carousel .award-card:nth-child(8) { --i: 7; }
        .awards-carousel .award-card:nth-child(9) { --i: 8; }
        .awards-carousel .award-card:nth-child(10){ --i: 9; }
        .awards-carousel .award-card:nth-child(11){ --i: 10; }

        @keyframes awards-marquee {
            100% {
                transform: translateX(
                    calc((var(--items) * (var(--carousel-item-width) + var(--carousel-item-gap))) * -1)
                );
            }
        }

        /* Remove old stack visibility classes impact */
        .award-card.visible { opacity: 1; }

        .award-card::before {
            content: '';
            position: absolute;
            top: -2px;
            left: -2px;
            right: -2px;
            bottom: -2px;
            background: transparent;
            border-radius: 15px;
            pointer-events: none;
            z-index: -1;
        }

        /* Remove particle edges */
        .award-card .card-particles { display: none; }

        /* Disable old stack transforms */
        .award-card.active,
        .award-card.prev1,
        .award-card.prev2,
        .award-card.next1,
        .award-card.next2,
        .award-card.stack-far {
            transform: none;
            z-index: auto;
            filter: none;
            opacity: 1;
        }

        .award-card.prev1 {
            transform: translateX(-120px) translateZ(-20px) rotateY(15deg) scale(0.95);
            opacity: 0.8;
            z-index: 7;
        }

        .award-card.prev2 {
            transform: translateX(-240px) translateZ(-40px) rotateY(25deg) scale(0.9);
            opacity: 0.5;
            z-index: 5;
            filter: blur(1px);
        }

        .award-card.next1 {
            transform: translateX(120px) translateZ(-20px) rotateY(-15deg) scale(0.95);
            opacity: 0.8;
            z-index: 7;
        }

        .award-card.next2 {
            transform: translateX(240px) translateZ(-40px) rotateY(-25deg) scale(0.9);
            opacity: 0.5;
            z-index: 5;
            filter: blur(1px);
        }

        /* Hide all other cards */
        .award-card.stack-far {
            opacity: 0;
            pointer-events: none;
            z-index: 1;
            filter: blur(2px);
        }

        .award-icon {
            width: 140px;
            height: 110px;
            margin: 0 auto 24px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            background: transparent;
            position: relative;
        }

        .award-icon img {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensures image fills without distortion */
            border-radius: 10px;
            box-shadow: none;
            transition: box-shadow 0.3s ease;
            position: relative;
            z-index: 1; /* ensure image sits above glow */
        }

        .award-card.active .award-icon {
            transform: scale(1.05);
        }

        /* Lumen-style glow starting under the award date */
        .award-date { position: relative; z-index: 1; }
        .award-date::before,
        .award-date::after {
            content: '';
            position: absolute;
            top: 100%; /* start just below the date line */
            pointer-events: none;
            opacity: 0; /* hidden until hover */
            transition: opacity 0.35s ease;
            z-index: 0;
        }

        /* Lumen (glow) layer under date */
        .award-date::before {
            left: -20%;
            right: -20%;
            height: 160%;
            border-radius: 0 0 50% 50%;
            filter: blur(16px);
            background: radial-gradient(ellipse at 50% 0%, rgba(255,255,255,0.6), rgba(255,255,255,0.0) 60%);
        }

        /* Slit line under date */
        .award-date::after {
            left: 18%;
            right: 18%;
            height: 1.2rem;
            background: #121212;
            border-radius: 0.4rem;
            box-shadow: 0 0 4px 0 #fff0;
            transform: perspective(400px) rotateX(-76deg);
            transition: box-shadow 0.35s ease, background 0.35s ease, opacity 0.35s ease;
        }

        .awards-carousel .award-card:hover .award-date::before { opacity: 0; }
        .awards-carousel .award-card:hover .award-date::after { opacity: 0; }

        /* Disable lumen/glow and slit entirely */
        .award-icon::before,
        .award-icon::after,
        .award-date::before,
        .award-date::after {
            content: none !important;
            display: none !important;
        }

        .award-date {
            color: #bbb;
            font-size: 0.9rem;
            font-weight: bold;
            margin-bottom: 15px;
            text-transform: uppercase;
            letter-spacing: 1px;
            border-bottom: 1px solid #333;
            padding-bottom: 10px;
        }

        .award-card.active .award-date {
            color: #fff;
        }

        .award-title {
            font-size: 1.4rem;
            font-weight: bold;
            margin-bottom: 15px;
            color: #fff;
            line-height: 1.3;
        }

        .award-event {
            color: #999;
            font-size: 1rem;
            font-weight: 600;
            margin-bottom: 20px;
            line-height: 1.4;
        }

        .award-card.active .award-event {
            color: #ccc;
        }

        .award-description {
            color: #777;
            font-size: 0.9rem;
            line-height: 1.6;
            margin-bottom: 15px;
        }

        .award-card.active .award-description {
            color: #aaa;
        }

        .award-value {
            color: #fff;
            font-weight: bold;
            margin-top: 15px;
            padding: 10px;
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.05);
            position: relative;
            overflow: hidden;
        }

        .award-card.active .award-value {
            background: rgba(255, 255, 255, 0.1);
        }

        /* Card particle system */
        .card-particle { display: none; }

        @keyframes cardParticleFloat {}

        @media (prefers-reduced-motion: reduce) {
            .award-card,
            .progress-dot {
                transition: none;
            }
            .card-particle {
                animation: none;
            }
            .awards-container,
            .award-card {
                backdrop-filter: none;
            }
        }

        /* Progress indicator */
        .progress-indicator {
            position: absolute;
            bottom: 50px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 10px;
            z-index: 50;
        }

        .progress-dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: #333;
            border: 1px solid #555;
            transition: all 0.3s ease;
            cursor: pointer;
        }

        .progress-dot.active {
            background: #fff;
            border-color: #fff;
            transform: scale(1.2);
        }

        /* Noise texture overlay */
        .noise-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            opacity: 0.03;
            pointer-events: none;
            background-image: 
                radial-gradient(circle at 25% 25%, #fff 1px, transparent 1px),
                radial-gradient(circle at 75% 75%, #fff 1px, transparent 1px);
            background-size: 100px 100px;
            background-position: 0 0, 50px 50px;
            animation: noiseMove 20s linear infinite;
        }

        @keyframes noiseMove {
            0% { transform: translate(0, 0); }
            100% { transform: translate(100px, 100px); }
        }


        .youtube-badge {
            position: absolute;
            left: 10px;
            top: 50%;
            transform: translateY(-50%);
            z-index: 2;
            background: rgba(0,0,0,0.12);
            border-radius: 50%;
            padding: 2px;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 2px 8px rgba(0,0,0,0.18);
            transition: box-shadow 0.2s;
        }

        .award-icon a:hover .youtube-badge {
            box-shadow: 0 4px 16px rgba(255,0,0,0.25);
        }


/* Responsive design */
        @media (max-width: 768px) {
            .section-title {
                font-size: 2rem;
                top: 120px;
                left: 50%;
                transform: translateX(-50%);
                text-align: center;
            }

            .awards-container {
                padding: 0 10px;
            }

            .awards-stack {
                width: 240px;
                height: 320px;
            }

            .award-card {
                padding: 15px 12px;
            }

            .award-icon {
                width: 80px;
                height: 65px;
                margin: 0 auto 12px;
            }

            .award-date {
                font-size: 0.75rem;
                margin-bottom: 8px;
                padding-bottom: 6px;
            }

            .award-title {
                font-size: 1rem;
                margin-bottom: 8px;
                line-height: 1.2;
            }

            .award-event {
                font-size: 0.8rem;
                margin-bottom: 10px;
                line-height: 1.3;
            }

            .award-description {
                font-size: 0.75rem;
                margin-bottom: 8px;
                line-height: 1.4;
            }

            .award-value {
                font-size: 0.8rem;
                margin-top: 8px;
                padding: 6px;
            }


            .progress-indicator {
                bottom: 50px;
            }

            .progress-dot {
                width: 8px;
                height: 8px;
            }

            .award-card.next1 {
                transform: translateX(-60px);
            }

            .award-card.prev1{
                transform: translateX(60px);
            }

            .award-card.next2 {
                transform: translateX(-120px);
            }

            .award-card.prev2{
                transform: translateX(120px);
            }
            
            /* .award-card.prev2,
            .award-card.next2 {
                display: none;
            } */

            .youtube-badge {
                padding: 1px;
                left: 5px;
            }

            .youtube-badge svg {
                width: 16px;
                height: 16px;
            }
        }

        @media (max-width: 480px) {
            .award-card.prev2,
            .award-card.next2 {
                display: none;
            }
        }