/*-------------------------- 

FONTS 

--------------------------*/



@font-face {
    font-family: 'Tipo';
    src: url('../fonts/arrunta.woff2') format('woff2'),
        url('../fonts/arrunta.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Tipo';
    src: url('../fonts/erdia.woff2') format('woff2'),
        url('../fonts/erdia.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


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


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




:root{
    --txuria:#ffffff;
    --argia:#f2ecde;
    --iluna:#1d1d1b;


}

.grecaptcha-badge { 
    visibility: hidden;
}


html{overflow-x: hidden;}

body{   
    font-family: 'Tipo'!important;
    font-weight: 400;
    background:var(--argia);
}
main ul{padding-left: 30px;}
ul,p{font-size: 1.4em;color: var(--iluna);}
p{color:var(--iluna);font-size: 1.6em;}


.single-artista-container{
    overflow: auto;
}


/*-------------------------- 

GENERAL 

--------------------------*/


* {box-sizing: border-box;margin:0;padding:0;}
body{overflow-x: hidden;}



.wp-block-image img{border-radius: 10px;}
/*-------------------------- 

HEADER 

--------------------------*/

.logo{
    z-index: 9999;
}
.logo img{width: 120px;}
nav.menu{
    float: right;
    margin-top: 5px;
    text-align: right;
}

.menu ul li{
    display:inline-block;
    text-decoration: none;
    padding: 5px 20px;
}

.menu ul li a{
    font-size: 1.6em;
    text-decoration: none;
    color:#1d1d1b;
    text-transform: uppercase;
}

/* Estilos para el preloader */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

#preloader .spinner {
    border: 4px solid white;
    border-top: 4px solid black;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Transición para el contenido */
.fade-in {
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.fade-in.visible {
    opacity: 1;
}



#site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: transparent;
    z-index: 1000;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.menu-container {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    justify-content: flex-start;

    background: var(--argia);
    margin-top: 0;
    border-bottom: 1px solid black;
}

.blanca,.blanca .menu-container{
    background:white;
}

#site-navigation{
    padding:8px;
    display: flex;width: 100%;justify-content: space-between;align-items:center;
}
#site-navigation ul {
list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    line-height: 1;
    font-size: 2.6em;
    text-transform: uppercase;
    font-family: 'Tipo';
    padding-bottom: 10px;
}
.category-links{
    margin-bottom: 20px;
}
#menu-list a,#menu-idioma a,.category-links a {
    text-decoration: none;
    color: var(--iluna);
    font-weight: 200;
    text-transform: uppercase;
    border: 1px solid var(--iluna);
    border-radius: 20px;
    font-size: 20px;
    font-family: 'Tipo';
    /* border-radius: 5px; */
    padding: 4px 10px;
    transition: all 0.5s ease;
}

#menu-list .pidecita a{
background:white;
}
#menu-list a:hover,#menu-list a.active,#menu-idioma a:hover,.category-links a:hover {
    color: var(--argia);
    background: var(--iluna);

}

#menu-list a.pidecita:hover,#menu-list a.pidecita.active {
    color: white;
    background: var(--iluna);

}

#menu-list{
    margin-left: auto!important;
}
#menu-idioma{
    margin-left:20px!important;
}

/* Ocultar el menú cuando se hace scroll hacia arriba */
.hide-menu {
    transform: translateY(-100%);
    opacity: 0;
}

/* Estilos para el menú hamburguesa */
.hamburger-menu {
    padding:20px;
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 7px;
}

.hamburger-menu span {
width: 30px;
    height: 2px;
    background-color: var(--iluna);}




    /* Estilo del menú a pantalla completa */
#full-screen-menu {
    list-style-type: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
background-color: var(--argia);
    color: var(--iluna);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s, visibility 0.5s;
    z-index: 100;
}

/* Mostrar el menú cuando está activo */
#full-screen-menu.active {
    opacity: 1;
    visibility: visible;
}

.hamburger-menu.open{background:black;}
/* Estilos del ícono de hamburguesa transformado en una X */
.hamburger-menu.open span:nth-child(1) {
    transform: rotate(45deg) translate(7.5px, 5px);
}

.hamburger-menu.open span:nth-child(2) {
    opacity: 0;
}

.hamburger-menu.open span:nth-child(3) {
    transform: rotate(-45deg) translate(7.5px, -5px);
}

.hamburger-menu span {
    z-index:999;
    transition: transform 0.3s, opacity 0.3s;
}
.artistas-nombres{
    font-size: 6em;
    font-family: 'Tituluak';
    text-transform: uppercase;
    font-weight: 400;
    width: 70%;
}



/*-------------------------- 

BLOG

--------------------------*/


