.elementor-kit-570{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#E91E63;--e-global-color-text:#334155;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:500;}.elementor-kit-570 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:768px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//*********/
html, body {
  overflow-x: hidden;
}
body { 
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI", "Poppins",sans-serif; 
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.elementor-widget-search .e-search-form{
    --e-search-icon-clear-absolute-width:0px!important;
}
.elementor-widget-taxonomy-filter{
  --e-filter-item-padding: 0px!important;
}

a, a:focus,a:active{
	outline:none!important;
}

@media (min-width: 1025px){
  .elementskit-megamenu-has .elementskit-megamenu-panel {
      transition: 600ms !important; 
  }
}
#ekit-megamenu-main-menu #menu-main-menu>li{
  /*margin: 0;*/
}

#ekit-megamenu-main-menu #menu-main-menu>li>a:before, #ekit-megamenu-main-menu #menu-main-menu>li>a:after{
  position: absolute;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;

}
#ekit-megamenu-main-menu #menu-main-menu>li>a:before{
  /*top: 0;*/
  bottom:0;
  display: none;
  height: 4px;
  width: 0%;
  content: "";
  background-color: #707070;
}
#ekit-megamenu-main-menu #menu-main-menu>li>a:after{
  left: 0;
  /*top: 0;*/
  padding: 0px;
  position: absolute;
  content: attr(data-hover);
  color: #707070;
  white-space: nowrap;
  max-width: 0%;
  overflow: hidden;
  display: none;
}

:lang(en) #ekit-megamenu-main-menu #menu-main-menu>li>a:after, :lang(es) #ekit-megamenu-main-menu #menu-main-menu>li>a:after{
  display: none!important;
}

#ekit-megamenu-main-menu #menu-main-menu>li>a:hover:before, #ekit-megamenu-main-menu #menu-main-menu>li.active>a:before{
  opacity: 1;
  width: 100%;
}
#ekit-megamenu-main-menu #menu-main-menu>li>a:hover:after, #ekit-megamenu-main-menu #menu-main-menu>li.active>a:after{
  max-width: 100%;
}


.elementskit-navbar-nav > li.current-menu-ancestor > a:before{
  width: 100%!important;
}


@media (min-width: 960px){
	#ekit-megamenu-main-menu #menu-main-menu>li>a:before, #ekit-megamenu-main-menu #menu-main-menu>li>a:after{
	  display: block;
	}
	#ekit-megamenu-main-menu #menu-main-menu>li {
		/*margin: 0 9px;*/
	}
	
	
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:after,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:hover:after,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:focus:after{
	  display: block;
	  max-width: 100%;
	}

	#ekit-megamenu-main-menu #menu-main-menu>.open>a:before,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:hover:before,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:focus:before{
	  display: block;
	  width: 100%;
	}
	
	
}


/*SUBMENU*/


.elementskit-navbar-nav-default .elementskit-submenu-panel>li>a:before{
  position: absolute;
  /*top: 0;*/
  bottom:0;
  left: 0;
  /*display: none;*/
  height: 4px;
  width: 0%;
  content: "";
  background-color: #707070;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.elementskit-navbar-nav-default .elementskit-submenu-panel>li>a:hover:before, 
.elementskit-navbar-nav-default .elementskit-submenu-panel>li.active>a:before{
  opacity: 1;
  width: 100%;
}




#NavigationPane{
  width: auto;
  float: none;
  padding: 0;
  /*margin-left: 15px;*/
}

#pageTitlePane{
  max-width:100%;
  float: none;
  padding:  7px 0 0 0;
  width: 0px;
}

@media screen and (min-width:767px) {
  #NavigationPane{
      float: right;
      margin-left: 0;
  }
  #pageTitlePane{
    float: left;
    width: auto;
    padding: 4px 15px 0 0;
      
  }
}
@media screen and (min-width:960px) {
  #pageTitlePane{
      padding: 4px 10px 0 0;
  }
}


#page-top{
  background-image: url(https://wpbb.mylib.eu/wp-content/uploads/2025/05/page-top-border-white.svg), url(https://wpbb.mylib.eu/wp-content/uploads/2025/05/bg_head_shadow-1.svg);
  background-position: center bottom, center top;
  background-repeat: repeat-x, no-repeat;
  background-color: #F9F2E8;
  /*overflow:hidden;*/
}

#page-top{
  background: rgba(255, 255, 255, 0.95)

}
#page-top > div {
  justify-content: space-between;
  overflow: hidden;
}


@media only screen and (min-width: 767px){
  #page-top > div {
      /*padding: 0 15px;*/
      justify-content: space-between;

  }
  
}


#page-top > div h2 {
  border-bottom: 4px solid #26292C;
  color: #748A96;
  font-weight: 700;
  display: inline-block;
  margin: 0px;
  min-height: 52px;
  padding: 0;
  position: relative;
  letter-spacing: -0.015em;
  font-size: 24px;
  line-height: 45px;
  text-transform: lowercase;
}

#page-top > div a, #page-top > div a:link, #page-top > div a:visited, #page-top span{
  color: #748A96;
  font-size:12px;
  text-decoration: none;
}

#page-top > div a:hover{
  color:#202124;
  text-decoration: none;
}
#page-top > div a:hover span{
  color:#202124;
}

/*
#page-top .swiper-button-prev, #page-top .swiper-button-next {
  color:#202124; 

}
#page-top .swiper-button-next {
  right:0;
}
#page-top .swiper-button-prev{
  left:0;
}

#page-top .swiper-button-prev:after, #page-top .swiper-button-next:after {
  font-size: 14px;
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{
  opacity: 0;
}

@media (min-width: 767px){
  #page-top .swiper-button-prev:after, #page-top .swiper-button-next:after {
      font-size: 16px;
  }
}

*/

#page-top .swiper-submenu-container {
  position: relative;
  padding: 0 27px;
}

.headerFix{height:53px;}

@media only screen and (min-width: 1024px){
    .headerFix{height:80px;}
  
}


#breadcrumbs{
	margin-bottom:-10px;	
}
#page-top .swiper {
 /*overflow:hidden;*/
 width: 100%;
 height: 100%;
}
  #page-top .swiper-wrapper{
	  margin: 0!important;
	  padding:0!important;
	  list-style: none;
	  display: flex;
  }
@media only screen and (min-width:767px) {
 #page-top  .swiper-wrapper{
   /* margin:20px 0 0 0!important;*/
  }
  
}
  #page-top .swiper-slide{
	   width: auto!important;
	   display: table;
	   padding-right: 0;
	   flex-shrink: 0;
  }

#page-top .swiper .swiper-slide a {

    line-height: 15px;
    font-size: 15px;
   /* font-family: 'Nunito', sans-serif; */
    font-weight: 700;
    /* text-transform: uppercase; */
    position: relative;
    letter-spacing: 0;
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    width: 100%;
	  width: auto!important;
	  /*background:#fff;*/
	  padding: 0 15px;
    /*border-radius: 10px;*/
}
#page-top .swiper .swiper-slide {
  margin: 0;
  padding: 0;
  text-align: center;
  height: 56px;
  display: table;
  background: none;
  -webkit-transition: all 300ms;
  -moz-transition: all 300ms;
  -o-transition: all 300ms;
  transition: all 300ms;
}
/*
#page-top.no-child .swiper .swiper-slide {
  height: 56px;
}
*/
@media screen and (min-width:767px) {
  #page-top  .swiper .swiper-slide {
    height: 72.69px;  
  }
}
#page-top .swiper .swiper-slide a:after{
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
background: #26292C;
left: 0;
visibility: hidden;
border-left: 0px solid transparent;
border-right: 0px solid transparent;
border-bottom: 4px solid transparent;
border-bottom-color: #26292C;
-webkit-transform: translate3d(0, 0, 0) scaleX(0);
-moz-transform: translate3d(0, 0, 0) scaleX(0);
transform: translate3d(0, 0, 0) scaleX(0);
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
  
}

@media screen and (min-width:767px) {
	#page-top .swiper .swiper-slide a:after{
		border-bottom: 4px solid transparent;
	}

    #page-top .swiper .swiper-slide a {

        line-height: 17px;
        font-size: 17px;
    }

}
  


