/**
 * Theme Name:     Doca Web
 * Author:         Doca Web
 * Template:       astra
 * Text Domain:	   doca-web
 * Description:    Astra is fast, fully customizable & beautiful WordPress theme suitable for blog, personal portfolio, business website and WooCommerce storefront. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with Schema.org code integrated and is Native AMP ready so search engines will love your site. It offers special features and templates so it works perfectly with all page builders like Elementor, Beaver Builder, Visual Composer, SiteOrigin, Divi, etc. Some of the other features: # WooCommerce Ready # Responsive # RTL & Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and WooCommerce ready theme that you can use for building any kind of website!
 */

 :root {
    --amarelo:   #f4bf41;
    --laranja:   #fe8e61;
    --azul:      #554eba;
    --bege:      #f6e4c7;
    --begeclaro: #fdf2e1;
    --azulclaro: #e1e9f5;
    --branco:    #FFFFFF;
    --preto:     #1F2732;
    --cinza:     #f2f2f2;
    --texto:     #495358;
}

* {
    font-family: "Outfit", Sans-serif;
}
a { 
	text-decoration: none;
    color: var(--azul);
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}
a:hover { 
    color: var(--laranja);
}

.destaque-texto {
    position: relative;
    display: inline-block;
}
.destaque-texto span {
    position: relative;
    z-index: 2;
}
.destaque-texto::before {
	content: "";
	background-color: #d6e3f5;
    width: 100%;
	height: 20px;
	position: absolute;
	bottom: 8px;
	z-index: 1;
}
.btn-tema {
	color: var(--branco);
	font-size: 1.1rem;
	font-weight: 700;
	letter-spacing: 0.8px;
	text-decoration: none !important;
	padding: 16px 32px 18px 32px;
	border-radius: 1.75em;
	outline: none;
	cursor: pointer;
	-webkit-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	-webkit-animation: btn-pulse 2s infinite;
	animation: btn-pulse 2s infinite;
}
.btn-tema:hover {
	color: var(--branco);
}
.btn-tema i {
	display: inline-block;
    font-size: 1.5rem;
	margin-left: 5px;
	margin-right: 5px;
    position: relative;
    top: 3px;
	-webkit-transition: .3s;
	transition: .3s;
}
.btn-tema:hover i {
	-webkit-animation: anima-arrow 1.25s;
	animation: anima-arrow 1.25s;
}

