/*
 Theme Name:   Joaquín Caserza
 Theme URI:    https://joaquincaserza.com/
 Description:  Child theme para Joaquín Caserza realizado por Anti.
 Author:       Anti
 Author URI:   https://antiestudi.com
 Template:     generatepress
 Version:      0.1
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
*/

/*  
  ─── ÍNDICE ─────────────────────────────────────────────────────────────
  1. VARIABLES GENERALES Y TIPOGRAFÍAS
  2. TÍTULOS
  3. TEXTOS
  4. BOTONES
  5. HEADER
  6. FOOTER
  7. DISTANCIAS
  8. SECCIONES
  9. RESPONSIVE
*/

/*─────────────────────────────────────────────────────────────────────────────
  1. VARIABLES GENERALES Y TIPOGRAFÍAS
─────────────────────────────────────────────────────────────────────────────*/

@font-face {
    font-family: 'Dingos-DisplayBlack';
    src: url('fonts/Dingos-DisplayBlack.woff2') format('woff2'),
        url('fonts/Dingos-DisplayBlack.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Dingos-DisplayOutlineBlack';
    src: url('fonts/Dingos-DisplayOutlineBlack.woff2') format('woff2'),
        url('fonts/Dingos-DisplayOutlineBlack.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Regular.woff2') format('woff2'),
        url('fonts/Poppins-Regular.woff') format('woff'),
        url('fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Medium.woff2') format('woff2'),
        url('fonts/Poppins-Medium.woff') format('woff'),
        url('fonts/Poppins-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-SemiBold.woff2') format('woff2'),
        url('fonts/Poppins-SemiBold.woff') format('woff'),
        url('fonts/Poppins-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Bold.woff2') format('woff2'),
        url('fonts/Poppins-Bold.woff') format('woff'),
        url('fonts/Poppins-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

:root{
  --fuente-titulos: 'Dingos-DisplayBlack', serif;
  --fuente-titulos-vacia: 'Dingos-DisplayOutlineBlack', serif;
  --fuente-textos:'Poppins', serif;
  --color-azul: #14A4EF;
  --color-azul-oscuro: #086FA4;
  --color-blanco: #FFFFFF;
  --color-negro: #000000;
}
/*─────────────────────────────────────────────────────────────────────────────
  2. TÍTULOS
─────────────────────────────────────────────────────────────────────────────*/
.titulo-inicio-azul h2{
  font-family: var(--fuente-titulos) !important;
  font-size: 50px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
}
.titulo-inicio-azul h2:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.titulo-inicio-blanco h2{
  font-family: var(--fuente-titulos) !important;
  font-size: 50px !important;
  color: var(--color-blanco) !important;
  text-transform: uppercase !important;
}
.titulo-inicio-blanco h2:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.titulo-shows-blanco h1{
  font-family: var(--fuente-titulos) !important;
  font-size: 50px !important;
  color: var(--color-blanco) !important;
  text-transform: uppercase !important;
}
.titulo-shows-blanco h1:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.titulo-paginas h1{
  font-family: var(--fuente-titulos) !important;
  font-size: 50px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
  text-transform: uppercase !important;
  line-height: 115% !important;
}
.titulo-paginas h1:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.contacto h2 {
  font-family: var(--fuente-titulos) !important;
  font-size: 26px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
}
.contacto h2:hover {
  font-family: var(--fuente-titulos-vacia) !important;
}
.show-empresas h2 {
  font-family: var(--fuente-titulos) !important;
  font-size: 26px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
}
.show-empresas h2:hover {
  font-family: var(--fuente-titulos-vacia) !important;
}
.titulo-pequeño h1{
  font-family: var(--fuente-titulos) !important;
  font-size: 30px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
  line-height: 130% !important;
}
.titulo-pequeño h1:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.titulo-pequeño h2{
  font-family: var(--fuente-titulos) !important;
  font-size: 30px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
  line-height: 130% !important;
}

.titulo-pequeño-blanco h2{
  font-family: var(--fuente-titulos) !important;
  font-size: 30px !important;
  color: var(--color-blanco) !important;
  text-transform: uppercase !important;
  line-height: 130% !important;
}
.titulo-pequeño h2:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.titulo-pequeño-show h2{
  font-family: var(--fuente-titulos) !important;
  font-size: 30px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
  line-height: 130% !important;
}
.titulo-pequeño-show h2:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.titulo-pequeño-meditaciones h1{
  font-family: var(--fuente-titulos) !important;
  font-size: 30px !important;
  color: var(--color-azul) !important;
  text-transform: uppercase !important;
  line-height: 130% !important;
}
.titulo-pequeño-meditaciones h1:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
.actor h1{
  font-family: var(--fuente-textos) !important;
  font-weight: 500 !important;
  font-size: 18px !important;
  text-transform: uppercase !important;
}
.actor h2{
  font-family: var(--fuente-textos) !important;
  font-weight: 500 !important;
  font-size: 18px !important;
  text-transform: uppercase !important;
}
/*─────────────────────────────────────────────────────────────────────────────
  3. TEXTOS
─────────────────────────────────────────────────────────────────────────────*/
.texto-blanco p{
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-blanco) !important;
  font-size: 18px !important;
}
.texto-blanco-footer span{
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-blanco) !important;
  font-size: 16px !important;
}
.texto-blanco-footer p{
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-blanco) !important;
  font-size: 16px !important;
}
.texto-negro-footer p{
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 16px !important;
}
.texto-blanco-footer a{
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-blanco) !important;
  font-size: 16px !important;
}
.contacto p {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
}
.contacto a {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
}
.contacto a:hover {
  color: var(--color-azul) !important;
}
.texto-negro p {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
}
.texto-negro strong {
  font-weight: 600 !important;
}
.texto-negro a {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
}
.texto-negro a:hover {
  color: var(--color-azul) !important;
}
.texto-azul {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-azul) !important;
  font-size: 18px !important; 
}
.texto-azul span {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
}
.actor-titulo h3 {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
  text-transform: uppercase !important;
}
.texto-negro{
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
}
.contacto .elementor-icon-list-text {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  color: var(--color-negro) !important;
  font-size: 18px !important; 
}
.contacto .elementor-icon-list-text:hover {
  color: var(--color-azul) !important;
}
/*─────────────────────────────────────────────────────────────────────────────
  4. BOTONES
─────────────────────────────────────────────────────────────────────────────*/
.boton-blanco .elementor-button{
  background-color: var(--color-blanco) !important;
  color: var(--color-azul) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  border-radius: 50px !important;
  padding: 17px 25px 13px 25px !important;
}
.boton-blanco .elementor-button:hover{
  background-color: var(--color-azul) !important;
  color: var(--color-blanco) !important;
}
.boton-azul .elementor-button{
  background-color: var(--color-azul) !important;
  color: var(--color-blanco) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  border-radius: 50px !important;
  padding: 17px 25px 13px 25px !important;
  text-transform: uppercase !important;
  border: 2px solid var(--color-azul) !important;
}
.boton-azul .elementor-button:hover {
  background-color: var(--color-blanco) !important;
  color: var(--color-azul) !important;
  border: 2px solid var(--color-azul) !important;
  font-family: var(--fuente-titulos) !important;
}
/*─────────────────────────────────────────────────────────────────────────────
  5. HEADER
─────────────────────────────────────────────────────────────────────────────*/
.logo h1{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-blanco) !important;
  font-size: 22px !important;
}
.menu-blanco p{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-blanco) !important;
  font-size: 22px !important;
}
.menu-azul p{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-azul-oscuro) !important;
  font-size: 22px !important;
}
.logo p{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-blanco) !important;
  font-size: 36px !important;
}
.navegacion a{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-blanco) !important;
  font-size: 22px !important;
  padding: 0 !important;
}
.elementor-item:after, .e--pointer-underline .elementor-item:after {
  bottom: -10px !important;
}
.navegacion .e--pointer-underline .elementor-item:after {
  background-color: var(--color-blanco) !important;
  height: 5px !important;
}
.logo-secundario p{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-azul-oscuro) !important;
  font-size: 22px !important;
}
.logo-show p{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-blanco) !important;
  font-size: 22px !important;
}
.logo-menu p{
  font-family: var(--fuente-titulos) !important;
  color: var(--color-blanco) !important;
  font-size: 22px !important;
}
.navegacion-secundaria a{
  font-family: var(--fuente-titulos) !important;
  font-size: 22px !important;
  padding: 0 !important;
}
.navegacion-secundaria .e--pointer-underline .elementor-item:after {
  background-color: var(--color-azul) !important;
  height: 5px !important;
}
.navegacion-show a{
  font-family: var(--fuente-titulos) !important;
  font-size: 22px !important;
  padding: 0 !important;
}
.navegacion-show .e--pointer-underline .elementor-item:after {
  background-color: var(--color-blanco) !important;
  height: 5px !important;
}
.menu-movil svg{
  fill: var(--color-blanco) !important;
  width: 30px !important;
}
.menu-movil-azul svg{
  fill: var(--color-azul-oscuro) !important;
  width: 30px !important;
}
/* 4) Estados sticky */
.header-secundario.elementor-sticky--effects  {
  background-color: var(--color-blanco) !important;
}
.elementor-sticky--effects .navegacion-show a{
  color: var(--color-azul) !important;
  fill: var(--color-azul) !important;
}
.elementor-sticky--effects .navegacion-show .e--pointer-underline .elementor-item:after {
  background-color: var(--color-azul) !important;
}
.elementor-sticky--effects .logo-show p{
  color: var(--color-azul-oscuro) !important;
}
.elementor-sticky--effects .menu-movil svg{
  fill: var(--color-azul-oscuro) !important;
  width: 30px !important;
}
ul.elementor-nav-menu--dropdown a, ul.elementor-nav-menu--dropdown a:focus, ul.elementor-nav-menu--dropdown a:hover {
  border-inline-start: 0px solid transparent !important;
  padding: 10px 20px 20px 20px !important;
  text-shadow: none;
}
.elementor-sticky--effects ul.elementor-nav-menu--dropdown a, ul.elementor-nav-menu--dropdown a:focus, ul.elementor-nav-menu--dropdown a:hover {
  color: var(--color-blanco) !important;
}
.elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown{
    margin-top: 30px !important;
    border-radius: 12px !important;
    padding-top: 10px !important;
}
/*─────────────────────────────────────────────────────────────────────────────
  6. FOOTER
─────────────────────────────────────────────────────────────────────────────*/
/* footer actor */
.footer-actor{
  border-top: solid 2px var(--color-negro) !important;
}
/*─────────────────────────────────────────────────────────────────────────────
  7. DISTANCIAS
─────────────────────────────────────────────────────────────────────────────*/
.padding-lateral{
  padding-left: 30px !important;
  padding-right: 30px !important;
}
.padding-superior{
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}
/*─────────────────────────────────────────────────────────────────────────────
  8. SECCIONES
─────────────────────────────────────────────────────────────────────────────*/
/* PAGINA EL SHOW */
.posicionar-show{
 position: absolute !important;
 top: 90px !important;
}
.posicionar-show-contenedor{
  position: relative !important;
}
.subtitulo-lateral-cartel p{
  font-family: var(--fuente-textos) !important;
  text-transform: uppercase !important;
  font-weight: 300 !important;
  color: var(--color-blanco) !important;
  font-size: 18px !important;
  padding: 0 30px !important;
  letter-spacing: 2px !important;
}
.subtitulo-cartel p{
  font-family: var(--fuente-textos) !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: var(--color-blanco) !important;
  font-size: 18px !important;
  letter-spacing: 2px !important;
}
.titulo-cartel h1 {
  font-family: var(--fuente-titulos) !important;
  font-size: 50px !important;
  color: var(--color-blanco) !important;
  text-transform: uppercase !important;
  padding: 0 60px !important;
}
.titulo-cartel h1:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}
/* VENTA DE ENTRADAS */
.evento{
  height: 110px !important;
  border-top: 3px solid var(--color-azul) !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  position: relative;
}
.evento:last-child {
  border-bottom: 3px solid var(--color-azul) !important;
}
.evento-datos{
  gap: 0px !important;
  display: flex !important;
  flex-direction: column !important;
  width: 20% !important;
}
.evento-fecha p{
  font-family: var(--fuente-textos) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  margin-bottom: 0 !important;
}
.evento-hora p{
  font-family: var(--fuente-textos) !important;
  font-size: 18px !important;
  font-weight: 300 !important;
  text-transform: uppercase !important;
  margin-bottom: 0 !important;
}
.evento-ciudad h3{
  font-family: var(--fuente-textos) !important;
  font-weight: 800 !important;
  font-size: 30px !important;
  text-transform: uppercase !important;
  margin-bottom: 0 !important;
}
.evento-ciudad{
  width: 20% !important;
}
.evento-teatro h4{
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  font-size: 18px !important;
  margin-bottom: 0 !important;
}
.evento-teatro{
  width: 35% !important;
}
.load-more-wrapper{
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
}
.cuadricula-eventos {
  background-color: transparent !important;
  color: var(--color-azul) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  text-transform: uppercase !important;
  margin-top: 20px !important;
}
.cuadricula-eventos:hover {
  font-family: var(--fuente-titulos-vacia) !important;
}
.evento-boton{
  width: 25% !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: end !important;
}
.evento-boton .elementor-button {
  background-color: var(--color-azul) !important;
  color: var(--color-blanco) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  border-radius: 50px !important;
  padding: 17px 25px 13px 25px !important;
  text-transform: uppercase !important;
  border: 2px solid var(--color-azul) !important;
}
.evento-boton .elementor-button:hover {
  background-color: var(--color-blanco) !important;
  color: var(--color-azul) !important;
  border: 2px solid var(--color-azul) !important;
  font-family: var(--fuente-titulos) !important;
}
button.elementor-button.boton-agotado{
  background-color: #F4F4F4!important;
  color: var(--color-negro) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  border-radius: 50px !important;
  padding: 17px 25px 13px 25px !important;
  text-transform: uppercase !important;
  border: 0px solid var(--color-azul) !important;
}