#page-top .swiper .swiper-slide a:hover:after{
bottom: 0;
visibility: visible;
-webkit-transform: translate3d(0, 0, 0) scaleX(1);
-moz-transform: translate3d(0, 0, 0) scaleX(1);
transform: translate3d(0, 0, 0) scaleX(1);
}

#page-top .swiper .swiper-slide a.ativo:after, #page-top .swiper .swiper-slide a.ativo:hover:after {
bottom: 0;
visibility: visible;
-webkit-transform: translate3d(0, 0, 0) scaleX(1);
-moz-transform: translate3d(0, 0, 0) scaleX(1);
transform: translate3d(0, 0, 0) scaleX(1);

}
#page-top .swiper .swiper-slide a.ativo{
  color: #26292C;
}
#page-top .swiper .swiper-slide.swiper-slide-active a{
	/*color:#000;*/
}

#header-LBW > div {
  justify-content: space-between!important;
}
#social-icons > div {
  justify-content: flex-end!important;
}
.elementor-search-form--skin-full_screen .elementor-search-form__container {
  z-index: 99998;
}
.elementor-search-form--skin-full_screen .elementor-search-form__toggle i{
  background: #FFF;
	color:#808080;
}

.ekit-template-content-header{
  position: fixed;
  width: 100%;
  z-index: 99;
  top: 0;
 /* height: 100vh;/*hack for mobile menu*/
}

#header-LBW{
  position: fixed;
  width: 100%;
  z-index: 99;
  top: 0;
  /*height: 100vh;/*hack for mobile menu*/
}

.elementskit-menu-hamburger.elementskit-menu-toggler{
  display: none!important;
}
/*header*/
.headroom {
  will-change: transform;
  -webkit-transition: -webkit-transform 300ms ease;
  -moz-transition: -moz-transform 300ms ease;
  -o-transition: -o-transform 300ms ease;
  transition: transform 300ms ease;
}
.headroom--pinned {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
  /*border-bottom: 1px solid #F1F3F4;*/
  /*max-height: 64px;*/
}

.headroom--unpinned {
  -webkit-transform: translateY(-80px);
  -o-transform: translateY(-80px);
  transform: translateY(-80px);

}
#header-LBW{
  -webkit-transition:all .2s ease!important;
  -o-transition:all .2s ease!important;
  transition: all .2s ease!important;
}

.headroom--not-top#header-LBW{
  /*
  padding-top: 14px;
  padding-bottom: 14px;
  */
}
@media only screen and (min-width:1024px) {
  .headroom--not-top#header-LBW{
    /*
    padding-top:0;
    padding-bottom:0;
    */
  }
}


.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}



.pages_grid{
   /* float:left;*/
   margin: 33px auto 0 auto!important;
   padding: 0!important;
}

.pages_grid:after {
    content: '';
    display: block;
    clear: both;
}
  
.square-box{
    overflow: hidden;
    position: relative;
    float: left;
    width: 150px;
    height: 150px;
    border: 4px solid #808080;
    background-color: #fff;
    border-radius: 15px;
    margin-bottom: 20px;
	-webkit-transition:border  0.2s ease-out;
	-moz-transition:border  0.2s ease-out;
	-o-transition:border  0.2s ease-out;
	-ms-transition:border  0.2s ease-out;
	transition:border  0.2s ease-out;
}

.square-content span {
    display: block;
    margin-top: -30px;
    padding: 0 10px;
}

.square-box:before {
  content: "e876";
  font-weight: 700;
  font-size: 24px;
  line-height: 24px;
  position: absolute;
  right: 24px;
  bottom: 24px;
  display: inline-block;
  font-family: elementskit!important;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.square-content{
    position:  absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-decoration: none!important;
    text-align: center;
    color: #26292C;
    font-size: 19px;
    line-height: 19px;
    font-weight: 700;
    text-transform: lowercase;

    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -30px;

    -webkit-transition:all 0.2s ease-out;
    -moz-transition:all 0.2s ease-out;
    -o-transition:all 0.2s ease-out;
    -ms-transition:all 0.2s ease-out;
    transition:all 0.2s ease-out;

}
/*
.square-content div {
   display: table;
   width: 100%;
   height: 100%;
}
.square-content a {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    color: #26292C;
    font-size: 19px;
    line-height: 19px;
    font-weight: 700;
    font-family: 'Adobe Garamond Pro';
    text-transform: lowercase;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	-o-transition:all 0.2s ease-out;
	-ms-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}
*/

.square-content:hover {
    text-decoration: none;
    color: #808080!important;
}
.square-box:hover:before {
  color: #808080;
}

.square-box:hover{
    border-color: #26292C;
}

#search-icon{
    width:30px;
    margin: 0 2px 0 8px;
}

@media(min-width: 769px) {
     #search-icon{
        width:30px;
    }  
}


#languages{
    width:33px;
    margin: 0 6px;
   
}

@media(min-width: 769px) {
     #languages{
        width:33px;
    }  
}


.switcher {font-size:13px;font-weight:500;margin:0;text-align:left;cursor:pointer;overflow:hidden;width:33px;line-height:17px;float:right;}
.switcher a {text-decoration:none;display:block;font-size:13px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;outline: none;}
.switcher a img {vertical-align:middle;display:inline;border:0;padding:0;margin:0;opacity:0.8;}
.switcher a:hover img {opacity:1;}
.switcher .selected { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);position:relative;z-index:9999;}
.switcher .selected a {border-top:2px solid #808080;border-bottom:2px solid #808080;color:#333;padding:0;width:auto;}
.switcher .selected a:after {height:19px;display:inline-block;position:absolute;right:0;width:15px;background-position:50%;background-size:11px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 285 285'><path d='M282 76.5l-14.2-14.3a9 9 0 0 0-13.1 0L142.5 174.4 30.3 62.2a9 9 0 0 0-13.2 0L3 76.5a9 9 0 0 0 0 13.1l133 133a9 9 0 0 0 13.1 0l133-133a9 9 0 0 0 0-13z' style='fill:%23666666'/></svg>");background-repeat:no-repeat;content:""!important;transition:all .2s;}
.switcher .selected a.open:after {-webkit-transform: rotate(-180deg);transform:rotate(-180deg);}
.switcher .selected a:hover { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);}
.switcher .option {position:absolute;z-index:9998;border-left:0px solid #808080;border-right:0px solid #808080;border-bottom:2px solid #808080;background-color:#ffffff;display:none;width:33px;max-height:198px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;overflow-y:auto;overflow-x:hidden;}
.switcher .option a {color:#333;padding:5px 5px;font-size:13px;}
.switcher .option a:hover { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);}
.switcher .option a.selected { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);}
#selected_lang_name {float: none;}
.l_name {float: none !important;margin: 0;}
.switcher .option::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,0.3);border-radius:5px;background-color:#f5f5f5;}
.switcher .option::-webkit-scrollbar {width:5px;}
.switcher .option::-webkit-scrollbar-thumb {border-radius:5px;-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.3);background-color:#888;}
.clearfix {overflow: auto;}
.clearfix::after {content: "";clear: both;display: table;}

#user-icon{
    width:47px;
    margin: 0 0 0 7px;
}
@media(min-width: 769px) {
     #user-icon{
        width:33px;
    }  
}



#particles-js{
width: 100vw;
/*height: 100vh;*/
/*background-color: #252525;*/
position: relative;
/* z-index: 2;*/
}

#particles-js canvas {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}


.members-access-error{
  text-align: center;
  margin-top: 108px;
}






/* ==== FONT ==== */
.glass-cta,
.glass-text,
.glass-btn {
  font-family: 'Montserrat', sans-serif;
}

/* ==== CORES POR PRODUTO ==== */
[data-product="gib"] {
  --color-primary: #2F80ED;
  --color-secondary: #1B5FA8;
  --color-accent: #5FA8D3;
  --color-hover: #1763c0;
}

[data-product="gead"] {
  --color-primary: #EB5757;
  --color-secondary: #B93F3F;
  --color-accent: #F28A8A;
  --color-hover: #d94c4c;
}

[data-product="musette"] {
  --color-primary: #DFA600;
  --color-secondary: #A87B00;
  --color-accent: #F2C94C;
  --color-hover: #c48f00;
}

[data-product="selfcheck"] {
  --color-primary: #808080;
  --color-secondary: #5f5f5f;
  --color-accent: #A6A6A6;
  --color-hover: #666666;
}

