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

        html{
            scroll-behavior:smooth;
        }

        body{
            font-family:'Poppins', sans-serif;
            background:#050505;
            color:#fff;
            overflow-x:hidden;
            overflow-y:auto;
            min-height:100vh;
            position:relative;
        }

        /* BACKGROUND IMAGE */

        body::before{
            content:'';
            position:fixed;
            inset:0;
            background:
            linear-gradient(rgba(0,0,0,.80), rgba(0,0,0,.92)),
            url('ellite(1).jpeg');
            background-size:cover;
            background-position:center;
            z-index:-3;
            animation:zoomBackground 18s ease-in-out infinite alternate;
        }

        body::after{
            content:'';
            position:fixed;
            inset:0;
            background:
            radial-gradient(circle at top left, rgba(212,164,55,.18), transparent 35%),
            radial-gradient(circle at bottom right, rgba(212,164,55,.10), transparent 30%);
            z-index:-2;
        }

        @keyframes zoomBackground{

            from{
                transform:scale(1);
            }

            to{
                transform:scale(1.08);
            }

        }

        /* FLOATING LIGHTS */

        .light{
            position:fixed;
            border-radius:50%;
            background:rgba(212,164,55,.10);
            filter:blur(80px);
            z-index:-1;
            animation:floatLight 10s infinite ease-in-out alternate;
        }

        .light.one{
            width:300px;
            height:300px;
            top:10%;
            left:5%;
        }

        .light.two{
            width:250px;
            height:250px;
            bottom:10%;
            right:5%;
            animation-delay:2s;
        }

        @keyframes floatLight{

            from{
                transform:translateY(0px) translateX(0px);
            }

            to{
                transform:translateY(-40px) translateX(20px);
            }

        }

        /* MAIN CONTAINER */

        .container{
            width:100%;
            min-height:100vh;
            display:flex;
            justify-content:center;
            align-items:center;
            padding:100px 20px 180px;
            position:relative;
        }

        /* CONTENT BOX */

        .content{
            width:100%;
            max-width:1000px;
            text-align:center;
            animation:fadeUp 1.2s ease;
        }

        @keyframes fadeUp{

            from{
                opacity:0;
                transform:translateY(40px);
            }

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

        }

        /* LOGO */

        .logo{
            display:flex;
            align-items:center;
            justify-content:center;
            gap:18px;
            margin-bottom:30px;
            flex-wrap:wrap;
        }

        .logo-icon{
            width:85px;
            height:85px;
            border-radius:50%;
            border:2px solid #D4A437;
            display:flex;
            align-items:center;
            justify-content:center;
            color:#D4A437;
            font-size:35px;
            background:rgba(255,255,255,.05);
            backdrop-filter:blur(10px);
            box-shadow:0 0 35px rgba(212,164,55,.25);
            animation:pulseGlow 3s infinite ease-in-out;
        }

        @keyframes pulseGlow{

            0%{
                box-shadow:0 0 20px rgba(212,164,55,.15);
            }

            50%{
                box-shadow:0 0 50px rgba(212,164,55,.35);
            }

            100%{
                box-shadow:0 0 20px rgba(212,164,55,.15);
            }

        }

        .logo-text h2{
            font-family:'Oswald', sans-serif;
            font-size:52px;
            line-height:1;
            letter-spacing:2px;
        }

        .logo-text span{
            color:#D4A437;
            letter-spacing:5px;
            font-size:14px;
        }

        /* BADGE */

        .badge{
            display:inline-flex;
            align-items:center;
            gap:10px;
            padding:12px 22px;
            border-radius:60px;
            background:rgba(212,164,55,.08);
            border:1px solid rgba(212,164,55,.30);
            color:#D4A437;
            margin-bottom:35px;
            backdrop-filter:blur(10px);
            animation:badgeFloat 3s infinite ease-in-out;
        }

        @keyframes badgeFloat{

            0%{
                transform:translateY(0px);
            }

            50%{
                transform:translateY(-6px);
            }

            100%{
                transform:translateY(0px);
            }

        }

        /* HEADER */

        h1{
            font-family:'Oswald', sans-serif;
            font-size:58px;
            line-height:1.15;
            text-transform:uppercase;
            letter-spacing:2px;
            margin-bottom:25px;
        }

        h1 span{
            color:#D4A437;
        }

        /* DESCRIPTION */

        .desc{
            max-width:760px;
            margin:auto;
            color:#d5d5d5;
            font-size:17px;
            line-height:1.9;
            margin-bottom:55px;
        }

        /* COUNTER */

        .counter{
            display:flex;
            justify-content:center;
            gap:25px;
            flex-wrap:wrap;
            margin-bottom:60px;
        }

        .time-box{
            width:170px;
            height:170px;
            background:rgba(255,255,255,.05);
            border:1px solid rgba(212,164,55,.25);
            border-radius:30px;
            backdrop-filter:blur(14px);
            display:flex;
            flex-direction:column;
            justify-content:center;
            align-items:center;
            position:relative;
            overflow:hidden;
            transition:.5s;
        }

        .time-box::before{
            content:'';
            position:absolute;
            top:-100%;
            left:-100%;
            width:250%;
            height:250%;
            background:linear-gradient(
                45deg,
                transparent,
                rgba(255,255,255,.05),
                transparent
            );
            transform:rotate(25deg);
            transition:.8s;
        }

        .time-box:hover::before{
            top:100%;
            left:100%;
        }

        .time-box:hover{
            transform:translateY(-12px);
            border-color:#D4A437;
            box-shadow:0 25px 50px rgba(212,164,55,.18);
        }

        .time-box h2{
            font-family:'Oswald', sans-serif;
            font-size:70px;
            line-height:1;
            color:#D4A437;
            margin-bottom:10px;
        }

        .time-box p{
            font-size:14px;
            letter-spacing:4px;
            text-transform:uppercase;
        }

        /* EMAIL BOX */

        .notify-box{
            width:100%;
            max-width:720px;
            margin:auto;
            display:flex;
            justify-content:center;
            gap:15px;
            flex-wrap:wrap;
        }

        .notify-box input{
            flex:1;
            min-width:280px;
            height:68px;
            border:none;
            outline:none;
            border-radius:60px;
            padding:0 25px;
            background:rgba(255,255,255,.06);
            border:1px solid rgba(255,255,255,.08);
            color:#fff;
            font-size:15px;
            backdrop-filter:blur(10px);
            transition:.4s;
        }

        .notify-box input:focus{
            border-color:#D4A437;
            box-shadow:0 0 20px rgba(212,164,55,.15);
        }

        .notify-box input::placeholder{
            color:#bbb;
        }

        .notify-box button{
            height:68px;
            padding:0 40px;
            border:none;
            border-radius:60px;
            background:#D4A437;
            color:#000;
            font-size:15px;
            font-weight:600;
            cursor:pointer;
            transition:.4s;
            position:relative;
            overflow:hidden;
        }

        .notify-box button::before{
            content:'';
            position:absolute;
            top:0;
            left:-100%;
            width:100%;
            height:100%;
            background:rgba(255,255,255,.3);
            transition:.5s;
        }

        .notify-box button:hover::before{
            left:100%;
        }

        .notify-box button:hover{
            background:#fff;
            transform:translateY(-4px);
        }

        /* FOOTER */

        .footer{
            width:100%;
            text-align:center;
            padding:0 20px 50px;
        }

        /* SOCIALS */

        .socials{
            display:flex;
            justify-content:center;
            align-items:center;
            gap:16px;
            margin-bottom:20px;
        }

        .socials a{
            width:55px;
            height:55px;
            border-radius:50%;
            display:flex;
            justify-content:center;
            align-items:center;
            text-decoration:none;
            color:#D4A437;
            background:rgba(255,255,255,.05);
            border:1px solid rgba(212,164,55,.25);
            backdrop-filter:blur(10px);
            transition:.5s;
        }

        .socials a:hover{
            background:#D4A437;
            color:#000;
            transform:translateY(-8px) rotate(360deg);
            box-shadow:0 15px 35px rgba(212,164,55,.25);
        }

        .footer-text{
            color:#bcbcbc;
            font-size:14px;
            letter-spacing:1px;
        }

        .footer-text span{
            color:#D4A437;
        }

        /* RESPONSIVE */

        @media(max-width:768px){

            .container{
                padding:80px 20px 120px;
            }

            h1{
                font-size:42px;
            }

            .desc{
                font-size:15px;
            }

            .logo-text h2{
                font-size:40px;
            }

            .time-box{
                width:130px;
                height:130px;
            }

            .time-box h2{
                font-size:50px;
            }

        }

        @media(max-width:500px){

            h1{
                font-size:34px;
            }

            .logo{
                flex-direction:column;
            }

            .time-box{
                width:100px;
                height:100px;
            }

            .time-box h2{
                font-size:36px;
            }

            .notify-box input,
            .notify-box button{
                width:100%;
            }

        }