/* ===========================================
   BLOCK VISITAS - VERSIÓN FINAL COMPACTA
   =========================================== */
.site-content .content-area {
    width: 100%;
}
.visitas-hero img{
   
    height: auto;
    max-width: 100%;
    padding-left: 35px;

}
.block-visitas {
    width: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    background-color: #fff;
    font-family: "RST Thermal", sans-serif; /* SE APLICA A TODO EL BLOQUE */
}

/* Contenedor Principal */
.block-visitas .visitas-container {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 40px; /* Reducido de 60px */
    box-sizing: border-box;
    padding-bottom: 50px;
}

/* ===========================================
   INTRO SECTION (Recorrido Arquitectónico)
   =========================================== */
.block-visitas .visitas-intro {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 60px;
    margin-bottom: 40px; /* Reducido */
}

.block-visitas .visitas-intro__title h2 {
    font-size: 51px;
    font-weight: 400;
    line-height: 0.9; /* Compacto */
    margin: 0;
    color: #000;
}

.block-visitas .visitas-intro__content {
    font-size: 25.5px;
    line-height: 1.4;
    color: #000;
}

/* ===========================================
   ACORDEONES (Horario, Admisión, etc.)
   =========================================== */
.block-visitas .visitas-acordeones {
    width: 100%;
    margin-bottom: 40px;
}

.block-visitas .acordeon {
    border-top: 1px solid #000;
    width: 100%;
}

/* ELIMINA LÍNEA SUPERIOR DE HORARIO */
.block-visitas .acordeon:first-child {
    border-top: none;
}

.block-visitas .acordeon:last-child {
    border-bottom: 1px solid #000;
}

.block-visitas .acordeon__header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0; /* MUY COMPACTO */
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
}

.block-visitas .acordeon__titulo {
    font-family: "RST Thermal", sans-serif;
    font-size: 51px;
    font-weight: 400;
    color: #000;
    margin: 0;
    line-height: 1.2; /* TEXTO PEGADO A LA LÍNEA */
}

/* Lógica de revelación */
.block-visitas .acordeon__contenido {
    font-family: "RST Thermal", sans-serif;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}

.block-visitas .acordeon.is-open .acordeon__contenido {
    max-height: 800px;
}

/* REDUCCIÓN DE ESPACIO AL ABRIR PERSIANAS */
.block-visitas .acordeon__inner {
    padding: 10px 0 15px 0; /* Espacio mínimo abajo */
    font-size: 25.5px;
    line-height: 1.3;
    color: #000;
}


/* ===========================================
   ESTILO DE MAPA Y DIRECCIÓN (IMAGEN 2)
   =========================================== */
.block-visitas .visitas-mapa {
    display: flex;             /* Alinea imagen y texto en la misma fila */
    align-items: flex-end;     /* Alinea la dirección a la base inferior del mapa */
    gap: 30px;                 /* Espacio horizontal entre el mapa y el texto */
    margin: 20px 0 60px 0;     /* Margen superior e inferior */
}

.block-visitas .visitas-mapa__imagen {
    flex: 0 0 auto;            /* Evita que el contenedor del mapa se deforme */
}

.block-visitas .visitas-mapa__imagen img {
    width: 320px;              /* Ancho del mapa ajustado a la referencia */
    height: auto;
    display: block;
    border-radius: 0;          /* Asegura bordes rectos como en la imagen */
}

.block-visitas .visitas-mapa__direccion {
    font-size: 22px;           /* Tamaño de texto similar a la imagen 2 */
    line-height: 1.2;
    color: #000;
    max-width: 450px;          /* Limita el ancho para forzar el salto de línea */
}

/* Ajuste para móviles */
/* ===========================================
   AJUSTES ESPECÍFICOS PARA MÓVILES (768px o menos)
   =========================================== */
