/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 12/03/2023
    Author     : Fábio Maciel
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

:root {            
    --brand-color-red: #E24F42;
    --brand-color-dark-red: #C33A2E;
    --brand-color-gray: #585859;    
    --brand-color-light-gray: #dfe2e6;  
    --brand-color-megalight-gray: #f5f5f5;  
    --brand-color-dark-gray: #575759;  
    --brand-color-black: #1E2121;      
    --brand-color-white: #FFFFFF; 
    
    --color-whatsapp: #9BDE90; 
    --color-success: #2C7C36;
    --color-warning: #FFAF11;    
    --color-error: #DA1414;
    --color-info: #20A8DE;    
}

:focus {
    outline: none;
}

@keyframes fadeIn { 
    from { opacity: 0.4; } 
}

@keyframes treme {
    0% { box-shadow: 0 0 0 0 var(--brand-color-megalight-gray); }
    25% { box-shadow: 0 0 15px 6px var(--brand-color-megalight-gray); }
    50% { box-shadow: 0 0 0 0 var(--brand-color-megalight-gray); }
    75% { box-shadow: 0 0 15px 6px var(--brand-color-megalight-gray); }
    100% { box-shadow: 0 0 0 0 var(--brand-color-megalight-gray); }
}


/*
 * Estrutura
----------------------------------- **/
body {
    margin: 69px 0 0 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--brand-color-black);
    text-align: left;
    background-color: var(--brand-color-white);
}

body, h1, h2, h3, h4, h5, h6, p, span, li, ol, a, i, b, strong {
    font-family: 'Inter', arial, sans-serif;    
    color: var(--brand-color-black);    
}

.site .container {
    max-width: 1129px;
}

.site section {
    padding: 20px 0;
    margin: 20px 0;
}

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


/*
 * Cores
----------------------------------- **/
.bgcolor-light-gray {
    background-color: var(--brand-color-light-gray) !important;
}

.bgcolor-megalight-gray {
    background-color: var(--brand-color-megalight-gray) !important;
}

.bgcolor-dark-gray {
    background-color: var(--brand-color-dark-gray) !important;
}

.bgcolor-black {
    background-color: var(--brand-color-black) !important;
}

/*
 * Geral
----------------------------------- **/
.d-nome {
    display: none !important;
}

.d-block {
    display: block !important;
}

strong {
    font-weight: 700;
}

small {
    font-size: 80%;
}

em {
    font-style: italic;   
}

h1, h2, h3, h4, h5, h6 {    
    margin-bottom: 20px;
}

a { 
    text-decoration: none;
    background-color: transparent;        
    color: var(--brand-color-red);
}

a:hover {
    text-decoration: underline;
}

h1 {
    font-size: 46px;
    line-height: 66px;
    font-weight: 700;    
}


h2 {
    font-size: 32px;
    line-height: 48px;
    font-weight: 700;    
}

h3 {
    font-size: 24px;
    line-height: 36px;
    font-weight: 700;        
}

h4 {
    font-size: 18px;
    line-height: 27px;
    font-weight: 400;        
}

h5, h6 {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;    
}

p {
    font-size: 18px;
    line-height: 27px;    
    margin-bottom: 20px;
}

.lowercase {
    text-transform: lowercase;
}

.heroshot img {
    margin: 0 auto;
}


figure {
    margin: 30px 0;
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

img {    
    border-style: none;
    max-width: 100%;
    height: auto;
    text-indent:-9999px;
    display: block;    
}

img.lazy {    
    border-radius: 4px;
}

aside {
    margin-bottom: 40px;
}

.media {
    display: flex;
    align-items: flex-start;
    display: -ms-flexbox;    
    -ms-flex-align: start;   
}

.media-body {
    flex: 1;
    -ms-flex: 1;    
}

.headline {
    margin-bottom: 40px;
}

.headline p {
    margin-top: 0;
}


.inline-block {
    display: inline-block !important;
}

.radius-4 {
    border-radius: 4px;
}

.circle {
    border-radius: 50%;
}

.ico {    
    width: 16px;
    height: 16px;
    background-size: cover;
    background-repeat: no-repeat;
    align-self: center;
}

.down-arrow {
    background-image: url(../icon/down-arrow.svg);
}

.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.animation-treme {
    animation: treme 1s;
    animation-iteration-count: 3;
}

@media (max-width: 991.98px) {
    p br {
        display: none;
    }

    a {                 
        color: var(--brand-color-gray);
    }
    
    h1 {
        font-size: 28px;
        line-height: 38px;
    }

    .headline p {
        font-size: 18px;
        line-height: 32px;
    }

    .hero h2 {
        font-size: 18px;
        line-height: 28px;          
    } 
    
    p {
        font-size: 16px;
        line-height: 22px;        
    }
    
    .hero .headline p {
        font-size: 18px;
        line-height: 26px;
    }        
}

@media (max-width: 768px) {
    section {
        padding: 25px 0 0 0;
        margin: 25px 0;
    } 

    h2 {
        font-size: 28px;
        line-height: 36px;          
    }    
    
    h1 br, h2 br, h3 br {
        display: none;
    }

    .d-xs-none {
        display: none !important;
    }

    .d-xs-block {
        display: block !important;
    }
    
    .d-xs-column-reverse {
        flex-direction: column-reverse;
    }       
}




.reading-time {
    font-size: 16px;
    line-height: 24px;
    display: flex;
    align-items: center;
    color: var(--brand-color-black);
}

.reading-time::before {
    content: "";
    width: 22px;
    height: 21px;
    margin-right: 5px;
    background: url(../icon/relogio.png) no-repeat;
}

.hr-top {
    border-top: 1px solid var(--brand-color-megalight-gray);
}

.cursor-help {
    cursor: help;
}

.aviso {
    font-size: 12px;
}



/*
 * Componente: form
----------------------------------- **/
button {
    cursor: pointer;
}

label {
    display: inline-block;
    margin-bottom: 0;
}

input:disabled, select:disabled, select:invalid  {
    color: #999;
}

.disabled {
    pointer-events: none;
}

input {    
    background: var(--brand-color-white);
    border: 1px solid var(--brand-color-megalight-gray);
    box-sizing: border-box;
    border-radius: 4px;
}

input:focus {
    border-color: var(--brand-color-gray);
}

.form-group {
    margin-bottom: 0.7rem;
}

.form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--brand-color-dark-gray);
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.input-group {
    position: relative;    
    display: flex;    
    flex-wrap: wrap;    
    align-items: stretch;
    width: 100%;
}

