@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&display=swap');

body { 
    font-family: "Bricolage Grotesque", sans-serif;
    background: #A20E10;
    background: linear-gradient(180deg,rgba(0, 0, 0, 1) 55%, rgba(49, 59, 230, 1) 100%);
}

/* VARIABLES */
:root {
    --main-color: #ff0066;
    --main-color-light: #ffcce0;
    --main-color-dark: #940541;
}

/*HEADER CSS*/
img {transition: opacity ease 300ms;}
img:not([src]) {opacity: 0;}
nav.sticky { box-shadow: 0 0 #0000, 0 0 #0000, 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); }
nav.sticky { background-color: #000000; }
nav.sticky.sticked { box-shadow: none; }
nav.sticky.sticked { background-color: transparent; }

/* ── NAVBAR FULLSCREEN ── */
body.navbar-open { height: 100vh; overflow: hidden; }
.navbar { pointer-events: none; }
.navbar.open { pointer-events: auto; }
.navbar .navbar-content {
    opacity: 0;
    transform: scale(1.02);
    transition: opacity 0.35s ease, transform 0.35s ease;
}
.navbar.open .navbar-content { opacity: 1; transform: scale(1); }
.navbar .navbar-overlay { opacity: 0; }
.navbar.open .navbar-overlay { opacity: 1; transition: opacity 0.35s ease; }

/* ── HAMBURGUESA → X con desplazamiento ── */
/* En reposo: en su sitio dentro del nav */
#hamburger-btn {
    position: relative;
    z-index: 200;
    transition: transform 0.45s ease;
}
/* Al abrir: el JS lo pone fixed en su posición y lo desplaza a la derecha.
   El CSS solo gestiona la animación de las líneas */
#hamburger-btn.is-open {
    position: fixed;
    z-index: 200;
}

.hamburger {
    width: 28px;
    height: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
}
.hamburger span {
    display: block;
    height: 2px;
    width: 100%;
    background: currentColor;
    border-radius: 2px;
    transition: transform 0.35s ease, opacity 0.2s ease;
    transform-origin: center;
}
.navbar-open .hamburger span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.navbar-open .hamburger span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.navbar-open .hamburger span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

/* MAIN COLOR */
/*.text-main-color{ color: var(--main-bg-color); }*/
/*.bg-main-color{ background-color: var(--main-bg-color); }*/
/*.bg-fill-main-color{ fill: var(--main-bg-color); }*/
/*.border-main-color{ border-color: var(--main-bg-color); }*/
/*.bg-gradient-main-color{ background: linear-gradient(to bottom,var(--main-bg-color-light) 0%, var(--main-bg-color) 100%); }*/
/*.hover\:text-main-color:hover{ color: var(--main-bg-color); }*/
/*.hover\:bg-main-color:hover{ background-color: var(--main-bg-color); }*/
/*.hover\:border-main-color:hover{ border-color: var(--main-bg-color); }*/
/*.hover\:bg-gradient-main-color:hover{ background: linear-gradient(to bottom,var(--main-bg-color-light) 0%, var(--main-bg-color) 100%); }*/
/*.focus\:text-main-color:focus{ color: var(--main-bg-color); }*/
/*.focus\:bg-main-color:focus{ background-color: var(--main-bg-color); }*/
/*.focus\:border-main-color:focus{ border-color: var(--main-bg-color); }*/
/*.focus\:bg-gradient-main-color:focus{ background: linear-gradient(to bottom,var(--main-bg-color-light) 0%, var(--main-bg-color) 100%); }*/