@media (max-width: 768px) {
    
    /* 1. Ocultar el Título de la página/entrada y el Header del post */
    .entry-header, 
    .entry-title, 
    header.entry-header {
        display: none !important;
    }

   .block-visitas .visitas-mapa__direccion {
        font-size: 18.7px;
    }   
    .visitas-intro__content p{
        font-size: 18.7px;
    }

    /* 2. Corregir el padding de la imagen hero en móvil */
    .visitas-hero img {
        height: 100%;
        max-width: 100%;
        padding-top:15px;
        padding-left: 0 !important; /* Forzamos a 0 para quitar los 35px */
    }

    /* 3. Ajustes de contenedores para que no tengan márgenes laterales excesivos */
    .block-visitas .visitas-container {
        padding: 20px; /* Reducimos el padding de 40px a 20px en móvil */
        padding-bottom: 60px;
    }

    /* 4. Ajuste del Mapa para que ocupe el ancho total */
    .block-visitas .visitas-mapa {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .block-visitas .visitas-mapa__imagen img {
        width: 100%; /* El mapa se adapta al ancho del móvil */
        max-width: 100%;
    }

  

    .faq-item__pregunta span {
        font-size: 25.5px;
    }

    /* 5. Ajuste de textos grandes para que no se corten */
    .block-visitas .visitas-intro__title h2,
    .block-visitas .acordeon__titulo,
    .block-visitas .visitas-faq__titulo {
        font-size: 51px; /* Tamaño más legible en vertical */
        line-height: 1.1;
    }
    /* 1. Eliminamos márgenes laterales que empujan el bloque fuera del borde */
    .block-visitas .visitas-faq {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100%;
        padding: 0 15px; /* Usamos un padding pequeño para que el texto no toque el borde */
        box-sizing: border-box;
    }

    /* 2. Reducimos el espacio (gap) entre preguntas y respuestas */
    .block-visitas .visitas-faq__grid {
        display: block; /* Cambiamos a block para evitar problemas de desbordamiento de grid */
        gap: 0;
    }

    /* 3. Ajustamos el header de la pregunta para que el texto y el icono quepan */
    .block-visitas .faq-item__pregunta {
        gap: 10px;
        align-items: flex-start; /* Alinea el icono arriba si la pregunta es muy larga */
    }

    .block-visitas .faq-item__pregunta span:first-child {
        font-size: 18.7px; /* Reducimos un poco el tamaño para que no fuerce el ancho */
        flex: 1; /* Esto obliga al texto a ocupar el espacio sobrante sin empujar al icono */
    }

    /* 4. Quitamos el padding lateral de la respuesta para ganar espacio */
    .block-visitas .faq-item__respuesta {
        padding-left: 0; 
    }
}

/* ===========================================
   PREGUNTAS FRECUENTES (FAQ)
   =========================================== */
.block-visitas .visitas-faq {
    width: 100%;
    margin-top: 40px;
    margin-left: 25px;
    margin-right: 25px;
}

.block-visitas .visitas-faq__titulo {
    font-size: 51px;
    font-weight: 400;
    margin-bottom: 30px;
    color: #000;
}

.block-visitas .visitas-faq__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 80px;
}

.block-visitas .faq-item__pregunta {
    width: 100%;
    display: flex;
    font-family: "RST Thermal", sans-serif;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    background: transparent !important;
    border: none;
    cursor: pointer;
}

.block-visitas .faq-item__pregunta span:first-child {
    font-size: 20px;
    color: #000;
    text-align: left;
    line-height: 1.1;
}

/* Icono Rosado */
.block-visitas .faq-item__icon {
    width: 24px;
    height: 24px;
    background-color: #F57E98;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.block-visitas .faq-item__icon::after {
    content: '';
    width: 6px;
    height: 6px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
    margin-top: -3px;
}

/* REDUCCIÓN DE ESPACIO AL ABRIR PREGUNTAS */
.block-visitas .faq-item__respuesta {
    font-family: "RST Thermal", sans-serif;
    max-height: 0;
    overflow: hidden;
    padding-left: 15px;
    transition: max-height 0.3s ease-in-out;
}

.block-visitas .faq-item.is-open .faq-item__respuesta {
    max-height: 300px;
}

.block-visitas .faq-item.is-open .faq-item__icon {
    transform: rotate(180deg);
}

.block-visitas .faq-item__respuesta-inner {
    padding: 5px 0 10px 0; /* Espacio mínimo abajo */
    font-size: 18px;
    color: #000;
}

/* Enlaces en respuestas FAQ */
.block-visitas .faq-item__respuesta-inner a {
    color: #000;
    text-decoration: underline;
    transition: color 0.3s ease;
}

.block-visitas .faq-item__respuesta-inner a:hover,
.block-visitas .faq-item__respuesta-inner a:active,
.block-visitas .faq-item__respuesta-inner a:focus {
    color: #F57E98;
}