.input-group > .form-control {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}

.form-inline {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
}

.form-inline input {
    display: inline-block;
    width: auto;
    vertical-align: middle;
}

.form-error {
    border-color: var(--color-error);
}

.alert-error {
    color: var(--color-error-1);
    font-size: 14px;
    font-style: italic;
}

.alert {
    font-size: 14px;
    display: block;
    padding: 10px;
    border-radius: 4px;
    text-align: left;
    width: 100%;
}

.alert-success {    
    border: 1px solid var(--color-success);
    color: var(--color-success);        
}

.alert-warning {
    border: 1px solid var(--color-error);
    color: var(--color-error);    
}


/*
 * Componente: buttons
----------------------------------- **/
.btn:focus, .btn:hover {
    box-shadow: none !important;
}

.btn-mobile {
    display: none;
}

.btn-large {
    font-size: 20px !important;
    line-height: 30px !important; 
    padding: 10px 30px !important
}

.btn, .btn-sm {
    text-decoration: none;
    border-radius: 8px;
    padding: 15px 24px;
    display: inline-block;
    border: none !important;    
    font-size: 18px;
    line-height: 18px;            
    font-weight: 400;    
    text-align: center;
    margin: 0 0 20px 0;
    
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;            
    transition: all .3s;
}

.btn-sm {     
    font-size: 14px;
    line-height: 16px;
    padding: 12px 20px;
    font-weight: 400;
    margin-bottom: 0;
}

.btn:hover, .btn-sm:hover {
    text-decoration: none;
}

.btn-primary {    
    color: var(--brand-color-white);
    background-color: var(--brand-color-red);       
}

.btn-primary:hover, .btn-primary:active {
    background-color: var(--brand-color-red) !important;   
}

.btn-default {
    color: var(--brand-color-gray);
    background-color: var(--brand-color-light-gray);    
}

.btn-default:hover, .btn-default:active {
    color: var(--brand-color-light-gray) !important;
    background-color: var(--brand-color-gray) !important;    
}

.btn-reset {
    color: initial;
    text-decoration: none !important;
}

.btn-mobile, .nav-mobile {
    display: none;
}

.btn-mobile {
    position: absolute;
    right: 20px;
    z-index: 999;
}

.nav-mobile {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #fff;
    left: 0;
    top: 0;
    overflow: auto;    
    z-index: 999;
    padding: 30px 25px;
}

.nav-mobile .logo {
    margin-bottom: 50px;
    display: block;
    max-width: 150px;
}

.nav-mobile .list-menu a {    
    font-size: 18px;
}

.nav-mobile .list-menu li {
    display: block;
    border-bottom: 1px solid var(--brand-color-megalight-gray);
    margin-bottom: 20px;
    padding-bottom: 20px;    
}

.nav-mobile .list-menu li:last-child {
    border-bottom: none;    
}

.nav-mobile .list-menu a:hover {
    text-decoration: none;
}

@media (max-width: 768px) {
    .main-nav, .second-nav {
        display: none !important;
    }
    .btn-mobile {
        display: block;
        top: 22px;
    }
}



/*
 * Componente: header
----------------------------------- **/
.site-header .container {
    align-self: center;    
}

.site-header {
    background-color: var(--brand-color-white);
    height: 69px;
    z-index: 2;
    position: relative;
}

