.navbar { padding-top: .6rem; padding-bottom: .6rem; }
.navbar h1 span { position: absolute; top: -9999px; left: -9999px; text-indent: -9999px; }
.navbar .navbar-brand { padding-top: 0rem; padding-bottom: 0rem; }
.navbar .navbar-brand .img-fluid { max-width: 240px; }
.navbar .navbar-nav .nav-item a { font-weight: 500; }
.navbar .navbar-nav .nav-item a:hover { color: var(--color-secondary); } 


/** Bloco "MAIN" */
.main { padding-top: 4rem; padding-bottom: 0rem; background: var(--color-main); height: 80vh; margin-bottom: 20vh; }
.main:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("../img/bg.webp");
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 30% auto;
    right: 2%;
    bottom: 12%;
    opacity: .3;
}
.main-content { padding-right: 0rem; }
.main-content h2 { font-weight: 900; font-size: 2.4rem; margin-bottom: 1.35rem; color: var(--color-font-light); }
.main-content p { font-size: 1.45rem; margin-bottom: 1.4rem; color: var(--color-font-light); }
.main .img-sistema {  border: 12px solid #efefef; border-radius: 2rem; position: absolute; right: 0; width: 80%; margin: 0 10%; }


/** Bloco "SOBRE NOS" */
.alvo { padding-top: 5rem; padding-bottom: 3rem; }
.alvo h2 { font-weight: 800; font-size: 2rem; margin-bottom: .6rem; }
.alvo h2 span { color: var(--color-secondary); }
.alvo p { font-size: 1.5rem; margin-bottom: 2.5rem; }
.alvo article { min-height: 385px; border: 2px solid #efefef; padding: 2rem 1.6rem; border-radius: 1rem; transition: .4s; }
.alvo article img { width: 90px; margin-bottom: 15px; }
.alvo article h3 { font-weight: 700; font-size: 1.4rem; margin-bottom: 1rem; }
.alvo article p { font-size: 1.15rem; margin-bottom: 0; }
.alvo article:hover { border: 2px solid var(--color-secondary); transition: .4s; }


/** Bloco "BENEFICIOS" */
.beneficios { padding-top: 1rem; padding-bottom: 3rem; }
.beneficios h2 { font-weight: 800; font-size: 2.25rem; margin-bottom: 1rem; }
.beneficios h2 span { color: var(--color-secondary); }
.beneficios p { font-size: 1.2rem; }
.beneficios img { border-radius: 1rem; }
.beneficios .list-bullets { list-style-type: disc; padding-left: 1rem; }
.beneficios .list-bullets li::marker { color: var(--color-secondary); font-size: 1.5rem; }
.beneficios .list-bullets li { font-size: 1.2rem; }


/** Bloco "DESTAQUE" */
.destaque { padding-top: 2rem; padding-bottom: 4rem; }
.destaque-content { position: relative; padding: 6rem 7rem; background: var(--color-primary-hover); border-radius: 2rem; }
.destaque-content:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(../img/bg.webp);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 32% auto;
    right: 2%;
    bottom: 3%;
    opacity: .3;
}
.destaque-content h2 { font-weight: 800; font-size: 2.5rem; margin-bottom: 3rem; color: var(--color-font-light); }
.destaque-content h2 span { color: var(--color-secondary); }


/** Bloco "FUNCIONALIDADES" */
.funcionalidades { padding-top: 1rem; padding-bottom: 3rem; }
.funcionalidades h2 { font-weight: 800; font-size: 2.5rem; margin-bottom: 1rem; }
.funcionalidades h2 span { color: var(--color-secondary); }
.funcionalidades p { font-size: 1.6rem; margin-bottom: 2.5rem; }
.funcionalidades article { background: #f0f3f5; border: 2px solid #f0f3f5; border-radius: 1rem; padding: 2.5rem 2rem; margin-bottom: 1.5rem; display: flex; align-items: start; transition: .4s; }
.funcionalidades article img { width: 50px; margin-right: 15px; }
.funcionalidades article h3 { font-weight: 700; font-size: 1.3rem; margin-bottom: .5rem; transition: .4s; }
.funcionalidades article p { font-size: 1.1rem; margin-bottom: 0; }
.funcionalidades article:hover { border: 2px solid var(--color-secondary); transition: .4s; }
.funcionalidades article:hover h3 { color: var(--color-secondary); transition: .4s; }


/** Bloco "STARTY HUB CLIENTE" */
.starty-hub { padding-top: 1rem; padding-bottom: 4rem; }
.starty-hub .container { position: relative; padding: 5rem 4rem; background: var(--color-primary-hover); border-radius: 2rem; }
.starty-hub .container:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(../img/bg.webp);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 50% auto;
    right: 2%;
    bottom: 2%;
    opacity: .3;
}
.starty-hub img { border-radius: 2rem; }
.starty-hub h2 { font-weight: 800; font-size: 2.5rem; margin-bottom: 3rem; color: var(--color-font-light); }
.starty-hub h2 span { color: var(--color-secondary); }
.starty-hub p { font-size: 1.2rem; font-weight: 500; color: var(--color-font-light); }
.starty-hub .list-bullets { list-style-type: disc; padding-left: 1rem; }
.starty-hub .list-bullets li::marker { color: var(--color-secondary); font-size: 1.5rem; }
.starty-hub .list-bullets li { font-size: 1.2rem; color: var(--color-font-light); }


/** Bloco "FOOTER" */
footer { padding-top: 6rem; padding-bottom: 3rem; background: var(--color-main); position: relative; }
footer:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("../img/bg.webp");
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 30% auto;
    right: 2%;
    bottom: 2%;
    opacity: .3;
}
footer h2 { font-weight: 800; font-size: 2.5rem; margin-bottom: 1rem; color: var(--color-font-light); }
footer h2 span { color: var(--color-secondary); }
footer p { font-size: 1.45rem; font-weight: 500; color: var(--color-font-light); margin-bottom: 3rem; }

footer ul { padding-left: 0; list-style: none; margin-bottom: 0; }
footer ul li { font-size: 1.2rem; font-weight: 500; margin-top: 10px; display: flex; align-items: center; color: var(--color-font-light); }
footer ul li a { color: var(--color-font-light); text-decoration: none; transition: .3s; }
footer ul li svg { font-size: 1.45rem; margin-right: 10px; }
footer ul li svg path { color: var(--color-secondary); }

footer .copyright { margin-top: 2rem; z-index: 999; position: relative; display: flex; align-items: center; justify-content: end; }
footer .copyright p { font-size: 1.2rem; color: var(--color-font-light); padding-top: 10px; }
footer .copyright p b { color: var(--color-font-light); }
footer .copyright img { width: 200px; margin-left: 15px; }





