.elementor-kit-5{--e-global-color-primary:#111111;--e-global-color-secondary:#F5F5F5;--e-global-color-text:#EDEDED;--e-global-color-accent:#8D1D1C;--e-global-color-1b216c3:#C59972;--e-global-typography-primary-font-family:"Roboto Slab";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-primary );color:var( --e-global-color-text );font-family:"Roboto", Sans-serif;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-kit-5 a{color:var( --e-global-color-1b216c3 );}.elementor-kit-5 a:hover{color:var( --e-global-color-secondary );}.elementor-kit-5 h1{color:var( --e-global-color-secondary );font-family:"Roboto Slab", Sans-serif;}.elementor-kit-5 h2{color:var( --e-global-color-secondary );font-family:"Roboto Slab", Sans-serif;}.elementor-kit-5 h3{color:var( --e-global-color-secondary );font-family:"Roboto Slab", Sans-serif;}.elementor-kit-5 button,.elementor-kit-5 input[type="button"],.elementor-kit-5 input[type="submit"],.elementor-kit-5 .elementor-button{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Degradado desde arriba hacia abajo */
.top-gradient {
  position: relative;
  z-index: 1;
}

.top-gradient::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: linear-gradient(to bottom, rgba(13,13,13,1), transparent);
  z-index: 3;
}

/* Degradado desde abajo hacia arriba */
.bottom-gradient {
  position: relative;
  z-index: 1;
}

.bottom-gradient::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: linear-gradient(to top, rgba(13,13,13,1), transparent);
  z-index: 3;
}

/* Pointer */
.pointer{
    cursor: pointer
}

/* Header fijo */
.header-dinamico{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 999;
  isolation: isolate;              /* crea un stacking context propio */
}

/* Capa negra por encima del fondo y por debajo del contenido */
.header-dinamico::before{
  content:"";
  position:absolute;
  inset:0;                         /* top:0; right:0; bottom:0; left:0 */
  background: rgba(13,13,13,.88);
  opacity:0;                       /* oculta al inicio */
  pointer-events:none;             /* no bloquea clics */
  transition: opacity .35s ease;
  z-index: 1;                      /* overlay */
}

/* Asegura que TODO el contenido del header quede sobre el overlay */
.header-dinamico > *{
  position: relative;
  z-index: 2;
}

/* Al hacer scroll: muestra el overlay y achica el header */
.header-dinamico.scroll-activo{ padding: 6px 16px; }
.header-dinamico.scroll-activo::before{ opacity:1; }

/* Logos (todos los .logo-dinamico dentro del header) */
.header-dinamico .logo-dinamico img{
  max-height: 120px; width:auto;
  transition: max-height .28s ease, transform .28s ease;
  transform-origin: center;
}
.header-dinamico.scroll-activo .logo-dinamico img{
  max-height: 80px; transform: scale(.92);
}

/* Icon widget y listas transition*/
.elementor-icon,
.elementor-icon i,
.elementor-icon svg,
.elementor-icon-list-icon i,
.elementor-icon-list-icon svg {
  transition: all 0.3s ease-in-out !important;
}

/* Social icons transition*/
.elementor-social-icon,
.elementor-social-icon i,
.elementor-social-icon svg {
  transition: all 0.3s ease-in-out !important;
}

/* Contenedor seguro */
.artist-hover{
  display:block;
  position:relative;
  overflow:hidden;     /* evita que sobresalga el zoom */
  line-height:0;
  cursor:pointer;
}

/* Estado base: gris */
.artist-hover img{
  display:block;
  width:100%;
  height:auto;
  filter:grayscale(100%) brightness(0.9);
  transform:scale(1.02);
  transform-origin:center center;
  transition:transform .6s ease, filter .6s ease;
  will-change:transform, filter;
}

.artist-hover:hover img{
    filter:grayscale(0) brightness(1);
    transform:scale(1.05);
}/* End custom CSS */