/* =======================
   SÃO PAULO GAME THEME
   Palette:
   - Vermelho Paulista (Primary): #C1001F
   - Verde Bandeira (Accent):     #00A859
   - Ouro (Highlight):            #F2C037
   - Preto Paulista (Dark):       #111111
   - Cinza Nevoa (Light):         #F5F6F8
   ======================= */

:root{
  /* Brand palette */
  --sp-primary: #C1001F;
  --sp-primary-rgb: 193, 0, 31;
  --sp-accent: #00A859;
  --sp-accent-rgb: 0, 168, 89;
  --sp-gold: #F2C037;
  --sp-dark: #111111;
  --sp-light: #F5F6F8;
  --sp-white: #ffffff;

  /* Map to existing project tokens */
  --bs-primary: var(--sp-primary);
  --bs-green: var(--sp-accent);
  --bs-amarillo: var(--sp-dark); /* used as header/footer bg in this template */
  --bs-light: var(--sp-light);
  --bs-white: var(--sp-white);
  --bs-dark: var(--sp-dark);
}

/*** Spinner Start ***/
/*** Spinner ***/
#spinner {
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease-out, visibility 0s linear .5s;
  z-index: 99999;
}
#spinner.show {
  transition: opacity .5s ease-out, visibility 0s linear 0s;
  visibility: visible;
  opacity: 1;
}
/*** Spinner End ***/

.back-to-top {
  position: fixed;
  right: 30px;
  bottom: 30px;
  display: flex;
  width: 45px;
  height: 45px;
  align-items: center;
  justify-content: center;
  transition: 0.5s;
  z-index: 99;
  box-shadow: 0 10px 25px rgba(var(--sp-primary-rgb), .25);
}

/*** Button Start ***/
.btn { font-weight: 600; transition: .5s; }

.btn-square{ width:32px; height:32px; }
.btn-sm-square{ width:34px; height:34px; }
.btn-md-square{ width:44px; height:44px; }
.btn-lg-square{ width:56px; height:56px; }

.btn-square,.btn-sm-square,.btn-md-square,.btn-lg-square{
  padding:0; display:flex; align-items:center; justify-content:center;
  font-weight:normal; border-radius:50%;
}

.btn.btn-primary{
  background: var(--bs-primary) !important;
  color: var(--bs-white) !important;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  transition: 0.3s;
  box-shadow: 0 8px 20px rgba(var(--sp-primary-rgb), .3);
  border: 1px solid var(--bs-primary);
}
.btn.btn.btn-primary:hover{
  background: var(--bs-green) !important;
  color: var(--bs-white) !important;
  border: 1px solid var(--bs-green);
  box-shadow: 0 10px 26px rgba(var(--sp-accent-rgb), .35);
}

.btn.btn-secondary{
  background: transparent;
  color: var(--bs-green);
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  border: 1px solid rgba(var(--sp-accent-rgb), .35);
  transition: 0.3s;
}
.btn.btn-secondary:hover{
  color: var(--bs-white) !important;
  background: var(--bs-primary);
  border-color: var(--bs-primary);
}

/*** Section Title Start ***/
.section-title{ max-width:900px; text-align:center; margin:0 auto; }
.section-title .sub-style{
  position:relative; display:inline-block; text-transform:uppercase; color:var(--bs-primary);
  letter-spacing:.08em;
}
.section-title .sub-style::before{
  content:""; width:100px; position:absolute; bottom:50%; left:0; transform:translateY(-50%);
  margin-bottom:-6px; margin-left:-100px; border:1.5px solid var(--bs-green) !important;
}
.section-title .sub-style::after{
  content:""; width:50px; position:absolute; top:50%; left:0; transform:translateY(-50%);
  margin-top:-8px; margin-left:-50px; border:1.5px solid var(--bs-primary) !important;
}
.sub-title{
  position:relative; display:inline-block; text-transform:uppercase; color:var(--bs-primary);
  letter-spacing:.08em;
}
.sub-title::before{
  content:""; width:100px; position:absolute; bottom:50%; right:0; transform:translateY(-50%);
  margin-bottom:-8px; margin-right:-100px; border:1.5px solid var(--bs-green) !important;
}
.sub-title::after{
  content:""; width:50px; position:absolute; top:50%; right:0; transform:translateY(-50%);
  margin-top:-6px; margin-right:-50px; border:1.5px solid var(--bs-primary) !important;
}