[data-product="rfid"] {
  --color-primary: #F2994A;
  --color-secondary: #C96E2D;
  --color-accent: #F5B27C;
  --color-hover: #d17a28;
}

[data-product="default"] {
  --color-primary: #5FA8D3;
  --color-secondary: #3D7FA5;
  --color-accent: #8FC4E6;
  --color-hover: #478EB0;
}

/* =========================
   BACKGROUND
========================= */
.gib-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(47, 128, 237, 0.22), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(99, 179, 237, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(147, 197, 253, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #1e293b 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.gib-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(47, 128, 237, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(59, 130, 246, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}
.gib-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47,128,237,0.02) 1px, transparent 1px);

  background-size: 80px 80px;

  opacity: 0.12;
  pointer-events: none;
  mix-blend-mode: overlay;
}

.gib-bg-simple {
  background:
    radial-gradient(circle at 30% 20%, rgba(47,128,237,0.15), transparent 40%),
    radial-gradient(circle at 70% 80%, rgba(155,81,224,0.12), transparent 50%),
    linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  background-blend-mode: overlay;
}

.gib-bg-2{
  background:radial-gradient(circle at 30% 30%, #1e293b, #020617);  
}
.gead-bg {
  background:
    radial-gradient(circle at 25% 20%, rgba(235, 87, 87, 0.22), transparent 45%),
    radial-gradient(circle at 75% 80%, rgba(248, 113, 113, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(252, 165, 165, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #111827 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.gead-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(235, 87, 87, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(239, 68, 68, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}
.gead-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    radial-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(rgba(235, 87, 87, 0.02) 1px, transparent 1px);

  background-size: 24px 24px, 140px 140px;

  opacity: 0.14;
  pointer-events: none;
  mix-blend-mode: overlay;
}
.gead-bg-simple {
    background: 
        radial-gradient(circle at 25% 15%, rgba(235, 87, 87, 0.12), transparent 45%),
        radial-gradient(circle at 75% 85%, rgba(153, 27, 27, 0.10), transparent 55%),
        linear-gradient(180deg, #0b1220 0%, #1e293b 100%);
    background-blend-mode: overlay;
}
.musette-bg {
  background:
    radial-gradient(circle at 20% 15%, rgba(223, 166, 0, 0.18), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(255, 199, 64, 0.10), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(255, 235, 160, 0.06), transparent 60%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #111827 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}
.musette-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 20%, rgba(223, 166, 0, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(251, 191, 36, 0.08), transparent 55%);
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}
.musette-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 50%, rgba(255, 220, 120, 0.04), transparent 70%),
    radial-gradient(circle at 20% 80%, rgba(223, 166, 0, 0.03), transparent 60%),
    radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.02), transparent 55%);

  opacity: 0.9;
  mix-blend-mode: screen;
  pointer-events: none;
}

.musette-bg-simple {
  background:
    radial-gradient(circle at 30% 25%, rgba(223,166,0,0.12), transparent 50%),
    radial-gradient(circle at 70% 75%, rgba(148,163,184,0.10), transparent 55%),
    linear-gradient(180deg, #0b1220 0%, #1e293b 100%);
  background-blend-mode: overlay;
}

.rfid-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(242, 153, 74, 0.28), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(251, 191, 36, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(253, 186, 116, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #111827 55%, #1f2937 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.rfid-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(242, 153, 74, 0.14), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(251, 146, 60, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}

.rfid-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,153,74,0.02) 1px, transparent 1px);

  background-size: 80px 80px;

  opacity: 0.12;
  pointer-events: none;
  mix-blend-mode: overlay;
}

/* versão simples */
.rfid-bg-simple {
  background:
    radial-gradient(circle at 30% 20%, rgba(242,153,74,0.18), transparent 40%),
    radial-gradient(circle at 70% 80%, rgba(251,146,60,0.12), transparent 50%),
    linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  background-blend-mode: overlay;
}



.selfcheck-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(128, 128, 128, 0.22), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(160, 160, 160, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(200, 200, 200, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #1e293b 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.selfcheck-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(180, 180, 180, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(128, 128, 128, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}

.selfcheck-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(128,128,128,0.02) 1px, transparent 1px);

  background-size: 80px 80px;

  opacity: 0.12;
  pointer-events: none;
  mix-blend-mode: overlay;
}

/* versão simples */
.selfcheck-bg-simple {
  background:
    radial-gradient(circle at 30% 20%, rgba(128,128,128,0.18), transparent 40%),
    radial-gradient(circle at 70% 80%, rgba(160,160,160,0.12), transparent 50%),
    linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  background-blend-mode: overlay;
}
/* =========================
   CTA
========================= */

/* ==== WRAPPER ==== */
.glass-cta-wrapper {
  display: flex;
  justify-content: center;
  margin-top: 40px;
  width: 100%;
}

/* ==== CONTAINER ==== */
.glass-cta {
  display: flex;
  align-items: center;
  justify-content: center;

  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);

  background: rgba(74, 81, 101, 0.55);
  border-radius: 12px;
  box-shadow: 0 25px 60px rgba(0,0,0,0.25);
  border: 1px solid rgba(255,255,255,0.08);

  padding: 20px 30px;
  max-width: 720px;
  width: 100%;

  transition: all 0.3s ease;
  z-index: 2;
}

.glass-cta:hover {
  background: rgba(74, 81, 101, 0.65);
  transform: translateY(-3px) scale(1.01);
}


.border-accent {
  border-color: var(--color-secondary);
}
.highlight {
  color: var(--color-accent);
}
.highlight {
  color: var(--color-accent);
}

/* ==== INNER ==== */
.glass-cta-inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;

  width: 100%;
  gap: 20px;
  padding-left: 20px;
}

/* ==== TEXTO ==== */
.glass-text-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
}

.glass-text {
  color: #fff;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: 0.2px;

  padding-left: 20px;
  opacity: 0.9;
}

/* ==== DOT ==== */
.glass-dot {
  position: absolute;
  left: 0;
  top: 10px;
  transform: translateY(-50%);

  width: 8px;
  height: 8px;
  border-radius: 50%;

  background: var(--color-primary);
  animation: pulse 2s infinite;

  z-index: 2;
}

/* ==== BOTÃO ==== */
.glass-btn {
  position: relative;
  overflow: hidden;

  padding: 12px 28px;
  border-radius: 6px;

  font-weight: 600;
  text-decoration: none;
  color: #fff;

  background: var(--color-primary);

  transition: all 0.3s ease;

  white-space: nowrap;
  flex-shrink: 0;

  backdrop-filter: blur(6px);
}

/* hover genérico (mais leve e consistente) */
.glass-btn:hover {
  transform: translateY(-2px);
  filter: brightness(85%);
  box-shadow: 0 10px 25px rgba(0,0,0,0.35);
  background: var(--color-hover);
}

/* ==== SHINE EFFECT ==== */
.glass-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;

  background: linear-gradient(
    120deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.4) 50%,
    rgba(255,255,255,0) 100%
  );

  transform: skewX(-20deg);
}

.glass-btn:hover::after {
  left: 130%;
  transition: 0.6s;
}

/* ==== ANIMAÇÃO DOT ==== */
@keyframes pulse {
  0% {
    transform: translateY(-50%) scale(1);
    opacity: 0.7;
  }
  50% {
    transform: translateY(-50%) scale(1.6);
    opacity: 1;
  }
  100% {
    transform: translateY(-50%) scale(1);
    opacity: 0.7;
  }
}

/* ==== RESPONSIVO ==== */
@media (max-width: 768px) {

  .glass-cta-inner {
    flex-direction: column;
    text-align: center;
    gap: 15px;
  }

  .glass-text-wrapper {
    justify-content: center;
  }

  .glass-btn {
    width: 100%;
    text-align: center;
  }

  .glass-cta {
    padding: 20px;
  }
}




/* ==== Animação DOT ==== */
@keyframes pulse {
  0% { transform: translateY(-50%) scale(1); opacity: 0.7; }
  50% { transform: translateY(-50%) scale(1.6); opacity: 1; }
  100% { transform: translateY(-50%) scale(1); opacity: 0.7; }
}

/* ==== RESPONSIVO ==== */
@media (max-width: 768px) {

  .glass-cta-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 15px;
  }

  .glass-text-wrapper {
    justify-content: center;
  }

  .glass-btn {
    width: 100%;
    text-align: center;
  }

  .glass-cta {
    padding: 20px;
  }
}



