/*=========================================
    MATHUR COMMUNICATION
=========================================*/

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

body{

    font-family:'Poppins',sans-serif;

    background:linear-gradient(135deg,#0f172a,#1e3a8a,#2563eb);

    min-height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    overflow:hidden;

}

/*=========================================*/

body::before{

    content:'';

    position:fixed;

    width:450px;

    height:450px;

    background:rgba(255,255,255,.08);

    border-radius:50%;

    top:-180px;

    left:-120px;

    filter:blur(10px);

}

body::after{

    content:'';

    position:fixed;

    width:350px;

    height:350px;

    background:rgba(255,255,255,.08);

    border-radius:50%;

    bottom:-150px;

    right:-120px;

    filter:blur(10px);

}

/*=========================================*/

.container{

    width:100%;

    display:flex;

    justify-content:center;

    align-items:center;

    padding:20px;

}

/*=========================================*/

.card{

    width:450px;

    max-width:100%;

    background:rgba(255,255,255,.15);

    backdrop-filter:blur(20px);

    -webkit-backdrop-filter:blur(20px);

    border:1px solid rgba(255,255,255,.25);

    border-radius:25px;

    padding:45px 35px;

    text-align:center;

    box-shadow:0 15px 45px rgba(0,0,0,.25);

    animation:fadeIn .8s ease;

}

/*=========================================*/

.logo{

    width:110px;

    height:110px;

    margin:auto;

    border-radius:50%;

    background:#ffffff;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:50px;

    box-shadow:0 10px 25px rgba(0,0,0,.20);

    margin-bottom:25px;

}

/*=========================================*/

.card h1{

    color:#ffffff;

    font-size:36px;

    font-weight:700;

    margin-bottom:10px;

}

.card p{

    color:#e5e7eb;

    font-size:16px;

    line-height:28px;

}

/*=========================================*/

.line{

    width:80px;

    height:4px;

    background:#ffffff;

    border-radius:20px;

    margin:30px auto;

}

/*=========================================*/

.btn-area{

    display:flex;

    flex-direction:column;

    gap:18px;

}

/*=========================================*/

.btn{

    text-decoration:none;

    color:#ffffff;

    font-size:18px;

    font-weight:600;

    padding:18px;

    border-radius:12px;

    transition:.35s;

    display:block;

    letter-spacing:.5px;

}

/*=========================================*/

.admin{

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

}

.admin:hover{

    transform:translateY(-4px);

    box-shadow:0 10px 25px rgba(37,99,235,.45);

}

/*=========================================*/

.team{

    background:linear-gradient(135deg,#10b981,#059669);

}

.team:hover{

    transform:translateY(-4px);

    box-shadow:0 10px 25px rgba(16,185,129,.45);

}

/*=========================================*/

.footer{

    margin-top:35px;

    color:#f8fafc;

    font-size:14px;

    opacity:.90;

    line-height:24px;

}

/*=========================================*/

@keyframes fadeIn{

    from{

        opacity:0;

        transform:translateY(30px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================
        TABLET
=========================================*/

@media(max-width:768px){

.card{

    padding:35px 25px;

}

.card h1{

    font-size:30px;

}

.logo{

    width:90px;

    height:90px;

    font-size:42px;

}

.btn{

    font-size:17px;

}

}

/*=========================================
        MOBILE
=========================================*/

@media(max-width:480px){

.card{

    border-radius:18px;

    padding:30px 20px;

}

.card h1{

    font-size:26px;

}

.card p{

    font-size:14px;

    line-height:24px;

}

.logo{

    width:80px;

    height:80px;

    font-size:36px;

}

.btn{

    font-size:16px;

    padding:16px;

}

.footer{

    font-size:13px;

}

}