/*** Topbar Start ***/
.fixed-top .container{ transition:0.5s; }
.topbar{
  padding:2px 10px 2px 20px;
  background: var(--bs-amarillo) !important; /* dark bar */
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.topbar a,.topbar a i{ transition:0.3s; color:#D9D9DB; }
.topbar a:hover,.topbar a i:hover{ color: var(--bs-green) !important; }
@media (max-width:768px){ .topbar{ display:none; } }
/*** Topbar End ***/

/*** Navbar ***/
.navbar-light .navbar-nav .nav-link{
  font-family:'Poppins',sans-serif; position:relative; margin-right:25px; padding:35px 0;
  color: var(--bs-amarillo) !important; /* dark text when over white bg */
  font-size:17px; font-weight:500; outline:none; transition:.3s;
}
.sticky-top .navbar-light .navbar-nav .nav-link{
  padding:20px 0; color: var(--bs-white) !important;
}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active{
  color: var(--bs-green) !important;
}
.navbar-light .navbar-brand img{ max-height:120px; transition:.5s; filter: drop-shadow(0 2px 10px rgba(0,0,0,.25)); }
.sticky-top .navbar-light .navbar-brand img{ max-height:45px; }

.navbar .dropdown-toggle::after{
  border:none; content:"\f107"; font-family:"Font Awesome 5 Free"; font-weight:600; vertical-align:middle;
}
@media (min-width:1200px){
  .navbar .nav-item .dropdown-menu{
    display:block; visibility:hidden; top:100%; transform:rotateX(-75deg); transform-origin:0% 0%;
    border:0; border-radius:10px; transition:.5s; opacity:0; box-shadow:0 24px 60px rgba(0,0,0,.2);
  }
}
.dropdown .dropdown-menu a:hover{
  background: var(--bs-primary);
  color: var(--bs-white);
}
.navbar .nav-item:hover .dropdown-menu{
  transform:rotateX(0deg); visibility:visible; background: var(--bs-light) !important; transition:.5s; opacity:1;
}

@media (max-width:991.98px){
  .sticky-top{ position:relative; background: var(--bs-white); }
  .navbar.navbar-expand-lg .navbar-toggler{
    padding:10px 20px; border:1px solid var(--bs-primary) !important; color:var(--bs-primary);
  }
  .navbar-light .navbar-collapse{ margin-top:15px; border-top:1px solid #DDDDDD; }
  .navbar-light .navbar-nav .nav-link,
  .sticky-top .navbar-light .navbar-nav .nav-link{
    padding:10px 0; margin-left:0; color: var(--bs-dark) !important;
  }
  .navbar-light .navbar-brand img{ max-height:45px; }
}
@media (min-width:991.98px){
  .sticky-top .navbar-light{ background: var(--bs-primary) !important; }
  .navbar-light .navbar-nav .nav-link:after,
  .navbar-light .navbar-nav .nav-link::before{
    position:absolute; content:""; top:30px; bottom:30px; left:0px; width:100%; height:2px;
    background: var(--bs-primary); opacity:0; transition:all 0.5s;
  }
  .navbar-light .navbar-nav .nav-link:before{ bottom:auto; }
  .navbar-light .navbar-nav .nav-link:after{ top:auto; }
  .navbar-light .navbar-nav .nav-link:hover:before,
  .navbar-light .navbar-nav .nav-link.active:before{ top:20px; opacity:1; background: var(--bs-gold, var(--sp-gold)); }
  .navbar-light .navbar-nav .nav-link:hover::after,
  .navbar-light .navbar-nav .nav-link.active::after{ bottom:20px; opacity:1; background: var(--bs-green); }
}
#searchModal .modal-content{ background: rgba(245, 246, 248, 0.6); }
/*** Navbar End ***/

/*** Single Page Hero Header Start ***/
.bg-breadcrumb{
  background: linear-gradient(rgba(var(--sp-primary-rgb), .92), rgba(var(--sp-dark-rgb,17,17,17), .86)), url(../img/breadcrumb.webp);
  background-position:center center; background-repeat:no-repeat; background-attachment:initial; background-size:cover;
  padding:100px 0 60px 0;
}
/*** Single Page Hero Header End ***/

/*** Carousel Hero Header Start ***/
.carousel-header .carousel-control-prev .carousel-control-prev-icon,
.carousel-header .carousel-control-next .carousel-control-next-icon{
  width:4rem; height:4rem; margin-left:-60px; border-radius:50%;
  background-size:60% 60%; transition:0.5s; filter: drop-shadow(0 10px 20px rgba(0,0,0,.25));
}
.carousel-header .carousel-control-next .carousel-control-next-icon{ margin-left:0; margin-right:-60px; }

.carousel-header .carousel .carousel-indicators{ padding-bottom:0; transition:0.5s; }
.carousel-header .carousel .carousel-indicators li{
  width:8px; height:8px; border:8px solid var(--bs-primary); border-radius:50%; margin-right:30px; transition:0.5s;
}
.carousel-header .carousel .carousel-indicators li.active{
  width:8px; height:8px; border:8px solid var(--bs-green);
}

.carousel-header .carousel-inner .carousel-item{ position:relative; min-height:50vh; }
.carousel-header .carousel-inner .carousel-item img{
  position:absolute; width:100%; height:100%; object-fit:cover;
}
.carousel-header .carousel-inner .carousel-item .carousel-caption{
  position:absolute; width:100%; height:100%; top:0; left:0; display:flex; align-items:center; justify-content:center;
  text-align:center; background: linear-gradient(rgba(17,17,17,.65), rgba(17,17,17,.65));
}

@media (max-width:768px){
  .carousel-header{ height:700px !important; }
  .carousel-header .carousel-control-prev .carousel-control-prev-icon,
  .carousel-header .carousel-control-next .carousel-control-next-icon{ margin-top:500px; }
  .carousel-header .carousel-control-prev .carousel-control-prev-icon{ margin-left:0px; }
  .carousel-header .carousel-control-next .carousel-control-next-icon{ margin-right:0px; }
  .carousel-header .carousel .carousel-indicators{ padding:0; }
}
/*** Carousel Hero Header End ***/

/*** Counter Facts Start ***/
.counter-facts{
  background: linear-gradient(rgba(255,255,255,.92), rgba(255,255,255,.85)), url(../img/breadcrumb.png);
  background-size:cover; background-attachment:fixed; background-position:center center; background-repeat:no-repeat;
}
.counter-facts .counter{
  position:relative; text-align:center; width:200px; min-height:215px; padding:10px 15px; margin:0 auto; border-radius:100px;
  box-shadow:0 8px 24px rgba(0,0,0,.16); background: var(--bs-white);
}
.counter-facts .counter:before{
  content:""; position:absolute; height:105px; width:100%; left:0; top:0; border-radius:10px 10px 0 0; background-color: var(--bs-primary);
}
.counter-facts .counter .counter-icon{
  position:relative; width:120px; height:100px; margin:0 auto 10px; border-radius:10px 10px 0 0; transform:translateY(-20px);
  font-size:50px; line-height:90px; color: var(--bs-green); background: rgba(var(--sp-accent-rgb), .25);
  clip-path: polygon(0% 0%, 100% 0, 100% 70%, 50% 100%, 0 70%);
}
.counter-facts .counter .counter-icon:before{
  content:""; position:absolute; width:120px; height:90px; top:0; left:50%; transform:translateX(-50%);
  border-radius:10px 10px 0 0; background: rgba(var(--sp-primary-rgb), .35); z-index:-1;
  clip-path: polygon(0% 0%, 100% 0, 100% 70%, 50% 100%, 0 70%);
}
.counter-facts .counter:hover .counter-icon i{ transform:rotate(360deg); transition:all 0.3s ease; }
.counter-facts .counter h3{
  color: var(--bs-primary); font-size:17px; font-weight:700; letter-spacing:1px; text-transform:uppercase; margin:0 0 5px 0;
}
.counter-facts .counter .counter-value{ font-size:30px; font-weight:800; display:block; color: var(--bs-green); }
@media screen and (max-width:1200px){ .counter-facts .counter{ margin-bottom:40px; } }
/*** Counter Facts End ***/

/*** service Start ***/
.service .service-item{ position:relative; overflow:hidden; }
.service .service-item .service-inner .service-title{ position:relative; margin-top:-30px; text-align:center; transition:0.5s; }
.service .service-item .service-inner .service-title .service-content{
  position:absolute; bottom:-100%; left:0; margin-left:30px; margin-right:30px; text-align:center; border-radius:10px;
  background: var(--bs-primary); opacity:0; transition:0.5s; color:var(--bs-white);
}
.service .service-item:hover .service-inner .service-title .service-content{ bottom:0; opacity:1; }
.service .service-item .service-inner .service-title .service-content a h4{ border-bottom:1px solid rgba(256,256,256,.12); }
.service .service-item .service-inner .service-title .service-title-name{ transition:0.5s; }
.service .service-item:hover .service-inner .service-title .service-title-name{ opacity:0; }
.service .service-item .service-inner .service-img{ position:relative; border-radius:10px; overflow:hidden; }
.service .service-item .service-inner .service-img::after{
  content:""; position:absolute; bottom:0; left:0; width:100%; height:0; border-radius:10px; background: rgba(255,255,255,.5);
  transition:0.5s; opacity:0;
}
.service .service-item:hover .service-inner .service-img::after{ height:100%; opacity:1; }
.service .service-item .service-inner .service-img img{ transition:0.5s; }
.service .service-item:hover .service-inner .service-img img{ transform:scale(1.3); }
/*** Service End ***/

/*** Features Start ***/
.features .feature-item{
  position:relative; box-shadow:0 0 45px rgba(0,0,0,0.08); border-radius:10px; background: var(--bs-white);
  border: 1px solid rgba(0,0,0,.04);
}
.features .feature-item::after{
  content:""; position:absolute; width:100%; height:0; bottom:0; left:0; border-radius:10px; background: rgba(var(--sp-primary-rgb), .08);
  z-index:-1; transition:0.5s;
}
.features .feature-item:hover::after{ height:100%; }
.features .feature-item .feature-icon{
  width:120px; height:120px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; text-align:center;
  background: var(--bs-light); transition:0.5s; border: 1px solid rgba(0,0,0,.05);
}
.features .feature-item:hover .feature-icon{ border-radius:50%; background: var(--bs-white) !important; }
.features .feature-item .feature-icon i{ transition:0.5s; }
.features .feature-item:hover .feature-icon i{
  color: var(--bs-green) !important; transform:rotate(360deg); transition:all 0.5s ease;
}
/*** Features End ***/

/*** Country Start ***/
.country .country-item{ position:relative; }
.country .country-item::after{
  position:absolute; content:""; width:100%; height:0; bottom:0; left:0; background: rgba(var(--sp-primary-rgb), .70);
  border-radius:10px; transition:0.5s; z-index:1;
}
.country .country-item:hover::after{ height:100%; }
.country .country-item .country-flag{
  position:absolute; width:90px; height:90px; border-radius:50%; top:-45px; left:50%; transform:translateX(-50%);
  transition:0.5s; z-index:2;
}
.country .country-item .country-flag img{ border:5px solid var(--bs-white); transition:0.5s; }
.country .country-item:hover .country-flag img{ border:5px solid var(--bs-white); transform:rotate(360deg); transition:all 0.5s ease; }
.country .country-item .country-name{
  position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); transition:0.5s; opacity:0; z-index:3;
}
.country .country-item:hover .country-name{ opacity:1; }
.country .country-item img{ transition:0.5s; }
.country .country-item:hover img{ transform:scale(1.2); }
.country .country-item .country-name a.fs-4{ transition:0.5s; }
.country .country-item .country-name a.fs-4:hover{ color: var(--bs-green) !important; }
/*** Country End ***/

/*** testimonial Start ***/
.testimonial .owl-carousel.testimonial-carousel{ position:relative; }
.testimonial .owl-carousel.testimonial-carousel .testimonial-item .testimonial-content{
  position:relative; border-radius:10px; background: var(--bs-light);
}
.testimonial .owl-carousel.testimonial-carousel .testimonial-item .testimonial-content::after{
  position:absolute; content:""; width:45px; height:45px; bottom:-20px; left:30px; transform:rotate(45deg);
  background: var(--bs-light); z-index:-1;
}
.testimonial .owl-carousel.testimonial-carousel .owl-nav{
  position:absolute; top:-60px; right:0; display:flex; font-size:40px; color: var(--bs-primary);
}
.testimonial .owl-carousel.testimonial-carousel .owl-nav .owl-prev{ margin-right:40px; }
.testimonial .owl-carousel.testimonial-carousel .owl-nav .owl-prev,
.testimonial .owl-carousel.testimonial-carousel .owl-nav .owl-next{ transition:0.5s; }
.testimonial .owl-carousel.testimonial-carousel .owl-nav .owl-prev:hover,
.testimonial .owl-carousel.testimonial-carousel .owl-nav .owl-next:hover{ color: var(--bs-green); }
/*** testimonial end ***/

/*** training Start ***/
.training .training-item .training-inner{ position:relative; }
.training .training-item .training-inner .training-title-name{
  position:absolute; width:100%; height:100%; bottom:0; left:0; padding:20px; border-radius:10px; background: rgba(0,0,0,0.5);
  display:flex; flex-direction:column; justify-content:end; text-align:center; transition:0.5s;
}
.training .training-item{ border-radius:10px; position:relative; overflow:hidden; }
.training .training-item:hover .training-inner .training-title-name{ background: rgba(var(--sp-primary-rgb), .45); }
.training .training-item:hover .training-inner .training-title-name a{ opacity:0; }
.training .training-item .training-inner img{ transition:0.5s; }
.training .training-item:hover .training-inner img{ transform:scale(1.3); }
.training .training-item .training-content{
  position:absolute; width:100%; bottom:-100%; left:0; transition:0.5s;
}
.training .training-item:hover .training-content{ bottom:0; }
/*** training End ***/

/*** Contact Start ***/
.contact .office .office-item{
  text-align:center; border-radius:10px; box-shadow:0 0 45px rgba(0,0,0,0.18); background: var(--bs-light); transition:0.5s;
}
.contact .office .office-item:hover{ box-shadow:20px 20px 20px rgba(var(--sp-primary-rgb), .22); }
.contact .office .office-item .office-img{ position:relative; overflow:hidden; border-radius:10px; }
.contact .office .office-item .office-img img{ transition:0.5s; }
.contact .office .office-item:hover .office-img img{ transform:scale(1.3); }
.contact .office .office-item .office-content a.text-secondary,
.contact .office .office-item .office-content a.text-muted{ transition:0.3s; }
.contact .office .office-item .office-content a.text-muted:hover{ color: var(--bs-green) !important; }
.contact .office .office-item .office-content a.text-secondary:hover{ color: var(--bs-primary) !important; }
/*** Contact End ***/

/*** Footer Start ***/
.footer{ background: var(--bs-primary); }
.footer .footer-item a{ line-height:30px; color: var(--bs-white); transition:0.3s; }
.footer .footer-item p{ line-height:30px; color: #EAECEF; }
.footer .footer-item a:hover{ letter-spacing:2px; color: var(--sp-gold); }
/*** Footer End ***/

/*** copyright Start ***/
.copyright{
  border-top: 1px solid rgba(255,255,255,0.08);
  background: var(--bs-amarillo) !important; /* dark strip */
  color: #EDEDED;
}
/*** copyright end ***/