/* glow */
.beneficio-icon svg {
  filter: drop-shadow(0 0 6px var(--color-primary));
  transition: filter 0.3s ease;
}

.beneficio-item:hover .beneficio-icon svg {
  filter: drop-shadow(0 0 12px var(--color-primary));
}
/* =========================
   BTN minimal
========================= */

.cta-wrapper {
  display: flex;
  justify-content: var(--cta-align, flex-end);
}

@media (max-width: 1024px) {
  .cta-wrapper {
    --cta-align: center;
  }
}

.glass-cta-luxo {
  display: inline-flex;
  align-items: center;
  justify-content: center; /* controlo base */
  gap: 14px;

  padding: 12px 18px;
  border-radius: 999px;

  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255,255,255,0.10);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  box-shadow:
    0 10px 30px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.08);

  text-decoration: none;
  color: #fff;

  position: relative;
  overflow: hidden;

  transition: transform 0.3s ease;

  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  opacity: 0;
  animation: ctaIn 0.4s ease forwards;


}
@keyframes ctaIn {
  from {
    opacity: 0;
    transform: translateY(6px);
    backdrop-filter: blur(0px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    backdrop-filter: blur(18px);
  }
}
/* hover premium */
.glass-cta-luxo:hover {
  transform: translateY(-3px);
  background: rgba(255,255,255,0.09);
  box-shadow:
    0 18px 45px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.12);
  color: #fff;
}

/* shimmer subtil (luxo) */
.glass-cta-luxo::before {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;

  background: linear-gradient(
    120deg,
    transparent,
    rgba(255,255,255,0.15),
    transparent
  );

  transform: skewX(-20deg);
  transition: 0.6s;
}

.glass-cta-luxo:hover::before {
  left: 120%;
}

/* DOT */
.glass-dot-luxo {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-primary);
  flex-shrink: 0;

  animation: pulse 2.2s infinite;/*********/
}
.dropdown-item>i {
    padding-right: 0px;
    padding-top: 8px;
}
html, body {
  overflow-x: hidden;
}
body { 
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI", "Poppins",sans-serif; 
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.elementor-widget-search .e-search-form{
    --e-search-icon-clear-absolute-width:0px!important;
}
.elementor-widget-taxonomy-filter{
  --e-filter-item-padding: 0px!important;
}

a, a:focus,a:active{
	outline:none!important;
}

@media (min-width: 1025px){
  .elementskit-megamenu-has .elementskit-megamenu-panel {
      transition: 600ms !important; 
  }
}
#ekit-megamenu-main-menu #menu-main-menu>li{
  /*margin: 0;*/
}

#ekit-megamenu-main-menu #menu-main-menu>li>a:before, #ekit-megamenu-main-menu #menu-main-menu>li>a:after{
  position: absolute;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;

}
#ekit-megamenu-main-menu #menu-main-menu>li>a:before{
  /*top: 0;*/
  bottom:0;
  display: none;
  height: 4px;
  width: 0%;
  content: "";
  background-color: #707070;
}
#ekit-megamenu-main-menu #menu-main-menu>li>a:after{
  left: 0;
  /*top: 0;*/
  padding: 0px;
  position: absolute;
  content: attr(data-hover);
  color: #707070;
  white-space: nowrap;
  max-width: 0%;
  overflow: hidden;
  display: none;
}

:lang(en) #ekit-megamenu-main-menu #menu-main-menu>li>a:after, :lang(es) #ekit-megamenu-main-menu #menu-main-menu>li>a:after{
  display: none!important;
}

#ekit-megamenu-main-menu #menu-main-menu>li>a:hover:before, #ekit-megamenu-main-menu #menu-main-menu>li.active>a:before{
  opacity: 1;
  width: 100%;
}
#ekit-megamenu-main-menu #menu-main-menu>li>a:hover:after, #ekit-megamenu-main-menu #menu-main-menu>li.active>a:after{
  max-width: 100%;
}


.elementskit-navbar-nav > li.current-menu-ancestor > a:before{
  width: 100%!important;
}


@media (min-width: 960px){
	#ekit-megamenu-main-menu #menu-main-menu>li>a:before, #ekit-megamenu-main-menu #menu-main-menu>li>a:after{
	  display: block;
	}
	#ekit-megamenu-main-menu #menu-main-menu>li {
		/*margin: 0 9px;*/
	}
	
	
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:after,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:hover:after,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:focus:after{
	  display: block;
	  max-width: 100%;
	}

	#ekit-megamenu-main-menu #menu-main-menu>.open>a:before,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:hover:before,
	#ekit-megamenu-main-menu #menu-main-menu>.open>a:focus:before{
	  display: block;
	  width: 100%;
	}
	
	
}


/*SUBMENU*/


.elementskit-navbar-nav-default .elementskit-submenu-panel>li>a:before{
  position: absolute;
  /*top: 0;*/
  bottom:0;
  left: 0;
  /*display: none;*/
  height: 4px;
  width: 0%;
  content: "";
  background-color: #707070;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.elementskit-navbar-nav-default .elementskit-submenu-panel>li>a:hover:before, 
.elementskit-navbar-nav-default .elementskit-submenu-panel>li.active>a:before{
  opacity: 1;
  width: 100%;
}




#NavigationPane{
  width: auto;
  float: none;
  padding: 0;
  /*margin-left: 15px;*/
}

#pageTitlePane{
  max-width:100%;
  float: none;
  padding:  7px 0 0 0;
  width: 0px;
}

@media screen and (min-width:767px) {
  #NavigationPane{
      float: right;
      margin-left: 0;
  }
  #pageTitlePane{
    float: left;
    width: auto;
    padding: 4px 15px 0 0;
      
  }
}
@media screen and (min-width:960px) {
  #pageTitlePane{
      padding: 4px 10px 0 0;
  }
}


#page-top{
  background-image: url(https://wpbb.mylib.eu/wp-content/uploads/2025/05/page-top-border-white.svg), url(https://wpbb.mylib.eu/wp-content/uploads/2025/05/bg_head_shadow-1.svg);
  background-position: center bottom, center top;
  background-repeat: repeat-x, no-repeat;
  background-color: #F9F2E8;
  /*overflow:hidden;*/
}

#page-top{
  background: rgba(255, 255, 255, 0.95)

}
#page-top > div {
  justify-content: space-between;
  overflow: hidden;
}


@media only screen and (min-width: 767px){
  #page-top > div {
      /*padding: 0 15px;*/
      justify-content: space-between;

  }
  
}


#page-top > div h2 {
  border-bottom: 4px solid #26292C;
  color: #748A96;
  font-weight: 700;
  display: inline-block;
  margin: 0px;
  min-height: 52px;
  padding: 0;
  position: relative;
  letter-spacing: -0.015em;
  font-size: 24px;
  line-height: 45px;
  text-transform: lowercase;
}

#page-top > div a, #page-top > div a:link, #page-top > div a:visited, #page-top span{
  color: #748A96;
  font-size:12px;
  text-decoration: none;
}

#page-top > div a:hover{
  color:#202124;
  text-decoration: none;
}
#page-top > div a:hover span{
  color:#202124;
}

/*
#page-top .swiper-button-prev, #page-top .swiper-button-next {
  color:#202124; 

}
#page-top .swiper-button-next {
  right:0;
}
#page-top .swiper-button-prev{
  left:0;
}

#page-top .swiper-button-prev:after, #page-top .swiper-button-next:after {
  font-size: 14px;
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{
  opacity: 0;
}

@media (min-width: 767px){
  #page-top .swiper-button-prev:after, #page-top .swiper-button-next:after {
      font-size: 16px;
  }
}

*/

#page-top .swiper-submenu-container {
  position: relative;
  padding: 0 27px;
}

.headerFix{height:53px;}

@media only screen and (min-width: 1024px){
    .headerFix{height:80px;}
  
}


#breadcrumbs{
	margin-bottom:-10px;	
}
#page-top .swiper {
 /*overflow:hidden;*/
 width: 100%;
 height: 100%;
}
  #page-top .swiper-wrapper{
	  margin: 0!important;
	  padding:0!important;
	  list-style: none;
	  display: flex;
  }
