/* Touvlo (Monotype) - webfont */
@font-face{font-family:"Touvlo";src:url("../fonts/Touvlo-Thin.woff2") format("woff2");font-weight:100 300;font-style:normal;font-display:swap}
@font-face{font-family:"Touvlo";src:url("../fonts/Touvlo-Regular.woff2") format("woff2");font-weight:400 500;font-style:normal;font-display:swap}
@font-face{font-family:"Touvlo";src:url("../fonts/Touvlo-Italic.woff2") format("woff2");font-weight:400 500;font-style:italic;font-display:swap}
@font-face{font-family:"Touvlo";src:url("../fonts/Touvlo-Bold.woff2") format("woff2");font-weight:600 800;font-style:normal;font-display:swap}
@font-face{font-family:"Touvlo";src:url("../fonts/Touvlo-Black.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}

/* titulos: mesmo visual de antes (Regular com negrito sintetico) */
@font-face{font-family:"Touvlo-Titulo";src:url("../fonts/Touvlo-Regular.woff2") format("woff2");font-weight:normal;font-style:normal;font-display:swap}

:root{--bs-body-font-family:"Touvlo",Arial,sans-serif;--bs-font-sans-serif:"Touvlo",Arial,sans-serif}
body,button,input,select,textarea,.btn,.navbar .navbar-nav li a{font-family:"Touvlo",Arial,sans-serif}
body{font-family:"Touvlo",Arial,sans-serif;font-size: 14px; }
h1,h2,h3,h4,h5,h6{font-family:"Touvlo-Titulo","Touvlo",Arial,sans-serif; text-transform:uppercase;}
.text-light {font-family:"Touvlo",Arial,sans-serif;font-weight:100; }


.navbar {
    padding: 25px 0px;
    background-color: #353A42 !important;
}


.navbar .navbar-nav li .nav-link.active, .navbar .navbar-nav li .nav-link:hover, .navbar .navbar-nav li .nav-link:focus {
    color: #fff !important;
    text-transform: uppercase;
}

.navbar .navbar-nav li .nav-link {
    color: #c7c7c7ff !important;
    font-family:"Touvlo",Arial,sans-serif !important;font-weight:100 !important;
    font-size: 14px !important;
    transition:all .3s;
    text-transform:uppercase;
}

.section {
    padding-bottom: 50px;
}

.hero-3 {
    background: #E8583F url(../images/hero-raios.png) top center / contain no-repeat;
    margin-top: 68px;
    min-height: 680px;
}
.hero-3 h1 {
font-family:"Touvlo-Titulo","Touvlo",Arial,sans-serif; 
line-height:1.5em;
color:#fff;
}

.hero-3 .hero-3-title {
    font-size: 36px;
}

footer {    background: #353A42 !important; padding:5%;}

footer h5 {
font-family:"Touvlo",Arial,sans-serif;font-weight:100;  }

.bb1pxwhite {
    border-bottom: white 1px solid;
    width: fit-content;
}

.bb1pxblack {
    border-bottom: black 1px solid;
}

#preloader{position:fixed;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top left, #353A42 0%, #000 100%);z-index:9999999;transition:all .4s;visibility:visible;opacity:1}
#preloader #status{position:absolute;left:50%;top:50%;transform:translate(-50%)}

/* icones dos cards: espaco de altura fixa para manter titulo/linha/texto alinhados */
.svc-icon {
    display: block;
    width: 100%;
    height: 48px;
    margin: 0 0 24px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto 48px;
}
.svc-icon-beneficio { background-image: url('beneficio.svg'); }
.svc-icon-troca     { background-image: url('troca.svg'); }
.svc-icon-qualidade { background-image: url('qualidade.svg'); }
.svc-icon-ajuste    { background-image: url('ajuste.svg'); }
.svc-icon-limpeza   { background-image: url('limpeza.svg'); }
.svc-icon-smart     { background-image: url('smart.svg'); }
.svc-icon-teste     { background-image: url('teste.svg'); }

/* cards de servicos: titulo, linha e texto alinhados e com a mesma altura */
#servicos .row > [class*="col-lg-4"] {
    display: flex;
}

#servicos .plan-card {
    width: 100%;
}

#servicos .plan-card .card-body {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

#servicos .plan-card h4 {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center !important;
    height: 64px;
    min-height: 64px !important;
    margin-bottom: 1.5rem !important;
    padding-left: 0 !important;
}

.plan-card {
    min-height: 95%;
}

.plan-card.black {
    background: #353A42;
}

.plan-card.black h4,.plan-card.black p {
    color: #fff !important;
}

.btn.btn-primary {
    background-color: transparent !important;
    border: 1px solid #fff !important;
    box-shadow: 0 3px 10px rgba(255, 255, 255, 0);
    color: #fff !important;
}

.btn.btn-primary:hover, .btn.btn-primary:focus, .btn.btn-primary.focus, .btn.btn-primary:active, .btn.btn-primary.active {
    background-color: transparent !important;
    border: 1px solid #fff !important;
    box-shadow: 0 3px 10px rgba(255, 255, 255, .5);
    color: #fff !important;
}


.marcas-box img:hover {
  transform: scale(1.2) !important; /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  transition: transform 0.3s ease !important;
  cursor: pointer !important;
}

@media (max-width: 768px) {
    .hero-3 {
        min-height: 500px !important;
    }
}



@media (prefers-reduced-motion: no-preference) {
  .in-view {
    animation: fade 1s 1s both;
  }

  .in-view.animate__delay-3s {
animation-name: fade;
animation-duration: 3s;
animation-iteration-count: 1;
animation-delay: 2s;
animation-fill-mode: both;
  }

  footer .h4.in-view,
  .logo-dark.in-view {
    animation: fade .1s .1s ease;
  }

  .not-in-view {
    opacity: 0;
  }
}


@keyframes fade {
  0% {
    opacity: 0;
    transform: translate(0, 2rem);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}




* {
  margin: 0;
  box-sizing: border-box;
}    

html, body { overflow-x: hidden; max-width: 100%; }