/*====================================
    SERCOAS PORTAL
====================================*/

:root{

    --primary:#0B3D91;
    --secondary:#1F5FBF;
    --accent:#2A7DE1;
    --light:#F5F7FB;
    --white:#FFFFFF;
    --text:#2D3748;
    --gray:#6C757D;

}

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

body{

    font-family:'Poppins',sans-serif;
    background:#eef3f9;
    color:var(--text);

}

/*=========================
HEADER
=========================*/

.header{

    background:#fff;
    padding:20px 0;
    box-shadow:0 8px 30px rgba(0,0,0,.08);
    position:relative;
    z-index:100;

}

.logo{

    max-height:80px;

}

.empresa h1{

    font-size:34px;
    font-weight:700;
    color:var(--primary);
    margin-bottom:5px;

}

.empresa p{

    color:#777;
    font-size:15px;
    letter-spacing:2px;

}

/*=========================
HERO
=========================*/

.hero{

    position:relative;

    padding:70px 0 90px;

    background:
    linear-gradient(
        rgba(8,45,99,.92),
        rgba(10,60,140,.92)
    ),
    url("../img/bg.jpg");

    background-size:cover;
    background-position:center;
    overflow:hidden;

}

.hero::before{

content:"";

position:absolute;

width:600px;
height:600px;

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

border-radius:50%;

top:-250px;
right:-200px;

}

.hero::after{

content:"";

position:absolute;

width:400px;
height:400px;

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

border-radius:50%;

bottom:-180px;
left:-120px;

}

.hero h2{

color:#fff;

font-size:44px;

font-weight:700;

margin-bottom:15px;

position:relative;
z-index:2;

}

.hero p{

font-size:18px;

color:#d7e8ff;

position:relative;
z-index:2;

}

/*=========================
CARDS CONTAINER
=========================*/

.row.gy-4{

position:relative;
z-index:5;

}

/*=========================
FOOTER
=========================*/

footer{

background:#082d63;

color:white;

padding:60px 0 30px;

}

footer h5{

font-weight:600;

margin-bottom:20px;

}

footer h5 i{

margin-right:8px;

color:#6ab2ff;

}

footer p{

margin-bottom:8px;

color:#d2def2;

}

footer hr{

margin:35px 0;

border-color:rgba(255,255,255,.15);

}

.copyright{

text-align:center;

font-size:14px;

color:#cfd8e6;

}

/*=========================
BOTONES GENERALES
=========================*/

.btn{

border-radius:50px;

padding:12px 30px;

font-weight:600;

transition:.35s;

}

.btn-primary{

background:linear-gradient(45deg,#0B3D91,#2A7DE1);

border:none;

}

.btn-primary:hover{

transform:translateY(-2px);

box-shadow:0 10px 25px rgba(42,125,225,.35);

}

/*=========================
ANIMACIONES
=========================*/

.portal-card{

animation:fadeUp .8s ease;

}

@keyframes fadeUp{

0%{

opacity:0;

transform:translateY(40px);

}

100%{

opacity:1;

transform:translateY(0);

}

}