@media only screen and (min-width:767px) {
 #page-top  .swiper-wrapper{
   /* margin:20px 0 0 0!important;*/
  }
  
}
  #page-top .swiper-slide{
	   width: auto!important;
	   display: table;
	   padding-right: 0;
	   flex-shrink: 0;
  }

#page-top .swiper .swiper-slide a {

    line-height: 15px;
    font-size: 15px;
   /* font-family: 'Nunito', sans-serif; */
    font-weight: 700;
    /* text-transform: uppercase; */
    position: relative;
    letter-spacing: 0;
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    width: 100%;
	  width: auto!important;
	  /*background:#fff;*/
	  padding: 0 15px;
    /*border-radius: 10px;*/
}
#page-top .swiper .swiper-slide {
  margin: 0;
  padding: 0;
  text-align: center;
  height: 56px;
  display: table;
  background: none;
  -webkit-transition: all 300ms;
  -moz-transition: all 300ms;
  -o-transition: all 300ms;
  transition: all 300ms;
}
/*
#page-top.no-child .swiper .swiper-slide {
  height: 56px;
}
*/
@media screen and (min-width:767px) {
  #page-top  .swiper .swiper-slide {
    height: 72.69px;  
  }
}
#page-top .swiper .swiper-slide a:after{
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
background: #26292C;
left: 0;
visibility: hidden;
border-left: 0px solid transparent;
border-right: 0px solid transparent;
border-bottom: 4px solid transparent;
border-bottom-color: #26292C;
-webkit-transform: translate3d(0, 0, 0) scaleX(0);
-moz-transform: translate3d(0, 0, 0) scaleX(0);
transform: translate3d(0, 0, 0) scaleX(0);
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
  
}

@media screen and (min-width:767px) {
	#page-top .swiper .swiper-slide a:after{
		border-bottom: 4px solid transparent;
	}

    #page-top .swiper .swiper-slide a {

        line-height: 17px;
        font-size: 17px;
    }

}
  


#page-top .swiper .swiper-slide a:hover:after{
bottom: 0;
visibility: visible;
-webkit-transform: translate3d(0, 0, 0) scaleX(1);
-moz-transform: translate3d(0, 0, 0) scaleX(1);
transform: translate3d(0, 0, 0) scaleX(1);
}

#page-top .swiper .swiper-slide a.ativo:after, #page-top .swiper .swiper-slide a.ativo:hover:after {
bottom: 0;
visibility: visible;
-webkit-transform: translate3d(0, 0, 0) scaleX(1);
-moz-transform: translate3d(0, 0, 0) scaleX(1);
transform: translate3d(0, 0, 0) scaleX(1);

}
#page-top .swiper .swiper-slide a.ativo{
  color: #26292C;
}
#page-top .swiper .swiper-slide.swiper-slide-active a{
	/*color:#000;*/
}

#header-LBW > div {
  justify-content: space-between!important;
}
#social-icons > div {
  justify-content: flex-end!important;
}
.elementor-search-form--skin-full_screen .elementor-search-form__container {
  z-index: 99998;
}
.elementor-search-form--skin-full_screen .elementor-search-form__toggle i{
  background: #FFF;
	color:#808080;
}

.ekit-template-content-header{
  position: fixed;
  width: 100%;
  z-index: 99;
  top: 0;
 /* height: 100vh;/*hack for mobile menu*/
}

#header-LBW{
  position: fixed;
  width: 100%;
  z-index: 99;
  top: 0;
  /*height: 100vh;/*hack for mobile menu*/
}

.elementskit-menu-hamburger.elementskit-menu-toggler{
  display: none!important;
}
/*header*/
.headroom {
  will-change: transform;
  -webkit-transition: -webkit-transform 300ms ease;
  -moz-transition: -moz-transform 300ms ease;
  -o-transition: -o-transform 300ms ease;
  transition: transform 300ms ease;
}
.headroom--pinned {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
  /*border-bottom: 1px solid #F1F3F4;*/
  /*max-height: 64px;*/
}

.headroom--unpinned {
  -webkit-transform: translateY(-80px);
  -o-transform: translateY(-80px);
  transform: translateY(-80px);

}
#header-LBW{
  -webkit-transition:all .2s ease!important;
  -o-transition:all .2s ease!important;
  transition: all .2s ease!important;
}

.headroom--not-top#header-LBW{
  /*
  padding-top: 14px;
  padding-bottom: 14px;
  */
}
@media only screen and (min-width:1024px) {
  .headroom--not-top#header-LBW{
    /*
    padding-top:0;
    padding-bottom:0;
    */
  }
}


.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}



.pages_grid{
   /* float:left;*/
   margin: 33px auto 0 auto!important;
   padding: 0!important;
}

.pages_grid:after {
    content: '';
    display: block;
    clear: both;
}
  
.square-box{
    overflow: hidden;
    position: relative;
    float: left;
    width: 150px;
    height: 150px;
    border: 4px solid #808080;
    background-color: #fff;
    border-radius: 15px;
    margin-bottom: 20px;
	-webkit-transition:border  0.2s ease-out;
	-moz-transition:border  0.2s ease-out;
	-o-transition:border  0.2s ease-out;
	-ms-transition:border  0.2s ease-out;
	transition:border  0.2s ease-out;
}

.square-content span {
    display: block;
    margin-top: -30px;
    padding: 0 10px;
}

.square-box:before {
  content: "e876";
  font-weight: 700;
  font-size: 24px;
  line-height: 24px;
  position: absolute;
  right: 24px;
  bottom: 24px;
  display: inline-block;
  font-family: elementskit!important;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.square-content{
    position:  absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-decoration: none!important;
    text-align: center;
    color: #26292C;
    font-size: 19px;
    line-height: 19px;
    font-weight: 700;
    text-transform: lowercase;

    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -30px;

    -webkit-transition:all 0.2s ease-out;
    -moz-transition:all 0.2s ease-out;
    -o-transition:all 0.2s ease-out;
    -ms-transition:all 0.2s ease-out;
    transition:all 0.2s ease-out;

}
/*
.square-content div {
   display: table;
   width: 100%;
   height: 100%;
}
.square-content a {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    color: #26292C;
    font-size: 19px;
    line-height: 19px;
    font-weight: 700;
    font-family: 'Adobe Garamond Pro';
    text-transform: lowercase;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	-o-transition:all 0.2s ease-out;
	-ms-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}
*/

.square-content:hover {
    text-decoration: none;
    color: #808080!important;
}
.square-box:hover:before {
  color: #808080;
}

.square-box:hover{
    border-color: #26292C;
}

#search-icon{
    width:30px;
    margin: 0 2px 0 8px;
}

@media(min-width: 769px) {
     #search-icon{
        width:30px;
    }  
}


#languages{
    width:33px;
    margin: 0 6px;
   
}

@media(min-width: 769px) {
     #languages{
        width:33px;
    }  
}


.switcher {font-size:13px;font-weight:500;margin:0;text-align:left;cursor:pointer;overflow:hidden;width:33px;line-height:17px;float:right;}
.switcher a {text-decoration:none;display:block;font-size:13px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;outline: none;}
.switcher a img {vertical-align:middle;display:inline;border:0;padding:0;margin:0;opacity:0.8;}
.switcher a:hover img {opacity:1;}
.switcher .selected { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);position:relative;z-index:9999;}
.switcher .selected a {border-top:2px solid #808080;border-bottom:2px solid #808080;color:#333;padding:0;width:auto;}
.switcher .selected a:after {height:19px;display:inline-block;position:absolute;right:0;width:15px;background-position:50%;background-size:11px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 285 285'><path d='M282 76.5l-14.2-14.3a9 9 0 0 0-13.1 0L142.5 174.4 30.3 62.2a9 9 0 0 0-13.2 0L3 76.5a9 9 0 0 0 0 13.1l133 133a9 9 0 0 0 13.1 0l133-133a9 9 0 0 0 0-13z' style='fill:%23666666'/></svg>");background-repeat:no-repeat;content:""!important;transition:all .2s;}
.switcher .selected a.open:after {-webkit-transform: rotate(-180deg);transform:rotate(-180deg);}
.switcher .selected a:hover { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);}
.switcher .option {position:absolute;z-index:9998;border-left:0px solid #808080;border-right:0px solid #808080;border-bottom:2px solid #808080;background-color:#ffffff;display:none;width:33px;max-height:198px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;overflow-y:auto;overflow-x:hidden;}
.switcher .option a {color:#333;padding:5px 5px;font-size:13px;}
.switcher .option a:hover { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);}
.switcher .option a.selected { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);}
#selected_lang_name {float: none;}
.l_name {float: none !important;margin: 0;}
.switcher .option::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,0.3);border-radius:5px;background-color:#f5f5f5;}
.switcher .option::-webkit-scrollbar {width:5px;}
.switcher .option::-webkit-scrollbar-thumb {border-radius:5px;-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.3);background-color:#888;}
.clearfix {overflow: auto;}
.clearfix::after {content: "";clear: both;display: table;}