.blog-listing{
    margin-top:50px;
    padding:40px;
}
.single-post-container{
    padding: 40px;
    color: var(--iluna);
    margin-top: 50px;
}

.single-post-container h1{
    font-size: 60px;
    font-weight: 300;
    line-height: 100%;
}
.post-content{
    margin-top:100px;
}
.post-content p,.post-content li,.post-content h1,.post-content h2,.post-content h3,.post-content h4,.post-content h5,.post-content h6{
font-size: 25px;    font-weight: 200;
}
.post-content strong{
    font-weight:300;
}

.post-content ol,.post-content ul{
    padding-left:40px;
}
.post-navigation{
        font-size: 20px;
    margin-top: 100px;
}

.post-navigation a{
    text-decoration: none;
    color: var(--iluna);
}
.post-navigation .prev,.post-navigation .next{
    padding: 10px;
}

    /* Contenedor principal del masonry */
.masonry {
  max-width: 100%;
  margin: 0 auto;
}

.masonry h2{
    font-weight: 200;
}
/* Estilo base para cada post */
.post {
    background: transparent;
    padding: 20px;
    box-sizing: border-box;
    margin-bottom: 20px;
    width: 30%;
}

/* Si el post tiene imagen, esta ocupará el 100% del ancho del artículo */
a.post img {
    width: 100%;
    display: block;
    height: auto;
    margin-top: 20px;
    border-radius: 10px;
}
.post{
    text-decoration: none;
    color:var(--iluna);
}


/* Estilos para posts sin imagen */
.post-no-image {
    border:1px solid var(--iluna);
    background: var(--argia);
    padding: 20px;
    border-radius: 10px;
color:var(--iluna);font-size:1.6em;line-height: 150%;transition: all ease 0.3s}

.post-no-image:hover {
    background: var(--iluna);
    color:var(--argia);
}
/* Responsive: en móviles se muestra 1 columna */
@media(max-width: 767px) {
  .post {
    width: 100%;
  }
}

/* Responsive: en tablet se muestran 2 columnas */
@media(min-width: 768px) and (max-width: 991px) {
  .post {
    width: 48%;
  }
}

/*-------------------------- 

PACKS

--------------------------*/
    main{
        color:var(--iluna);
    }
.filters {
    margin-bottom: 20px;
    width:100%;
    border-top: 1px solid var(--iluna);
    padding: 20px;
    border-bottom: solid 1px var(--iluna);}

.filter-pill {
    display: inline-block;
    margin: 5px;
    text-transform:uppercase;
    padding: 4px 15px;
    background-color: transparent;
    color: var(--iluna);
    text-decoration: none;
    border-radius: 20px;
    cursor: pointer;
    border:1px solid var(--iluna);
    transition: background-color 0.3s ease, color 0.3s ease;
}
.filtros{
        text-align: left;
            padding: 0 20px;

}

.filtros .feature-link{
display: inline-block;
    margin: 5px;
    text-transform: uppercase;
    padding: 6px 15px;
    background-color: transparent;
    color: var(--iluna);
    text-decoration: none;
    border-radius: 20px;
    border: 1px solid var(--iluna);
    font-size: 14px;
    transition: all 0.3s ease;
}


.filtros > .feature-link:first-child {
    margin-left: 0;
}

.filtros .feature-link:hover{
    background:var(--iluna);
    color: var(--argia);
}


.filter-pill:hover, .filter-pill.active {
    background-color: var(--iluna);
    color: var(--argia);
}

.packs {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: start;
}

.pack {
    display: none;
    width: calc(33.3333333333333333333333333333333% - 10px);
    background: transparent;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--iluna);
    text-align: center;
    box-shadow: 0;
    transition: transform 0.3s ease;
    
    color: var(--iluna);
    /*flex-wrap: wrap;*/
    justify-content: space-between;
    padding-bottom: 75px;
    align-items: start;
        flex-direction: column;
    justify-content: start;
}

.pack:hover {

}

.pack .imagen-pack{    
    height: 300px;
    width: 100%;
}
.pack .img-pack {
    border-radius: 8px;
    display: flex;
    justify-content: left;
    align-items: center;
    color: var(--iluna);
    font-size: 50px;
    width: 100%;
    text-align: left;
    line-height: 1;
    margin-bottom: 20px;
    padding: 0 20px;
margin-top:50px;
}

.pack .text-pack {
    color:var(--iluna);
    padding: 0;
    font-size: 18px;
    text-align: left;
    margin-bottom: 20px;
        padding: 0 20px;

}



