   *{
        margin:0;
        padding:0;
        box-sizing:border-box;
        font-family: Arial, Helvetica, sans-serif;
    }

    /*  BODY */
    body{

        background:#f3f4f6;

        min-height:100vh;

        display:flex;

        justify-content:center;

        align-items:center;

        padding:20px;
    }

    /* CARD */
    .forgot-card{

        width:100%;

        max-width:450px;

        background:#fff;

        border-radius:15px;

        padding:40px;

        box-shadow:0 4px 15px rgba(0,0,0,0.08);
    }
  
    /* TÍTULO */
    .title{

        text-align:center;

        color:#222;

        margin-bottom:10px;
    }

    /* TEXTO */
    .subtitle{

        text-align:center;

        color:#666;

        font-size:14px;

        line-height:1.5;

        margin-bottom:30px;
    }

    /* GRUPO INPUT*/
    .form-group{
        margin-bottom:20px;
    }

    .form-group label{

        display:block;

        margin-bottom:8px;

        font-size:14px;

        font-weight:bold;

        color:#444;
    }

    /* INPUT */
    .form-control{

        width:100%;

        padding:14px;

        border:1px solid #d1d5db;

        border-radius:8px;

        font-size:14px;

        outline:none;

        transition:0.3s;
    }

    .form-control:focus{

        border-color:#2d0cc2;

        box-shadow:0 0 0 3px rgba(245,158,11,0.15);
    }

    /* BOTÃO */
    .btn-send{

        width:100%;

        background:#2808b4;

        color:white;

        border:none;

        padding:14px;

        border-radius:8px;

        font-size:15px;

        font-weight:bold;

        cursor:pointer;

        transition:0.3s;
    }

    .btn-send:hover{
        background:#2a05af;
    }

    /* LINK LOGIN */
    .back-login{

        text-align:center;

        margin-top:25px;

        font-size:14px;
    }

    .back-login a{

        color: rgb(52, 52, 255);

        text-decoration:none;

        font-weight:bold;
    }

    .back-login a:hover{
        text-decoration:underline;
    }

    /* RESPONSIVO */
    @media(max-width:500px){

        .forgot-card{
            padding:30px 25px;
        }

    }