/* ===========================================
   RESPONSIVE
   =========================================== */
@media (max-width: 1024px) {
    .block-visitas .visitas-intro { grid-template-columns: 1fr; }
    .block-visitas .visitas-faq__grid { grid-template-columns: 1fr; }
    .block-visitas .acordeon__titulo, .block-visitas .visitas-faq__titulo { font-size: 40px; }
}
.site-header{
    display: none;
}

/* ===========================================
   TABLA DE ADMISIÓN SIN BORDES
   =========================================== */
.block-visitas table {
    border: none !important;
    border-collapse: collapse;
    background-color: #ffffff;
    width: auto;                 /* Ancho automático para juntar columnas */
}

.block-visitas table td {
    border: none !important;
    vertical-align: middle;
    text-align: left;
    padding: 8px 15px 8px 0;     /* Reducido el espacio derecho */
    font-size: 25.5px;
    line-height: 1;
    height: auto !important;
}

/* Primera columna con bullet */
.block-visitas table td:first-child {
    position: relative;
    padding-left: 25px;
    white-space: nowrap;         /* Evita saltos de línea innecesarios */
}

.block-visitas table td:first-child::before {
    content: "•";
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    color: #000;
}

/* Oculta bullet en filas vacías */
.block-visitas table td:first-child:empty::before {
    content: none;
}

/* Segunda columna (precios) */
.block-visitas table td:last-child {
    padding-left: 40px;          /* Espacio controlado entre columnas */
    white-space: nowrap;
}

/* Quita estilos de lista si aún usas ul/li */
.block-visitas table ul {
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: 1;
}

.block-visitas table li {
    margin: 0;
    padding: 0;
}

/* Fuerza altura mínima en las filas */
.block-visitas table tr {
    height: auto !important;
}

/* ===========================================
   TABLA - VERSIÓN MÓVIL
   =========================================== */
@media (max-width: 768px) {
    .block-visitas table {
        width: 100%;
    }
    
    .block-visitas table td {
        font-size: 18.7px;
        padding: 6px 10px 6px 0;
    }
    
    .block-visitas table td:first-child {
        padding-left: 20px;
        white-space: normal;     /* Permite saltos de línea en móvil */
    }
    
    .block-visitas table td:last-child {
        padding-left: 20px;
        text-align: right;       /* Precios a la derecha en móvil */
    }
    .block-visitas .acordeon__inner
    {
        padding: 10px 0 15px 0;
        font-size: 18.7px;
        
        color: #000;
    }
}

/* ===========================================
   INFORMACIÓN DE TRANSPORTE / CÓMO LLEGAR
   =========================================== */
.block-visitas .transporte-info {
    font-size: 25.5px;
    line-height: 1.4;
}

.block-visitas .transporte-info p {
    margin: 0;
    
}

/* Títulos con bullet (Metro, Por auto) */
.block-visitas .transporte-titulo {
    position: relative;
    padding-left: 35px;          /* Aumentado de 25px a 35px */
    margin-top: 15px !important;
}

.block-visitas .transporte-titulo:first-child {
    margin-top: 0 !important;
}

.block-visitas .transporte-titulo::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #000;
}

/* Rutas indentadas SIN bullet */
.block-visitas .transporte-ruta {
    padding-left: 35px;          /* Igual que el título para alinear */
}

.block-visitas .transporte-ruta span {
    display: inline-block;
    min-width: 130px;
}

/* Dirección indentada SIN bullet */
.block-visitas .transporte-direccion {
    padding-left: 35px;          /* Igual que el título para alinear */
}

/* ===========================================
   TRANSPORTE - VERSIÓN MÓVIL
   =========================================== */
@media (max-width: 768px) {
    .block-visitas .transporte-info {
        font-size: 18.7px;
    }
    
    .block-visitas .transporte-titulo,
    .block-visitas .transporte-ruta,
    .block-visitas .transporte-direccion {
        padding-left: 30px;
    }
    
    .block-visitas .transporte-ruta span {
        min-width: 110px;
    }
}

/* ========================================
   CORRECCIÓN PARA LAPTOPS Y FULL HD (1025px - 1920px)
   Página: Visitas
   ======================================== */