.open-popup{
        display: block;
    margin: 5px;
    text-transform: uppercase;
    padding: 6px 15px;
    background-color: var(--iluna);
    color: var(--argia);
    text-decoration: none;
    border-radius: 20px;
    border: 1px solid var(--iluna);
    font-size: 20px;
    height: 42px;
    transition: all 0.3s ease;
    font-family: 'Tipo';
    font-weight: 300;
    bottom: 10px;
    left: 10px;
    position: absolute;
}

.open-popup.pregunta-link{
    position: unset !important;
    max-width: 200px;
    text-decoration: none !important;
    text-align: center;
    margin-top: 40px;
}
.open-popup:hover{
    background-color: var(--argia);
    color: var(--iluna);
}

    body.no-scroll {
    overflow: hidden;
}

.popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
        z-index: 999999;
}

.popup-content {
    background: white;
    padding: 20px;
    border-radius: 10px;
    position: relative;
    max-width: 80%;
    width: 90%;
    max-height: 90vh; /* Para que el contenido no sea mayor que la pantalla */
    overflow: auto; /* Permite desplazarse dentro del popup si el contenido es largo */
}

.close-popup {
    position: absolute;
    top: 10px;
    right: 15px;
    cursor: pointer;
    font-size: 20px;
}

.text-pack-txiki{
font-size: 12px;
    text-align: left;
    padding: 0;
    margin-top: 20px;
}

.pack{
    position: relative;
}

.pak-precio{
    position: absolute;
    bottom: 0;
    right: 0;
        max-width: 50%;
    text-align: right;
    background: var(--argia);
    padding: 10px;
    border-top: 1px solid var(--iluna);
    color: var(--iluna);
    border-left: 1px solid var(--iluna);
}


/*--------------------------

EKIPO
--------------------------*/


.ekipo-principal{
    display: flex;
    flex-wrap: wrap;
    /* flex-basis: 50%; */
    align-items: end;
    border-bottom: 1px solid black;
    /* padding: 20px; */
}
.ekipo-principal .texto-header{
        font-size: 2em;
    line-height: 105%;
    color: var(--iluna);
    font-weight: 200;
    margin-top: 100px;
    margin-bottom: 50px;
    padding: 20px;
    flex-basis: 50%;
}

.ekipo-principal img{
        flex-basis: 50%;
    width: 50%;
    height: auto;
    object-fit: contain;
}

.ekipo{display:flex;flex-wrap:wrap;gap:20px;padding:20px;}
.partaide{flex-basis:calc(25% - 20px);}
.imagen-partaide{width:100%;border-radius:10px;}
.nombre-partaide{
        text-transform: uppercase;
    margin-bottom: 20px;
    font-size: 35px;
    font-weight: 200;margin-top:10px;
}



/*-------------------------- 

HOME
--------------------------*/
.abitu-container-home{
        min-height: 50vh;
    display: flex
;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    margin-top: 68px;
}
.fotos-home img{
        flex-basis: 50%;
    width: 50%;
    height: auto;
    object-fit: contain;
}
    .destacados-home{
        display:flex;
        flex-wrap:wrap;
        gap:20px;
        padding:20px;
    }
    .destacado-servicios{
            background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/home-1.jpg);

    }
        .destacado-equipo{
            background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/taldea.jpg);

    }

    .destacado-packs{
            background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/pak.jpg);

    }


.mas-informacion{
    padding: 20px;
    margin: 20px;
    border-radius: 20px;
    color: var(--iluna);
    border: 1px solid;}

.mas-informacion p{
        color: var(--iluna);
font-size:1.3em;
}
.mas-informacion a{
    color: var(--iluna);
    text-decoration: none;
}
    .destacado{
        background-position: center;


flex-basis: calc(33.333333333333333333% - 15px);
    height: 20vw;
    display: flex;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 20px;
    align-items:center;
    justify-content:center;
    transition:all 0.4s ease;
    text-decoration:none;
        position: relative;
        }
        .destacado span{
                font-weight: 200;
    text-transform: uppercase;
    background: var(--argia);
    padding: 4px 15px;
    border-radius: 60px;
    color: var(--iluna);
    font-size: 30px;
    line-height:105%;
        position: absolute;
    bottom: 20px;
    width: calc(100% - 20px);
    text-align: center;
        }

.texto-home{
        flex-basis: 60%;
    display: flex;
    flex-wrap: wrap;
    margin: auto;
    text-align: center;
    align-items: center;
    justify-content: center;
}


.destacados-home:hover .destacado:not(:hover) {
  opacity: 0.2;
}


/*--------------------------

SERVICIOS

--------------------------*/

.zerrenda-serv{
    display:flex;
    font-weight:200;
    gap:20px;
    margin-left:40px;
}
.zerrenda-serv li ul li{
    font-size:20px;
}
.servicio-galeria{
    width: 100%;
    display: flex
;
    gap: 20px;
    padding-left: 40px;
    padding-top: 20px;}