button.elementor-button.boton-agotado:hover{
  background-color: #F4F4F4!important;
  color: var(--color-negro) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  border-radius: 50px !important;
  padding: 17px 25px 13px 25px !important;
  text-transform: uppercase !important;
  border: 0px solid var(--color-azul) !important;
}
a.elementor-button.pocas-entradas{
  background-color: var(--color-azul-oscuro)!important;
  color: var(--color-blanco) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  border-radius: 50px !important;
  padding: 17px 25px 13px 25px !important;
  text-transform: uppercase !important;
  border: 2px solid var(--color-azul-oscuro) !important;
}
a.elementor-button.pocas-entradas:hover{
  background-color: var(--color-blanco)!important;
  color: var(--color-azul-oscuro) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  border-radius: 50px !important;
  padding: 17px 25px 13px 25px !important;
  text-transform: uppercase !important;
  border: 2px solid var(--color-azul-oscuro) !important;
}
a.elementor-button.boton-agotado{
  background-color: #EB5B10!important;
  border: 2px solid #EB5B10 !important;
}
a.elementor-button.boton-agotado:hover{
  background-color: var(--color-blanco) !important;
  border: 2px solid #EB5B10 !important;
  color: #EB5B10 !important;
}
.filtro-ciudad select{
	appearance:none !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  margin-bottom: 15px !important;
  text-transform: uppercase !important;
  color: var(--color-azul) !important;
  border: none !important;
  padding: 0 !important;
  background-color: transparent !important;
}
.filtro-ciudad select:hover{
  font-family: var(--fuente-titulos-vacia) !important;
}


