/*==================================================
    TSCT Bihar Website Launch Curtain
    Part 1
==================================================*/

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

/*=========================================
    Full Screen Overlay
=========================================*/

#launchOverlay{

    position:fixed;
    inset:0;

    width:100%;
    height:100vh;

    overflow:hidden;

    z-index:999999;

    background:transparent;

    cursor:default;

    user-select:none;

}


/*=========================================
    Spotlight
=========================================*/

.launch-light{

    position:absolute;

    top:-250px;
    left:50%;

    transform:translateX(-50%);

    width:1000px;
    height:900px;

    pointer-events:none;

    background:radial-gradient(circle,
                rgba(255,255,255,.45) 0%,
                rgba(255,255,255,.18) 18%,
                rgba(255,255,255,.08) 35%,
                rgba(255,255,255,.02) 60%,
                transparent 100%);

    filter:blur(25px);

    animation:lightMove 4s ease-in-out infinite;
}


/*=========================================
    Top Golden Border
=========================================*/

.curtain-top{

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:20px;

    z-index:90;

    background:linear-gradient(
            to bottom,
            #fff7b1 0%,
            #f8d96b 25%,
            #d9a404 55%,
            #b67c00 100%);
}


/*=========================================
    Curtains
=========================================*/

.curtain{

    position:absolute;

    top:0;

    width:50%;
    height:100%;

    overflow:hidden;

    z-index:80;

    transition:
        transform 7s cubic-bezier(.20,.95,.18,1);

    box-shadow:
        inset 0 0 90px rgba(0,0,0,.55);
}


/*=========================================
    Left Curtain
=========================================*/

.curtain.left{

    left:0;

    border-right:3px solid rgba(255,220,120,.25);

    background:

    repeating-linear-gradient(

        90deg,

        #7a0000 0px,
        #8d0000 28px,

        #a40000 56px,

        #770000 84px,

        #5e0000 112px

    );

}


/*=========================================
    Right Curtain
=========================================*/

.curtain.right{

    right:0;

    border-left:3px solid rgba(255,220,120,.25);

    background:

    repeating-linear-gradient(

        90deg,

        #5e0000 0px,

        #770000 28px,

        #a40000 56px,

        #8d0000 84px,

        #7a0000 112px

    );

}


/*=========================================
    Curtain Velvet Effect
=========================================*/

.curtain::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    linear-gradient(
        to bottom,
        rgba(255,255,255,.18),
        rgba(255,255,255,0) 25%,
        rgba(0,0,0,.12) 70%,
        rgba(0,0,0,.35)
    );

    mix-blend-mode:soft-light;

}


/*=========================================
    Curtain Fold Texture
=========================================*/

.curtain-folds{

    position:absolute;

    inset:0;

    background:

    repeating-linear-gradient(

        90deg,

        rgba(255,255,255,.10) 0px,

        rgba(255,255,255,.02) 10px,

        rgba(0,0,0,.15) 22px,

        rgba(255,255,255,.03) 34px,

        rgba(0,0,0,.18) 46px

    );

    opacity:.55;

}


/*=========================================
    Curtain Shadow
=========================================*/

.curtain::after{

    content:"";

    position:absolute;

    inset:0;

    background:

    radial-gradient(circle at center,

        rgba(255,255,255,.05),

        rgba(0,0,0,.30));

}


/*=========================================
    Opening Animation
=========================================*/

#launchOverlay.open .left{

    transform:translateX(-105%);

}

#launchOverlay.open .right{

    transform:translateX(105%);

}


/*=========================================
    Remove Overlay
=========================================*/

#launchOverlay.finished{

    opacity:0;

    visibility:hidden;

    transition:opacity .8s ease;

}


/*=========================================
    Spotlight Animation
=========================================*/

@keyframes lightMove{

    0%{

        transform:
            translateX(-50%)
            scale(1);

        opacity:.80;

    }

    50%{

        transform:
            translateX(-50%)
            scale(1.08);

        opacity:1;

    }

    100%{

        transform:
            translateX(-50%)
            scale(1);

        opacity:.80;

    }

}
/*==================================================
    TSCT Bihar Website Launch Curtain
    Part 2
    Content & Typography
==================================================*/


/*=========================================
    Center Content
=========================================*/

.launch-content{

    position:absolute;

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    width:90%;
    max-width:1100px;

    text-align:center;

    z-index:100;

    color:#ffffff;

    animation:contentFade 1.5s ease;

}


/*=========================================
    TSCT Logo
=========================================*/

.launch-logo{

    margin-bottom:35px;

    display:flex;

    justify-content:center;

    align-items:center;

}

.launch-logo img{

    width:130px;
    height:auto;

    display:block;

    filter:drop-shadow(0 0 20px rgba(255,255,255,.35));

}


/*=========================================
    Chief Minister
=========================================*/

.launch-chief{

    font-size:24px;

    font-weight:500;

    letter-spacing:1px;

    color:#FFE082;

    text-transform:uppercase;

    margin-bottom:8px;

}


.launch-name{

    font-size:54px;

    font-weight:700;

    color:#ffffff;
    line-height:1.25;
    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:30px;

    text-shadow:
        0 0 12px rgba(255,255,255,.20);

}


/*=========================================
    Subtitle
=========================================*/

.launch-subtitle{

    font-size:22px;

    font-weight:400;

    color:#f5f5f5;

    letter-spacing:1px;

    margin-bottom:20px;

}


/*=========================================
    Main Website Title
=========================================*/

