/*
Theme Name: Neticom Brasil
Theme URI: https://www.neticombrasil.com.br
Author: Wilson R. Garcia Jr.
Description: Tema desenvolvido sob medida para o site Neticom Brasil
Version: 0.1
Text Domain: neticombrasil
License: GNU General Public Licence v2 or later
Licence URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

html {font-size: 100%; max-width: 100%; }
body {font-size: 100%; font-family: "Inter", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; /* -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; */ }

.bg-dark-green { background-color: #213232; }
.text-dark-green{color: #213232;}

.bg-green { background-color: #69e4a5; }
.text-green{color: #69e4a5;}

.bg-hover{background-color: #2d3e3e; border-color: rgba(255, 255, 255, 0.2); }
.bg-hover:hover{background-color: transparent; border-color: #69e4a5; top: -5px; }

.text-opacity{color: rgba(255, 255, 255, 0.2) !important;}
.border-color-green{border-color: #69e4a5 !important;}
.title{font-family: "Anton", sans-serif; font-weight: 400; font-style: normal; font-size: clamp(1rem, 6vw, 6rem); }
.lead{font-size: clamp(1.2rem, 1.4vw, 1.4rem);}
.intro{width: 60ch;}

.selo{top: 100px; right: 20px; }

@keyframes soft-shake {
  0% { transform: translateX(0); }
  1% { transform: translateX(-3px); }
  2% { transform: translateX(3px); }
  3% { transform: translateX(-3px); }
  4% { transform: translateX(3px); }
  5% { transform: translateX(0); }
  100% { transform: translateX(0); }
}

.wa-flutuante {
    width: 80px;
    animation: soft-shake 4s infinite ease-in-out;
}


.card{transition: all 0.3s ease; top: 0;}
.card-effect:hover{background-color: #2d3e3e !important; top: -5px;}
.card-title{font-size: clamp(2rem, 3vw, 3rem) !important;}

/* Pulse effect */
.pulse { animation: pulse 1s infinite; margin: 0 auto; animation-direction: alternate;}
@-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); } 100% { -webkit-transform: scale(1.1); } }
@keyframes pulse { 0% { transform: scale(1); } 100% { transform: scale(1.1); } }

.home #digital ul{list-style: none;}
.home #digital ul li{position: relative; margin: 1rem 0;}
.home #digital ul li::before {position: absolute; display: inline-block; width: 24px; height: 24px; left: -35px; top: 3px; content: ""; background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2369e4a5' class='bi bi-check-circle-fill' viewBox='0 0 16 16'><path d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z'/></svg>"); background-repeat: no-repeat; background-size: cover;}
.home #digital .card-title{font-size: clamp(2rem, 3vw, 3rem) !important;}

.home .clientes-slider{display: none;}

.home #servicos .card{ background-image: url('images/overlays/02.png'); }
.home #digital .card{ background-image: url('images/overlays/03.png'); }

main.interno.pages{margin-top: 130px;}
main.interno.pages .content{ background-color: #2d3e3e; border-color: rgba(255, 255, 255, 0.2) !important; }
main.interno.pages h1{font-size: clamp(1rem, 4vw, 4rem);}
main.interno.pages ul{margin-bottom: 30px;}
main.interno.pages ul li{line-height: 1;}
main.interno.pages ul li::before { width: 16px !important; height: 16px !important; left: -23px !important; top: 0px !important; }
    

main.interno section.justificativa .card{background-color: rgb(49 86 73) !important;}
main.interno section.justificativa .card:hover{background-color: #2d3e3e !important; top: -5px;}
main.interno section.steps .accordion-button{border: 0 !important;}
main.interno section.steps .accordion-button:not(.collapsed){background-color: #FFFFFF !important;}
main.interno section.steps .accordion-button:focus{box-shadow: none !important;}
main.interno section.steps .accordion-item{border-top: none !important; border-left: none !important; border-right: none !important;}
main.interno section.steps .accordion-body{padding-left: 60px;}
main.interno ul{list-style: none;}
main.interno ul li{position: relative; margin: 1rem 0;}
main.interno ul li::before {position: absolute; display: inline-block; width: 24px; height: 24px; left: -35px; top: 2px; content: ""; background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2369e4a5' class='bi bi-check-circle-fill' viewBox='0 0 16 16'><path d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z'/></svg>"); background-repeat: no-repeat; background-size: cover;}

.scroll-indicator {position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); width: 48px; height: 48px; opacity: 0.7;}
.scroll-indicator span {display: block; width: 32px; height: 32px; border-bottom: 3px solid white; border-right: 3px solid white; transform: rotate(45deg); margin: 0 auto; animation: scrollPulse 1.6s infinite ease-in-out;}
@keyframes scrollPulse { 0% { opacity: 0; transform: translateY(0) rotate(45deg); } 50% { opacity: 1; transform: translateY(10px) rotate(45deg); } 100% { opacity: 0; transform: translateY(20px) rotate(45deg); } }

main.interno blockquote{border-left: 4px; border-color: #ededed; padding-left: 6px;}

#contato .form-control:focus, #contato .form-control:active{box-shadow: none; border-color: #69e4a5;} 
#contato .form-control{background-color: #2d3e3e; border-color: rgba(255, 255, 255, 0.2); color: #FFFFFF;}
#contato textarea.form-control{height: 100px;}
#contato .notice{ font-size: 0.75rem; }

.btn {background-color: #69e4a5; color: #213232 !important; border: 2px solid #69e4a5; font-weight: 500; font-size: 18px !important;}
.btn-phanton {background-color: transparent !important; color: #69e4a5 !important; border: 2px solid #69e4a5; font-weight: 500; font-size: 18px !important;}
.btn:hover, .btn:active{ background-color: #2d3e3e; color: #FFFFFF !important; border-color: #FFFFFF; }

.topmenu .nav-link{font-size: 1.3rem; font-weight: 600; color: #FFFFFF;}
.topmenu .megamenu-list a.dropdown-item:hover{ background-color: #69e4a5; border-radius: 6px;  }
.topmenu .megamenu-list li.active a.dropdown-item{ background-color: #69e4a5; border-radius: 6px;  }


footer img.logo{ filter: brightness(100); }
footer .contact .bi { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background-color: #69e4a5; color: #213232; font-size: 1rem; line-height: 1; flex-shrink: 0;}
footer ul.icons li{line-height: 2.3;}
footer p.copyright{font-size: 0.7rem;}
footer .border-top, footer .border-bottom{ border-color: rgba(255, 255, 255, 0.2) !important; }
footer .footermenu a{ transition: all 0.3s ease; }
footer .footermenu a:hover{transform: translateX(6px); }
/* Flip Effect */
footer .social-icon{width:64px; height:64px; position:relative; display:inline-block; perspective:800px; text-decoration:none;}
footer .face{ position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:2rem; color:#fff; border-radius:50%; backface-visibility:hidden; transition:transform .6s ease;}
footer .front{ background-color:rgb(49 86 73); transform:rotateY(0deg);}
footer .back{ background-color:#69e4a5; transform:rotateY(180deg);}
footer .social-icon:hover .front{ transform:rotateY(180deg);}
footer .social-icon:hover .back{ transform:rotateY(360deg);}


/* Paginação */
.page-item:first-child .page-link {border-top-left-radius: 3px; border-bottom-left-radius: 3px;}
.page-item:last-child .page-link {border-top-right-radius: 3px; border-bottom-right-radius: 3px;}
.active > .page-link, .page-link.active { background-color: #d51a1a; border-color: #d51a1a;}
.page-link{ background-color: #e9e6ed; border-color: #dee2e6; color: #333}
.form-floating > textarea.form-control{ height: auto; }

/* Top Menu */
.nav-item.dropdown {position: relative;}
.nav-item.dropdown > .dropdown-menu { position: absolute; top: 100%; left: 50%; transform: translate(-50%, 15px); display: block; opacity: 0; visibility: hidden; transition: opacity .25s ease, transform .25s ease; max-width: 95vw; z-index: 1000;}
.nav-item.dropdown > .dropdown-menu.show { display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: 2rem; padding: 2rem; width: max-content; max-width: 95vw; opacity: 1; visibility: visible; transform: translate(-50%, 0);}
.dropdown-menu.show > li.menu-item-depth-1 { flex: 1; min-width: 0;}
.dropdown-menu.show > li.menu-item-depth-1 > a.dropdown-item { font-family: 'Anton'; font-size: 1.6rem; text-transform: uppercase; pointer-events: none !important; cursor: default; padding-left: 0; margin-bottom: .5rem;}
.dropdown-menu.show li.menu-item-depth-1 > .dropdown-menu { display: block; position: static; transform: none; opacity: 1; visibility: visible; box-shadow: none; background: transparent; padding: 0; margin: 0; }
ul.megamenu-list{list-style: none; margin: 0; padding: 0;}
li.menu-item-has-children > a.dropdown-item { font-family: 'Anton'; font-size: 2.5rem; text-transform: uppercase; line-height: 1.1; margin-bottom: 20px; cursor: default; }
li.menu-item-has-children > a.dropdown-item:hover{ background-color: #FFF; }
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show{color: #FFFFFF;}

.zoom-img {
  transition: transform 0.4s ease-in-out;
}

@media(min-width: 576px){
	
}

@media(max-width: 576px){

    .title{font-size: 3rem; }
	
	.offcanvas{width: 70% !important;}
	/* .offcanvas-menu a, .offcanvas-menu span, .offcanvas-menu ul, .offcanvas-menu li{padding: 0; margin: 0; line-height: unset; } */
	
	.offcanvas-menu ul{margin-left: 1rem !important;}
	.offcanvas-menu li{line-height: 4;}
	

    /* Menu Mobile */
    .topmenu-mobile .nav-link{font-size: 1rem; font-weight: 500; color: #333; line-height: 1.7}
    .topmenu-mobile .menu-title-text{font-size: 0.8rem; font-weight: 700; color: #6c757d;}

	}
}