.filtro-ciudad {
  position: relative;
  display: inline-block;
}

.filtro-ciudad select {
  appearance: none;
  padding-right: 2em;
}

.filtro-ciudad::after {
    content: "\f0dc";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: -1.25em;
    top: 14px;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--color-azul);
}
/* FONDOS SECCIONES */

.fondo-azul{
  background-color: var(--color-azul) !important;
}
.fondo-azul-oscuro{
  background-color: var(--color-azul-oscuro) !important;
}
.fondo-blanco{
  background-color: var(--color-blanco) !important;
}
.fondo-negro{
  background-color: var(--color-negro) !important;
}


/*Marquee eventos*/
.marquee-wrapper {
  overflow: hidden;
  background: var(--color-azul) !important;
  color: #fff;
  padding: 10px 0 8px 0;
  position: relative;
}

.marquee-track {
  display: flex;
  width: max-content;
  white-space: nowrap;
}

.marquee-text {
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  color: var(--color-blanco) !important;
  text-transform: uppercase !important;
  padding-right: 5px !important;
}
/*Formulario*/
.formulario .elementor-field-label {
  font-family: var(--fuente-titulos) !important;
  color: var(--color-blanco) !important;
  font-size: 20px !important;
  text-transform: uppercase !important;
}
.formulario .elementor-mark-required .elementor-field-label:after{
  color: var(--color-blanco) !important;
  padding-inline-start: 0 !important;
}
.formulario .elementor-field {
  font-family: var(--fuente-textos) !important;
  color: var(--color-negro) !important;
  font-size: 16px !important;
  background-color: var(--color-blanco) !important;
  border-radius: 50px !important;
  border: none !important;
}
.formulario .elementor-button {
  color: var(--color-blanco) !important;
  font-family: var(--fuente-titulos) !important;
  font-size: 20px !important;
  padding: 0 !important;
  text-transform: uppercase !important;
}
.formulario .elementor-field-option label {
  font-family: var(--fuente-textos) !important;
  font-weight: 300 !important;
  font-size: 16px !important;
  color: var(--color-blanco) !important;
}
.formulario .e-form__indicators__indicator__label{
  display: none !important;
}