.servicio-img-50{border-radius:5px;flex-basis: 50%;width:50%;}
    .texto-header {
        font-size: 2.5em;
        line-height: 105%;
        color: var(--iluna);
        font-weight: 200;
        margin-top:100px;
        margin-bottom:50px;
    }

    .texto-header.pastillas{
                margin-bottom:30px;

    }

    .servicios-h4 {
        width:100%;
    font-size: 2em;
    margin-top: 20px;
    flex-wrap: wrap;
    border-top: 1px solid var(--iluna);
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding-top: 20px;

}
     .medicina-general{
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/zerbitzuak-08.jpg);
     }
     .pruebas-esfuerzo{ 
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/zerbitzuak-02.jpg);
     }
     .planes-entrenamiento{ 
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/abitu-sport.jpg);
     }
     .nutricion{ 
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/zerbitzuak-03.jpg);
     }
     .consulta{ 
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/zerbitzuak-05.jpg);
     }
     .equipos{ 
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/zerbitzuak-04.jpg);
     }
     .analisis{ 
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/abitu-odola.jpg);
     }
     .ecografias{
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/zerbitzuak-09.jpg);
     }

          .biomecanica{
         background-image: url(https://www.abitu.eus/wp-content/themes/chroma/assets/images/biomecanica.jpg);
     }

    .servicios-h4 .zerbitzua {

background-position: center;
    flex-basis: calc(25% - 22px);
    height: 25vw;
    display: flex
;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 20px;
    align-items: center;
    justify-content: center;
    transition: all 0.4s ease;
    text-decoration: none;
    position: relative;
    /*
        transition: background-color 0.3s, color 0.3s;
        font-weight: 200;
        padding: 14px 40px;
        border: 1px solid var(--iluna);
        border-radius: 70px;
        background-color: transparent;
        color: var(--iluna);
        cursor: pointer;
        flex-basis:calc(25% - 30px);*/
    }



.zerbitzua span{
        font-weight: 200;
    text-transform: uppercase;
    background: var(--argia);
    padding: 4px 15px;
    border-radius: 60px;
    color: var(--iluna);
    font-size: 30px;
    line-height: 105%;
    position: absolute;
    bottom: 20px;
    width: calc(100% - 20px);
    text-align: center;
}
            .zerbitzua {
    position: relative;
    transition: all 0.3s ease;
}

.zerbitzua:not(.active).has-active {
    filter: brightness(0.5);
        opacity: 0.5;

}

.zerbitzua:not(.active).has-active:hover{
    filter: brightness(1);
    opacity: 0.8;
}
.zerbitzua:hover{
    opacity: 0.8;
    }


    .servicios-h4 .zerbitzua.active span,.zerbitzua:hover span {
        background-color: var(--iluna);
        color: var(--argia);
    }

    .servicio-content {
        margin-top: 20px;
        padding: 15px;
        color:var(--iluna);
        display: none; /* Ocultamos todo por defecto */
    }

    .servicios,.servicio-content{
       width: 100%;
    flex-wrap: wrap;
    }

.intro-servicio{
    font-size: 1.8em;
    flex-basis: 100%;
    color: var(--iluna);
    line-height: 105%;
    border-bottom: 1px solid black;
    padding-bottom: 60px;
        margin-left: 40px;
    margin-top: 40px;
    font-weight:200;
}

.pastilla-servicio{
        background: var(--iluna);
    flex-basis: 100%;
    border-radius: 20px;
    padding: 4px 15px;
    color: var(--argia);
    margin-top: 20px;
    margin-left: 20px;
}
    .servicio-content.active {
        display: flex; /* Mostramos solo el contenido activo */
    }
    .title-subservicio,.text-subservicio,.title-sub,.text-sub{
        color:var(--iluna);
    }

    


    .servicio-content{
    padding: 0px 40px 40px 0px;
    border-radius: 30px;        }


    .sub-servicio-t{
    flex-basis: 100%;
    padding: 20px;
    padding-left: 20px;
        }



.title-subservicio{
    display:flex;justify-content: space-between;align-items: end;
    margin-bottom:20px;border-bottom:1px solid black;padding-bottom:10px;
}

    .title-subservicio p{
    font-size: 1.6em;
    font-weight: 300;
    text-transform: uppercase;
    flex-basis: 60%;
    text-align: left;
    align-items:end;
        }

        .title-subservicio span{
            font-size:2em;
            text-align:right;
            display:block;
            margin-top:40px;
        }
.subsub{
    width: calc(33.3333333333% - 20px);
}
        .title-sub{
                    flex-basis: 100%;

                font-size: 2em;
    font-weight: 300;
    text-transform: uppercase;
    flex-basis: auto;
    text-align: left;
    align-self: end;

        }
            .text-sub{
        flex-basis: 100%;
    align-self: end;
    font-size: 1.25em;
    }

    .text-subservicio,.lista-subservicio{
    align-self: end;
    font-size: 1.25em;
    }
    .sub-servicio{
    display: flex;
    flex-wrap: wrap;
    padding-top: 40px;
    gap: 20px;
    flex-basis:calc(33.333333333% - 40px);
    margin-left: 10px;
    padding-right:10px;
    border-right: 1px solid black;
    padding-bottom: 80px;  
      }

          .packs-subs-intro{flex-basis: calc(20%);}
    .packs-subs{flex-basis: calc(80% - 20px);}



.sub-servicio.azkena,.intro-servicio.azkena{
    border-right:0!important;
}
    .img-servicio{
    border-radius: 15px;
    object-fit: contain;
    align-items: end;
    width: 100%;
        }









/* General styles */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Main menu styles */
.menu-nagusia {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.7);
    padding: 10px;
    z-index: 1000;
}
.menu-nagusia ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 20px;
}
.menu-nagusia ul li {
    margin: 0;
}
.menu-nagusia ul li a {
    color: white;
    text-decoration: none;
    font-weight: bold;
}
.menu-nagusia ul li a:hover {
    text-decoration: underline;
}