.btn-primario {
	background: -webkit-gradient(linear, left top, right top, from(#fe8e61), color-stop(#f4bf41), to(#fe8e61));
	background: linear-gradient(to right, #fe8e61, #f4bf41, #fe8e61);
    background-size: 200% auto;
}

.dashcircle .e-con-inner:before {
    content: "";
    background-image: url(/wp-content/uploads/2024/10/bg-dash-circle.webp);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 68px;
    height: 68px;
    position: absolute;
    top: 0;
    right: 20%;
    -webkit-animation: rotate-animation 10s infinite linear;
    animation: rotate-animation 10s infinite linear;
}
.dashcircle .e-con-inner::after {
    content: "";
    background-image: url(/wp-content/uploads/2024/10/bg-dash-circle.webp);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;    
	width: 50px;
	height: 50px;
    position: absolute;
	top: 25%;
	left: 18%;
    -webkit-animation: rotate-animation 10s infinite linear;
    animation: rotate-animation 10s infinite linear;    
}
.stripecircle .e-con-inner:before {
    content: "";
    background-image: url(/wp-content/uploads/2024/10/bg-stripe-circle.webp);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 60px;
    height: 60px;
    position: absolute;
    top: -10%;
    right: 20%;
    -webkit-animation: rotate-animation 10s infinite linear;
    animation: rotate-animation 10s infinite linear;
}
.linkSaibaMais {
    background: transparent;
	font-size: 1.1rem;
	letter-spacing: 0.5px;
	color: var(--preto);
	padding: 8px 25px 12px 30px;
	border-radius: 50px;
	-webkit-transition: all .2s linear;
	transition: all .2s linear;
}
.linkSaibaMais:hover {
	background: -webkit-gradient(linear, left top, right top, from(#fe8e61), color-stop(#f4bf41), to(#fe8e61));
	background: linear-gradient(to right, #fe8e61, #f4bf41, #fe8e61);
    background-size: 200% auto;
    color: var(--branco);
    text-decoration: none;
}
.linkSaibaMais i {
	display: inline-block;
    font-size: 1.3rem;
    position: relative;
    top: 2px;
	-webkit-transition: .3s;
	transition: .3s;
}
.linkSaibaMais:hover i {
	-webkit-animation: anima-arrow 1.25s;
	animation: anima-arrow 1.25s;
}
.shine a::before {
	position: absolute;
	display: block;
	content: '';
	width: 0%;
	height: 100%;
	background: -o-linear-gradient(left, transparent 0%, rgba(255,255,255,0.3) 100%);
	background: -webkit-gradient(linear, left top, right top, from(transparent), to(rgba(255,255,255,0.3)));
	background: linear-gradient(to right, transparent 0%, rgba(255,255,255,0.3) 100%);
	-webkit-transform: skewX(-25deg);
	-ms-transform: skewX(-25deg);
	transform: skewX(-25deg);
}
.shine a:hover::before {
	-webkit-animation: shine 0.5s;
	animation: shine 0.5s;
}
@media screen and (min-width: 1024px) {
    .move_anim-y img {
        -webkit-animation: movebounce-y 3.0s linear infinite;
        animation: movebounce-y 3.0s linear infinite;
    }
    .move_anim-x img {
        -webkit-animation: movebounce-x 3.0s linear infinite;
        animation: movebounce-x 3.0s linear infinite;
    }
}


.btn-whatsapp {
    background: rgb(35,199,96);
    background: -moz-linear-gradient(0deg, rgba(35,199,96,1) 0%, rgba(44,240,117,1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(35,199,96,1) 0%, rgba(44,240,117,1) 100%);
    background: linear-gradient(0deg, rgba(35,199,96,1) 0%, rgba(44,240,117,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#23c760",endColorstr="#2cf075",GradientType=1); 
	color: var(--branco);
	font-size: 1.4rem;
	font-weight: 600;
	text-decoration: none;
	padding: 16px 40px 18px 40px;
	border-radius: 1.75em;
	outline: none;
	cursor: pointer;
	-webkit-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	-webkit-animation: zap-pulse 2s infinite;
	animation: zap-pulse 2s infinite;    
}
.btn-whatsapp:hover {
	color: var(--branco);
}
.btn-whatsapp i {
    font-size: 1.6rem;
    margin-right: 10px;
    position: relative;
    top: 2px;  
}
.btn-whatsapp:hover span {
	-webkit-animation: anima-arrow 1s;
	animation: anima-arrow 1s;
}



.service-block {
    position: relative;
    margin-bottom: 30px;
    z-index: 1;
}
.service-block > a {
    text-decoration: none;
}
.service-block .inner-box {
    position: relative;
    background-color:  var(--branco);
    border: 1px solid #e2e2e2;
    padding: 45px 25px 50px 50px;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    border-radius: 10px;
    overflow: hidden;
}
.service-block .inner-box::before {
    content: "";
    background-image: url(/wp-content/uploads/2024/10/dots.png);
    position: absolute;
    width: 124px;
    height: 121px;
    left: 0;
    top: 0;
}
.service-block .inner-box:hover {
    -webkit-box-shadow: 0 10px 60px rgba(0,0,0,.1);
    box-shadow: 0 10px 60px rgba(0,0,0,.1);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
}
.service-block .inner-box:hover .icon-box {
    background-color: var(--amarelo);
}
.service-block .inner-box:hover .read-more i {
    color: var(--branco);
    background-color: var(--amarelo);
}
.service-block .icon-box {
	position: absolute;
	right: -50px;
	bottom: -50px;
	height: 200px;
	width: 200px;
	background: var(--cinza);
	-webkit-transition: all 300ms ease;
	transition: all 300ms ease;
	border-radius: 50%;
}
.service-block .icon-box i {
    background-size: contain;
	background-repeat: no-repeat;
	display: block;
    position: relative;
	top: 22%;
	left: 26%;    
	width: 70px;
	height: 70px;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}
/* LOJA VIRTUAL */
.service-block .icon-box .serv-lojavirtual {
	background-image: url(/wp-content/uploads/2024/10/b-icone-loja-virtual.webp);
	width: 85px;
	height: 85px;
	top: 17%;
	left: 20%;
}
.service-block .inner-box:hover .icon-box .serv-lojavirtual {
	background-image: url(/wp-content/uploads/2024/10/w-icone-loja-virtual.webp);   
}

/* ATUALIZACAO DE SITES */
.service-block .icon-box .serv-atualizacao{
	background-image: url(/wp-content/uploads/2024/10/b-icone-atualizacao-de-sites.webp);
}
.service-block .inner-box:hover .icon-box .serv-atualizacao {
	background-image: url(/wp-content/uploads/2024/10/w-icone-atualizacao-de-sites.webp);  
}

/* LANDING PAGE */
.service-block .icon-box .serv-landing {
	background-image: url(/wp-content/uploads/2024/10/b-icone-landing-page.webp);    
}
.service-block .inner-box:hover .icon-box .serv-landing {
	background-image: url(/wp-content/uploads/2024/10/w-icone-landing-page.webp);  
}

/* INFOPRODUTOS */
.service-block .icon-box .serv-infoprodutos {
	background-image: url(/wp-content/uploads/2024/10/b-icone-site-criadores-infoprodutos.webp);    
}
.service-block .inner-box:hover .icon-box .serv-infoprodutos {
	background-image: url(/wp-content/uploads/2024/10/w-icone-site-criadores-infoprodutos.webp);    
}

/* PEQUENOS COMERCIANTES */
.service-block .icon-box .serv-pequenocomercio {
	background-image: url(/wp-content/uploads/2024/10/b-icone-sites-pequenos-comerciantes.webp);    
}
.service-block .inner-box:hover .icon-box .serv-pequenocomercio {
	background-image: url(/wp-content/uploads/2024/10/w-icone-sites-pequenos-comerciantes.webp);  
}

/* INSTITUCIONAL*/
.service-block .icon-box .serv-institucional {
	background-image: url(/wp-content/uploads/2024/10/b-icone-site-institucional.webp);   
}
.service-block .inner-box:hover .icon-box .serv-institucional {
	background-image: url(/wp-content/uploads/2024/10/w-icone-site-institucional.webp);  
}

.service-block .title {
    color: var(--preto);
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 14px;
}
.service-block .text {
    color: var(--texto);
    font-size: 1.1rem;
    position: relative;
    margin-bottom: 60px;
}
.service-block .read-more {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 10px;
    color: var(--texto);
    -webkit-transition: all 100ms linear;
    transition: all 100ms linear;
}
.service-block .read-more i {
    color: var(--preto);
    width: 1em;
    height: 1em;
    font-size: 1.2rem;
    margin-right: 20px;
    padding: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    -webkit-transition: all 100ms linear;
    transition: all 100ms linear;
    -webkit-box-shadow: 0 10px 30px rgba(0,0,0,.1);
    box-shadow: 0 10px 30px rgba(0,0,0,.1);
}

.nav-servicos {
	list-style-type: none;
    padding-left: 0 !important;
}
.nav-servicos li a {
	background-color: var(--branco);
	border-radius: 10px;
	margin-bottom: 8px;
	padding: 18px 20px 18px 30px;
	color: var(--preto);
	font-size: 1.1rem;
	font-weight: 400;
	line-height: 1.2rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.nav-servicos li a:hover,
.nav-servicos li a.active {
    background-color: var(--preto);
    color: var(--branco);
}

.page-contato .links a .elementor-icon-list-text {
	text-decoration: underline solid var(--preto) 1px !important;
    text-underline-offset: 4px;
}
.page-contato .links a:hover .elementor-icon-list-text {
    text-decoration-color: var(--azul) !important;
}

.search.ast-page-builder-template .site-content > .ast-container,
.archive.category.ast-page-builder-template .site-content > .ast-container{
	max-width: 100% !important;
}

.single-post-content p {
    margin-bottom: 12px;
}
.single-post-content p a {
    text-decoration: underline;   
}

@keyframes btn-pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(254,142,97,.5);
        box-shadow: 0 0 0 0 rgba(254,142,97,.5);
    }
    70% {
        -webkit-box-shadow: 0 0 0 15px rgba(254,142,97,0);
        box-shadow: 0 0 0 15px rgba(254,142,97,0);
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(254,142,97,0);
        box-shadow: 0 0 0 0 rgba(254,142,97,0);
    }
}
@keyframes zap-pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(37,211,102,.5);
        box-shadow: 0 0 0 0 rgba(37,211,102,.5);
    }
    70% {
        -webkit-box-shadow: 0 0 0 15px rgba(37,211,102,0);
        box-shadow: 0 0 0 15px rgba(37,211,102,0);
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(37,211,102,0);
        box-shadow: 0 0 0 0 rgba(37,211,102,0);
    }
}
@keyframes anima-arrow {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
  25% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
    opacity: 0;
  }
  26% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
    opacity: 0;
  }
  50% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes movebounce-y {
    0% {
        transform: translateY(0px); }
    50% {
        transform: translateY(20px); }
    100% {
        transform: translateY(0px); }
}
@keyframes movebounce-x {
    0% {
        transform: translateX(0px); }
    50% {
        transform: translateX(20px); }
    100% {
        transform: translateX(0px); }
}
@keyframes rotate-animation {
    0% {
    transform: rotate(0deg);
    }
    50% {
    transform: rotate(180deg);
    }
    100% {
    transform: rotate(360deg);
    }
}
@keyframes shine {
    100% {
        width:125%;
    }
}