.div-main-header.navbar-faded {
    position: fixed;
    background: #fff;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 99;
    border-bottom: 2px solid var(--brand-color-light-gray);
}

.site-header .logo, 
.site-header .btn {
    align-self: center;
}

.site-header {
    display: none;
}

.site-header #lpHeadline {
    display: inline-block;  
    vertical-align: middle;
    color: var(--brand-color-dark-gray);    
    margin: 0;
    font-size: 22px;
}

.site-header #lpHeadline br {
    display: none;
}

.site-header .second-nav {
    margin-left: 20px;
    display: inline-block;    
}

.site-header .btn-primary {
    margin-left: 16px;
}

.site-header .main-nav {    
    position: unset;
}

.site-header .main-nav .list-menu {    
    margin: 0;
    padding: 0;
    align-self: center;    
    display: inline-block;
    height: 69px;    
}

.site-header .main-nav .list-menu li {
    list-style: none;
    display: inline-flex;
    height: 69px;
    padding: 0;
}

.site-header .main-nav .list-menu li:hover,
.site-header .main-nav .list-menu li:hover a,
.site-header .main-nav .list-menu a:hover,
.site-header .main-nav .list-menu li.active {
    cursor: pointer;
    color: var(--brand-color-red);
    text-transform: none;    
}

.site-header .main-nav .list-menu li.active a {        
    color: var(--brand-color-white);
}

.site-header .main-nav .list-menu li a {
    display: block;
    font-size: 14px;
    line-height: 16px;    
    color: var(--brand-color-black);
    font-weight: 400;
    align-self: center;
    padding: 10px 15px;
    text-decoration: none !important;
}


@media (max-width: 768px) {
    body.hive-lp {
        margin: 0;
    }
    .hive-lp .div-main-header.navbar-faded {
        position: relative;
        box-shadow: none;
    }
    .hive-lp header .logo {
        margin: 0 auto;
    }
}


/*
 * Componente: pagination
----------------------------------- **/
.pagination .page-numbers {
    border: 1px solid var(--brand-color-red);
    padding: 4px 8px;
    border-radius: 4px;
    color: var(--brand-color-red);
    text-decoration: none !important;
}

.pagination .current, .pagination .page-numbers:hover {
    background-color: var(--brand-color-red);
    color: var(--brand-color-white);    
}




/*
 * Componente: footer 
---------------------------------- **/
footer {
    margin-top: 60px;
    border-top: 1px solid var(--brand-color-light-gray);
}

footer, footer .section-header {
    position: relative;
}

footer .section-header {    
    min-height: 100px;   
    padding: 50px 0 35px 0;    
    border-bottom: 1px solid var(--brand-color-light-gray);   
}

footer p {
    font-size: 14px;
    line-height: 21px;   
}

footer ul {
    list-style: disc;
    margin-left: 20px;
    padding: 0;
}

footer h4 {
    font-weight: 700;
    margin-bottom: 15px;
}

footer .logo {
    margin-bottom: 25px;
    display: block;
}

footer .li-menu {
    display: inline-block;    
    vertical-align: top;
}

footer .li-menu li strong {
    display: block;
}

footer .li-menu li a, footer a {
    color: var(--brand-color-black);
}

footer .li-menu li {
    margin-bottom: 15px;
    margin-right: 0;
}

footer .li-menu li:last-child {
    margin-right: 0;
}

footer .li-menu li span {
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
}

footer .section-footer {
    padding: 15px 0;     
    font-size: 12px;
    line-height: 18px;
    color: var(--brand-color-black);
}

footer .btn-whatsapp {
    color: var(--brand-color-black);    
    font-size: 12px;
    font-weight: 400;
    line-height: 150%;
    text-transform: uppercase;
    padding: 10px 20px 10px 50px;        
    border: 2px solid var(--color-whatsapp);    
    border-radius: 10px;
    background: url(../icon/whatsapp.png) 12px center no-repeat;
    display: inline-block;    
    text-decoration: none !important;
    margin-bottom: 25px;
}

footer .btn-whatsapp:hover {    
    color: var(--color-success);    
}

@media (max-width: 768px) {
    footer .li-menu {
        display: block;
    }
    
    footer li {
        font-size: 16px;
        line-height: 22px;
    }       
    
    footer .section-header a img {
        margin-bottom: 40px;
    }
    
    footer .li-menu {
        margin-bottom: 30px;
    }
    
    footer .li-menu li {
        margin: 0 0 10px 0;
    }      

    footer .section-footer .col-sm-6 {
        text-align: left !important;
        margin-bottom: 10px;
    }
}

.category span {
    padding: 2px 12px;
    background-color: var(--brand-color-light-gray);
    font-size: 14px;
    line-height: 21px;
    font-weight: 400;
    border-radius: 4px;
    display: inline-block;
    margin: 0 9px 9px 0;
}



.lp footer .section-header, .lp #navPrimary, .lp #btnSouCliente {
    display: none;;
}

