* { box-sizing: border-box; }

:root { --fondo-sitio: #d9f2ff; }

html { font-family: 'Libre Franklin', Arial, sans-serif; }

body { margin: 0; background: var(--fondo-sitio); color: #111; }

img { -webkit-user-drag: none; -webkit-touch-callout: none; user-select: none; }

.sitio { width: min(100%, 1024px); margin: 0 auto; }

.encabezado { width: 100%; }

.marca { display: block; padding-top: 44px; padding-bottom: 41px; }

.marca img { display: block; width: 100%; height: auto; }

.navegacion { border-top: 1px solid #dedee2; }

.menu { display: flex; align-items: center; justify-content: flex-start; gap: 29px; min-height: 62px; margin: 0; padding: 0 5px; list-style: none; }

.menu a { display: block; color: #111; font-size: 14px; font-weight: 700; line-height: 1.3; text-decoration: none; white-space: nowrap; }

.menu a:hover, .menu a:focus-visible, .menu a[aria-current="page"] { color: #cc3636; }

.menu-boton { display: none; }

.carrusel { margin-top: 28px; }

.carrusel-imagenes { position: relative; aspect-ratio: 1024 / 600; overflow: hidden; background: #171717; }

.diapositiva { display: block; width: 100%; height: 100%; object-fit: cover; }

.diapositiva[hidden] { display: none; }

.carrusel-flecha { position: absolute; z-index: 1; top: 50%; display: grid; width: 44px; height: 44px; place-items: center; padding: 0; border: 0; border-radius: 50%; background: #0008; cursor: pointer; transform: translateY(-50%); }

.carrusel-flecha:hover { background: #000b; }

.carrusel-flecha:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

.carrusel-flecha.anterior { left: 18px; }

.carrusel-flecha.siguiente { right: 18px; }

.carrusel-flecha span { display: block; width: 13px; height: 13px; border-top: 3px solid #fff; border-right: 3px solid #fff; }

.carrusel-flecha.anterior span { margin-left: 5px; transform: rotate(-135deg); }

.carrusel-flecha.siguiente span { margin-right: 5px; transform: rotate(45deg); }

.carrusel-puntos { display: flex; justify-content: center; align-items: center; gap: 12px; padding: 16px 0 4px; }

.carrusel-punto { width: 11px; height: 11px; padding: 0; border: 0; border-radius: 50%; background: #888; cursor: pointer; }

.carrusel-punto.activo { background: #191919; }

.carrusel-punto:focus-visible { outline: 2px solid #111; outline-offset: 4px; }

.accesos { display: flex; flex-wrap: wrap; justify-content: space-around; align-items: flex-start; gap: 24px; margin: 48px 0 60px; }

.acceso { display: block; width: 300px; max-width: calc(100% - 32px); }

.acceso img { display: block; width: 100%; height: auto; }

.acceso:hover { opacity: .88; }

.acceso:focus-visible { outline: 2px solid #111; outline-offset: 4px; }

.historia { padding: 0 12px 72px; color: #202126; font-size: 20px; line-height: 1.25; }

.historia-introduccion { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: start; gap: 28px; }

.historia h2 { margin: 0 0 22px; color: #933a65; font-size: 22px; font-weight: 700; line-height: 1.3; }

.historia p { margin: 0; }

.historia-bloque + .historia-bloque { margin-top: 24px; }

.historia-imagen { display: block; width: 180px; max-width: 100%; height: auto; }

.historia-beneficios { display: grid; grid-template-columns: minmax(0, 1fr) 480px; align-items: center; gap: 24px; margin-top: 50px; }

.historia-beneficios p + p { margin-top: 22px; }

.historia-beneficios-imagen { display: block; width: 100%; height: auto; }

.pie { padding: 20px 12px; border-top: 1px solid #dedee2; color: #555; text-align: center; font-size: 13px; line-height: 1.5; }

.pie p { margin: 0; }

.musica-control { position: fixed; z-index: 1001; right: max(18px, env(safe-area-inset-right)); top: max(18px, env(safe-area-inset-top)); display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 12px 16px; border: 1px solid #ffffff60; border-radius: 30px; background: #080e70; color: #fff; box-shadow: 0 4px 16px #080e7033; font: 600 13px 'Libre Franklin', Arial, sans-serif; cursor: pointer; }

.musica-control:hover { background: #23298c; }

.musica-control:focus-visible { outline: 3px solid #933a65; outline-offset: 4px; }

.musica-barras { display: flex; align-items: center; justify-content: center; gap: 3px; width: 32px; height: 26px; }

.musica-barras span { display: block; width: 4px; height: 24px; border-radius: 3px; background: #d9f2ff; transform: scaleY(.2); }

.musica-control.reproduciendo .musica-barras span { animation: musica-onda .85s ease-in-out infinite alternate; }

.musica-control.reproduciendo .musica-barras span:nth-child(2) { animation-duration: .56s; animation-delay: -.3s; }

.musica-control.reproduciendo .musica-barras span:nth-child(3) { animation-duration: .72s; animation-delay: -.5s; }

.musica-control.reproduciendo .musica-barras span:nth-child(4) { animation-duration: .48s; animation-delay: -.2s; }

.musica-control.reproduciendo .musica-barras span:nth-child(5) { animation-duration: .66s; animation-delay: -.4s; }

@keyframes musica-onda {
    0% { transform: scaleY(.2); }
    45% { transform: scaleY(.65); }
    100% { transform: scaleY(1); }
}

.quienes-somos { padding: 18px 10px 70px; }

.quienes-somos h1 { margin: 0 0 22px; color: #10156e; font-size: 24px; font-weight: 700; line-height: 1.25; }

.quienes-somos p { margin: 0; color: #790000; font-size: 17px; line-height: 1.25; }

.quienes-somos-imagen { display: block; width: 849px; max-width: 100%; height: auto; margin: 50px auto 0; }

.quienes-misterio { display: grid; grid-template-columns: minmax(0, 1fr) 473px; gap: 30px; align-items: start; margin-top: 60px; }

.quienes-cita { max-width: 460px; padding-top: 36px; }

.quienes-somos .quienes-cita { font-size: 20px; line-height: 1.2; }

.quienes-vida { width: 410px; max-width: 100%; margin: 0; justify-self: end; }

.quienes-vida img { display: block; width: 100%; height: auto; }

.quienes-vida figcaption { margin-top: 54px; color: #7138a0; font-size: 18px; line-height: 1.3; text-align: center; }

.ensenanzas { padding: 38px 10px 72px; }

.ensenanzas-intro { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 35px; align-items: start; }

.ensenanzas h1 { margin: 20px 0 50px; color: #10156e; font-size: 22px; line-height: 1.3; font-weight: 700; }

.ensenanzas-lista { display: flex; flex-direction: column; gap: 52px; margin: 0; padding: 0; list-style: none; color: #790000; font-size: 20px; line-height: 1.25; }

.ensenanzas-danzas img { display: block; width: 100%; height: auto; }

.ensenanzas-video { position: relative; width: 100%; height: 315px; margin-top: 20px; overflow: hidden; background: #111; }

.video-portada { position: absolute; inset: 0; display: block; color: #fff; }

.video-portada > img { display: block; width: 100%; height: 100%; object-fit: cover; }

.video-titulo { position: absolute; top: 0; right: 0; left: 0; padding: 12px 14px; background: linear-gradient(#000d, #0000); font-size: 17px; font-weight: 700; line-height: 1.2; }

.video-titulo small { display: block; margin-top: 4px; font-size: 11px; font-weight: 400; }

.video-play { position: absolute; top: 50%; left: 50%; width: 66px; height: 46px; border-radius: 12px; background: #f03; transform: translate(-50%, -50%); }

.video-play::after { content: ''; position: absolute; top: 13px; left: 26px; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 17px solid #fff; }

.video-enlace { position: absolute; right: 10px; bottom: 10px; z-index: 2; padding: 5px 8px; background: #000b; color: #fff; font-size: 12px; font-weight: 700; text-decoration: none; }

.ensenanzas-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.cuarto-camino-intro { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 50px; align-items: start; margin-top: 90px; }

.cuarto-camino-intro > img { display: block; width: 100%; height: auto; }

.cuarto-camino-texto { color: #10156e; font-size: 20px; line-height: 1.2; }

.cuarto-camino-texto p { margin: 25px 0 28px; }

.cuarto-camino-texto ol { display: flex; flex-direction: column; gap: 26px; margin: 0; padding: 0; color: #790000; list-style: none; counter-reset: faceta; }

.cuarto-camino-texto li { counter-increment: faceta; }

.cuarto-camino-texto li::before { content: counter(faceta) ') '; }

.cuarto-camino-equilibrio { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 50px; align-items: start; margin-top: 55px; }

.cuarto-camino-equilibrio p { margin: 20px 0 0; color: #10156e; font-size: 20px; line-height: 1.25; }

.cuarto-camino-equilibrio p + p { margin-top: 28px; }

.cuarto-camino-equilibrio img { display: block; width: 100%; height: auto; }

.ensenanzas-citas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 50px; align-items: start; margin-top: 65px; }

.ensenanzas-citas img { display: block; width: 100%; height: auto; }

.actividades { padding: 50px 12px 72px; }

.actividades-galeria { display: block; width: 961px; max-width: 100%; height: auto; margin: 0 auto; }

.actividades-texto { margin-top: 68px; }

.actividades h1 { margin: 0 0 24px; color: #933a65; font-size: 24px; font-weight: 700; line-height: 1.3; }

.actividades p { margin: 0; color: #202126; font-size: 20px; line-height: 1.25; }

.actividades p + p { margin-top: 26px; }

.actividades-cita { display: block; width: 100%; height: auto; margin-top: 55px; }

.libros-pagina { padding: 65px 12px 80px; }

.libros-pagina h1, .libros-subtitulo { margin: 0; color: #080e70; font-size: 40px; font-weight: 400; line-height: 1.2; }

.libros-subtitulo { margin-top: 25px; margin-bottom: 48px; }

.libro-fila { display: grid; align-items: start; gap: 48px; padding-bottom: 65px; margin-bottom: 90px; border-bottom: 1px solid #e8e8e8; }

.libro-fila.portada-izquierda { grid-template-columns: 165px minmax(0, 1fr); }

.libro-fila.portada-derecha { grid-template-columns: minmax(0, 1fr) 165px; }

.libro-portada { display: block; width: 165px; max-width: 100%; height: auto; }

.libro-contenido { padding-top: 22px; }

.libro-contenido h3 { margin: 0 0 24px; color: #0b3766; font-size: 27px; font-weight: 400; line-height: 1.2; }

.libro-contenido p { margin: 0; font-size: 20px; line-height: 1.25; }

.libro-contenido p + p { margin-top: 28px; }

.texto-naranja p { color: #ff6500; }

.texto-negro h3, .texto-negro p { color: #191919; }

.texto-verde p { color: #103b13; }

.libros-cds { margin: -35px 0 0; color: #0b3766; font-size: 27px; font-weight: 400; line-height: 1.3; }

.biografias { padding: 20px 10px 75px; }

.biografia { display: flow-root; color: #a33600; font-size: 20px; line-height: 1.22; }

.biografia + .biografia { margin-top: 28px; padding-top: 26px; border-top: 1px solid #e6e6e6; }

.biografia-retrato { float: left; display: block; max-width: 35%; height: auto; margin: 18px 26px 18px 0; }

.biografia h1, .biografia h2 { margin: 0; color: #080e70; font-size: 21px; font-weight: 700; line-height: 1.2; }

.biografia p { margin: 0; }

.biografia .bio-separado { margin-top: 25px; }

.biografia-banner { clear: both; display: block; width: 685px; max-width: 100%; height: auto; margin: 30px auto 26px; }

.biografia-roja { color: #820000; }

.biografia-roja > .bio-separado { clear: both; }

.biografia-obras { clear: both; padding-top: 25px; }

.biografia-obras p + p { margin-top: 45px; }

.galeria { padding: 30px 12px 65px; }

.galeria h1 { margin: 0 0 30px; color: #080e70; font-size: 36px; font-weight: 700; line-height: 1.25; text-align: center; }

.galeria-retratos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }

.galeria-miniatura { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #b4cbd7; cursor: zoom-in; }

.galeria-miniatura img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }

.galeria-miniatura:hover img { transform: scale(1.04); }

.galeria-miniatura:focus-visible { outline: 3px solid #080e70; outline-offset: 3px; }

.galeria-vacia { margin: 0; font-size: 18px; }

.galeria-visor[hidden] { display: none; }

.galeria-visor { position: fixed; z-index: 1002; inset: 0; display: flex; align-items: center; justify-content: center; padding: 55px 18px 30px; background: #000e; }

.galeria-visor-abierto { overflow: hidden; }

.galeria-visor-contenido { display: flex; flex-direction: column; align-items: center; max-width: 100%; max-height: 100%; margin: 0; }

.galeria-visor-contenido img { display: block; width: auto; max-width: 100%; height: auto; max-height: calc(100dvh - 115px); object-fit: contain; box-shadow: 0 8px 30px #0008; }

.galeria-contador { margin-top: 13px; color: #fff; font-size: 14px; }

.galeria-cerrar, .galeria-navegar { position: absolute; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: #0009; color: #fff; font-family: Arial, sans-serif; cursor: pointer; }

.galeria-cerrar:hover, .galeria-navegar:hover { background: #000d; }

.galeria-cerrar:focus-visible, .galeria-navegar:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

.galeria-cerrar { top: 14px; right: 18px; font-size: 36px; line-height: 1; }

.galeria-navegar { top: 50%; font-size: 48px; line-height: 1; transform: translateY(-50%); }

.galeria-anterior { left: 14px; }

.galeria-siguiente { right: 14px; }

.contacto { padding: 20px 10px 55px; }

.contacto-mapa { position: relative; display: block; width: 100%; aspect-ratio: 1020 / 390; overflow: hidden; background: #f3f3f3; }

.contacto-mapa img { display: block; width: 101.765%; max-width: none; height: auto; transform: translate(-.963%, -3.262%); }

.contacto-mapa:focus-visible { outline: 2px solid #0b3766; outline-offset: 3px; }

.contacto-columnas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 50px; margin-top: 78px; }

.contacto-formulario { min-width: 0; }

.area-preguntas { padding: 40px 10px 55px; }

.area-preguntas .contacto-formulario { max-width: 640px; margin: 0 auto; }

.contacto-formulario h1 { margin: 0; color: #080e70; font-size: 26px; font-weight: 400; line-height: 1.25; }

.contacto-preguntas { margin: 26px 0 24px; color: #080e70; font-size: 12px; line-height: 1.4; }

.contacto-formulario h2 { margin: 0 0 26px; color: #080e70; font-size: 25px; font-weight: 400; line-height: 1.25; }

.contacto-campo { margin-bottom: 28px; }

.contacto-campo label { display: block; margin-bottom: 3px; color: #3b3b3b; font-size: 13px; line-height: 1.2; }

.contacto-campo input:not([type="date"]), .contacto-campo textarea { display: block; width: 100%; padding: 10px 12px; border: 1px solid #dedede; border-radius: 2px; background: #fff; color: #111; font: 16px 'Libre Franklin', Arial, sans-serif; }

.contacto-campo input:not([type="date"]) { height: 47px; }

.contacto-fecha { margin-bottom: 22px; }

.contacto-fecha input { max-width: 100%; min-height: 26px; font: 13px 'Libre Franklin', Arial, sans-serif; }

.contacto-mensaje { margin-bottom: 35px; }

.contacto-mensaje textarea { min-height: 236px; resize: vertical; }

.contacto-trampa { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.contacto-enviar { display: block; width: 100%; min-height: 44px; border: 0; border-radius: 2px; background: #df3033; color: #fff; font: 700 11px 'Libre Franklin', Arial, sans-serif; cursor: pointer; }

.contacto-enviar:hover, .contacto-enviar:focus-visible { background: #c62a2d; }

.contacto-enviar:disabled { opacity: .6; cursor: not-allowed; }

.contacto-estado { margin: 0 0 20px; padding: 12px; font-size: 14px; line-height: 1.4; }

.contacto-estado.exito { background: #e8f5e9; color: #215e29; }

.contacto-estado.error { background: #fff0f0; color: #9a1d1d; }

.contacto-datos { color: #0b3766; font-size: 20px; line-height: 1.25; }

.contacto-datos h2 { margin: 0; color: #0b3766; font-size: 20px; font-weight: 400; line-height: 1.25; }

.contacto-datos p { margin: 0 0 5px; }

.contacto-datos .contacto-direccion { color: #111; }

.contacto-datos a { color: inherit; text-decoration: none; }

.contacto-datos a:hover, .contacto-datos a:focus-visible { text-decoration: underline; }

.pie-visitas { margin-bottom: 20px; color: #0b3766; }

.pie-digitos { display: flex; justify-content: center; gap: 2px; margin-top: 8px; }

.pie-digitos span { display: grid; width: 24px; height: 25px; place-items: center; border-radius: 5px; background: #050505; color: #fff; font-size: 20px; line-height: 1; }

.seminarios { display: grid; grid-template-columns: 481px minmax(0, 1fr); align-items: start; gap: 24px; padding: 40px 6px 55px; }

.seminarios img { display: block; max-width: 100%; height: auto; }

.seminarios-cartel { width: 481px; }

.seminarios-adicional { width: 100%; }

@media (max-width: 900px) {
    .menu { flex-wrap: wrap; justify-content: center; column-gap: 22px; row-gap: 15px; padding: 18px; }
    .quienes-misterio { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .ensenanzas-intro { grid-template-columns: minmax(0, 1fr) 290px; gap: 24px; }
    .ensenanzas-video { height: 240px; }
    .cuarto-camino-intro { grid-template-columns: 260px minmax(0, 1fr); gap: 30px; }
    .cuarto-camino-equilibrio { grid-template-columns: minmax(0, 1fr) 260px; gap: 30px; }
    .ensenanzas-citas { gap: 30px; }
    .actividades { padding-top: 36px; }
    .actividades-texto { margin-top: 50px; }
    .actividades p { font-size: 18px; }
    .libros-pagina h1, .libros-subtitulo { font-size: 34px; }
    .libro-fila.portada-izquierda { grid-template-columns: 140px minmax(0, 1fr); }
    .libro-fila.portada-derecha { grid-template-columns: minmax(0, 1fr) 140px; }
    .libro-portada { width: 140px; }
    .libro-fila { gap: 30px; }
    .libro-contenido p { font-size: 18px; }
    .biografia { font-size: 18px; }
    .contacto-columnas { gap: 30px; }
    .historia-beneficios { grid-template-columns: minmax(0, 1fr) 390px; gap: 20px; }
    .seminarios { grid-template-columns: 1fr; }
    .seminarios-adicional { width: min(100%, 600px); }
}

@media (max-width: 760px) {
    .historia-beneficios { grid-template-columns: 1fr; }
    .historia-beneficios-imagen { width: min(100%, 480px); margin: 8px auto 0; }
}

@media (max-width: 600px) {
    .marca { padding: 24px 16px; }
    .menu-boton { display: flex; width: 100%; min-height: 54px; align-items: center; justify-content: space-between; padding: 0 18px; border: 0; background: var(--fondo-sitio); color: #111; font: 700 15px 'Libre Franklin', Arial, sans-serif; cursor: pointer; }
    .menu { display: none; align-items: stretch; flex-direction: column; gap: 0; padding: 0 18px 16px; }
    .menu.is-open { display: flex; }
    .menu a { padding: 10px 0; }
    .carrusel-flecha { width: 36px; height: 36px; }
    .carrusel-flecha.anterior { left: 10px; }
    .carrusel-flecha.siguiente { right: 10px; }
    .historia { font-size: 18px; }
    .historia-introduccion { grid-template-columns: 1fr; }
    .historia-imagen { justify-self: center; }
    .historia-beneficios { margin-top: 40px; }
    .quienes-somos { padding-top: 24px; }
    .quienes-somos-imagen { margin-top: 36px; }
    .quienes-misterio { grid-template-columns: 1fr; gap: 28px; }
    .quienes-cita { padding-top: 0; }
    .quienes-vida { width: min(100%, 410px); margin: 0 auto; }
    .quienes-vida figcaption { margin-top: 24px; }
    .ensenanzas-intro, .cuarto-camino-intro, .cuarto-camino-equilibrio, .ensenanzas-citas { grid-template-columns: 1fr; }
    .ensenanzas-lista { gap: 28px; font-size: 18px; }
    .ensenanzas-danzas { width: min(100%, 380px); margin: 20px auto 0; }
    .ensenanzas-video { height: 315px; }
    .cuarto-camino-intro { margin-top: 60px; }
    .cuarto-camino-intro > img, .cuarto-camino-equilibrio img { width: min(100%, 320px); margin: 0 auto; }
    .cuarto-camino-texto, .cuarto-camino-equilibrio p { font-size: 18px; }
    .ensenanzas-citas { gap: 30px; }
    .libros-pagina { padding-top: 40px; }
    .libros-pagina h1, .libros-subtitulo { font-size: 30px; }
    .libro-fila, .libro-fila.portada-izquierda, .libro-fila.portada-derecha { display: flex; flex-direction: column; gap: 16px; margin-bottom: 55px; padding-bottom: 40px; }
    .libro-portada { width: 165px; order: -1; }
    .libro-contenido { padding-top: 0; }
    .libro-contenido h3 { font-size: 24px; }
    .libros-cds { margin-top: -15px; font-size: 24px; }
    .biografias { padding: 25px 12px 60px; }
    .biografia { font-size: 17px; line-height: 1.35; }
    .biografia h1, .biografia h2 { font-size: 20px; }
    .biografia-retrato { float: none; max-width: 100%; margin: 0 0 20px; }
    .biografia + .biografia { margin-top: 40px; }
    .biografia-obras p + p { margin-top: 22px; }
    .galeria { padding: 20px 12px 45px; }
    .galeria-retratos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .galeria-cerrar, .galeria-navegar { width: 42px; height: 42px; }
    .galeria-anterior { left: 8px; }
    .galeria-siguiente { right: 8px; }
    .contacto-mapa { height: 220px; aspect-ratio: auto; }
    .contacto-mapa img { position: absolute; left: 50%; width: auto; height: 834px; transform: translate(-50%, -3.262%); }
    .contacto-columnas { grid-template-columns: 1fr; gap: 50px; margin-top: 50px; }
    .contacto-formulario h1 { font-size: 24px; }
    .contacto-formulario h2 { font-size: 22px; }
    .contacto-datos { font-size: 18px; }
    .seminarios { padding: 25px 10px 45px; }
}

@media (prefers-reduced-motion: reduce) {
    .galeria-miniatura img { transition: none; }
    .musica-control.reproduciendo .musica-barras span { animation: none; transform: scaleY(.65); }
    .musica-control.reproduciendo .musica-barras span:nth-child(2n) { transform: scaleY(1); }
}