.formulario .e-form__indicators__indicator__number {
  font-family: var(--fuente-titulos) !important;
}
#form-field-agradecimiento {
  font-family: var(--fuente-textos) !important;
  color: var(--color-negro) !important;
  font-size: 16px !important;
  background-color: var(--color-blanco) !important;
  border-radius: 20px !important;
  border: none !important;
}
#form-field-otro {
  font-family: var(--fuente-textos) !important;
  color: var(--color-negro) !important;
  font-size: 16px !important;
  background-color: var(--color-blanco) !important;
  border-radius: 20px !important;
  border: none !important;
}

/*MODO MENTE*/
  /* Ocultamos por defecto el texto “modo mente” */
  #modo-mente-container .texto-mente { display: none; }

  /* Cuando el contenedor lleva la clase .modo-mente */
  #modo-mente-container.modo-mente .texto-normal { display: none; }
  #modo-mente-container.modo-mente .texto-mente { display: block; }
  /* Estilos para el botón fijo en el lateral derecho */
  #btn-toggle-modo {
    transform: translateY(-50%);
    z-index: 9999;
    display: flex;
    align-items: center;
    padding: 0.5em 1em;
    font-size: 14px;
    cursor: pointer;
    border: 0px;
    background: #F4F4F4;
    color: var(--color-negro);
    border-radius: 50px;
    transition: background 0.2s, color 0.2s;
    /* Animación de vaivén suave */
    animation: cabeceo 2s ease-in-out infinite;
    font-family: var(--fuente-textos);
    font-weight: 500;
  }
  #btn-toggle-modo svg{
    fill: var(--color-negro);
  }
  #btn-toggle-modo:hover svg{
    fill: var(--color-blanco);
  }
    #btn-toggle-modo.modo-mente svg{
    fill: var(--color-blanco);
  }
    #btn-toggle-modo:hover {
    background: var(--color-azul);
    color: var(--color-blanco);
  }

  /* Estado activo */
  #btn-toggle-modo.modo-mente {
    background: var(--color-azul);
    color: var(--color-blanco);
  }

  /* Keyframes para desplazarlo ligeramente a la derecha y volver */
  @keyframes cabeceo {
    0%, 100%   { right: 0.5em; }
    50%        { right: 1.5em; }
  }

  /* Icono dentro del botón */
  #btn-toggle-modo .btn-icon {
    width: 1.5em;
    margin-right: 0.5em;
    flex-shrink: 0;
  }