#user-icon{
    width:47px;
    margin: 0 0 0 7px;
}
@media(min-width: 769px) {
     #user-icon{
        width:33px;
    }  
}



#particles-js{
width: 100vw;
/*height: 100vh;*/
/*background-color: #252525;*/
position: relative;
/* z-index: 2;*/
}

#particles-js canvas {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}


.members-access-error{
  text-align: center;
  margin-top: 108px;
}






/* ==== FONT ==== */
.glass-cta,
.glass-text,
.glass-btn {
  font-family: 'Montserrat', sans-serif;
}

/* ==== CORES POR PRODUTO ==== */
[data-product="gib"] {
  --color-primary: #2F80ED;
  --color-secondary: #1B5FA8;
  --color-accent: #5FA8D3;
  --color-hover: #1763c0;
}

[data-product="gead"] {
  --color-primary: #EB5757;
  --color-secondary: #B93F3F;
  --color-accent: #F28A8A;
  --color-hover: #d94c4c;
}

[data-product="musette"] {
  --color-primary: #DFA600;
  --color-secondary: #A87B00;
  --color-accent: #F2C94C;
  --color-hover: #c48f00;
}

[data-product="selfcheck"] {
  --color-primary: #808080;
  --color-secondary: #5f5f5f;
  --color-accent: #A6A6A6;
  --color-hover: #666666;
}

[data-product="rfid"] {
  --color-primary: #F2994A;
  --color-secondary: #C96E2D;
  --color-accent: #F5B27C;
  --color-hover: #d17a28;
}

[data-product="default"] {
  --color-primary: #5FA8D3;
  --color-secondary: #3D7FA5;
  --color-accent: #8FC4E6;
  --color-hover: #478EB0;
}

/* =========================
   BACKGROUND
========================= */
.gib-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(47, 128, 237, 0.22), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(99, 179, 237, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(147, 197, 253, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #1e293b 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.gib-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(47, 128, 237, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(59, 130, 246, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}
.gib-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47,128,237,0.02) 1px, transparent 1px);

  background-size: 80px 80px;

  opacity: 0.12;
  pointer-events: none;
  mix-blend-mode: overlay;
}

.gib-bg-simple {
  background:
    radial-gradient(circle at 30% 20%, rgba(47,128,237,0.15), transparent 40%),
    radial-gradient(circle at 70% 80%, rgba(155,81,224,0.12), transparent 50%),
    linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  background-blend-mode: overlay;
}

.gib-bg-2{
  background:radial-gradient(circle at 30% 30%, #1e293b, #020617);  
}
.gead-bg {
  background:
    radial-gradient(circle at 25% 20%, rgba(235, 87, 87, 0.22), transparent 45%),
    radial-gradient(circle at 75% 80%, rgba(248, 113, 113, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(252, 165, 165, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #111827 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.gead-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(235, 87, 87, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(239, 68, 68, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}
.gead-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    radial-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(rgba(235, 87, 87, 0.02) 1px, transparent 1px);

  background-size: 24px 24px, 140px 140px;

  opacity: 0.14;
  pointer-events: none;
  mix-blend-mode: overlay;
}
.gead-bg-simple {
    background: 
        radial-gradient(circle at 25% 15%, rgba(235, 87, 87, 0.12), transparent 45%),
        radial-gradient(circle at 75% 85%, rgba(153, 27, 27, 0.10), transparent 55%),
        linear-gradient(180deg, #0b1220 0%, #1e293b 100%);
    background-blend-mode: overlay;
}
.musette-bg {
  background:
    radial-gradient(circle at 20% 15%, rgba(223, 166, 0, 0.18), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(255, 199, 64, 0.10), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(255, 235, 160, 0.06), transparent 60%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #111827 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}
.musette-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 20%, rgba(223, 166, 0, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(251, 191, 36, 0.08), transparent 55%);
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}
.musette-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 50%, rgba(255, 220, 120, 0.04), transparent 70%),
    radial-gradient(circle at 20% 80%, rgba(223, 166, 0, 0.03), transparent 60%),
    radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.02), transparent 55%);

  opacity: 0.9;
  mix-blend-mode: screen;
  pointer-events: none;
}

.musette-bg-simple {
  background:
    radial-gradient(circle at 30% 25%, rgba(223,166,0,0.12), transparent 50%),
    radial-gradient(circle at 70% 75%, rgba(148,163,184,0.10), transparent 55%),
    linear-gradient(180deg, #0b1220 0%, #1e293b 100%);
  background-blend-mode: overlay;
}

.rfid-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(242, 153, 74, 0.28), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(251, 191, 36, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(253, 186, 116, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #111827 55%, #1f2937 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.rfid-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(242, 153, 74, 0.14), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(251, 146, 60, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}

.rfid-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,153,74,0.02) 1px, transparent 1px);

  background-size: 80px 80px;

  opacity: 0.12;
  pointer-events: none;
  mix-blend-mode: overlay;
}

/* versão simples */
.rfid-bg-simple {
  background:
    radial-gradient(circle at 30% 20%, rgba(242,153,74,0.18), transparent 40%),
    radial-gradient(circle at 70% 80%, rgba(251,146,60,0.12), transparent 50%),
    linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  background-blend-mode: overlay;
}



.selfcheck-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(128, 128, 128, 0.22), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(160, 160, 160, 0.14), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(200, 200, 200, 0.06), transparent 65%),
    linear-gradient(180deg, #070b14 0%, #0f172a 55%, #1e293b 100%);

  background-blend-mode: screen, screen, overlay, normal;
  position: relative;
  overflow: hidden;
}

.selfcheck-bg::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 15%, rgba(180, 180, 180, 0.12), transparent 60%),
    radial-gradient(circle at 30% 80%, rgba(128, 128, 128, 0.08), transparent 55%);

  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}

.selfcheck-bg::after {
  content: "";
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(128,128,128,0.02) 1px, transparent 1px);

  background-size: 80px 80px;

  opacity: 0.12;
  pointer-events: none;
  mix-blend-mode: overlay;
}

/* versão simples */
.selfcheck-bg-simple {
  background:
    radial-gradient(circle at 30% 20%, rgba(128,128,128,0.18), transparent 40%),
    radial-gradient(circle at 70% 80%, rgba(160,160,160,0.12), transparent 50%),
    linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  background-blend-mode: overlay;
}
/* =========================
   CTA
========================= */

/* ==== WRAPPER ==== */
.glass-cta-wrapper {
  display: flex;
  justify-content: center;
  margin-top: 40px;
  width: 100%;
}

/* ==== CONTAINER ==== */
.glass-cta {
  display: flex;
  align-items: center;
  justify-content: center;

  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);

  background: rgba(74, 81, 101, 0.55);
  border-radius: 12px;
  box-shadow: 0 25px 60px rgba(0,0,0,0.25);
  border: 1px solid rgba(255,255,255,0.08);

  padding: 20px 30px;
  max-width: 720px;
  width: 100%;

  transition: all 0.3s ease;
  z-index: 2;
}

.glass-cta:hover {
  background: rgba(74, 81, 101, 0.65);
  transform: translateY(-3px) scale(1.01);
}


.border-accent {
  border-color: var(--color-secondary);
}
.highlight {
  color: var(--color-accent);
}
.highlight {
  color: var(--color-accent);
}

/* ==== INNER ==== */
.glass-cta-inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;

  width: 100%;
  gap: 20px;
  padding-left: 20px;
}

/* ==== TEXTO ==== */
.glass-text-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
}

.glass-text {
  color: #fff;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: 0.2px;

  padding-left: 20px;
  opacity: 0.9;
}

