/*
|--------------------------------------------------------------------------
| CSS Principal
|--------------------------------------------------------------------------
*/

@import url('reset.css');
@import url('variables.css');

@import url('navbar.css');
@import url('hero.css');
@import url('destaques.css');
@import url('perfis.css');
@import url('sobre.css');
@import url('footer.css');
@import url('whatsapp.css');
@import url('responsive.css');

.container{
    width:100%;
    max-width:var(--container);
    margin:auto;
    padding:0 20px;
}

section{
    padding:80px 0;
}

.section-header{
    margin-bottom:50px;
    text-align:center;
}

.section-subtitle{
    display:block;
    color:var(--secondary);
    font-size:.9rem;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:2px;
    margin-bottom:10px;
}

.section-title{
    font-size:2.5rem;
    font-weight:700;
    margin-bottom:15px;
}

.section-description{
    max-width:700px;
    margin:auto;
    color:#bbb;
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:14px 30px;
    border-radius:var(--radius);
    transition:var(--transition);
    font-weight:600;
}

.btn-primary{
    background:var(--primary);
    color:#000;
}

.btn-primary:hover{
    transform:translateY(-3px);
}

.btn-secondary{
    background:transparent;
    border:2px solid var(--primary);
    color:var(--white);
}

.btn-secondary:hover{
    background:var(--primary);
    color:#000;
}