/*-------------------------- 

CONTACT 

--------------------------*/


#comollegar{
    display:flex;flex-wrap:wrap;margin-top:150px;
}
.donde-estamos{
    flex-basis:20%;
}
.fachada{
    gap:20px;
    flex-basis:80%;
    display:flex;
}
.fachada img{
        flex-basis: calc(50% - 20px);
    width: calc(50% - 20px);
    border-radius: 20px;
}

.donde-estamos a{color:var(--iluna)}



.formulario{
    display: flex;
    flex-wrap: wrap;
    gap:20px;
}

    .texto-formulario{
                font-size: 4em;
        line-height: 105%;
        color: var(--iluna);
        font-weight: 200;
        display: flex;
    flex-wrap: wrap;
    align-items: start;
    justify-content: normal;
    height: 100%;
    flex-direction: column;

    }
        .texto-formulario,.formu-formulario{
        flex-basis: calc(50% - 20px);

    }

    .campo-nombre,.campo-apellido,{flex-basis:50%;width: 50%;padding: 20px;}
    .campo-email{flex-basis:100%;width:100%;padding: 20px;}




    .nf-error .ninja-forms-field{border-radius: 20px}
    .nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-field-element input:not([type=submit]), .nf-form-content textarea{

    background: black;
    border-radius: 20px !important;
    border: 1px solid white;
    padding: 10px 10px;
    color: rgba(50, 50, 50, 1);
}


    }
    .nf-error.field-wrap .nf-field-element:after{
       border-radius: 0px 18px 18px 0px;
    }
    .nf-error.field-wrap textarea.nf-field-element:after{
       border-radius: 0px 18px 0px 0px;
    }

    .nf-form-content label,.nf-field-label {
    font-size: 14px;
    line-height: 20px;
    color: white;
    text-transform: uppercase;}


    /* Selecciona los elementos de entrada y área de texto dentro de Ninja Forms cuando están en foco */
.nf-form-content .list-select-wrap .nf-field-element > div:focus-within,
.nf-form-content input:not([type=button]):focus,
.nf-form-content textarea:focus {
    background-color: #f0f8ff; /* Cambia el color de fondo */
    color: #333; /* Cambia el color del texto */
    border-color: #0073e6; /* Cambia el color del borde si es necesario */
    outline: none; /* Elimina el borde predeterminado del navegador */
    transition: background-color 0.3s ease, color 0.3s ease; /* Añade una transición suave */
}




.formu-formulario p{
font-size: 20px;
    line-height: 30px;
    margin-top: 10px;}



input[type="text"],textarea,input[type="email"],input[type="tel"]{

    border: 0;
    background: var(--iluna);
    padding: 5px 10px 5px 5px;
    font-size: 20px;
    border-radius: 0;
    display: block;
    user-select: none;
    -webkit-user-select: none;
    line-height: 22px;
    background: gainsboro;
    color: black;
    padding: 10px;
    font-family: 'Tipo';
    border-radius: 10px;
    font-weight:200;
        width: 100%;
}


/* Estilo para los select */
select {
    border: 0;
    background: var(--iluna, gainsboro);
    padding: 10px;
    font-size: 20px;
    border-radius: 10px;
    display: block;
    user-select: none;
    -webkit-user-select: none;
    line-height: 22px;
    color: white;
    font-family: 'Tipo';
    font-weight: 200;
    width: 100%;
}