/* ==== DOT ==== */
.glass-dot {
  position: absolute;
  left: 0;
  top: 10px;
  transform: translateY(-50%);

  width: 8px;
  height: 8px;
  border-radius: 50%;

  background: var(--color-primary);
  animation: pulse 2s infinite;

  z-index: 2;
}

/* ==== BOTÃO ==== */
.glass-btn {
  position: relative;
  overflow: hidden;

  padding: 12px 28px;
  border-radius: 6px;

  font-weight: 600;
  text-decoration: none;
  color: #fff;

  background: var(--color-primary);

  transition: all 0.3s ease;

  white-space: nowrap;
  flex-shrink: 0;

  backdrop-filter: blur(6px);
}

/* hover genérico (mais leve e consistente) */
.glass-btn:hover {
  transform: translateY(-2px);
  filter: brightness(85%);
  box-shadow: 0 10px 25px rgba(0,0,0,0.35);
  background: var(--color-hover);
}

/* ==== SHINE EFFECT ==== */
.glass-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;

  background: linear-gradient(
    120deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.4) 50%,
    rgba(255,255,255,0) 100%
  );

  transform: skewX(-20deg);
}

.glass-btn:hover::after {
  left: 130%;
  transition: 0.6s;
}

/* ==== ANIMAÇÃO DOT ==== */
@keyframes pulse {
  0% {
    transform: translateY(-50%) scale(1);
    opacity: 0.7;
  }
  50% {
    transform: translateY(-50%) scale(1.6);
    opacity: 1;
  }
  100% {
    transform: translateY(-50%) scale(1);
    opacity: 0.7;
  }
}

/* ==== RESPONSIVO ==== */
@media (max-width: 768px) {

  .glass-cta-inner {
    flex-direction: column;
    text-align: center;
    gap: 15px;
  }

  .glass-text-wrapper {
    justify-content: center;
  }

  .glass-btn {
    width: 100%;
    text-align: center;
  }

  .glass-cta {
    padding: 20px;
  }
}




/* ==== Animação DOT ==== */
@keyframes pulse {
  0% { transform: translateY(-50%) scale(1); opacity: 0.7; }
  50% { transform: translateY(-50%) scale(1.6); opacity: 1; }
  100% { transform: translateY(-50%) scale(1); opacity: 0.7; }
}

/* ==== RESPONSIVO ==== */
@media (max-width: 768px) {

  .glass-cta-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 15px;
  }

  .glass-text-wrapper {
    justify-content: center;
  }

  .glass-btn {
    width: 100%;
    text-align: center;
  }

  .glass-cta {
    padding: 20px;
  }
}



/* glow */
.beneficio-icon svg {
  filter: drop-shadow(0 0 6px var(--color-primary));
  transition: filter 0.3s ease;
}

.beneficio-item:hover .beneficio-icon svg {
  filter: drop-shadow(0 0 12px var(--color-primary));
}
/* =========================
   BTN minimal
========================= */
.cta-wrapper {
  display: flex;
}

/* desktop */
.cta-wrapper {
  justify-content: flex-end;
}
.cta-wrapper.center {
  justify-content: center;
}
/* mobile + tablet */
@media (max-width: 1024px) {
  .cta-wrapper {
    justify-content: center;
  }
}

.glass-cta-luxo {
  display: inline-flex;
  align-items: center;
  justify-content: center; /* controlo base */
  gap: 14px;

  padding: 12px 18px;
  border-radius: 999px;

  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255,255,255,0.10);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  box-shadow:
    0 10px 30px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.08);

  text-decoration: none;
  color: #fff;

  position: relative;
  overflow: hidden;

  transition: transform 0.3s ease;

  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  opacity: 0;
  animation: ctaIn 0.4s ease forwards;


}
@keyframes ctaIn {
  from {
    opacity: 0;
    transform: translateY(6px);
    backdrop-filter: blur(0px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    backdrop-filter: blur(18px);
  }
}
/* hover premium */
.glass-cta-luxo:hover {
  transform: translateY(-3px);
  background: rgba(255,255,255,0.09);
  box-shadow:
    0 18px 45px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.12);
  color: #fff;
}

/* shimmer subtil (luxo) */
.glass-cta-luxo::before {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;

  background: linear-gradient(
    120deg,
    transparent,
    rgba(255,255,255,0.15),
    transparent
  );

  transform: skewX(-20deg);
  transition: 0.6s;
}

.glass-cta-luxo:hover::before {
  left: 120%;
}

/* DOT */
.glass-dot-luxo {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-primary);
  flex-shrink: 0;

  animation: pulse 2.2s infinite;
}

/* TEXTO */
.glass-text-luxo {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.2px;

  opacity: 0.92;
  white-space: nowrap;
}

/* ÍCONE */
.glass-icon-luxo {
  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 16px;
  opacity: 0.85;

  transition: transform 0.3s ease;
}

.glass-cta-luxo:hover .glass-icon-luxo {
  transform: translateX(5px) scale(1.05);
}


/* =========================
   GRID (CORRIGIDO)
========================= */
.features-grid {
  display: grid;

  /* Grid mais controlada */
  grid-template-columns: repeat(4, 1fr);

  gap: 24px;

  /* alinhamento perfeito */
  justify-items: center;
  align-items: stretch;

  max-width: 1200px;
  margin: 0 auto;
}

/* =========================
   BREAKPOINTS INTELIGENTES
========================= */

/* Tablets */
@media (max-width: 1024px) {
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile */
@media (max-width: 640px) {
  .features-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}
/* =========================
   CARD BASE
========================= */
.feature-card {
  width: 100%;
  max-width: 100%;

  margin: 0 auto; /* 🔥 garante centramento */

  background: rgba(74, 81, 101, 0.45);
  border-radius: 16px;

  padding: 22px 16px 70px;



  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start; /* 🔥 evita desalinhamento */

  gap: 14px;
  min-height: 220px;

  text-align: center;
  color: #fff;

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255, 255, 255, 0.08);

  box-shadow:
    0 15px 35px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);

  position: relative;
  overflow: hidden;

  opacity: 0;
  transform: translateY(30px) scale(0.96);

  transition: all 0.5s ease;

  will-change: transform, opacity;
}

/* entrada */
.feature-card.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* hover sem quebrar */
.feature-card.visible:hover {
  transform: translateY(-4px) scale(1.02);
}

/* =========================
   CONTEÚDO INTERNO (CENTRAGEM REAL)
========================= */
.feature-content {
  width: 100%;
  gap: 12px;
  display: flex;
  flex: 1; /* 🔥 ocupa o espaço restante */
  flex-direction: column;
  align-items: center; /* 🔥 garante centramento real */
  justify-content: center;
}

/* =========================
   ÍCONE
========================= */
.icon-circle {
  width: 64px;
  height: 64px;

  border-radius: 50%;

  background: rgba(255,255,255,0.06);

  display: flex;
  align-items: center;
  justify-content: center;

  margin: 0 auto; /* 🔥 redundância de segurança */

  transition: all 0.3s ease;
}

.feature-card:hover .icon-circle {
  transform: scale(1.1);
}

/* =========================
   LOTTIE
========================= */
.feature-lottie {
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.feature-lottie svg {
  width: 34px;
  height: 34px;
}

/* =========================
   TÍTULO
========================= */
.feature-card h3 {
  font-size: 0.95rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  margin: 0;

  transition: opacity 0.3s ease, transform 0.3s ease;
}

.feature-card:hover h3 {
  opacity: 0;
  transform: translateY(-10px);
}

/* =========================
   DESCRIÇÃO (SEM SHIFT)
========================= */
.feature-card .feature-desc {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 44px;

  font-size: 0.85rem;
  line-height: 1.4;

  color: rgba(255,255,255,0.85);

  opacity: 0;
  transform: translateY(10px);

  transition: opacity 0.35s ease, transform 0.35s ease;

  pointer-events: none;
  text-align: center;
  margin-bottom: 0;
}

.feature-card:hover .feature-desc,
.feature-card.active .feature-desc {
  opacity: 1;
  transform: translateY(0);
}

/* =========================
   GLOW
========================= */
.turbo-card::before {
  content: "";
  position: absolute;
  inset: -3px;

  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));

  border-radius: 16px;

  opacity: 0;
  filter: blur(16px);

  transition: 0.4s ease;

  pointer-events: none;
}

.turbo-card:hover::before {
  opacity: 0.6;
}

