/*==================================================================
    SISTEMA DE GESTÃO DE LICITAÇÕES
    IDENTIDADE VISUAL
==================================================================*/


/*==========================================================
RESET
==========================================================*/

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

html{

    height:100%;

}

body{

    min-height:100%;

    display:flex;

    flex-direction:column;

    background:#eef3f7;

    font-family:"Segoe UI",sans-serif;

    color:#1d3550;

}

main{

    flex:1;

}

a{

    text-decoration:none;

}

img{

    max-width:100%;

}


/*==========================================================
CONTAINER PADRÃO
==========================================================*/

.sgl-container{

    max-width:1450px;

    margin:auto;

}


/*==========================================================
HEADER
==========================================================*/

.sgl-header{

    background:#ffffff;

    padding:26px 0 18px;

    box-shadow:0 3px 12px rgba(0,0,0,.05);

}

.sgl-header .container{

    position:relative;

}

.sgl-logo{

    display:block;

    margin:auto;

    max-height:110px;

    width:auto;

}


/*==========================================================
BOTÃO INÍCIO
==========================================================*/

.sgl-home-btn{

    position:absolute;

    left:0;

    top:50%;

    transform:translateY(-50%);

    display:flex;

    align-items:center;

    gap:10px;

    padding:13px 22px;

    background:#ffffff;

    color:#0d4d82;

    border-radius:14px;

    border:2px solid transparent;

    font-weight:600;

    transition:.25s;

    box-shadow:0 8px 22px rgba(0,0,0,.08);

}

.sgl-home-btn:hover{

    color:#fff;

    background:linear-gradient(135deg,#0b4f86,#17896a);

    border-color:#f3c345;

    transform:translateY(calc(-50% - 4px));

}


/*==========================================================
DIVISOR
==========================================================*/

.sgl-divider{

    height:2px;

    background:#0f3556;

    border:none;

    opacity:1;

    margin:8px 0 24px;

}


/*==========================================================
TÍTULOS
==========================================================*/

.page-title{

    font-size:2.7rem;

    font-weight:800;

    color:#16324f;

}

.page-subtitle{

    color:#617488;

    font-size:1.08rem;

    margin-top:10px;

}


/*==========================================================
LAYOUT DAS PÁGINAS
==========================================================*/

.sgl-page{

    width:100%;

}

.sgl-page-content{

    background:#ffffff;

    border-radius:22px;

    padding:34px;

    margin-bottom:40px;

    box-shadow:0 12px 35px rgba(0,0,0,.08);

}

@media(max-width:992px){

    .sgl-page-content{

        padding:22px;

    }

}

/*==================================================================
    HOME
==================================================================*/

.module-card{

    background:#ffffff;

    border-radius:20px;

    padding:22px 22px;

    text-align:center;

    height:100%;

    border:2px solid transparent;

    transition:.30s;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.module-card:hover{

    transform:translateY(-8px);

    background:linear-gradient(135deg,#0b4f86,#17896a);

    border-color:#f3c345;

    box-shadow:0 24px 50px rgba(0,0,0,.18);

}

.module-card:hover h4,
.module-card:hover p,
.module-card:hover i{

    color:#fff;

}

.module-icon{

    width:58px;

    height:58px;

    margin:0 auto 18px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:18px;

    background:#0b4f86;

    color:#fff;

    font-size:26px;

    transition:.30s;

}

.module-card:hover .module-icon{

    background:#ffffff;

    color:#0b4f86;

    transform:scale(1.08);

}

.module-card h4{

    font-size:1.35rem;

    font-weight:700;

    color:#16324f;

    margin-bottom:14px;

}

.module-card p{

    color:#657789;

    line-height:1.5;

    margin:0;

    font-size:.92rem;

}


/*==================================================================
    CARDS DO SISTEMA
==================================================================*/

.sgl-card{

    background:#ffffff;

    border:none;

    border-radius:20px;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    transition:.25s;

}

.sgl-card:hover{

    transform:translateY(-4px);

    box-shadow:0 18px 45px rgba(0,0,0,.14);

}

.sgl-card-header{

    padding:22px 28px;

    border-bottom:1px solid #e8edf2;

    font-weight:700;

    font-size:1.1rem;

}

.sgl-card-body{

    padding:28px;

}


/*==================================================================
    BOTÕES
==================================================================*/

.btn{

    border-radius:12px;

    font-weight:600;

    padding:.65rem 1.2rem;

}

.btn-primary{

    background:#0b4f86;

    border-color:#0b4f86;

}

.btn-primary:hover{

    background:#17896a;

    border-color:#17896a;

}

.btn-outline-primary{

    color:#0b4f86;

    border-color:#0b4f86;

}

.btn-outline-primary:hover{

    background:linear-gradient(135deg,#0b4f86,#17896a);

    border-color:#f3c345;

    color:#ffffff;

}

.btn-success{

    background:#17896a;

    border-color:#17896a;

}

.btn-success:hover{

    background:#0b4f86;

    border-color:#0b4f86;

}

/*==================================================================
    ANIMAÇÕES
==================================================================*/

.fade-up{

    animation:fadeUp .35s ease;

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(18px);

    }

    to{

        opacity:1;

        transform:none;

    }

}