/* Estilo para los radio buttons */
input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    border: 2px solid white;
    background: var(--iluna, gainsboro);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 10px;
    display: inline-block;
    position: relative;
    cursor: pointer;
}

input[type="radio"]:checked {
    background: white;
    border: 5px solid var(--iluna, gainsboro);
}

input[type="radio"]:focus {
    outline: none;
    box-shadow: 0 0 3px white;
}

/* Ajuste para etiquetas de radio */
.wpcf7-list-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}



/* Estilo para el input de tipo date */
input[type="date"] {
    border: 0;
    background: var(--iluna, gainsboro);
    padding: 10px;
    font-size: 20px;
    border-radius: 10px;
    display: block;
    user-select: none;
    -webkit-user-select: none;
    line-height: 22px;
    color: white;
    font-family: 'Tipo';
    font-weight: 200;
    width: 100%;
    appearance: none; /* Elimina el estilo por defecto del navegador */
}

/* Personalización adicional para navegadores */
input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    filter: invert(1); /* Ajusta los colores para combinar con un fondo oscuro */
}

/* Para mejorar la accesibilidad al hacer foco */
input[type="date"]:focus {
    outline: none;
    box-shadow: 0 0 3px white;
}

/* Ajuste en caso de un icono nativo mal posicionado */
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-clear-button {
    display: none;
}







 input[type="submit"].nf-element{
 text-decoration: none;
    padding: 10px 30px;
    border-radius: 50px;
    border: none;
    background:var(--argia);
    font-size: 14px;
    line-height: 20px;
    margin-top: 20px;
text-transform:uppercase;}
input[type="submit"]:hover,.btn:hover{background:white;color:#1d1d1b;
}




input[type=submit],.btn{
    background: var(--iluna);
    color: white;
    font-family: 'Tipo';
    font-size: 20px;
    border-radius: 60px;
    padding: 10px 15px;
    margin-top: 40px;
    line-height: 105%;
    text-transform:uppercase;
    text-decoration:none;
    border:1px solid var(--iluna);
}










.btn-white{    text-decoration: none;
    background: white!important;
    padding: 15px 30px;
    border-radius: 30px;
    color: #1d1d1b!important;
    font-family: 'Tipografia';
    font-size: 15px;
    border: none;
    margin-top: 20px;}
.btn-white:hover{ color: #1d1d1b!important;background: grey!important}




/*-------------------------- 

EQUIPO 

--------------------------*/

.colaborador{flex-basis:calc(25% - 20px);text-align:left;display:flex;flex-wrap:wrap;flex-direction:column}
                    .colaborador img{width: 100%;
    aspect-ratio: 1;
    border-radius: 20px;
    object-fit: cover;}
                    .especialidad{font-size: 15px;
    text-transform: uppercase;}
                    .nombre{font-size:20px;}
                    .cola-logo img{     border-radius: 200px;
    width: 100px;margin-bottom: 20px;
                    }

                    .cola-empresa{
                        flex-basis:100%;text-align:center;align-items: center;justify-content: center;margin-bottom: 30px;margin-top:50px
                    }
                    .cola-pro{flex-basis:100%;text-align:center;align-items: center;justify-content: center;margin-bottom: 30px;}
.colab-tit{
    flex-basis:100%;margin:auto;text-align:center;text-transform:uppercase;
}
.colab-section{
    display:flex;flex-wrap:wrap;margin-top:200px;
}

.colaboradores{

    display: flex
;
    flex-basis: 75%;
    flex-wrap: wrap;
    justify-content: start;
    margin-top: 0;
    align-content: start;
    gap: 20px;


}

/*-------------------------- 

FOOTER 

--------------------------*/
.based{
        text-align: right;
    font-size: 0.8em;
}
.based a{text-decoration:none;color:var(--iluna);opacity: 0.5;margin-right: 10px}
.logos img{float:left}
.logos{bottom:10px;width: 300px;margin:0 auto;display:block;right: 0;left: 0;text-align: center;}
footer{       padding: 20px;
    font-size: 18px;
    /* text-transform: uppercase; */
    height: auto;
    margin-top: 100px;
    padding-bottom: 20px;
    border-top: 1px solid var(--iluna);
    padding-top: 100px;}
.footer-single{position: fixed;padding-top: 100px;}
.intro-fot p{font-size: 50px;line-height: 60px;font-weight: bold}
.logos.hasiera{left:22vw!important;margin: 0}

.caja-footer{
        display: flex;
    align-items: start;
    justify-content: space-between;
    padding: 30px;
    margin-bottom: 50px;

    display: flex;flex-wrap: wrap;justify-content: space-between;
}



.caja-footer a{color:var(--iluna)}

.caja-1{
    color: white;margin-right: 50px;text-align: right
}
.caja-2{margin-right: 50px;

}

/* Fuerza la transición lineal para un movimiento continuo */
.fotoshome .swiper-wrapper {
  transition-timing-function: linear !important;
}


/* Estilos para móviles */
@media (max-width: 768px) {

    .colaboradores{
        flex-basis: 100%;
        justify-content:center;
    }
#menu-idioma{
    margin-left: unset!important;
    list-style-type: none;
}
#menu-list{
    margin-left: unset!important;
}
    /* Slider con altura máxima de 50vh */