/* PÁGINA ACTOR */
/* Contenedor que ocupa toda la ventana */
  .video-fullscreen {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
  }
  /* Vídeo sin controles, ocupa 100% */
  .video-fullscreen video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  /* Botón de volumen */
  .video-fullscreen .btn-volume {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: rgba(0,0,0,0.5);
    border: none;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    cursor: pointer;
    font-size: 1.2rem;
  }

/*EL SHOW PARA EMPRESAS*/
.card{
  height:auto!important;
  padding: 20px !important;
  background-color: var(--color-azul) !important;
  border-radius: 20px !important;
}
.titulo-card h3{
  font-family: var(--fuente-titulos) !important;
  font-weight: 500 !important;
  color: var(--color-blanco) !important;
  font-size: 18px !important;
  line-height: 1.4 !important;
}
/* LIBRO */
.libro img{
  width: auto !important;
}
/*─────────────────────────────────────────────────────────────────────────────
  9. RESPONSIVE
─────────────────────────────────────────────────────────────────────────────*/
/* MOVIL */
@media only screen and (max-width: 600px) {
  .padding-lateral{
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .evento{
    height: auto !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto auto auto !important;
    padding-bottom: 15px !important;
    padding-top: 20px !important;
    row-gap: 15px !important;
  }
  .evento-datos{
    width: 100% !important;
  }
  .evento-ciudad h3{
    text-align: center !important;
  }
  .evento-ciudad{
    width: 100% !important;
    grid-column: 1 / 3 !important;
    grid-row: 1 / 2 !important;
  }
  .evento-teatro h4{
    text-align: center !important;
    margin-top: -10px !important;
    padding-bottom: 10px !important;
  }
  .evento-teatro{
    width: 100% !important;
    grid-column: 1 / 3 !important;
    grid-row: 2 / 3 !important;
  }
  .cuadricula-eventos:hover {
    font-family: var(--fuente-titulos) !important;
  }
  .evento-boton{
    width: 100% !important;
  }
  .evento-boton .elementor-button {
    padding: 15px 25px 11px 25px !important;
  }
  .filtro-ciudad select:hover{
    font-family: var(--fuente-titulos) !important;
  }
  .titulo-inicio-azul h2{
    font-size: 46px !important;
  }
  .titulo-paginas h1{
    font-size: 38px !important;
  }
  .titulo-inicio-blanco h2{
    font-size: 46px !important;
  }
  .titulo-cartel h1{
    font-size: 28px !important;
    padding: 0 !important;
  }
  .titulo-shows-blanco h1{
    font-size: 28px !important;
  }
  .padding-lateral-movil{
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .titulo-pequeño h1{
    font-size: 38px !important;
    line-height: 130% !important;
  }
  .titulo-pequeño h2{
    font-size: 38px !important;
    line-height: 130% !important;
  }
  .titulo-pequeño-show h2{
    font-size: 20px !important;
    line-height: 130% !important;
  }
  .titulo-pequeño-blanco h2{  
    font-size: 16px !important;
  }
  .titulo-pequeño-meditaciones h1{
    line-height: 130% !important;
  }
  .show-empresas h2 {
    font-size: 22px !important;
    line-height: 115% !important;
  }
  .video-fullscreen {
    height: 30vh !important;
  }
  /* Vídeo sin controles, ocupa 100% */
  .video-fullscreen video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  /* Botón de volumen */
  .video-fullscreen .btn-volume {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: rgba(0,0,0,0.5);
    border: none;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    cursor: pointer;
    font-size: 1.2rem;
  }
  .posicionar-show{
    position: static !important;
    margin-bottom: -70% !important;
    z-index: 10 !important;
  }
  #btn-toggle-modo {
    bottom: 2px;
  }
  #btn-toggle-modo {
    background: var(--color-azul);
    color: var(--color-blanco);
  }
  #btn-toggle-modo svg{
    fill: var(--color-blanco);
  }
  #btn-toggle-modo:hover svg{
    fill: var(--color-negro);
  }
  #btn-toggle-modo.modo-mente svg{
    fill: var(--color-negro);
  }
  #btn-toggle-modo:hover {
    background: #F4F4F4;
    color: var(--color-negro);
  }
  /* Estado activo */
  #btn-toggle-modo.modo-mente {
    background: #F4F4F4;
    color: var(--color-negro);
  }
  .navegacion a{
  font-size: 32px !important;
}
}
/* IPAD HORIZONTAL*/
@media only screen and (min-width: 1025px) and (max-width: 1200px) {
  .titulo-cartel h1{
  font-size: 40px !important;
  }
  .subtitulo-lateral-cartel p{
  font-size: 16px !important;
  padding: 0 30px !important;
}
}
/* IPAD VERTICAL*/
@media only screen and (min-width: 601px) and (max-width: 1024px) {
  .titulo-cartel h1{
  font-size: 52px !important;
  }
  .subtitulo-lateral-cartel p{
  font-size: 16px !important;
  padding: 0 30px !important;
}
.navegacion a{
  font-size: 42px !important;
}
.evento{
  height: 110px !important;
  gap: 20px !important;
}
.evento-fecha p{
  font-size: 14px !important;
}
.evento-hora p{
  font-size: 14px !important;
}
.evento-ciudad h3{
  font-size: 30px !important;
}
.evento-ciudad{
  width: 30% !important;
}
.evento-teatro h4{
  font-size: 16px !important;
}
.evento-teatro{
  width: 35% !important;
}
.evento-boton{
  width: 15% !important;
}
.evento-boton .elementor-button {
  font-size: 16px !important;
  padding: 15px 23px 11px 23px !important;
}
.posicionar-show{
  margin-bottom: -46% !important;
  position: static !important;
  z-index: 10 !important;
}
.padding-lateral-movil{
  padding-left: 30px !important;
  padding-right: 30px !important;
}
.elementor-68 .elementor-element.elementor-element-357f554{
  width: 100% !important;
}
.titulo-card h3{
  font-size: 18px !important;
}
 .video-fullscreen {
    height: 50vh !important;
  }
  .elementor-2368 .elementor-element.elementor-element-27a3d11{
    width: 100% !important;
  }
}
/* ESCRITORIO */
@media only screen and (min-width: 1920px) {
  .subtitulo-lateral-cartel p{
    font-size: 22px !important;
    padding: 0 60px !important;
  }
  .subtitulo-cartel p{
    font-size: 22px !important;
  }
  .titulo-cartel h1{
    padding: 0 120px !important;
  }
}

/* PANTALLAS GRANDES */
@media only screen and (min-width: 2400px) {
  .titulo-inicio-azul h2{
    font-size: 60px !important;
  }
  .titulo-inicio-blanco h2{
    font-size: 60px !important;
  }
  .titulo-cartel h1{
    font-size: 60px !important;
    padding: 0 180px !important;
  }
  .titulo-shows-blanco h1{
    font-size: 60px !important;
  }
  .titulo-paginas h1{
    font-size: 60px !important;
  }
  .contacto h3 {
    font-size: 34px !important;
  }
  .titulo-pequeño h1{
    font-size: 40px !important;
  }
  .titulo-pequeño h2{
    font-size: 40px !important;
  }
  .titulo-pequeño-blanco h2{  
    font-size: 40px !important;
  }
  .titulo-pequeño-show h2{
    font-size: 40px !important;
  }
  .titulo-pequeño-meditaciones h1{
    font-size: 40px !important;
  }
  .subtitulo-lateral-cartel p{
    font-size: 26px !important;
    padding: 0 60px !important;
  }
  .subtitulo-cartel p{
    font-size: 26px !important;
  }
}