/* MAIN COLOR DARK */
/*.text-main-color-dark{ color: var(--main-bg-color-dark); }*/
/*.bg-main-color-dark{ background-color: var(--main-bg-color-dark); }*/
/*.bg-fill-main-color-dark{ fill: var(--main-bg-color-dark); }*/
/*.border-main-color-dark{ border-color: var(--main-bg-color-dark); }*/
/*.bg-gradient-main-color-dark{ background: linear-gradient(to bottom,var(--main-bg-color-dark) 0%, var(--main-bg-color-dark) 100%); }*/
/*.hover\:text-main-color-dark:hover{ color: var(--main-bg-color-dark); }*/
/*.hover\:bg-main-color-dark:hover{ background-color: var(--main-bg-color-dark); }*/
/*.hover\:border-main-color-dark:hover{ border-color: var(--main-bg-color-dark); }*/
/*.hover\:bg-gradient-main-color-dark:hover{ background: linear-gradient(to bottom,var(--main-bg-color-dark) 0%, var(--main-bg-color-dark) 100%); }*/
/*.focus\:text-main-color-dark:focus{ color: var(--main-bg-color-dark); }*/
/*.focus\:bg-main-color-dark:focus{ background-color: var(--main-bg-color-dark); }*/
/*.focus\:border-main-color-dark:focus{ border-color: var(--main-bg-color-dark); }*/
/*.focus\:bg-gradient-main-color-dark:focus{ background: linear-gradient(to bottom,var(--main-bg-color-dark) 0%, var(--main-bg-color-dark) 100%); }*/

/* MAIN COLOR LIGHT */
/*.text-main-color-light{ color: var(--main-bg-color-light); }*/
/*.bg-main-color-light{ background-color: var(--main-bg-color-light); }*/
/*.bg-fill-main-color-light{ fill: var(--main-bg-color-light); }*/
/*.border-main-color-light{ border-color: var(--main-bg-color-light); }*/
/*.bg-gradient-main-color-light{ background: linear-gradient(to bottom,var(--main-bg-color-light) 0%, var(--main-bg-color-light) 100%); }*/
/*.hover\:text-main-color-light:hover{ color: var(--main-bg-color-light); }*/
/*.hover\:bg-main-color-light:hover{ background-color: var(--main-bg-color-light); }*/
/*.hover\:border-main-color-light:hover{ border-color: var(--main-bg-color-light); }*/
/*.hover\:bg-gradient-main-color-light:hover{ background: linear-gradient(to bottom,var(--main-bg-color-light) 0%, var(--main-bg-color-light) 100%); }*/
/*.focus\:text-main-color-light:focus{ color: var(--main-bg-color-light); }*/
/*.focus\:bg-main-color-light:focus{ background-color: var(--main-bg-color-light); }*/
/*.focus\:border-main-color-light:focus{ border-color: var(--main-bg-color-light); }*/
/*.focus\:bg-gradient-main-color-light:focus{ background: linear-gradient(to bottom,var(--main-bg-color-light) 0%, var(--main-bg-color-light) 100%); }*/

.tns-nav{display:flex;justify-content:center;width:100%;align-items:center;margin-top:20px;position:relative;bottom:0px;}
.tns-nav button{background-color:#e4e4e4; border:solid 1px white;width:20px; height:20px; border-radius:100%;margin:5px;}
.tns-nav button.tns-nav-active{ background-color: var(--main-bg-color); }

.tns-nav-active { background-color: var(--main-bg-color-dark); }

/* BASE CLASES PROPIAS */

.bg-dark { background-color: #000000; }
.group:hover .group-hover\:bg-main-color-dark{ background-color: var(--main-bg-color-dark); }
.group:hover .group-hover\:text-main-color{ color: var(--main-bg-color); }

.gradient-white { 
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.0984768907563025) 50%, rgba(0,0,0,1) 100%);
}

.gradient-bannersec { 
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
}

.gradient-infocontacto {
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
}

.gradient-plataformas {
    background: #000000;
    background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
}

.gradient-producto {
    background: #A20E10;
    background: linear-gradient(180deg,rgba(0, 0, 0, 1) 55%, rgba(49, 59, 230, 1) 100%);
}