.fotoshome {
  max-height: 50vh;
  overflow: hidden; /* Evita que el contenido se desborde */
}

/* Ajusta la altura de cada slide */
.fotoshome .swiper-slide {
  max-height: 50vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Asegura que las imágenes se adapten a la altura */
.fotoshome .swiper-slide img {
  max-height: 50vh;
  width: auto;
  height: 100%;
  object-fit: cover;
  display: block;
}





    .donde-estamos{
            flex-basis: 100%;
    }

    .fachada{
            gap: 20px;
    flex-basis: 100%;
    flex-wrap: wrap;
    display: flex
;
    margin-top: 20px;
    }

    .texto-formulario{
            flex-basis: 100%;    height: auto;    font-size: 2em;
    }

    .texto-formulario, .formu-formulario{flex-basis:100%}

    .partaide{
        flex-basis:100%;
    }
.pack .img-pack{
    font-size:38px;
}
    .pack{
        width:calc(100% - 0px)
    }
.texto-header{font-size:2em}
    #full-screen-menu #menu-list{
            list-style-type: none;
    display: flex
;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 20px;
    text-align: center;
    align-items: center;
    font-size: 30px;
    margin-bottom:40px;
    text-transform: uppercase;
    }

    #menu-list a{
        font-size:30px;
            padding: 5px 35px;
            border-radius: 100px;
    }

    .abitu-container{
        margin-top:77px
    }

    .texto-home{
            flex-basis: 100%;
    padding: 25px;
    padding-top: 50px;
    }

    .destacado{
        flex-basis: 100%;
        height: 40vh;
        width: 100%;
    }
.concert-tickets{
        flex: 1;
    text-align: center;
    padding-right: 0;
    font-size: 20px;
    text-transform: uppercase;
}
.btn-tickets{
        background-color: var(--argia);
    color: var(--iluna);
    padding: 7px 0px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    border-radius: 3px;
    transition: all 0.3s ease;
    display: block;
    border-radius: 25px;
    margin-top: 20px;
    margin-bottom: 30px;
    margin-left: 20px;
    margin-right: 20px;
}
.concert-location{
        flex-basis: 100%;
    text-align: left;
    padding-left: 20px;
}
    .concert-date {
    font-size: 1.5em;
    flex: 100%;
    text-align: right;
    margin-right: 20px;
}



    #conciertos-artista{order:7}
    .bideoak{display: none;}
.genero{
        text-transform: uppercase;
    font-size: 20px;
    margin: 10px auto;
    text-align: center;
}
.single-leyenda .genero{
    margin:0;
}

.single-leyenda{padding:10px;width:100%}

            .ordenagailuko-botoiak{display: none;}
        .artista-image {

            flex-basis: 100%;
            width: 100vw;
            height: 100vw;
            order: 1;
            width: 100%;
        }
        .artista-image img{width: 100%}
        .artista-header { order: 2; }
        .artista-content { order: 3; }
        .artistas-relacionados { order: 4; }
        .cajita{order:5}

        .single-artista-container .artista-header{display: block;height:auto;}
        .artista-header, .artista-image {
            flex-basis: 100%;
            text-align: center;
        }
        .artista-title {
            font-size: 70px;
            margin-bottom: 20px;
            color: #fff;
            font-family: 'Tituluak';
            text-transform: uppercase;
            line-height: 80%;
            text-align: center;
            margin-top: 20px;
        }
        .artista-image img {
            display: none;
        }
        .disco-links {
            flex-wrap: wrap;
            display: flex;
            margin-bottom: 20px;
            flex-basis: 100%;
        }
        .disco-links a {
            flex-basis: 100%;
            display: flex;
            padding: 10px 20px;
            margin: 0;
            color: white;
            text-decoration: none;
            border-radius: 15px;
            justify-content: space-between;
            align-items: center;
            text-align: center;
            border: 1px solid;
            height: 50px;
            margin-top: 20px;
        }
        .spotify-embed {
            display: none;
        }
        .biografia p {
            font-size: 20px;
            line-height: 26px;
            margin-bottom: 20px;
        }
