:root {
	--text-gradient: linear-gradient(135deg, var(--color), var(--color2));
}
html{font-size: 18px;}
body{font-family: "Inter", sans-serif; font-optical-sizing: auto; font-style: normal; font-variation-settings:"wdth" 100;font-size: 1rem;}
.wbs-simple-contact-header > h4 {font-size: 40px;font-weight: 900;}


/* typography */
h1,h2,h3,h4,h5,h6 {color: #fffbeb;}    
h1{font-size: 3.2rem;font-weight: 700;line-height: 1.1;margin-bottom: 1.5rem;}
h2{font-size: 3rem;font-weight: 700;line-height: 1.2;margin-bottom: 1.2rem;}
h3{font-size: 2rem;font-weight: 700;line-height: 1.2;margin-bottom: 1.2rem;}
h4{font-size: 1.25rem;font-weight: 700;line-height: 1.2;margin-bottom: 1.2rem;}

.text-xl {font-size: 1.125rem;line-height: 1.75rem;}
.text-xxl,.wbs-mod-custom-html-subtitle {font-size: 1.4rem; line-height: 1.3;}
.w-20{width: 20%;}
@media (max-width: 767px) {
h1{font-size: 2.5rem;}
h2{font-size: 2rem;}
}



.text-gradient, .wbs-grd {background-image: var(--text-gradient);-webkit-background-clip: text;background-clip: text;color: transparent;font-weight: bold;}
.btn.wbs-btn-grd  {background-image: var(--text-gradient) !important; color: var(--body_bcolor) !important; }
.btn.wbs-btn-grd:hover {background-image: linear-gradient(to right, var(--color),var(--color2)) !important; 
    transform: translateY(-1px); /* Desplazamiento suave hacia arriba */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25), 0 0 15px var(--color2); /* Glow suave */
    cursor: pointer;
}
.btn .text-gradient {color: inherit;}