.launch-title{

    font-size:54px;

    font-weight:800;

    color:#FFD54F;

    line-height:1.25;

    text-transform:uppercase;

    letter-spacing:2px;

    text-shadow:

        0 0 10px rgba(255,213,79,.30),

        0 0 30px rgba(255,213,79,.15);

}


/*=========================================
    Divider
=========================================*/

.launch-divider{

    width:220px;

    height:3px;

    margin:40px auto 50px;

    border-radius:50px;

    background:linear-gradient(
        to right,
        transparent,
        #FFD54F,
        transparent);

}


/*=========================================
    Developer Credit
=========================================*/

.developer-credit{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:22px;

}


.developer-logo{

    flex-shrink:0;

}


.developer-logo img{

    width:85px;

    height:auto;

    filter:
        drop-shadow(0 0 12px rgba(255,255,255,.25));

}


.developer-text{

    text-align:left;

}


.developed-by{

    font-size:17px;

    color:#dddddd;

    letter-spacing:1px;

    margin-bottom:4px;

}


.developer-company{

    font-size:30px;

    font-weight:700;

    color:#ffffff;

    letter-spacing:1px;

    line-height:1.2;

}


.developer-website{

    margin-top:6px;

    font-size:18px;

    color:#FFD54F;

    letter-spacing:1px;

}


/*=========================================
    Entrance Animation
=========================================*/

@keyframes contentFade{

    from{

        opacity:0;

        transform:
            translate(-50%,-46%)
            scale(.95);

    }

    to{

        opacity:1;

        transform:
            translate(-50%,-50%)
            scale(1);

    }

}


/*=========================================
    Glow Animation
=========================================*/

.launch-logo img,
.launch-title{

    animation:softGlow 3s ease-in-out infinite;

}


@keyframes softGlow{

    0%{

        filter:
            drop-shadow(0 0 8px rgba(255,255,255,.15));

    }

    50%{

        filter:
            drop-shadow(0 0 18px rgba(255,255,255,.35));

    }

    100%{

        filter:
            drop-shadow(0 0 8px rgba(255,255,255,.15));

    }

}
/*==================================================
    TSCT Bihar Website Launch Curtain
    Part 3
    Responsive & Final Effects
==================================================*/


/*=========================================
    Large Desktop
=========================================*/

@media (min-width:1600px){

    .launch-title{
        font-size:64px;
    }

    .launch-name{
        font-size:48px;
    }

    .launch-chief{
        font-size:28px;
    }

    .launch-subtitle{
        font-size:26px;
    }

    .developer-company{
        font-size:34px;
    }

}


/*=========================================
    Laptop
=========================================*/

@media (max-width:1200px){

    .launch-logo img{
        width:110px;
    }

    .launch-title{
        font-size:46px;
    }

    .launch-name{
        font-size:36px;
    }

}


/*=========================================
    Tablet
=========================================*/

@media (max-width:991px){

    .launch-logo img{
        width:100px;
    }

    .launch-chief{

        font-size:20px;

    }

    .launch-name{

        font-size:32px;

    }

    .launch-subtitle{

        font-size:18px;

    }

    .launch-title{

        font-size:38px;

    }

    .launch-divider{

        width:180px;

        margin:30px auto 40px;

    }

    .developer-company{

        font-size:24px;

    }

}


/*=========================================
    Mobile
=========================================*/

@media (max-width:768px){

    .launch-content{

        width:92%;

    }

    .launch-logo img{

        width:80px;

    }

    .launch-chief{

        font-size:16px;

        line-height:1.5;

    }

    .launch-name{

        font-size:26px;

        margin-bottom:22px;

    }

    .launch-subtitle{

        font-size:16px;

        line-height:1.5;

    }

    .launch-title{

        font-size:28px;

        line-height:1.4;

    }

    .launch-divider{

        width:140px;

        margin:25px auto 35px;

    }

    .developer-credit{

        flex-direction:column;

        gap:15px;

    }

    .developer-logo img{

        width:70px;

    }

    .developer-text{

        text-align:center;

    }

    .developer-company{

        font-size:22px;

    }

    .developer-website{

        font-size:16px;

    }

}


/*=========================================
    Small Mobile
=========================================*/

@media (max-width:480px){

    .launch-logo img{

        width:70px;

    }

    .launch-chief{

        font-size:14px;

    }

    .launch-name{

        font-size:21px;

    }

    .launch-subtitle{

        font-size:15px;

    }

    .launch-title{

        font-size:22px;

    }

    .developer-company{

        font-size:18px;

    }

    .developer-website{

        font-size:14px;

    }

}


/*=========================================
    Smooth Text Rendering
=========================================*/

.launch-chief,
.launch-name,
.launch-subtitle,
.launch-title,
.developer-company,
.developer-website{

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

}


/*=========================================
    Prevent Image Dragging
=========================================*/

.launch-logo img,
.developer-logo img{

    user-select:none;

    -webkit-user-drag:none;

}


/*=========================================
    Fade Content After Curtain Opens
=========================================*/

#launchOverlay.open .launch-content{

    opacity:0;

    transition:opacity .7s ease;

}


/*=========================================
    Smooth Curtain Performance
=========================================*/

.curtain{

    will-change:transform;

}

.launch-content{

    will-change:opacity;

}

.launch-content{

    position:absolute;

    top:48%;
    left:50%;

    transform:translate(-50%,-50%);

    width:90%;
    max-width:1100px;

    text-align:center;

    z-index:100;

    color:#ffffff;

}


/*=========================================
    Hide Overflow
=========================================*/

html,
body{

    overflow-x:hidden;

}


/*=========================================
    Optional Background Blur
=========================================*/

.launch-light{

    mix-blend-mode:screen;

}


/*==================================================
    END
==================================================*/