.biografia{
        margin-top: 0;
    margin-left: 10px;
}
        .biografia, .biografia h2 {
            display: none;
        }
        .btn-bio.active {
            background-color: #ccc;
        }





    .artista-header, .artista-image{border-radius: 10px;}

        .artista-title {
        font-size: 70px;
        margin: 20px auto 0;
        color: #fff;
        font-family: 'Tituluak';
        text-transform: uppercase;
        line-height: 80%;
        text-align: center;
        margin-top: 20px;
    }


.artista-image{border-radius: 10px;}
    .elemento-1,.elemento-2,.elemento-3,.elemento-4,.elemento-5,.elemento-6,.elemento-7,.elemento-8,.elemento-9,.elemento-10,.elemento-11,.elemento-12,.elemento-13,.elemento-14 {
    flex-basis: 100%;
    padding: 0;
    margin: 0;
            margin-bottom: 40px;
}

    #site-navigation ul {
        flex-direction: column;
        position: absolute;
        top: 0px;
        left: 0;
        right: 0;
        background-color: var(--argia);
        display: none;
        padding: 20px;
        align-items: center;
        justify-content: center;
        height: 100vh;
        z-index: -1;
    }

    #site-navigation ul.show {
        display: flex;
    }

    .hamburger-menu {
        display: flex;
    }
}


.telefono{
    text-decoration: none;
    color: var(--iluna);
    border: 1px solid;
    border-radius: 100px;
    padding: 3px 7px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

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


        .telefono{transform:none;position: static;margin-left: 20px;}
}
/*MOVIL*/
    @media screen and (max-width:800px){


}

    @media screen and (max-width:481px) and (orientation:portrait) {

        .single-post-container h1{
            font-size:35px;
        }

        .texto-header {
        font-size: 1.5em;
    }
.ekipo-principal .texto-header{
            font-size: 1.5em;
flex-basis: 100%;
}

ul,p{
    font-size:1.2em
}
.ekipo-principal img{
    flex-basis:100%;width:100%;
}
.caja-2{
        margin-right: 0;
    flex-basis: 100%;
    margin-top: 50px;
    text-align: center;
}
.colaborador{
    flex-basis: calc(100% - 80px);
    text-align: center;
    display: flex
;
    flex-wrap: wrap;
    flex-direction: column;
    margin-bottom: 60px;
}
       .caja-1{
 color: white;
    margin-right: 0;
    text-align: center;
    flex-basis: 100%;}
.servicios-h4 .zerbitzua{
    flex-basis: 100%;
    height: 35vh;
}
.servicio-galeria{
    flex-wrap: wrap;padding-left:10px;padding-top: 0;
}
.servicio-img-50{
        border-radius: 5px;
    flex-basis: 100%;
    width: 100%;
}
.title-subservicio{flex-wrap: wrap;}

.title-subservicio p{
        flex-basis: 100%;
    margin-top: 13px;
}
.intro-servicio{
    border-bottom:0;
}
.sub-servicio{
        display: flex
;
    flex-wrap: wrap;
    padding-top: 0;
    gap: 20px;
    flex-basis: 100%;
    margin-left: 0;
    border-right: 0;
    padding-bottom: 40px;
}
.sub-servicio-t{
flex-basis: 100%;
    padding: 0px;
    padding-left:0;
    padding-top: 20px;}
.pastilla-servicio{
    margin-left: 0;
}
.servicio-content{padding:0;}

.intro-servicio{font-size:1.5em;margin-left: 10px;}

.single-artista-container{
        padding: 15px;
}










        .vc_custom_1694417241767{padding-bottom:0!important}
        #caja-fotos{padding:20px!important}
        nav.menu {
    width: 100%;
    float: none;
    text-align: center;
}
        .menu ul li {
    display: inline-block;
    text-decoration: none;
    padding: 10px 10px;
}
.icon-eskubi{
    left: 79%;
    top: -35px;
}.icon-galeria figure div img {
    width: 21vw;}
        .fot-4{    flex-basis: 100%;
    margin: auto;
    text-align: center;}
    .fot-5{flex-basis: 70%;
    text-align: center;
    margin: auto;}
        .contacto{max-width: 100%}
      
.titulo-2 {
    font-size: 20px;
    line-height: 36px;
}
.vc_custom_1694418695024,.vc_custom_1694511821094,.vc_custom_1694503029461,.vc_custom_1696418932258{padding:20px!important}
.caja-faq{margin-top:0;}
.faq{flex-basis: 100%;    margin-top: 40px;}

.accordion-menu {
    font-size: 28px;}

:root {
    --tamaina1: 7vw;}

.fot-1, .fot-2, .fot-3 {
    flex-basis: 100%;
    text-align: center;
}

}