.text-shadow { text-shadow: 1px 1px 4px rgb(0 0 0 / 25%); }
.titulo-main-color span { color: var(--main-bg-color); font-weight: 700; }
.titulo-main-color-light span { color: var(--main-bg-color-light); font-weight: 700; }
.titulo-main-color-dark span { color: var(--main-bg-color-dark); font-weight: 700; }
.titulo-main-color-white span { color: #fff; font-weight: 700; }
.titulo-main-color-black span { color: #000; font-weight: 700; }

button[data-action="stop"],button[data-action="start"]{display:none;}
:focus,input:focus,button:hover,button:focus{outline:none;}
.transition2s{transition: all .2s ease-in-out;}
.transition3s{transition: all .3s ease-in-out;}
.img::after{content:"";display:block;}

.p-1\/20::after{content:"";display:block;padding-top:200%;}
.p-1\/16::after{content:"";display:block;padding-top:161%;}
.p-1\/15::after{content:"";display:block;padding-top:150%;}
.p-1\/12::after{content:"";display:block;padding-top:120%;}
.p-1\/10::after{content:"";display:block;padding-top:100%;}
.p-1\/9::after{content:"";display:block;padding-top:90%;}
.p-1\/8::after{content:"";display:block;padding-top:80%;}
.p-1\/7::after{content:"";display:block;padding-top:70%;}
.p-1\/6::after{content:"";display:block;padding-top:60%;}
.p-1\/5::after{content:"";display:block;padding-top:50%;}
.p-1\/4::after{content:"";display:block;padding-top:40%;}
.p-1\/3::after{content:"";display:block;padding-top:30%;}
.p-1\/2::after{content:"";display:block;padding-top:20%;}

.p-interior::after{content:"";display:block;padding-top:102%;}
  
.w-screen-4\/12{width:33.33vw;}
.w-screen-5\/12{width:42vw;}
.w-screen-6\/12{width:50vw;}
.max-w-none{max-width:none;}

.line-clamp1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;  
  overflow: hidden;
}

.line-clamp2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.32; }
.line-clamp4 { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.32; }
.line-clamp3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.32; }
.line-clamp5 { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.32; }
.line-clamp6 { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.32; }

.last\:border-none>li:last-child,.last\:border-none>a:last-child{border:none !important}

.hover\:scale-sm:hover{transform: scale(1.1);}
.hover\:scale-md:hover{transform: scale(1.3);}
.hover\:scale-lg:hover{transform: scale(1.5);}

.rotate-180{transform: rotate(180deg);}

.filter-white { filter:grayscale(100) brightness(0) invert(1); }
.filter-black { filter:grayscale(100) brightness(0) invert(0); }
.grayscale-custom { filter: grayscale(100%) }
.grayscale-custom:hover { filter: grayscale(0%) }

.shadow-inner {
    --tw-shadow: inset 0 5px 10px 0 rgba(0,0,0,0.45);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.-z-1{z-index:-1}

.social-media li { padding: 0px; }
.social-media li a { margin: 0px; display: flex; width: 100%; height: 100%; }

.group:hover .group-hover\:scale-sm {transform: scale(1.1);}
.group:hover .group-hover\:scale-md {transform: scale(1.25);}

.swal2-styled.swal2-confirm{background-color:var(--main-bg-color-dark)}
.swal2-styled:focus{box-shadow:none;}
.buscador_oculto{margin-top:-60px;opacity:0;}
.buscador_toggle:not(.buscador_oculto){margin-top:0 !important;opacity:1 !important;}

.idiomaToShow { pointer-events:none; }

.idiomasContainer:hover .idiomaToShow { pointer-events: all; }

.h-112 { height: 28rem; }
.h-128 { height: 32rem; }
.h-144 { height: 36rem; }
.h-160 { height: 40rem; }

@media screen and (min-width:768px) {
    .md\:p-1\/auto::after{display:none !important;}

}

@media screen and (max-width:1280px) {
}

@media screen and (max-width:1024px) {
}
@media screen and (max-width:768px) {

	    
}

body{opacity:1;}