@media (min-width: 1025px) and (max-width: 1920px) {

    
    /* 1. SEPARACIÓN DEL CONTENIDO RESPECTO AL MENÚ
       Añadimos margen superior al contenedor para que no pegue con el nav */
    .block-visitas {
        margin-top: 100px !important;
    }

    /* 2. REDUCCIÓN DE MÁRGENES LATERALES
       Pasamos de 40px a 20px para ganar amplitud horizontal */
    .block-visitas .visitas-container {
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-top: 0;
    }

    /* 3. EXPANSIÓN DE LA IMAGEN HERO
       Eliminamos el padding de 35px para que la imagen se vea ancha
       como en la segunda imagen de referencia */
    .visitas-hero img {
        padding-left: 0 !important;
        width: 100%;
        object-fit: fi;
        margin-top: 10px;
       
    }

    /* 4. AJUSTE DE LA SECCIÓN INTRO (Recorrido Arquitectónico)
       Reducimos el gap para que el texto aproveche mejor el espacio */
    .block-visitas .visitas-intro {
        gap: 40px;
        margin-bottom: 60px;
    }

    /* 5. AJUSTE DE FAQ (Para que no se vea comprimido) */
    .block-visitas .visitas-faq {
        margin-left: 0;
        margin-right: 0;
    }

    .block-visitas .visitas-faq__grid {
        gap: 15px 50px; /* Reducción del espacio entre columnas */
    }

    /* 6. MAPA Y DIRECCIÓN
       Ajuste para que el mapa y la dirección se vean alineados a la izquierda */
    .block-visitas .visitas-mapa {
        margin-top: 40px;
        gap: 40px;
    }
}

/* ============================================================
   AJUSTES PARA PANTALLAS GRANDES Y FULL SCREEN (Desktop)
   ============================================================ */

@media (min-width: 1025px) {

    /* 1. CONTENEDOR MÁS COMPACTO Y CENTRADO
       Esto arregla que el contenido se vea muy pegado a los bordes. 
       Al poner max-width, se crea espacio blanco a los lados automáticamente. */
    .block-visitas .visitas-container {
        max-width: 1440px; /* Puedes ajustar a 1600px si quieres más ancho */
        margin: 0 auto;    /* Esto centra el bloque */
        padding-left: 60px !important;
        padding-right: 60px !important;
    }

    /* 2. ARREGLO DE LA IMAGEN PRINCIPAL (HERO) */
    .visitas-hero img {
        width: 100%;
        display: block;
        padding-left: 0 !important; /* Quitamos el padding asimétrico */
        
        /* Esto separa la imagen del texto de "Recorrido Arquitectónico" */
        margin-bottom: 80px; 
        
        /* Truco para que no se deforme: */
        object-fit: cover; 
        object-position: center;
    }

    /* 3. ARREGLO DEL MAPA (Imagen 3 - Compacta al centro) */
    .block-visitas .visitas-mapa {
        /* Separación superior fuerte */
        margin-top: 100px; 
        margin-bottom: 80px;
        
        /* Centrado de los elementos (mapa y dirección) */
        justify-content: center;
        
        /* Padding lateral para compactar visualmente al centro */
        padding-left: 10%;
        padding-right: 10%;
    }
}

/* ============================================================
   MEDIA QUERY ESPECIAL: PANTALLAS FULL / MUY GRANDES (ej. > 1600px)
   Para que la imagen se vea alta como en el Home
   ============================================================ */

@media (min-width: 1600px) {
    
    .visitas-hero img {
        /* Hacemos la imagen más alta en pantallas grandes */
        height: 75vh; /* Ocupa el 75% del alto de la ventana */
        max-height: 900px; 
    }

    .block-visitas .visitas-container {
        /* En pantallas gigantes, damos aún más aire a los lados */
        max-width: 1600px; 
        padding-left: 100px !important;
        padding-right: 100px !important;
    }

    /* Hacemos el mapa un poco más grande en pantallas gigantes para compensar */
    .block-visitas .visitas-mapa {
        transform: scale(1.1); 
        margin-top: 120px;
    }
}

/* REDUCCIÓN DE ESPACIO AL ABRIR PREGUNTAS */
.block-visitas .faq-item__respuesta {
    font-family: "RST Thermal", sans-serif;
    max-height: 0;
    overflow: hidden;
    padding-left: 15px;
    padding-right: 60px; /* <--- AQUI: Agregamos 60px de margen interno derecho */
    transition: max-height 0.3s ease-in-out;
}