/* =========================
   RESPONSIVO
========================= */
@media (max-width: 768px) {

  .features-grid {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }

  .feature-card {
    max-width: 100%;
  }

  .feature-card:hover {
    transform: none;
  }

}


  /* =========================
    LOTTIE COLORS
  ========================= */
  .features-section[data-product] .feature-lottie svg * {
    fill: var(--color-primary) !important;
    stroke: var(--color-primary) !important;
  }

  .features-section[data-product] .feature-lottie svg [fill="none"] {
    fill: var(--color-primary) !important;
  }


  .features-section[data-product] .feature-card:hover .feature-lottie svg * {
    fill: #FFFFFF!important;
    stroke: #FFFFFF!important;
  }

/* =========================
   BENEFICIOS GRID
========================= */
.beneficios {
  padding: 60px 20px;
  text-align: center;
}

.beneficios h2 {
  font-size: 2.2rem;
  margin-bottom: 40px;
}


.beneficios-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 40px;
  padding: 0!important;
  list-style: none;
}

/* ==== ITEM ==== */
.beneficio-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 220px;
  cursor: pointer;

  opacity: 0;
  transform: translate3d(0, 28px, 0) scale(0.96);

  transition:
    opacity 1s cubic-bezier(0.22, 1, 0.36, 1),
    transform 1s cubic-bezier(0.22, 1, 0.36, 1);

  will-change: transform, opacity;
}

/* estado visível */
.beneficio-item.visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* ==== HOVER ==== */
.beneficio-item:hover .beneficio-icon {
  transform: scale(1.12);
}

/* ==== ÍCONE ==== */
.beneficio-icon {
  width: 80px;
  height: 80px;
  margin-bottom: 15px;

  display: flex;
  align-items: center;
  justify-content: center;

  transition: transform 0.35s ease, filter 0.35s ease;
}

.beneficio-icon svg {
  width: 60px;
  height: 60px;
  background: transparent !important;
}

/* ==== TEXTO ==== */
.beneficio-text strong {
  display: block;
  font-size: 1.1rem;
  margin-bottom: 8px;
  color: #333;
}

.beneficio-text p {
  font-size: 0.95rem;
  color: #555;
}

.animado{
  max-width: 100%!important;
}


}

/* TEXTO */
.glass-text-luxo {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.2px;

  opacity: 0.92;
  white-space: nowrap;
}

/* ÍCONE */
.glass-icon-luxo {
  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 16px;
  opacity: 0.85;

  transition: transform 0.3s ease;
}

.glass-cta-luxo:hover .glass-icon-luxo {
  transform: translateX(5px) scale(1.05);
}


/* =========================
   GRID (CORRIGIDO)
========================= */
.features-grid {
  display: grid;

  /* Grid mais controlada */
  grid-template-columns: repeat(4, 1fr);

  gap: 24px;

  /* alinhamento perfeito */
  justify-items: center;
  align-items: stretch;

  max-width: 1200px;
  margin: 0 auto;
}

/* =========================
   BREAKPOINTS INTELIGENTES
========================= */

/* Tablets */
@media (max-width: 1024px) {
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile */
@media (max-width: 640px) {
  .features-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}
/* =========================
   CARD BASE
========================= */
.feature-card {
  width: 100%;
  max-width: 100%;

  margin: 0 auto; /* 🔥 garante centramento */

  background: rgba(74, 81, 101, 0.45);
  border-radius: 16px;

  padding: 22px 16px 70px;



  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start; /* 🔥 evita desalinhamento */

  gap: 14px;
  min-height: 220px;

  text-align: center;
  color: #fff;

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255, 255, 255, 0.08);

  box-shadow:
    0 15px 35px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);

  position: relative;
  overflow: hidden;

  opacity: 0;
  transform: translateY(30px) scale(0.96);

  transition: all 0.5s ease;

  will-change: transform, opacity;
}

/* entrada */
.feature-card.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* hover sem quebrar */
.feature-card.visible:hover {
  transform: translateY(-4px) scale(1.02);
}

/* =========================
   CONTEÚDO INTERNO (CENTRAGEM REAL)
========================= */
.feature-content {
  width: 100%;
  gap: 12px;
  display: flex;
  flex: 1; /* 🔥 ocupa o espaço restante */
  flex-direction: column;
  align-items: center; /* 🔥 garante centramento real */
  justify-content: center;
}

/* =========================
   ÍCONE
========================= */
.icon-circle {
  width: 64px;
  height: 64px;

  border-radius: 50%;

  background: rgba(255,255,255,0.06);

  display: flex;
  align-items: center;
  justify-content: center;

  margin: 0 auto; /* 🔥 redundância de segurança */

  transition: all 0.3s ease;
}

.feature-card:hover .icon-circle {
  transform: scale(1.1);
}

/* =========================
   LOTTIE
========================= */
.feature-lottie {
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.feature-lottie svg {
  width: 34px;
  height: 34px;
}

/* =========================
   TÍTULO
========================= */
.feature-card h3 {
  font-size: 0.95rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  margin: 0;

  transition: opacity 0.3s ease, transform 0.3s ease;
}

.feature-card:hover h3 {
  opacity: 0;
  transform: translateY(-10px);
}

/* =========================
   DESCRIÇÃO (SEM SHIFT)
========================= */
.feature-card .feature-desc {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 44px;

  font-size: 0.85rem;
  line-height: 1.4;

  color: rgba(255,255,255,0.85);

  opacity: 0;
  transform: translateY(10px);

  transition: opacity 0.35s ease, transform 0.35s ease;

  pointer-events: none;
  text-align: center;
  margin-bottom: 0;
}

.feature-card:hover .feature-desc,
.feature-card.active .feature-desc {
  opacity: 1;
  transform: translateY(0);
}

/* =========================
   GLOW
========================= */
.turbo-card::before {
  content: "";
  position: absolute;
  inset: -3px;

  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));

  border-radius: 16px;

  opacity: 0;
  filter: blur(16px);

  transition: 0.4s ease;

  pointer-events: none;
}

.turbo-card:hover::before {
  opacity: 0.6;
}

/* =========================
   RESPONSIVO
========================= */
@media (max-width: 768px) {

  .features-grid {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }

  .feature-card {
    max-width: 100%;
  }

  .feature-card:hover {
    transform: none;
  }

}


  /* =========================
    LOTTIE COLORS
  ========================= */
  .features-section[data-product] .feature-lottie svg * {
    fill: var(--color-primary) !important;
    stroke: var(--color-primary) !important;
  }

  .features-section[data-product] .feature-lottie svg [fill="none"] {
    fill: var(--color-primary) !important;
  }


  .features-section[data-product] .feature-card:hover .feature-lottie svg * {
    fill: #FFFFFF!important;
    stroke: #FFFFFF!important;
  }

/* =========================
   BENEFICIOS GRID
========================= */
.beneficios {
  padding: 60px 20px;
  text-align: center;
}

.beneficios h2 {
  font-size: 2.2rem;
  margin-bottom: 40px;
}


.beneficios-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 40px;
  padding: 0!important;
  list-style: none;
}

/* ==== ITEM ==== */
.beneficio-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 220px;
  cursor: pointer;

  opacity: 0;
  transform: translate3d(0, 28px, 0) scale(0.96);

  transition:
    opacity 1s cubic-bezier(0.22, 1, 0.36, 1),
    transform 1s cubic-bezier(0.22, 1, 0.36, 1);

  will-change: transform, opacity;
}

/* estado visível */
.beneficio-item.visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* ==== HOVER ==== */
.beneficio-item:hover .beneficio-icon {
  transform: scale(1.12);
}

/* ==== ÍCONE ==== */
.beneficio-icon {
  width: 80px;
  height: 80px;
  margin-bottom: 15px;

  display: flex;
  align-items: center;
  justify-content: center;

  transition: transform 0.35s ease, filter 0.35s ease;
}

.beneficio-icon svg {
  width: 60px;
  height: 60px;
  background: transparent !important;
}

/* ==== TEXTO ==== */
.beneficio-text strong {
  display: block;
  font-size: 1.1rem;
  margin-bottom: 8px;
  color: #333;
}

.beneficio-text p {
  font-size: 0.95rem;
  color: #555;
}

.animado{
  max-width: 100%!important;
}/* End custom CSS */