.btn-color2 {border-color: var(--alt_color);color: #fffbeb;  background: linear-gradient(90deg, #ff7b32, #ff5722);}
.btn-color2:hover, .btn-color2:focus, .btn-color2:active  {background: linear-gradient(90deg, hsl(21, 100%, 50%), hsl(14, 100%, 45%));border-color: #c96822; color: #fffbeb;}

.btn-color2:not(:disabled):not(.disabled).active, .btn-color2:not(:disabled):not(.disabled):active, .show > .btn-color2.dropdown-toggle {background-color: #c96822;border-color: #c96822;}
.btn-color3 {background-color: var(--alt_color2);border-color: var(--alt_color2);color: #fffbeb;}
.btn-color3:hover, .btn-color3:focus, .btn-color3:active  {background-color: #fc843d;border-color: #fc843d;}
.btn-color3:not(:disabled):not(.disabled).active, .btn-color3:not(:disabled):not(.disabled):active, .show > .btn-color3.dropdown-toggle {background-color: #fc843d;border-color: #fc843d;}


/* mini lista con inconos */
.wbs-icon-box-item {display: flex; align-items: center; gap: 1rem; margin-top: 1.5rem;}
.wbs-icon-item-icon{width: 2.5rem;height: 2.5rem;display: flex;align-items: center;justify-content: center;border-radius: 0.75rem;font-size: 1rem;
background-color: var(--alt_color2);color: var(--color2);}
.wbs-icon-item-img{width:5rem;height: 5rem;}
.wbs-icon-box-item-text {color: #fffbeb;font-size: 0.95rem;line-height: 1.4; flex: 1; text-align: left;}
.wbs-icon-box-item-text h5{margin-bottom: 0;}
.wbs-icon-box-item:hover .wbs-icon-item-icon {transform: translateY(-1px);transition: all 0.2s ease;}



/* Layout general */
.section-even{background-color: transparent  ;}
.section-odd{background: var(--body_bcolor);}
.mod-menu li{margin-bottom: 2px; }
.wbs-tpl-content-container {padding-top: 58px;}
.swal2-content {line-height: 1.5 !important;}
@media (max-width: 767px) {
.wbs-tpl-content-wrapper {padding: 50px 0;}
.wbs-full-width-above {padding-top: 5px;}
.wbs-tpl-content-container {padding-top: 0;}
}


/* mensaje de sistema */
joomla-alert {border-radius: 14px !important;padding: 18px 22px !important;font-size: 1rem;  backdrop-filter: blur(8px) saturate(180%);margin-top: 20px;
    -webkit-backdrop-filter: blur(8px) saturate(180%);  border: 1px solid rgba(255,255,255,0.10) !important;box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);}

joomla-alert .alert-message {color: #e5e9f0 !important; font-weight: 500;}
joomla-alert .joomla-alert--close {background: transparent !important; border: none !important;color: #ccc !important;opacity: 0.7;font-size: 1.3rem;transition: 0.25s ease;}
joomla-alert .joomla-alert--close:hover {opacity: 1;color: white !important;transform: scale(1.2);}
joomla-alert[type="info"] {background: #64b3ffaa;border-left: 3px solid #64b3ff !important;}
joomla-alert[type="success"] {background: rgba(34, 255, 158, 0.5);border-left: 3px solid #22ff9e !important;}
joomla-alert[type="error"] {background: rgba(255, 79, 79, 0.5);border-left: 3px solid #ff4f4f !important;}
joomla-alert[type="danger"] {background: rgba(255, 79, 79, 0.5);border-left: 3px solid #ff4f4f !important;}
joomla-alert[type="warning"] {background: rgba(255, 221, 87, 0.5);border-left: 3px solid #ffdd57 !important;}


/* layout web */
.frontpage .wbs-tpl-content-wrapper {padding: 0;}


/* Top header */
.wbs-tpl-header-right {margin-top: 0}
.wbs-tpl-top-menu-wrapper.wbs-tpl-top-menu-wrapper-right {display: flex;align-items: center;gap: 0.3rem; justify-content: end;padding-right: 1rem;}
.wbs-tpl-header-top-wrapper {padding: 7px 0 4px;background: var(--color);}
.wbs-tpl-top-menu-wrapper .nav > li > a {color: var(--menu_text);}
.wbs-tpl-top-menu-wrapper .nav > li > a:hover {color: var(--menu_text_hover);}
.wbs-favorites-module {margin:  0.4rem 0;color: #fff;}
.wbs-cart-module {padding: 0;margin: 0;color: #fff;}
.wbs-cart-module a {color: #fff;}
.wbs-cart-module-link {color: var(--header_text); transition: color ease-in 0.2s;}
.wbs-cart-module-link:hover {color: #000;}
.wbs-mod-welcome {color: var(--menu_text);font-size: 0.8rem;}
.fa-light.fa-bell.fa-lg.text-secondary.fa-fw {color: var(--header_text) !important;}
.wbs-notifications-module {margin: 0}
.wbs-tpl-header-right .p-2 {padding: 0 .5rem !important;}
.wbs-notifications-module .active {margin: 0;color: #f88787;}
#wbs-tpl-menu-wrapper .nav > li > * { font-size: 14px;}
#wbs-tpl-top-menu-wrapper .nav > li > a {font-size: 13px;	line-height:13px; padding: 0.5rem 0.8rem !important; border: 0;}
.wbs-tpl-header-left {font-size: 13px;line-height: 15px;display: flex;align-items: center;justify-content: start;gap: 10px;color: #fff;}


/*header*/
.wbs-tpl-header-center {margin-top:0}
#wbs-tpl-header-wrapper {border-bottom: 0 solid var(--line);padding: 0.5rem 1rem;position: fixed;height: 58px;right: 0;	top: 0;	left: 0;z-index: 10;}
#wbs-tpl-header {margin: 0 auto;}
header{max-width: 100%;}
.frontpage header {border-bottom: 0}
#wbs-tpl-header > .row {align-items: center;}
.wbs-logo {width: 110px;margin: 0;}
#wbs-tpl-header > .row {align-items: center;}



/*Header mobile */
#wbs-tpl-phone-header-wrapper {border-bottom: 1px solid #414958;}
.wbs-mobile-menu > ul > .deeper > ::after {border-left: 0;}
.wbs-mobile-menu > ul > li > ul > li > ul > li {text-indent: 20px;}
.wbs-tpl-phone-menu-button-search {display: none;}
.wbs-tpl-phone-menu-button { border-left: 0;}
.wbs-logo-movil {text-align: left;}

.wbs-mobile-menu {background: #191d22;}
.wbs-mobile-menu li > a, .wbs-mobile-menu li > span {color: var(--text);font-size: 16px; padding: 10px 20px;}
.wbs-mobile-menu li > a:hover {	background-color: #343536; color: #FFF;}
.wbs-mobile-menu > ul {padding-bottom: 10px;}
.wbs-mobile-menu .btn.wbs-btn-grd {margin: 15px 20px 0 20px;}





/* menu principal */
#wbs-tpl-menu-wrapper, #wbs-tpl-menu-wrapper .navbar-inner {background-color: transparent;border: 0;}
#wbs-tpl-menu-wrapper .nav > li > *  {border-bottom: 3px solid transparent; transition: all ease-in-out 0.3s; font-family: 'Golos Text', sans-serif;}
#wbs-tpl-menu-wrapper .nav > .active {border-bottom: 0}
#wbs-tpl-menu-wrapper .nav > li > * {color: var(--menu_text);}
.frontpage .wbs-cart-module-link {color: #fff;}
#wbs-tpl-menu-wrapper .dropdown-menu {padding:.9rem 0;background-color:var(--menu_bcolor);border-radius: 0;min-width: 300px;left:0;opacity: 0;} /* Si ponemos display:block funciona el efecto de los item menu moviendose pero se activa el menu a cada rato */
#wbs-tpl-menu-wrapper .dropdown-menu > li > a {color: var(--text);font-size: 15px;}
#wbs-tpl-menu-wrapper .dropdown-menu > li > a {font-size: 15px;font-family: 'Golos Text', sans-serif}
#wbs-tpl-menu-wrapper .dropdown-menu > li > a:hover {color: var(--color)}
#wbs-tpl-menu-wrapper ul.nav li.dropdown > ul.dropdown-menu > li {transform: translate3d(0,13px,0); transition: transform cubic-bezier(.2,.8,.25,1) .65s }
#wbs-tpl-menu-wrapper ul.nav li.dropdown:hover > ul.dropdown-menu > li {transform: translate3d(0,0,0);}
#wbs-tpl-menu-wrapper ul.nav li.dropdown:hover > ul.dropdown-menu {opacity: 1;}
#wbs-tpl-menu-wrapper .nav > .dropdown > .dropdown-menu  {z-index: 1000;}
#wbs-tpl-menu-wrapper .nav > .dropdown > .dropdown-menu .dropdown-menu {z-index: 2000;left: 250px; top: 5px;}
#wbs-tpl-menu-wrapper .nav {align-items: center; gap: 1rem;}
#wbs-tpl-menu-wrapper .nav > li {padding: .5rem 0; }


/* footer */
.wbs-tpl-footer a{font-size: 14px;	line-height: 20px;}
.wbs-tpl-footer-wrapper {border-top: 1px solid #414958; padding: 3rem 0;}
.wbs-logo-footer {width: 200px;}


/* landings */
.wbs-landing-hero {padding: 100px 0 100px 0;}
.wbs-landing-section > div {padding-top: 100px; padding-bottom: 100px;}
.wbs-landing-section::after {content: "";display: block;width: 100%;height: 1px;
background: linear-gradient(to right, var(--body_bcolor), var(--color_transparent), var(--body_bcolor));margin: 0 auto; }

.wbs-mod-custom-html-subtitle{margin-top: -1rem; color: var(--text2);}
@media (max-width:767px){
.wbs-landing-section > div {padding-top: 80px;padding-bottom: 80px;}
}


/* Hero */
.wbs-tpl-hero {background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.8)), url('../../../images/landing/hero.jpg') no-repeat top center;
background-size: cover;}
@media (max-width:767px){
.wbs-landing-hero  .wbs-mod-custom-html-title { text-align: center;}
.wbs-landing-hero {padding: 40px 0 80px 0;}
.wbs-landing-hero .wbs-mod-custom-html > .row {flex-direction: column-reverse;}
.wbs-landing-hero .wbs-mod-custom-html-video{margin-top: 1rem;}
.wbs-mod-custom-html-subtitle {text-align: center;}
}


/* layouts de los custom html modules */
.wbs-mod-custom-html-video .wbs-video-wrapper {overflow: hidden !important;border-radius: 16px !important;}
@media (max-width:767px){
.wbs-mod-custom-html-content{text-align: center;}
.wbs-mod-custom-html-video .wbs-video-wrapper {width: 100%;margin: 0 auto !important;border-radius: 8px !important;}
ul{text-align: left;}
.wbs-tpl-footer-wrapper ul {text-align: center;}

}

/* seccion de caracteristicas*/
.wbs-productos-mod {background: url('../../../images/landing/fondo1.jpg') no-repeat top center;background-size: cover;}
.wbs-features-row {display: flex; flex-wrap: wrap; justify-content: center; gap: 30px;}
.wbs-feature-item {width: 290px; height: 290px; border-radius: 50%; position: relative;display: flex;flex-direction: column;justify-content: center;align-items: center;text-align: center;padding: 25px;box-sizing: border-box;background: rgba(255, 255, 255, 0.03);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);border: 1px solid rgba(59, 130, 246, 0.3);box-shadow: 0 0 25px rgba(59, 130, 246, 0.15), inset 0 0 20px rgba(59, 130, 246, 0.5);transition: all 0.3s ease;}

.wbs-feature-item:hover {transform: translateY(-5px) scale(1.02);border-color: rgba(59, 130, 246, 0.8);box-shadow: 0 0 40px rgba(59, 130, 246, 0.4) , inset 0 0 20px rgba(59, 130, 246, 0.5);background: rgba(255, 255, 255, 0.07);}
/* Opcional: limitar ancho máximo para que la segunda fila quede perfecta */
.wbs-features-row {max-width: 1100px;margin: 0 auto;}
.wbs-feature-title h4 {margin: 0 0 10px 0; text-shadow: 0 2px 4px rgba(0,0,0,0.5);}
.wbs-feature-item i {font-size: 2.5rem; color: var(--color); margin-bottom: 10px; display: block;}
.wbs-feature-list {color: #cbd5e1; font-size: 0.95rem; line-height: 1.5; }

/* CONTENEDOR DE LAS DOS FEATURES SUPERIORES */ 
.wbs-features-row { display: flex; gap: 3rem; justify-content: center; align-items: center; flex-wrap: wrap; }  
.wbs-feature-item { width: 280px; height: 280px; border-radius: 50%; background: radial-gradient(circle at top, rgba(60, 120, 255, 0.18), rgba(8, 12, 22, 0.95) 70%);
   box-shadow: 0 0 0 1px rgba(120, 170, 255, 0.25), 0 0 35px rgba(80, 140, 255, 0.25); display: flex; flex-direction: column; 
   justify-content: center; align-items: center; text-align: center; padding: 25px; } 
.wbs-feature-item > i { font-size: 2.4rem; color: #f5b400; margin-bottom: 1rem; } 
.wbs-feature-info { color: #dbe4f3; } /* TITULO */ 
.wbs-feature-title h4 { font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem; color: #ffffff; }
.wbs-feature-list { font-size: 0.95rem; line-height: 1.4; color: #b7c4dd; } 

.wbs-feature-base { margin: 1.5rem auto 0; max-width: 680px; padding: 1.5rem 2rem; border-radius: 14px;
  background: linear-gradient(180deg, rgba(40, 90, 180, 0.25), rgba(10, 14, 28, 0.95));
   box-shadow: 0 0 0 1px rgba(120, 170, 255, 0.35), 0 0 40px rgba(80, 140, 255, 0.35); text-align: center; } 
 .wbs-feature-base .wbs-feature-title h4 { font-size: 1.4rem; font-weight: 700; letter-spacing: 0.05em; margin-bottom: 0.5rem; color: #ffffff; } 
.wbs-feature-base .wbs-feature-list { font-size: 1rem; color: #c9d6ee; }

@media (max-width: 768px)
{    

}




/* seccion de ventajas*/
.wbs-advantages-row {display: flex;gap: 1rem;flex-flow: wrap;width: 100%;justify-content: center;align-items: stretch;}
.wbs-advantage-item {max-width: calc(33.33% - 2rem);padding: 1.5rem; border: 1px solid hsl(220, 15%, 20%);background: #161a1f; border-radius: 1rem;transition: all 0.5s ;}
.wbs-advantage-title {margin-top: 1rem;}
.wbs-advantage-image {border-radius: 5px;color:var(--body_bcolor);display: flex;justify-content: center;align-items: center;font-size: 1.5rem;min-width: 50px;
  background-image: var(--text-gradient);width: 50px;height: 50px;} 
.wbs-advantage-item:hover {border-color: var(--color); box-shadow: 0px 5px 30px var(--color2);}
@media (max-width:767px){
.wbs-advantage-item { max-width: 100%; display: flex;gap: 1rem;padding: 1rem;}
.wbs-advantage-title{margin-top: 0;  text-align: left;}
.wbs-advantage-title h4{margin-bottom: 0;}
.wbs-advantage-list {text-align: left;}
}


/* seccion de como gano */
.wbs-gana-item {padding: 1.5rem;border: 1px solid hsl(220, 15%, 20%);background: #161a1f;border-radius: 1rem;transition: all 0.5s;}
.wbs-gana-item:hover {border-color: var(--color); box-shadow: 0 0 60px -15px #ffc10566}
.wbs-gana-item h4{text-align: center;}
.wbs-gana-icon {font-size: 2.5rem;display: block;text-align: center;margin: 0 auto;margin-bottom: 1rem;}
.wbs-gana-img {margin: 0 auto;text-align: center;width: 96px;height: 96px;background: var(--text-gradient);border-radius: 50%;display: flex;align-items: center;
	justify-content: center;	margin-bottom: 2rem; transition: all 0.3s cubic-bezier(.4,0,.2,1);transform: scale(1); position: absolute;top:8px;left: 8px;}
.wbs-gana-img-wrapper {position: relative; width: 116px; height: 116px; margin: 0 auto 1.5rem;}
 .wbs-gana-img img {width: 60%;}
.wbs-gana-img-circle {position: absolute;width: 112px;height: 112px;border-radius: 50%;border: 2px solid var(--color_transparent);}
.wbs-gana-item:hover .wbs-gana-img {transform: scale(1.1);}
.wbs-gana-item .fa-li{color:var(--color);background:#393113;border-radius:50%;aspect-ratio:1;display:flex;justify-content:center;align-items:center;left:-40px;top:2px;
font-size: 12px;}
.wbs-gana-item li{margin-bottom: 10px; color: #fffbeb;}


/* section de empresa */
.wbs-enterprise-mod .wbs-mod-custom-html-video {width: 70%;margin: 0 auto; margin-top: 3rem;}
@media (max-width:767px){
.wbs-enterprise-mod .wbs-mod-custom-html-video {width: 100%;}
}


/* sección de unente a nuestro equipo */
.wbs-team-mod {background: radial-gradient(circle at 50% 30%, rgba(40, 90, 255, 0.25) 0%, rgba(20, 40, 80, 0.10) 40%,rgba(10, 20, 40, 1) 100%),linear-gradient(135deg,#0a0f2b 0%,#0d1333 40%,#081024 100%);background-blend-mode: screen, normal;}
.wbs-join-team-row {display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; gap: 60px; margin-top: 40px;}
.wbs-join-team-row-item-img {width: 180px;height: 180px;border-radius: 50%; margin: 0 auto 20px; display: flex;justify-content: center;align-items: center;border: 2px solid rgba(0, 122, 255, 0.6); box-shadow: 0 0 20px rgba(0, 122, 255, 0.4), 0 0 40px rgba(0, 122, 255, 0.25),0 0 60px rgba(0, 122, 255, 0.15);transition: all 0.3s ease;}
.wbs-join-team-row-item-img img {width: 70%; height: auto; display: block;}
.wbs-join-team-row-item-img:hover {transform: translateY(-5px) scale(1.05); border-color: rgba(0, 150, 255, 0.9);box-shadow:0 0 25px rgba(0, 150, 255, 0.7),0 0 60px rgba(0, 150, 255, 0.4),0 0 90px rgba(0, 150, 255, 0.25);}
.wbs-team-mod h4{font-size: 1rem;}

/* sección referenciador */
.wbs-sponsor-mod {background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.9)),url('../../../images/landing/fondo2.jpg') no-repeat top center;
background-size: cover;}
.wbs-sponsor-mod-avatar  {width: 80%;}
.wbs-sponsor-mod-avatar img {border: 3px solid #1f2e26;border-radius: 10px;}
.wbs-sponsor-mod-msg {font-size: 1.2rem;line-height: 1.4;margin-top: 1rem;color: #fffbeb;}
@media (max-width:767px){
.wbs-sponsor-mod-avatar {margin: 0 auto;}
}


/* seccion de tarjetas */
.wbs-glow-bg {inset: 0;border-radius: 1.5rem;background: linear-gradient( to right, var(--color_transparent), var(--body_bcolor));filter: blur(2rem);}
@media (max-width:767px){
.wbs-card-img{margin-top: 4rem !important;}
.wbs-card-img img{width: 70%;}
}


/* modal popup de contacto y registo */
.wbs-tsunami-modal-img{margin: 0 25%;}
.wbs-tsunami-modal-sponsor{font-size: 1rem; margin-top: 1rem; padding: 0 20px 0; color: #999;}
.wbs-tsunami-modal-page {margin: 2rem}
.btn.btn-whatsapp {background: #25d366;display: flex;align-items: center;color: #fff;}
.wbs-password-eye {right: 16px;}
.help-block {margin-top: 5px !important;text-align: left;}
.iti__country-list {color: #666;   font-size: 12px;   z-index: 200;}ç
.iti--allow-dropdown input, .iti--allow-dropdown input[type="text"], .iti--allow-dropdown input[type="tel"], .iti--separate-dial-code input, 
.iti--separate-dial-code input[type="text"], .iti--separate-dial-code input[type="tel"] {padding-left: 52px !important;}

/* ------  MODAL — CONTENEDOR PRINCIPAL -----*/
#wbs-tsunami-modal .modal-dialog { max-width: 640px;transform: translateY(0px); transition: transform 0.35s ease, opacity 0.35s ease;}
#wbs-tsunami-modal.show .modal-dialog {transform: translateY(0px); opacity: 1;}
#wbs-tsunami-modal .modal-content {background: rgba(15, 18, 28, 0.65); backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%); border-radius: 18px; border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: 0 25px 50px rgba(0,0,0,0.45);}


/* -----   TIPOGRAFÍA  --------*/
#wbs-tsunami-modal h4, #wbs-tsunami-modal h3 { font-weight: 700; letter-spacing: 0.5px; color: #fff;}
.wbs-tsunami-modal-body.mb-4 {padding: 0 2rem;}
.wbs-tsunami-modal-subtitle {font-style: italic;}
#wbs-tsunami-modal p, #wbs-tsunami-modal label { color: #ccd3e0;}
/* -----   CAMPOS DE FORMULARIO  --------*/
#wbs-tsunami-modal .form-control, #wbs-tsunami-modal .form-select { border: 1px solid rgba(255,255,255,0.15); color: #fff; border-radius: 10px; padding: 12px;}


#wbs-tsunami-modal .form-control:focus,#wbs-tsunami-modal .form-select:focus { border-color: #00c8ff; box-shadow: 0 0 0 0.2rem rgba(0,200,255,0.15);}
.wbs-tsunami-modal-page { animation: fadeIn 0.4s ease both;}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* -----   HEADER — BOTÓN CERRAR  --------*/
#wbs-tsunami-modal .btn-close {filter: invert(1); opacity: 0.7; transition: 0.25s;}
#wbs-tsunami-modal .btn-close:hover {opacity: 1; transform: rotate(90deg);}


/* Pantalla de login  */
.wbs-login-page #wbs-tpl-header-wrapper {display: none;}
.wbs-login-page .wbs-tpl-footer-wrapper {display: none;}
.wbs-login-page .wbs-tpl-content-container {padding: 0;}
.wbs-register-card-header{text-align: center;}
.wbs-login-logo{text-align: center;}
.wbs-login-logo img {width: 220px;margin-bottom: 50px;background: #fff9;padding: 10px 25px;border-radius: 12px;margin-top: 30px;}
.wbs-login-logo h2{font-size: 1.5rem;text-shadow: #000 1px 1px 2px;}
.wbs-login-card {background-color: rgba(255,255,255,0.7);padding: 2rem;border-radius: 22px;color: #000;width: 475px;margin: 0 auto;}
.wbs-login-links {text-align: center; }
@media (max-width: 767px) {
.wbs-login-card {width: 95%;}
.wbs-login-page .wbs-tpl-content-container {background: unset;}
.wbs-login-page .wbs-tpl-phone-menu-menu {display: none;}
.wbs-login-page .wbs-tpl-content-wrapper {padding: 0;}
}


/* Pantalla de registro */
.wbs-register-referrer-fs {display: none;}
.wbs-form-separator {border-bottom: 0;}

/* CONTENEDOR PRINCIPAL */
.wbs-register-sponsor-info
{
    display: flex;
    align-items: center;
    gap: 24px;

    background: linear-gradient(135deg, #12213c, #0e1b32);
    border-radius: 16px;

    padding: 24px 28px !important;

    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 10px 30px rgba(0,0,0,0.35);

    transition: all 0.3s ease;
}

/* HOVER SUTIL */
.wbs-register-sponsor-info:hover
{
    box-shadow: 0 12px 35px rgba(0,0,0,0.45);
}

/* AVATAR */
.wbs-sponsor-register-avatar
{
    flex-shrink: 0;
}

.wbs-sponsor-register-avatar img
{
    width: 90px;
    height: 90px;

    border-radius: 50%;
    object-fit: cover;

    border: 3px solid #f5b942;
    box-shadow: 0 0 18px rgba(245,185,66,0.35);
}

/* TEXTOS */
.wbs-register-sponsor-info-title
{
    font-size: 15px;
    color: #9fb3d1;
    margin-bottom: 6px;
}

.wbs-register-sponsor-info-name
{
    font-size: 24px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 4px;
}

.wbs-register-sponsor-info-subtitle
{
    font-size: 16px;
    color: #f5b942;
    font-weight: 500;
}

@media (max-width: 768px)
{
    .wbs-register-sponsor-info
    {
        flex-direction: column;
        text-align: center;
        padding: 22px !important;
    }

    .wbs-sponsor-register-avatar img
    {
        width: 80px;
        height: 80px;
    }

    .wbs-register-sponsor-info-name
    {
        font-size: 20px;
    }
}



/* modulo solicita una demo */
#wbs-we-call-you-modal > .modal-dialog {margin-top: 5rem;}
.wbs-we-call-you-module {text-align: center;background-color: #f0f0f0;padding-bottom: 80px;}
@media (max-width: 767px) {
#wbs-we-call-you-modal > .modal-dialog {margin-top: 1rem;}
}
.wbs-carousel-container {justify-content: center;	gap: 5px;}


/* modulo de ecosistema */
.wbs-ecosistema-mod img {width: 80%;	margin: 4rem auto;}


/* Campos de estrellas */
.wbs-stars-bg #ecosistema{ position: relative; overflow: hidden;
    background-image:
        /* estrellas grandes */
        radial-gradient(circle at 20% 30%, rgba(255,255,255,0.35) 1.8px, transparent 4px),
        radial-gradient(circle at 70% 20%, rgba(180,220,255,0.35) 2px, transparent 4px),
        radial-gradient(circle at 60% 75%, rgba(255,220,180,0.3) 1.6px, transparent 3.5px),

        /* estrellas medias */
        radial-gradient(circle at 15% 80%, rgba(255,255,255,0.22) 1.2px, transparent 3px),
        radial-gradient(circle at 40% 55%, rgba(200,230,255,0.22) 1.3px, transparent 3px),
        radial-gradient(circle at 80% 65%, rgba(255,240,200,0.2) 1.1px, transparent 2.8px),

        /* estrellas pequeñas */
        radial-gradient(circle, rgba(255,255,255,0.12) 0.8px, transparent 2.5px),
        radial-gradient(circle, rgba(180,210,255,0.1) 0.7px, transparent 2.2px),
        radial-gradient(circle, rgba(255,220,180,0.1) 0.7px, transparent 2.2px);

    background-size:
        700px 700px,
        900px 900px,
        800px 800px,

        450px 450px,
        500px 500px,
        420px 420px,

        250px 250px,
        220px 220px,
        200px 200px;

    background-position:
        0 0,
        200px 100px,
        400px 300px,

        100px 250px,
        350px 150px,
        520px 380px,

        50px 80px,
        120px 200px,
        300px 100px;

    animation: stars-drift 180s linear infinite;
}



/* animaciones */
@keyframes stars-drift {
    from {
        background-position:
            0 0,
            200px 100px,
            400px 300px,
            100px 250px,
            350px 150px,
            520px 380px,
            50px 80px,
            120px 200px,
            300px 100px;
    }
    to {
        background-position:
            -1000px 800px,
            -800px 600px,
            -600px 900px,
            -400px 500px,
            -300px 400px,
            -700px 600px,
            -500px 300px,
            -600px 400px,
            -450px 350px;
    }
}

@keyframes stars-twinkle {
    0%   { opacity: 0.6; }
    100% { opacity: 1; }
}

.wbs-nebula-bg {
    position: relative;
    background-color: #080c16;
    overflow: hidden;

    background-image:
        /* Nebulosa azul principal */
        radial-gradient(circle at 30% 40%,
            rgba(80, 180, 255, 0.25),
            rgba(20, 80, 140, 0.15) 30%,
            rgba(8, 12, 22, 0.9) 70%),

        /* Nebulosa secundaria */
        radial-gradient(circle at 70% 60%,
            rgba(0, 160, 220, 0.18),
            rgba(10, 60, 110, 0.12) 35%,
            rgba(8, 12, 22, 0.85) 75%),

        /* Brillo dorado isPay */
        radial-gradient(circle at 55% 45%,
            rgba(255, 190, 80, 0.18),
            rgba(255, 170, 40, 0.08) 30%,
            transparent 65%),

        /* Profundidad oscura */
        radial-gradient(circle at center,
            rgba(255,255,255,0.03),
            rgba(8,12,22,1) 70%);

    animation: nebula-float 120s ease-in-out infinite alternate;
}

/* animaciones */
@keyframes nebula-float {
    0% {
        background-position:
            0% 0%,
            0% 0%,
            0% 0%,
            center;
    }
    100% {
        background-position:
            10% 15%,
            -10% -10%,
            5% -5%,
            center;
    }
}




/* Seccion de game */
.wbs-game-mod {position: relative;overflow: hidden;
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.2)),	url('../../../images/landing/game.jpg') no-repeat center top;background-size: cover;}
.wbs-game-panel {position: relative;padding: 2rem 2.5rem;border-radius: 10px;	backdrop-filter: blur(6px);	-webkit-backdrop-filter: blur(6px);
	box-shadow:	0 20px 50px rgba(0, 0, 0, 0.35),	0 0 35px rgba(255, 220, 120, 0.25);color: rgba(255, 255, 255, 0.95);
  background:
		linear-gradient(
			90deg,
			#ffd25a,
			#6bb6ff
		) top left / 100% 4px padding-box no-repeat,
		linear-gradient(
			180deg,
			#ffd25a,
			#6bb6ff
		) top left / 4px 100% border-box no-repeat;
}
.wbs-game-panel::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;
background: radial-gradient(circle at top left,	rgba(255, 210, 90, 0.25),transparent 5%);	border-radius: 20px;pointer-events: none;}
.wbs-game-panel-title {color: #fbf5dd;font-weight: bold;text-shadow: 2px 2px 2px #000000aa;font-size: 20px;}
.wbs-game-panel-title .text-gradient, .wbs-game-panel .text-gradient{color: var(--color); text-shadow: 2px 2px 2px #000000aa;}
.wbs-icon-game-item {display: flex;align-items: flex-start;gap: 14px;margin-bottom: 18px;}
.wbs-icon-game-icon {width: 34px;height: 34px;min-width: 34px;display: flex;align-items: center;justify-content: center;border-radius: 50%;
background: radial-gradient(circle at top left, #6fdc6f, #2f8f2f);border: 2px solid rgba(180, 255, 180, 0.8);color: #ffffff;
font-weight: 700;font-size: 16px;line-height: 1;box-shadow:	0 0 6px rgba(120, 255, 120, 0.6),inset 0 0 4px rgba(255, 255, 255, 0.3);}
.wbs-icon-game-item-text {color: #e9f0e9;line-height: 1.35;}
.wbs-icon-game-item-tile {font-weight: 700;font-size: 18px;color: #f5f7e8;margin-bottom: 2px;text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);}
.wbs-icon-game-item-text > div:last-child {font-size: 15px;color: #dfe7df;}
.wbs-game-logo {margin-top: -2rem;margin-bottom: 2rem;text-align: center;}
.wbs-game-logo img {width: 250px;}
@media (max-width: 767px) {
.wbs-game-mod {background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.2)),	url('../../../images/landing/game_vertical.jpg') no-repeat center top;}
.wbs-game-panel{padding: 1.5rem 1.5rem;text-align: left;}
}



/* micro testimonios */
.wbs-micro-testimonial{max-width: 480px;}
.wbs-micro-testimonial .card-body{padding: 16px 18px;}
.wbs-micro-testimonial-avatar{flex-shrink: 0; width: 56px;height: 56px; border-radius: 50%;padding: 3px;background: linear-gradient(135deg,var(--color), var(--color2));}
.wbs-micro-testimonial-avatar img{width: 100%;height: 100%;object-fit: cover;border-radius: 50%;background-color: #0f172a;}
.wbs-micro-testimonial-text{margin: 0;color: #e5e7eb;font-size: 0.95rem; line-height: 1.4; font-style: italic;}
.wbs-micro-testimonial-author{display: block;margin-top: 6px;font-size: 0.85rem;font-weight: 600;color: var(--color2);}
.wbs-micro-testimonial-text .fa-quote-left, .wbs-micro-testimonial-text .fa-quote-right {color: var(--color); font-size: 1.2rem;}
.glass {border: 1px solid rgba(255, 255, 255, 0.1);background-color: rgba(255, 255, 255, 0.05);backdrop-filter: blur(24px);-webkit-backdrop-filter: blur(24px);
border-radius: 1rem;}




/* modulo de token */
.wbs-token-mod {background: #0a0911;}


/* whatsapp */
.wbs-whatsapp-mod {position: fixed;bottom: 70px;right: -5px;z-index: 9999;width: 75px;}
.wbs-whatsapp-mod a {width: 50px;height: 50px;line-height: 50px;background: transparent;}
.wbs-whatsapp-mod a:hover{background:transparent; transform: translateY(-5px);}

/* Footer y copyright */
.wbs-tpl-footer-col-1 {font-size: 14px;line-height: 140%;margin: 0 40px 0 0 !important;flex:2}
.wbs-tpl-footer h3 {margin: 0 0 1rem;}
.wbs-payment i {font-size: 20px;margin-right: 4px;margin-top: 3px;}
.wbs-tpl-copyright-wrapper {padding: 10px 0;}
.wbs-payment.mt-2 {margin-bottom: 15px;}
.nav-item.item-1110 a,.nav-item.item-1111 a {font-weight: bold;margin-top: 10px;}
.nav.fcl-footer-mod {margin-top: 20px;}
@media (max-width: 767px) {
.wbs-tpl-footer-col.wbs-tpl-footer-col-1 {margin: 0 5% !important;text-align: center;}
.wbs-logo-footer {margin: 0 auto;}
.nav.fcl-footer-mod {width: 150px;	margin: 20px auto;}
.wbs-kd-logos {width: 100%; margin: 0 auto}
}

/* detalle de una oferta */
.wbs-sharing-bar-deal {display: none;}
.wbs-sharing-bar-deal, .wbs-deal-price-buy-gift, .wbs-deal-price-timeleft, .wbs-deal-number-sold {display: none;}
.wbs-deal-options-info, .wbs-deal-price-column > div { border-top: 0;}
.wbs-deal-left { border-right: 0;}
.wbs-deal .wbs-reviews, .wbs-deal-company-wrapper, .wbs-deal-conditions, .wbs-deal-description, .wbs-deal-features, .wbs-deal-include {border-bottom: 0;}





/* animaciones */
.animate-float {
  animation:float 6s ease-in-out infinite
}
@keyframes float {
  0%,
  to {
    transform:translateY(0)
  }
  50% {
    transform:translateY(-20px)
  }
}