*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#000}
body{font-family:Arial,sans-serif}
.pantalla,.arbol-pantalla{position:relative;width:100vw;height:100vh;overflow:hidden;background:#000}
.home-picture{position:absolute;inset:0;width:100%;height:100%;display:block}
.home-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;user-select:none}
.arbol-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;user-select:none}

/* INDEX: las zonas táctiles de ÁRBOL y PERSONAS se posicionan desde app.js */
.zona-arbol,.zona-personas{
  position:absolute;
  display:block;
  background:transparent;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  z-index:100;
}
/* PÁGINA 2 */
/* PÁGINA 2 */
.arbol-page{background:#000}
.arbol-pantalla{display:flex;align-items:center;justify-content:center}
.enlace-inicio-arbol,.enlace-volver-inicio{
  position:absolute;z-index:200;display:block;background:transparent;cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.enlace-inicio-arbol{top:.7%;right:1.8%;width:9%;height:7.5%}
.enlace-volver-inicio{top:8.5%;right:2.5%;width:15%;height:9%}

/* PÁGINA 3 */
.fichas-page{background:#0a0a0a;color:#f2e5c8;overflow:auto}
.fichas-header{position:sticky;top:0;z-index:20;height:66px;background:#050505;border-bottom:1px solid #b78a22;display:flex;align-items:center;justify-content:center;color:#e7b83f;font:700 25px Georgia,serif;letter-spacing:.5px}
.fichas-inicio{position:absolute;right:22px;top:11px;padding:9px 16px;border:1px solid #b78a22;border-radius:8px;color:#fff;text-decoration:none;font:18px Georgia,serif}
.fichas-contenido{padding:28px 4vw 50px}
.fichas-contenido h1{text-align:center;color:#e7b83f;font:700 34px Georgia,serif;margin:5px 0}
.subtitulo{text-align:center;color:#d8c9aa;margin:0 0 28px;font:18px Georgia,serif}
.fichas-grid{display:grid;grid-template-columns:repeat(4,minmax(210px,1fr));gap:18px;max-width:1500px;margin:auto}
.ficha{position:relative;background:#f4e5ca;color:#17120b;border:1px solid #b78a22;border-radius:10px;padding:20px 17px 16px;min-height:150px;box-shadow:0 3px 12px #0008}
.ficha h2{font:700 19px Georgia,serif;margin:3px 0 14px;padding-right:30px}
.ficha div:not(.numero){display:flex;gap:8px;border-top:1px solid #d3bd99;padding:6px 0;font:15px Georgia,serif}
.ficha span{font-weight:700;min-width:105px}
.numero{position:absolute;right:12px;top:10px;color:#a87512;font:bold 14px Georgia,serif}
@media(max-width:1100px){.fichas-grid{grid-template-columns:repeat(3,minmax(210px,1fr))}}
@media(max-width:760px){.fichas-grid{grid-template-columns:repeat(2,minmax(150px,1fr));gap:12px}.fichas-header{font-size:18px}.ficha h2{font-size:16px}.ficha div:not(.numero){font-size:13px}.ficha span{min-width:80px}}
@media(max-width:480px){.fichas-grid{grid-template-columns:1fr}.fichas-inicio{right:8px;font-size:14px}.fichas-contenido h1{font-size:25px}}

/* MENÚ LATERAL COMPARTIDO — página 3 y futuras páginas */
.fichas-page{
  padding-left:170px;
}
.menu-lateral{
  position:fixed;
  left:0;
  top:0;
  bottom:0;
  width:170px;
  z-index:500;
  background:#050505;
  border-right:1px solid #b78a22;
  color:#f1e6ce;
  overflow:hidden;
  box-shadow:4px 0 18px rgba(0,0,0,.45);
}
.menu-escudo{
  height:170px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.menu-escudo img{
  width:190px;
  height:150px;
  object-fit:cover;
  object-position:left top;
  /* La portada contiene el escudo en la esquina superior izquierda. */
  clip-path:inset(0 0 0 0);
}
.menu-titulo{
  text-align:center;
  font:24px/1.05 Georgia,serif;
  margin:-8px 10px 16px;
}
.menu-navegacion{
  padding:0 16px;
}
.menu-item{
  min-height:48px;
  display:flex;
  align-items:center;
  gap:13px;
  padding:5px 12px;
  border-radius:6px;
  text-decoration:none;
  color:#f0e9dc;
  font:20px Georgia,serif;
}
.menu-item.activo{
  color:#e7b83f;
  background:#241900;
}
.menu-item.activo-menu{
  color:#e7b83f;
}
.menu-item.futuro{
  opacity:.95;
}
.menu-icono{
  width:28px;
  text-align:center;
  color:#d8a63a;
  font-size:24px;
  flex:0 0 28px;
}
.menu-frase{
  position:absolute;
  left:22px;
  right:22px;
  bottom:95px;
  padding-top:15px;
  border-top:1px solid #b78a22;
  text-align:center;
  color:#e7b83f;
  font:italic 16px/1.45 Georgia,serif;
}
.fichas-header.contenido-con-menu,
.fichas-contenido.contenido-con-menu{
  margin-left:0;
}
.fichas-header.contenido-con-menu{
  width:calc(100vw - 170px);
}
.fichas-contenido.contenido-con-menu{
  width:100%;
}
@media(max-width:760px){
  .fichas-page{padding-left:0}
  .menu-lateral{
    position:relative;
    width:100%;
    height:auto;
    max-height:none;
    border-right:0;
    border-bottom:1px solid #b78a22;
  }
  .menu-escudo{height:90px}
  .menu-escudo img{width:110px;height:90px}
  .menu-titulo{font-size:20px;margin:0 0 8px}
  .menu-navegacion{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:3px;
    padding:5px 10px 10px;
  }
  .menu-item{font-size:15px;min-height:40px;padding:4px 6px;gap:7px}
  .menu-icono{font-size:19px;width:22px;flex-basis:22px}
  .menu-frase{position:relative;left:auto;right:auto;bottom:auto;margin:0 18px;padding:10px 0 14px}
  .fichas-header.contenido-con-menu{width:100%}
}
 
.ficha-interactiva{cursor:pointer;transition:transform .16s ease,box-shadow .16s ease}
.ficha-interactiva:hover,.ficha-interactiva:focus-visible{transform:translateY(-2px);box-shadow:0 8px 22px #000a;outline:2px solid #b78a22;outline-offset:2px}
.modal-persona{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px}
.modal-persona.abierto{display:flex}.modal-fondo{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(2px)}
.modal-tarjeta{position:relative;z-index:1;width:min(720px,94vw);max-height:88vh;overflow:auto;background:#f4e5ca;color:#17120b;border:2px solid #b78a22;border-radius:14px;box-shadow:0 18px 60px #000c;padding:30px}
.modal-cerrar{position:absolute;right:12px;top:8px;width:42px;height:42px;border:1px solid #b78a22;border-radius:50%;background:#17120b;color:#e7b83f;font:30px/38px Georgia,serif;cursor:pointer}
.modal-cabecera{display:flex;align-items:center;gap:18px;padding:5px 48px 22px 0;border-bottom:1px solid #b78a22}
.modal-inicial{width:72px;height:72px;flex:0 0 72px;display:flex;align-items:center;justify-content:center;border:2px solid #b78a22;border-radius:50%;background:#17120b;color:#e7b83f;font:bold 22px Georgia,serif}
.modal-etiqueta{color:#9b6c12;font:bold 13px Arial,sans-serif;letter-spacing:1.5px}.modal-cabecera h2{margin:5px 0 0;color:#5c3d08;font:700 29px Georgia,serif}
.modal-datos{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;padding:22px 0}.modal-datos div{display:flex;flex-direction:column;gap:4px;padding-bottom:9px;border-bottom:1px solid #d3bd99;font-family:Georgia,serif}.modal-datos span{color:#8a641e;font-size:14px;font-weight:bold}.modal-datos strong{font-size:17px}
.modal-seccion{border-top:1px solid #b78a22;padding-top:16px}.modal-seccion h3{margin:0 0 7px;color:#5c3d08;font:700 21px Georgia,serif}.modal-seccion p{margin:0;font:16px/1.5 Georgia,serif}
@media(max-width:600px){.modal-persona{padding:12px}.modal-tarjeta{padding:22px 18px}.modal-cabecera h2{font-size:23px}.modal-datos{grid-template-columns:1fr}}

.modal-francisco-completa{width:min(820px,94vw)}
.modal-francisco-completa .modal-cabecera{align-items:center}
.modal-foto{width:120px;height:145px;flex:0 0 120px;border:2px solid #b78a22;border-radius:10px;background:#17120b;display:flex;align-items:center;justify-content:center;overflow:hidden}
.modal-foto img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.modal-identidad{min-width:0}
.modal-subtitulo{margin-top:8px;color:#806024;font:italic 15px Georgia,serif}
.modal-bloque{border-top:1px solid #b78a22;padding-top:16px;margin-top:18px}
.modal-bloque h3{margin:0 0 12px;color:#5c3d08;font:700 21px Georgia,serif}
.hijos-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hijos-grid div{padding:9px 11px;background:#ead8b8;border:1px solid #d3bd99;border-radius:6px;font:15px Georgia,serif}
.pendiente{margin:0;color:#66533a;font:15px/1.5 Georgia,serif;font-style:italic}
@media(max-width:600px){
  .modal-francisco-completa{width:96vw}
  .modal-francisco-completa .modal-cabecera{align-items:flex-start}
  .modal-foto{width:92px;height:112px;flex-basis:92px}
  .modal-cabecera h2{font-size:21px}
  .hijos-grid{grid-template-columns:1fr}
}

.enlace-personas-menu{
  position:absolute;
  z-index:201;
  display:block;
  background:transparent;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

@media (min-width:761px) and (max-width:1000px){
  .menu-lateral{width:170px}
  .fichas-page{padding-left:170px}
  .fichas-header.contenido-con-menu{width:calc(100vw - 170px)}
  .fichas-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .fichas-contenido{padding-left:18px;padding-right:18px}
  .menu-item{font-size:17px}
  .menu-icono{font-size:21px}
}

/* MENÚ LATERAL — modo iconos */
.menu-navegacion .menu-item{
  position:relative;
  justify-content:center;
  padding:6px 4px;
}
.menu-navegacion .menu-icono{
  width:44px;
  flex:0 0 44px;
  font-size:29px;
  line-height:1;
  text-align:center;
}
.menu-navegacion .menu-label{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.menu-navegacion .menu-item:hover::after,
.menu-navegacion .menu-item:focus-visible::after{
  content:attr(aria-label);
  position:absolute;
  left:58px;
  top:50%;
  transform:translateY(-50%);
  z-index:900;
  padding:6px 9px;
  border:1px solid #b78a22;
  border-radius:5px;
  background:#050505;
  color:#e7b83f;
  white-space:nowrap;
  font:14px Georgia,serif;
  pointer-events:none;
}
@media(max-width:760px){
  .menu-navegacion .menu-item{
    min-height:48px;
  }
  .menu-navegacion .menu-icono{
    width:42px;
    flex-basis:42px;
    font-size:26px;
  }
}

/* MENÚ LATERAL COMPACTO — página 2 y página 3 */
.menu-lateral{width:170px}
.fichas-page{padding-left:170px}
.fichas-header.contenido-con-menu{width:calc(100vw - 170px)}
.menu-escudo{height:125px}
.menu-escudo img{width:125px;height:105px}
.menu-titulo{font-size:18px;margin:-4px 6px 10px}
.menu-navegacion{padding:0 10px}
.menu-navegacion .menu-item{min-height:46px;padding:5px 3px}
.menu-navegacion .menu-icono{width:48px;flex-basis:48px;font-size:28px}
.menu-frase{left:12px;right:12px;bottom:55px;font-size:12px}
@media(max-width:760px){
  .menu-lateral{width:100%}
  .fichas-page{padding-left:0}
  .fichas-header.contenido-con-menu{width:100%}
}

/* ÁRBOL — mismo menú compacto que PERSONAS */
.arbol-page{background:#000;overflow:hidden}
.menu-lateral-arbol{width:170px}
.arbol-page .arbol-pantalla{
  position:absolute;
  left:170px;
  top:0;
  width:calc(100vw - 170px);
  height:100vh;
  overflow:hidden;
}
.arbol-page .arbol-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  pointer-events:none;
  user-select:none;
}
.arbol-page .enlace-inicio-arbol,
.arbol-page .enlace-volver-inicio{
  z-index:600;
}
@media(max-width:760px){
  .arbol-page .menu-lateral-arbol{
    position:relative;
    width:100%;
    height:auto;
    max-height:none;
  }
  .arbol-page .arbol-pantalla{
    position:relative;
    left:0;
    width:100vw;
    height:calc(100vh - 300px);
  }
}

/* PÁGINA 2 — enlaces de inicio independientes de la escala del árbol */
.arbol-page .enlace-inicio-arbol,
.arbol-page .enlace-volver-inicio{
  z-index:1200;
  pointer-events:auto;
}
.arbol-page .enlace-inicio-arbol{
  top:12px;
  right:14px;
  width:86px;
  height:48px;
}
.arbol-page .enlace-volver-inicio{
  top:66px;
  right:14px;
  width:150px;
  height:44px;
}

/* Móvil horizontal: el menú conserva todos sus iconos sin que la frase los tape. */
@media (orientation: landscape) and (max-height: 520px){
  .menu-lateral{
    width:170px;
    overflow:hidden;
  }
  .menu-lateral .menu-escudo{
    height:62px;
  }
  .menu-lateral .menu-escudo img{
    width:78px;
    height:58px;
  }
  .menu-lateral .menu-titulo{
    font-size:12px;
    margin:0 4px 3px;
  }
  .menu-lateral .menu-navegacion{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:2px;
    padding:0 7px;
  }
  .menu-lateral .menu-item{
    min-height:34px;
    height:34px;
    padding:2px;
  }
  .menu-lateral .menu-icono{
    width:38px;
    flex-basis:38px;
    font-size:22px;
  }
  .menu-lateral .menu-frase{
    position:absolute;
    left:8px;
    right:8px;
    bottom:5px;
    margin:0;
    padding:3px 0 0;
    font-size:9px;
    line-height:1.15;
  }
  .fichas-page{
    padding-left:170px;
  }
  .fichas-header.contenido-con-menu{
    width:calc(100vw - 170px);
  }
}

/* Móvil vertical: el menú de página 2 aparece arriba, como ya ocurre en página 3. */
@media (orientation: portrait) and (max-width: 760px){
  .arbol-page .menu-lateral-arbol{
    position:relative;
    width:100%;
    height:auto;
    max-height:none;
  }
  .arbol-page .arbol-pantalla{
    position:relative;
    left:0;
    width:100vw;
    height:calc(100vh - 300px);
  }
}

/* PÁGINA 2 — corrección definitiva de los enlaces INICIO */
body.arbol-page .enlace-inicio-arbol,
body.arbol-page .enlace-volver-inicio{
  position:fixed !important;
  z-index:9999 !important;
  pointer-events:auto !important;
}
body.arbol-page .enlace-inicio-arbol{
  top:12px !important;
  right:14px !important;
  width:110px !important;
  height:52px !important;
}
body.arbol-page .enlace-volver-inicio{
  top:70px !important;
  right:14px !important;
  width:170px !important;
  height:50px !important;
}

/* PÁGINA 2 — eliminar el borde/recorte negro que tapa los iconos izquierdos */
body.arbol-page .menu-lateral-arbol{
  box-sizing:border-box;
  overflow:visible;
}
body.arbol-page .menu-lateral-arbol .menu-navegacion{
  padding-left:2px;
  padding-right:2px;
}
body.arbol-page .menu-lateral-arbol .menu-item{
  width:100%;
  overflow:visible;
}
body.arbol-page .menu-lateral-arbol .menu-icono{
  position:relative;
  z-index:2;
}

/* PORTADA VERTICAL — zonas táctiles de los iconos inferiores */
@media (orientation: portrait){
  .pantalla [id^="zona-"]{
    z-index:99999 !important;
    pointer-events:auto !important;
    touch-action:manipulation;
  }
}

/* PÁGINA 2 — BOTÓN INICIO: zona táctil fija y prioritaria */
body.arbol-page #enlace-inicio-arbol{
  position:fixed !important;
  top:8px !important;
  right:10px !important;
  left:auto !important;
  width:145px !important;
  height:60px !important;
  display:block !important;
  z-index:2147483647 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
}

/* PÁGINA 2 — INICIO alineado exactamente con el botón de la imagen */
body.arbol-page #enlace-inicio-arbol{
  position:absolute !important;
  z-index:2147483647 !important;
  pointer-events:auto !important;
  display:block !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
}

/* ===== FIX DEFINITIVO PÁGINA 2: BOTÓN INICIO =====
   El botón visible está siempre en la esquina superior derecha del árbol.
   La zona táctil ocupa esa misma esquina y queda por encima de la imagen. */
body.arbol-page .arbol-pantalla #enlace-inicio-arbol{
  position:absolute !important;
  top:0 !important;
  right:0 !important;
  left:auto !important;
  bottom:auto !important;
  width:190px !important;
  height:78px !important;
  margin:0 !important;
  padding:0 !important;
  display:block !important;
  z-index:2147483647 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
  background:transparent !important;
}

/* ===== PÁGINAS 4–9 · ESTRUCTURA EN CONSTRUCCIÓN ===== */
.seccion-page{
  margin:0;
  background:#000;
  color:#e7b83f;
  min-height:100vh;
  overflow:hidden;
}
.seccion-page .menu-lateral-seccion{
  width:170px;
  height:100vh;
  box-sizing:border-box;
}
.seccion-contenido{
  position:fixed;
  left:170px;
  top:0;
  width:calc(100vw - 170px);
  height:100vh;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  background:#000;
}
.seccion-inicio{
  position:absolute;
  top:12px;
  right:18px;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:105px;
  min-height:48px;
  padding:0 14px;
  box-sizing:border-box;
  border:1px solid #b78a22;
  border-radius:5px;
  color:#e7b83f;
  background:#080808;
  font:700 15px Georgia,serif;
  text-decoration:none;
  touch-action:manipulation;
}
.seccion-inicio:hover,.seccion-inicio:focus-visible{
  background:#181818;
  outline:none;
}
.seccion-mensaje{
  text-align:center;
  width:min(760px,90%);
}
.seccion-icono{
  font-size:64px;
  line-height:1;
  margin-bottom:18px;
}
.seccion-mensaje h1{
  margin:0 0 22px;
  font:700 clamp(28px,4vw,48px) Georgia,serif;
  letter-spacing:.03em;
}
.construccion{
  display:inline-block;
  padding:12px 22px;
  border:1px solid #b78a22;
  border-radius:5px;
  font:700 18px Georgia,serif;
  letter-spacing:.12em;
}
@media(max-width:760px){
  .seccion-page .menu-lateral-seccion{
    position:relative;
    width:100%;
    height:auto;
    min-height:290px;
  }
  .seccion-contenido{
    position:relative;
    left:0;
    width:100%;
    height:calc(100vh - 290px);
    min-height:360px;
  }
  .seccion-inicio{
    top:10px;
    right:10px;
  }
}
@media (orientation: landscape) and (max-height:520px){
  .seccion-page .menu-lateral-seccion{
    width:170px;
    height:100vh;
    min-height:0;
    overflow:hidden;
  }
  .seccion-contenido{
    left:170px;
    width:calc(100vw - 170px);
    height:100vh;
  }
  .seccion-page .menu-lateral-seccion .menu-escudo{
    height:62px;
  }
  .seccion-page .menu-lateral-seccion .menu-escudo img{
    width:78px;height:58px;
  }
  .seccion-page .menu-lateral-seccion .menu-titulo{
    font-size:12px;margin:0 4px 3px;
  }
  .seccion-page .menu-lateral-seccion .menu-navegacion{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:2px;
    padding:0 7px;
  }
  .seccion-page .menu-lateral-seccion .menu-item{
    min-height:34px;height:34px;padding:2px;
  }
  .seccion-page .menu-lateral-seccion .menu-icono{
    width:38px;flex-basis:38px;font-size:22px;
  }
  .seccion-page .menu-lateral-seccion .menu-frase{
    left:8px;right:8px;bottom:5px;
    font-size:9px;line-height:1.15;
  }
}

/* PORTADA — zonas táctiles para todas las secciones */
.pantalla [id^="zona-"]{
  position:absolute;
  z-index:99999 !important;
  display:block;
  pointer-events:auto !important;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

/* ===== PÁGINA 9 · BÚSQUEDA ===== */
.busqueda-contenido{
  overflow:auto;
  align-items:flex-start;
  padding:78px 42px 40px;
  box-sizing:border-box;
}
.busqueda-panel{
  width:min(900px,100%);
  margin:auto;
  color:#151515;
  background:#f4ead9;
  border:1px solid #b78a22;
  border-radius:8px;
  box-shadow:0 10px 35px rgba(0,0,0,.35);
  padding:34px;
  box-sizing:border-box;
}
.busqueda-cabecera{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  border-bottom:1px solid #b78a22;
  padding-bottom:20px;
  margin-bottom:25px;
}
.busqueda-cabecera .seccion-icono{
  color:#b78a22;
  font-size:50px;
  margin:0;
}
.busqueda-cabecera h1{
  margin:0;
  font:700 clamp(30px,4vw,44px) Georgia,serif;
  color:#151515;
}
.busqueda-cabecera p{
  margin:6px 0 0;
  font:16px Georgia,serif;
  color:#51483c;
}
.busqueda-form label{
  display:block;
  margin-bottom:9px;
  font:700 17px Georgia,serif;
}
.busqueda-fila{
  display:flex;
  gap:10px;
}
.busqueda-fila input{
  flex:1;
  min-width:0;
  height:52px;
  padding:0 16px;
  border:1px solid #9b7625;
  border-radius:5px;
  background:#fffdf8;
  color:#171717;
  font:16px Georgia,serif;
  box-sizing:border-box;
}
.busqueda-fila input:focus{
  outline:2px solid #c79a35;
  outline-offset:1px;
}
.busqueda-fila button{
  width:125px;
  border:1px solid #9b7625;
  border-radius:5px;
  background:#101b22;
  color:#e7b83f;
  font:700 15px Georgia,serif;
  cursor:pointer;
  touch-action:manipulation;
}
.busqueda-ayuda{
  margin-top:22px;
  padding:18px;
  border:1px solid #d5bd86;
  border-radius:6px;
  background:#fbf5e9;
  font-family:Georgia,serif;
}
.busqueda-tipos{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:12px;
}
.busqueda-tipos span{
  padding:8px 11px;
  border:1px solid #d5bd86;
  border-radius:20px;
  background:#fffdf8;
  font-size:14px;
}
.resultados-busqueda{
  margin-top:22px;
}
.resultados-titulo{
  margin:0 0 12px;
  font:700 20px Georgia,serif;
}
.resultado-item{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:10px;
  padding:14px;
  border:1px solid #d5bd86;
  border-radius:6px;
  background:#fffdf8;
}
.resultado-icono{
  width:42px;
  text-align:center;
  font-size:26px;
  flex:0 0 42px;
}
.resultado-info{
  flex:1;
  min-width:0;
}
.resultado-nombre{
  font:700 18px Georgia,serif;
  color:#151515;
}
.resultado-meta{
  margin-top:3px;
  font:14px Georgia,serif;
  color:#665b4e;
}
.resultado-enlace{
  color:#8a6515;
  font:700 14px Georgia,serif;
  text-decoration:none;
  white-space:nowrap;
}
.resultado-enlace:hover{text-decoration:underline}
.sin-resultados{
  padding:18px;
  text-align:center;
  border:1px dashed #b78a22;
  border-radius:6px;
  font:16px Georgia,serif;
}
@media(max-width:760px){
  .busqueda-contenido{
    padding:65px 15px 30px;
    min-height:calc(100vh - 290px);
  }
  .busqueda-panel{padding:22px 17px}
  .busqueda-cabecera{justify-content:flex-start}
  .busqueda-cabecera .seccion-icono{font-size:40px}
  .busqueda-fila{flex-direction:column}
  .busqueda-fila button{width:100%;height:48px}
  .resultado-item{align-items:flex-start}
  .resultado-enlace{display:block;margin-top:7px}
}

/* GALERÍA PÁGINA 5 */
.galeria-contenido{overflow:auto;align-items:flex-start;padding:70px 28px 35px;box-sizing:border-box}
.galeria-panel{width:min(1100px,100%);margin:auto;color:#151515;background:#f4ead9;border:1px solid #b78a22;border-radius:8px;box-shadow:0 10px 35px rgba(0,0,0,.35);padding:24px;box-sizing:border-box}
.galeria-cabecera{display:flex;align-items:center;justify-content:center;gap:16px;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid #b78a22}
.galeria-cabecera .seccion-icono{font-size:44px;margin:0}.galeria-cabecera h1{margin:0;font:700 clamp(28px,4vw,42px) Georgia,serif}.galeria-cabecera p{margin:5px 0 0;color:#5b5145;font:15px Georgia,serif}
.coleccion-bloque{margin-top:18px;padding:17px;border:1px solid #d2b97f;border-radius:7px;background:#fbf5e9}
.coleccion-titulo{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.coleccion-titulo h2{margin:0;font:700 22px Georgia,serif}.coleccion-titulo p{margin:5px 0 0;color:#665b4e;font:14px Georgia,serif}
.ver-coleccion{border:1px solid #9b7625;border-radius:5px;background:#101b22;color:#e7b83f;padding:10px 13px;font:700 12px Georgia,serif;cursor:pointer;touch-action:manipulation}
.foto-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.coleccion-bloque:nth-of-type(2) .foto-grid,.coleccion-bloque:nth-of-type(3) .foto-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.foto-card{padding:0;border:1px solid #c6a965;background:#fffdf8;border-radius:5px;overflow:hidden;cursor:pointer;text-align:left;touch-action:manipulation}.foto-card img{display:block;width:100%;height:150px;object-fit:cover}.foto-card span{display:block;padding:9px 8px;min-height:38px;box-sizing:border-box;font:700 13px Georgia,serif;color:#2d2924}
.visor-fotografias{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;padding:35px 70px;box-sizing:border-box}.visor-fotografias[hidden]{display:none}
.visor-contenido{width:min(1100px,94vw);height:min(92vh,850px);display:flex;align-items:center;justify-content:center;gap:18px}.visor-contenido img{max-width:75%;max-height:82vh;object-fit:contain;border:1px solid #b78a22}
.visor-info{width:270px;color:#f4ead9;font-family:Georgia,serif}.visor-info h2{margin:8px 0;font-size:23px;color:#e7b83f}.visor-info p{font-size:15px;line-height:1.45}.visor-info #visor-contador{font-size:13px;color:#d5bd86}
.visor-cerrar,.visor-prev,.visor-next{position:absolute;border:1px solid #b78a22;background:#080808;color:#e7b83f;cursor:pointer;z-index:3;touch-action:manipulation}.visor-cerrar{top:15px;right:18px;width:45px;height:45px;border-radius:50%;font-size:32px}.visor-prev,.visor-next{top:50%;transform:translateY(-50%);width:48px;height:70px;font-size:44px;border-radius:5px}.visor-prev{left:15px}.visor-next{right:15px}
@media(max-width:900px){.foto-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.visor-contenido{flex-direction:column;height:90vh;gap:8px}.visor-contenido img{max-width:90%;max-height:68vh}.visor-info{width:90%;text-align:center}}
@media(max-width:600px){.galeria-contenido{padding:58px 10px 25px}.galeria-panel{padding:15px}.coleccion-titulo{align-items:flex-start;flex-direction:column}.ver-coleccion{width:100%}.foto-grid,.coleccion-bloque:nth-of-type(2) .foto-grid,.coleccion-bloque:nth-of-type(3) .foto-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foto-card img{height:115px}.foto-card span{font-size:11px}.visor-fotografias{padding:20px 8px}}
\n.historia-coleccion{margin:12px 0 15px;padding:12px 14px;border-left:3px solid #b78a22;background:#f7efdf;color:#40382f;font:14px/1.5 Georgia,serif}.historia-coleccion strong{display:block;margin-bottom:4px;color:#7b5b18;font-size:15px}.historia-coleccion p{margin:0}\n
.vicente-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:900px){.vicente-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:520px){.vicente-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.arbol-interactivo{position:relative;width:100%;line-height:0}
.arbol-interactivo .arbol-img{display:block;width:100%;height:auto}
.arbol-plus{position:absolute;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:transparent;border:0;cursor:pointer;z-index:1300;padding:0;pointer-events:auto!important;touch-action:manipulation}
.arbol-plus:focus-visible{outline:3px solid #d8aa42;outline-offset:3px}
.arbol-popup-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:20px;z-index:9999}
.arbol-popup{position:relative;width:min(920px,96vw);max-height:90vh;overflow:auto;background:#f6ead7;border:2px solid #b78a22;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.55);color:#231f1a;font-family:Georgia,serif;padding:24px}
.arbol-popup h2{margin:0 40px 4px 0;color:#6f5117;font-size:27px}
.arbol-popup .subtitulo{margin:0 0 18px;color:#5a5145}
.arbol-popup-close{position:absolute;right:14px;top:10px;border:0;background:none;color:#6f5117;font-size:32px;cursor:pointer}
.mini-tree{display:flex;flex-direction:column;align-items:center;gap:12px}
.mini-parents{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.mini-node{background:#fffaf1;border:1px solid #c6a45b;border-radius:8px;padding:9px 13px;text-align:center;min-width:150px;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.mini-node strong{display:block;color:#4d3a18}
.mini-node small{display:block;margin-top:3px;color:#746958}
.mini-arrow{color:#9a741e;font-size:22px;line-height:1}
.mini-children{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.mini-note{margin-top:18px;padding-top:14px;border-top:1px solid #d4bd8b;color:#5c5245;font-size:14px;text-align:center}
@media(max-width:600px){.arbol-plus{width:34px;height:34px}.arbol-popup{padding:18px 14px}.arbol-popup h2{font-size:22px}.mini-node{min-width:125px;font-size:14px}}

/* PWA-SIMPLE-046 — página 2: conservar la posición original del árbol */
.arbol-page .arbol-interactivo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  line-height:0;
}
.arbol-page .arbol-interactivo .arbol-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
}

/* Árboles individuales: mostrar las imágenes originales sin reconstruirlas */
.arbol-popup-imagen{display:block;width:100%;height:auto;max-height:calc(90vh - 110px);object-fit:contain;margin:0 auto;border-radius:4px}
.arbol-popup-imagen-wrap{display:flex;justify-content:center;align-items:center;min-height:120px}
.arbol-popup.imagen-popup{padding:16px;max-width:1100px;background:#f6ead7}
.arbol-popup.imagen-popup h2{margin:0 45px 12px 4px}
@media(max-width:600px){.arbol-popup.imagen-popup{padding:10px}.arbol-popup-imagen{max-height:calc(92vh - 80px)}}

.arbol-plus[data-persona="francisco"],.arbol-plus[data-persona="rosa"]{z-index:1500!important}


/* PWA-SIMPLE-052 — escudo de Francisco dentro de su ficha desplegable */
.modal-escudo {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 8px;
}
.modal-escudo img {
  width: 110px;
  height: 110px;
  object-fit: contain;
}

/* PWA-SIMPLE-053 — ficha desplegable de Rosa Herrero Segura */
.modal-rosa-completa { max-height: 92vh; overflow-y: auto; }

/* PWA-SIMPLE-054 — ficha de Francisco Branchadell Herrero */
.modal-francisco-completa {
  max-height: 92vh;
  overflow-y: auto;
}

/* PWA-SIMPLE-055 — Rosa Herrero y Francisco Branchadell Herrero */
.modal-francisco-herrero-completa,
.modal-rosa-completa {
  max-height: 92vh;
  overflow-y: auto;
}

/* POP UPS DE LOS HERMANOS — recuperación 058 */
.hermano-popup-trigger{position:absolute;z-index:1490;background:transparent;border:0;cursor:pointer;padding:0;width:170px;height:315px;top:300px}
.trigger-francisco{left:42px}.trigger-rosa{left:248px}.trigger-manuel{left:456px}
.hermano-popup{position:fixed;inset:0;z-index:5000;display:none;align-items:center;justify-content:center;padding:18px}
.hermano-popup.abierto{display:flex}.hermano-popup-fondo{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(2px)}
.hermano-popup-card{position:relative;z-index:1;width:min(1040px,96vw);max-height:94vh;overflow:auto;background:#f4e5ca;color:#17120b;border:2px solid #b78a22;border-radius:14px;box-shadow:0 18px 60px #000c;padding:24px}
.hermano-popup-cerrar{position:absolute;right:12px;top:10px;width:42px;height:42px;border:1px solid #b78a22;border-radius:50%;background:#17120b;color:#e7b83f;font:30px/38px Georgia,serif;cursor:pointer;z-index:3}
.pareja-cabecera{display:grid;grid-template-columns:1fr 110px 1fr;gap:12px;align-items:start;padding:10px 45px 20px;border-bottom:1px solid #b78a22}
.popup-galeria{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.popup-galeria figure{margin:0;max-width:100%;text-align:center}.popup-galeria img{display:block;width:min(100%,520px);max-height:360px;height:auto;object-fit:contain;background:#f8f1e5;border:1px solid #b78a22;border-radius:8px}.popup-galeria figcaption{margin-top:7px;font:600 13px Georgia,serif;color:#6d5120}.pareja-persona{text-align:center;min-width:0}.pareja-foto{width:125px;height:145px;margin:0 auto 8px;border:2px solid #b78a22;border-radius:10px;overflow:hidden;background:#eee;display:flex;align-items:center;justify-content:center}.pareja-foto img{width:100%;height:100%;object-fit:cover}.pareja-persona h2{font:700 22px Georgia,serif;color:#5c3d08;margin:6px 0 8px}.pareja-escudo{width:82px;height:82px;object-fit:contain}.pareja-centro{display:flex;align-items:center;justify-content:center;height:235px}.pareja-centro img{width:90px;height:auto;object-fit:contain}
.pareja-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.pareja-bloque{border:1px solid #d3bd99;border-radius:10px;padding:14px;background:rgba(255,255,255,.16)}.pareja-bloque h3{margin:0 0 8px;color:#5c3d08;font:700 20px Georgia,serif}.pareja-bloque p{margin:0;font:15px/1.5 Georgia,serif}.pareja-bloque hr{border:0;border-top:1px solid #d3bd99;margin:10px 0}
@media(max-width:700px){.hermano-popup-card{padding:18px 12px}.pareja-cabecera{grid-template-columns:1fr 65px 1fr;gap:4px;padding:8px 28px 15px}.pareja-foto{width:86px;height:105px}.pareja-persona h2{font-size:15px}.pareja-escudo{width:58px;height:58px}.pareja-centro{height:170px}.pareja-centro img{width:55px}.pareja-grid{grid-template-columns:1fr}.hermano-popup-trigger{height:300px;top:305px;width:170px}.trigger-francisco{left:42px}.trigger-rosa{left:248px}.trigger-manuel{left:456px}}
/* POP UPS hermanos 060 — parejas aprobadas 1-6 */
.trigger-juan{left:664px}.trigger-laura{left:872px}.trigger-vicente{left:1080px}
.pareja-foto.pendiente{font:700 14px Georgia,serif;color:#7b6338;text-align:center;line-height:1.35}
.pareja-cabecera-individual{grid-template-columns:1fr;padding-bottom:20px}
@media(max-width:700px){.trigger-juan{left:664px}.trigger-laura{left:872px}.trigger-vicente{left:1080px}}
.foto-documento{display:block;width:100%;max-height:300px;object-fit:contain;border-radius:8px;margin:8px 0 10px;border:1px solid #d3bd99}


/* PWA-SIMPLE-088 — correcciones de interacción móvil y POP UPS */
body.popup-open #enlace-inicio-arbol,
body.popup-open #enlace-volver-inicio{
  pointer-events:none !important;
  visibility:hidden !important;
}
body.popup-open .arbol-popup-backdrop,
body.popup-open .hermano-popup.abierto{
  pointer-events:auto !important;
}
.arbol-popup-close,
.hermano-popup-cerrar{
  pointer-events:auto !important;
  touch-action:manipulation !important;
}
/* Los activadores de las fichas se calculan sobre la imagen y nunca deben
   cubrir los botones + de los árboles individuales. */
.hermano-popup-trigger{
  top:auto !important;
  left:auto !important;
  width:150px;
  height:210px;
  touch-action:manipulation !important;
}
@media(max-width:700px){
  .hermano-popup-trigger{width:110px;height:155px;top:auto;left:auto}
}
/* Menú de secciones: en vertical todos los iconos conservan una zona táctil
   prioritaria, incluidos Cronología y Búsqueda. */
@media (orientation: portrait) and (max-width:760px){
  .seccion-page .menu-lateral-seccion{
    position:relative !important;
    z-index:50000 !important;
    pointer-events:auto !important;
    height:290px !important;
    min-height:290px !important;
    overflow:visible !important;
  }
  .seccion-page .menu-lateral-seccion .menu-navegacion{
    position:relative !important;
    z-index:50001 !important;
  }
  .seccion-page .menu-lateral-seccion .menu-item{
    position:relative !important;
    z-index:50002 !important;
    display:flex !important;
    pointer-events:auto !important;
    touch-action:manipulation !important;
  }
  .seccion-page .seccion-contenido{
    position:relative !important;
    z-index:1 !important;
  }
}
/* Visor fotográfico vertical: la fotografía completa debe caber dentro del
   viewport y el botón de cierre debe quedar siempre visible. */
@media (orientation: portrait) and (max-width:760px){
  .visor-fotografias{
    padding:54px 8px 12px !important;
    align-items:center !important;
    overflow:hidden !important;
  }
  .visor-contenido{
    width:100% !important;
    height:calc(100vh - 70px) !important;
    max-height:calc(100vh - 70px) !important;
    overflow:hidden !important;
    gap:6px !important;
  }
  .visor-contenido img{
    display:block !important;
    width:auto !important;
    max-width:94vw !important;
    height:auto !important;
    max-height:calc(100vh - 190px) !important;
    object-fit:contain !important;
    flex:0 1 auto !important;
  }
  .visor-info{
    width:94vw !important;
    max-height:100px !important;
    overflow:auto !important;
    flex:0 0 auto !important;
  }
  .visor-cerrar{top:8px !important;right:8px !important;z-index:100003 !important}
  .visor-prev,.visor-next{z-index:100003 !important}
}

/* PWA-SIMPLE-089 — correcciones finales del examen en iPhone */
.arbol-page .arbol-plus{
  z-index:3000 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
}
.arbol-page .hermano-popup-trigger{
  z-index:1200 !important;
}

@media (orientation: portrait) and (max-width:760px){
  /* El enlace INICIO pertenece al área del árbol, no al menú superior. */
  body.arbol-page .arbol-pantalla #enlace-inicio-arbol{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    width:170px !important;
    height:64px !important;
    z-index:2147483647 !important;
    pointer-events:auto !important;
    touch-action:manipulation !important;
  }

  /* Visor de fotografías: usa la altura dinámica de iOS y deja siempre
     una zona segura para el botón de cierre. */
  .visor-fotografias{
    position:fixed !important;
    inset:0 !important;
    height:100dvh !important;
    min-height:100dvh !important;
    padding:calc(env(safe-area-inset-top) + 58px) 8px calc(env(safe-area-inset-bottom) + 8px) !important;
    align-items:flex-start !important;
    justify-content:center !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }
  .visor-contenido{
    width:100% !important;
    height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 70px) !important;
    max-height:none !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    gap:6px !important;
    overflow:hidden !important;
  }
  .visor-contenido img{
    width:auto !important;
    height:auto !important;
    max-width:94vw !important;
    max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 150px) !important;
    object-fit:contain !important;
    flex:0 1 auto !important;
  }
  .visor-info{
    width:94vw !important;
    max-height:62px !important;
    overflow:hidden !important;
    flex:0 0 auto !important;
  }
  .visor-cerrar{
    position:fixed !important;
    top:calc(env(safe-area-inset-top) + 8px) !important;
    right:8px !important;
    width:46px !important;
    height:46px !important;
    z-index:2147483647 !important;
    pointer-events:auto !important;
    touch-action:manipulation !important;
  }
  .visor-prev,.visor-next{
    z-index:2147483646 !important;
    pointer-events:auto !important;
  }
}

/* PWA-SIMPLE-090 — ajuste final del visor fotográfico vertical iPhone */
@media (orientation: portrait) and (max-width:760px){
  .visor-contenido img{
    max-width:97vw !important;
    max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 125px) !important;
  }
  .visor-info{max-height:56px !important;}
}


/* PWA-SIMPLE-091 — INICIO visible en página ÁRBOL y ajuste final del visor vertical */
body.arbol-page #enlace-inicio-arbol{
  position:absolute !important;
  top:14px !important;
  right:14px !important;
  width:150px !important;
  height:54px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  padding:0 18px !important;
  border:1px solid #b78a22 !important;
  border-radius:5px !important;
  color:#e7b83f !important;
  background:#080808 !important;
  font:700 17px Georgia,serif !important;
  text-decoration:none !important;
  z-index:2147483647 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
}
body.arbol-page #enlace-inicio-arbol:hover,
body.arbol-page #enlace-inicio-arbol:focus-visible{
  background:#181818 !important;
  outline:none !important;
}
@media (orientation:portrait) and (max-width:760px){
  body.arbol-page #enlace-inicio-arbol{
    top:10px !important; right:10px !important;
    width:145px !important; height:52px !important;
    font-size:16px !important;
  }
  .visor-fotografias .visor-contenido img{
    transform:translateY(9px) !important;
  }
}


/* PWA-SIMPLE-092 — Árbol horizontal sustituido por la imagen ORIGINAL aportada por el usuario.
   En horizontal se utiliza exactamente assets/arbol-horizontal-usuario.png.
   Los enlaces y zonas táctiles se superponen sin alterar la imagen. */
.arbol-picture{display:block;width:100%;height:100%;position:absolute;inset:0}
@media (orientation: landscape) and (min-width:761px){
  body.arbol-page .menu-lateral-arbol{display:none !important}
  body.arbol-page .arbol-pantalla{left:0 !important;width:100vw !important;height:100vh !important}
  body.arbol-page .arbol-interactivo{width:100vw !important;height:100vh !important;position:relative !important;line-height:0 !important}
  body.arbol-page .arbol-picture{width:100% !important;height:100% !important}
  body.arbol-page .arbol-img{width:100% !important;height:100% !important;object-fit:contain !important}
  body.arbol-page #enlace-inicio-arbol{
    background:transparent !important;border:0 !important;color:transparent !important;
    box-shadow:none !important;border-radius:0 !important;padding:0 !important;
    width:120px !important;height:62px !important;display:block !important;
  }
  body.arbol-page #enlace-volver-inicio{display:none !important}
  body.arbol-page .arbol-landscape-links{position:absolute;inset:0;z-index:2200;pointer-events:none}
  body.arbol-page .arbol-landscape-link{position:absolute;display:block;background:transparent;border:0;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  body.arbol-page .arbol-plus{z-index:3000 !important}
  body.arbol-page .hermano-popup-trigger{z-index:2900 !important}
}
@media (orientation: portrait) and (max-width:760px){
  body.arbol-page .arbol-picture{position:absolute;inset:0;width:100%;height:100%}
  body.arbol-page .arbol-img{width:100%;height:100%;object-fit:contain}
  .visor-fotografias .visor-contenido img{transform:translateY(18px) !important}
}

/* PWA 093 — ajuste final del árbol horizontal y visor vertical de fotografías */
@media (orientation: landscape) and (min-width: 761px){
  body.arbol-page .arbol-pantalla #enlace-inicio-arbol{
    width:210px !important;
    height:86px !important;
  }
}
@media (orientation: portrait) and (max-width: 600px){
  .visor-contenido{
    height:92vh;
    justify-content:flex-start;
    padding-top:9vh;
    gap:8px;
  }
  .visor-contenido img{
    max-width:92%;
    max-height:54vh;
    transform:translateY(8vh);
  }
  .visor-info{
    transform:translateY(8vh);
  }
}

/* PWA-SIMPLE-102 — visor de FOTOGRAFÍAS basado en la 094.
   Único objetivo: garantizar fotografía completa y cierre visible en iPhone.
   No modifica miniaturas, colecciones ni el resto de la PWA. */
.visor-fotografias{
  position:fixed !important;
  inset:0 !important;
  z-index:100000 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:calc(env(safe-area-inset-top) + 56px) calc(env(safe-area-inset-right) + 58px) calc(env(safe-area-inset-bottom) + 24px) calc(env(safe-area-inset-left) + 58px) !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
.visor-fotografias[hidden]{display:none !important}
.visor-fotografias .visor-contenido{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  min-width:0 !important;
  min-height:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:18px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
.visor-fotografias .visor-contenido img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:center !important;
  margin:0 !important;
  box-sizing:border-box !important;
  border:2px solid #b78a22 !important;
}
.visor-fotografias .visor-info{
  flex:0 1 270px !important;
  width:270px !important;
  max-width:270px !important;
  max-height:100% !important;
  overflow:auto !important;
  box-sizing:border-box !important;
}
.visor-fotografias .visor-cerrar{
  position:fixed !important;
  top:calc(env(safe-area-inset-top) + 10px) !important;
  right:calc(env(safe-area-inset-right) + 12px) !important;
  width:48px !important;
  height:48px !important;
  min-width:48px !important;
  min-height:48px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  margin:0 !important;
  z-index:100010 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
  border-radius:50% !important;
  box-sizing:border-box !important;
  font-size:32px !important;
  line-height:1 !important;
}
.visor-fotografias .visor-prev,
.visor-fotografias .visor-next{
  position:fixed !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  z-index:100010 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
}
.visor-fotografias .visor-prev{left:10px !important}
.visor-fotografias .visor-next{right:10px !important}

/* iPhone vertical: reserva espacio real para X, marco y texto. */
@media (orientation:portrait) and (max-width:760px){
  .visor-fotografias{
    padding:calc(env(safe-area-inset-top) + 68px) 10px calc(env(safe-area-inset-bottom) + 62px) !important;
  }
  .visor-fotografias .visor-contenido{
    flex-direction:column !important;
    gap:6px !important;
    width:100% !important;
    height:100% !important;
  }
  .visor-fotografias .visor-contenido img{
    max-width:calc(100vw - 54px) !important;
    max-height:calc(100dvh - 205px) !important;
    flex:0 1 auto !important;
  }
  .visor-fotografias .visor-info{
    width:min(90vw,520px) !important;
    max-width:90vw !important;
    max-height:72px !important;
    flex:0 0 auto !important;
    text-align:center !important;
  }
  .visor-fotografias .visor-cerrar{
    top:calc(env(safe-area-inset-top) + 10px) !important;
    right:12px !important;
  }
  .visor-fotografias .visor-prev,
  .visor-fotografias .visor-next{
    width:44px !important;
    height:62px !important;
  }
}

/* iPhone horizontal: la foto conserva su proporción y la X queda fija. */
@media (orientation:landscape) and (max-width:1100px){
  .visor-fotografias{
    padding:calc(env(safe-area-inset-top) + 52px) 62px calc(env(safe-area-inset-bottom) + 14px) 62px !important;
  }
  .visor-fotografias .visor-contenido{
    flex-direction:row !important;
    gap:14px !important;
  }
  .visor-fotografias .visor-contenido img{
    max-width:calc(100vw - 360px) !important;
    max-height:calc(100dvh - 90px) !important;
  }
  .visor-fotografias .visor-info{
    width:250px !important;
    max-width:250px !important;
    max-height:calc(100dvh - 90px) !important;
  }
  .visor-fotografias .visor-cerrar{
    top:calc(env(safe-area-inset-top) + 8px) !important;
    right:12px !important;
  }
}

/* PWA-SIMPLE-103 — visor FOTOGRAFÍAS limpio. Solo modifica el POP UP. */
.visor-fotografias{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100dvh !important;
  padding:0 !important;
  margin:0 !important;
  background:rgba(0,0,0,.88) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  z-index:2147483000 !important;
  box-sizing:border-box !important;
}
.visor-fotografias[hidden]{display:none !important}
.visor-fotografias .visor-contenido{
  position:relative !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  padding:70px 70px 58px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:16px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
.visor-fotografias .visor-contenido img{
  position:relative !important;
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:calc(100vw - 150px) !important;
  max-height:calc(100dvh - 145px) !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  flex:0 1 auto !important;
  border:2px solid #b78a22 !important;
  box-sizing:border-box !important;
}
.visor-fotografias .visor-info{
  position:relative !important;
  flex:0 1 260px !important;
  width:260px !important;
  max-width:260px !important;
  max-height:calc(100dvh - 145px) !important;
  overflow:auto !important;
  box-sizing:border-box !important;
}
.visor-fotografias .visor-cerrar{
  position:fixed !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  top:calc(env(safe-area-inset-top, 0px) + 10px) !important;
  right:calc(env(safe-area-inset-right, 0px) + 12px) !important;
  width:52px !important;
  height:52px !important;
  min-width:52px !important;
  min-height:52px !important;
  padding:0 !important;
  margin:0 !important;
  border:2px solid #b78a22 !important;
  border-radius:50% !important;
  background:#080808 !important;
  color:#e7b83f !important;
  font-family:Arial,sans-serif !important;
  font-size:38px !important;
  font-weight:400 !important;
  line-height:1 !important;
  text-align:center !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
  z-index:2147483647 !important;
  box-sizing:border-box !important;
  -webkit-appearance:none !important;
}
.visor-fotografias .visor-prev,
.visor-fotografias .visor-next{
  position:fixed !important;
  top:50% !important;
  width:48px !important;
  height:68px !important;
  margin:0 !important;
  padding:0 !important;
  transform:translateY(-50%) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #b78a22 !important;
  border-radius:5px !important;
  background:#080808 !important;
  color:#e7b83f !important;
  font-size:44px !important;
  line-height:1 !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
  z-index:2147483646 !important;
}
.visor-fotografias .visor-prev{left:10px !important}
.visor-fotografias .visor-next{right:10px !important}

@media (orientation:portrait) and (max-width:760px){
  .visor-fotografias .visor-contenido{
    flex-direction:column !important;
    padding:72px 48px 48px !important;
    gap:7px !important;
  }
  .visor-fotografias .visor-contenido img{
    max-width:calc(100vw - 96px) !important;
    max-height:calc(100dvh - 170px) !important;
    transform:none !important;
    flex:0 1 auto !important;
  }
  .visor-fotografias .visor-info{
    width:calc(100vw - 48px) !important;
    max-width:calc(100vw - 48px) !important;
    max-height:48px !important;
    flex:0 0 auto !important;
    text-align:center !important;
    overflow:hidden !important;
  }
  .visor-fotografias .visor-cerrar{
    top:calc(env(safe-area-inset-top, 0px) + 8px) !important;
    right:10px !important;
  }
  .visor-fotografias .visor-prev,
  .visor-fotografias .visor-next{
    width:42px !important;
    height:58px !important;
  }
  .visor-fotografias .visor-prev{left:4px !important}
  .visor-fotografias .visor-next{right:4px !important}
}

@media (orientation:landscape) and (max-width:1100px){
  .visor-fotografias .visor-contenido{
    flex-direction:row !important;
    padding:62px 62px 30px !important;
    gap:14px !important;
  }
  .visor-fotografias .visor-contenido img{
    max-width:calc(100vw - 350px) !important;
    max-height:calc(100dvh - 100px) !important;
    transform:none !important;
  }
  .visor-fotografias .visor-info{
    width:250px !important;
    max-width:250px !important;
    max-height:calc(100dvh - 100px) !important;
  }
}


/* PWA-SIMPLE-105 — Corrección del menú lateral del Árbol en horizontal.
   La regla anterior lo ocultaba en pantallas landscape >= 761px.
   El menú debe permanecer vertical a la izquierda también en escritorio. */
@media (orientation: landscape) and (min-width: 761px){
  body.arbol-page .menu-lateral-arbol{
    display:flex !important;
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:170px !important;
    min-width:170px !important;
    height:100vh !important;
    z-index:5000 !important;
  }
  body.arbol-page .arbol-pantalla{
    left:170px !important;
    width:calc(100vw - 170px) !important;
    height:100vh !important;
  }
  body.arbol-page .arbol-interactivo{
    width:100% !important;
    height:100% !important;
  }
  body.arbol-page .arbol-picture{
    width:100% !important;
    height:100% !important;
  }
  body.arbol-page .arbol-img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-navegacion{
    display:flex !important;
    flex-direction:column !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-item{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-icono{
    display:block !important;
    width:100% !important;
    text-align:center !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-label{
    display:none !important;
  }
}


/* PWA-SIMPLE-106 — Menú Árbol horizontal compacto.
   El ancho de la ventana puede ser menor de 761px aunque el teléfono
   esté en horizontal; por eso se fuerza aquí el mismo menú vertical
   que en escritorio, con escudo visible. */
@media (orientation: landscape) and (max-height: 700px){
  body.arbol-page .menu-lateral-arbol{
    display:flex !important;
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:170px !important;
    min-width:170px !important;
    height:100dvh !important;
    max-height:none !important;
    z-index:2147483000 !important;
    flex-direction:column !important;
    align-items:stretch !important;
    background:#050505 !important;
    border-right:1px solid #b78a22 !important;
    border-bottom:0 !important;
    padding:6px 8px 10px !important;
    overflow:hidden !important;
  }

  body.arbol-page .menu-lateral-arbol .menu-escudo{
    display:flex !important;
    width:100% !important;
    height:88px !important;
    min-height:88px !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-escudo img{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:84px !important;
    height:82px !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center !important;
  }

  body.arbol-page .menu-lateral-arbol .menu-titulo{
    display:block !important;
    visibility:visible !important;
    width:100% !important;
    height:auto !important;
    margin:0 0 7px !important;
    text-align:center !important;
    font-size:15px !important;
    line-height:1.05 !important;
  }

  body.arbol-page .menu-lateral-arbol .menu-navegacion{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    width:100% !important;
    gap:5px !important;
    padding:0 !important;
    margin:0 !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-item{
    width:100% !important;
    min-height:48px !important;
    height:48px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:3px !important;
    margin:0 !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-icono{
    display:block !important;
    width:100% !important;
    flex:0 0 auto !important;
    text-align:center !important;
    font-size:28px !important;
    line-height:1 !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-label{
    display:none !important;
  }
  body.arbol-page .menu-lateral-arbol .menu-frase{
    display:block !important;
    position:absolute !important;
    left:8px !important;
    right:8px !important;
    bottom:18px !important;
    margin:0 !important;
    font-size:10px !important;
    line-height:1.35 !important;
    text-align:center !important;
  }

  body.arbol-page .arbol-pantalla{
    position:absolute !important;
    left:170px !important;
    top:0 !important;
    right:auto !important;
    width:calc(100vw - 170px) !important;
    height:100dvh !important;
    margin-left:0 !important;
    overflow:hidden !important;
    z-index:1 !important;
  }
  body.arbol-page .arbol-interactivo,
  body.arbol-page .arbol-picture{
    width:100% !important;
    height:100% !important;
  }
  body.arbol-page .arbol-img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }
}


/* PWA-SIMPLE-107 — Menú del Árbol trasladado literalmente desde TEST-04.
   Esta estructura usa clases independientes para que el CSS histórico del
   menú no pueda ocultarlo, recolocarlo ni generar tooltips. */

body.arbol-page .menu-test04{
  position:fixed !important;
  left:0 !important; top:0 !important; bottom:0 !important;
  width:170px !important; min-width:170px !important;
  z-index:2147483000 !important;
  background:#050505 !important;
  border-right:1px solid #b78a22 !important;
  color:#f1e6ce !important;
  overflow:hidden !important;
  box-shadow:4px 0 18px rgba(0,0,0,.45) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  padding:0 !important;
  margin:0 !important;
}
body.arbol-page .menu-test04-escudo{
  height:125px !important; min-height:125px !important;
  display:flex !important; align-items:center !important;
  justify-content:center !important; overflow:hidden !important;
}
body.arbol-page .menu-test04-escudo img{
  display:block !important; visibility:visible !important; opacity:1 !important;
  width:125px !important; height:105px !important;
  object-fit:contain !important; margin:0 !important;
}
body.arbol-page .menu-test04-titulo{
  display:block !important; width:100% !important;
  text-align:center !important;
  font:18px/1.05 Georgia,"Times New Roman",serif !important;
  margin:-4px 6px 10px !important;
  color:#f1e6ce !important;
}
body.arbol-page .menu-test04-navegacion{
  width:100% !important; padding:0 10px !important; margin:0 !important;
  display:flex !important; flex-direction:column !important;
  align-items:stretch !important; gap:8px !important;
}
body.arbol-page .menu-test04-item{
  width:100% !important; min-height:46px !important;
  display:flex !important; align-items:center !important;
  justify-content:center !important;
  padding:5px 3px !important; margin:0 !important;
  border-radius:6px !important;
  text-decoration:none !important;
  color:#f0e9dc !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  outline:none !important;
  cursor:pointer !important;
  position:relative !important;
}
body.arbol-page .menu-test04-item.activo{
  color:#e7b83f !important; background:#241900 !important;
}
body.arbol-page .menu-test04-item:hover,
body.arbol-page .menu-test04-item:focus,
body.arbol-page .menu-test04-item:focus-visible{
  color:#e7b83f !important;
  background:#241900 !important;
  outline:none !important;
}
body.arbol-page .menu-test04-item::before,
body.arbol-page .menu-test04-item::after{
  content:none !important; display:none !important;
}
body.arbol-page .menu-test04-icono{
  width:100% !important; flex:0 0 auto !important;
  display:block !important; text-align:center !important;
  color:#d8a63a !important;
  font-size:30px !important; line-height:1 !important;
  pointer-events:none !important;
}
body.arbol-page .menu-test04-frase{
  position:absolute !important; left:12px !important; right:12px !important;
  bottom:55px !important; padding-top:15px !important;
  border-top:1px solid #b78a22 !important;
  text-align:center !important; color:#e7b83f !important;
  font:italic 12px/1.45 Georgia,"Times New Roman",serif !important;
}

/* El contenido queda siempre a la derecha del menú en horizontal. */
@media (orientation:landscape){
  body.arbol-page .arbol-pantalla{
    position:absolute !important;
    left:170px !important; right:0 !important; top:0 !important; bottom:0 !important;
    width:calc(100vw - 170px) !important;
    height:100dvh !important;
    margin:0 !important; overflow:hidden !important;
  }
}

/* Vertical: exactamente la disposición compacta aprobada en TEST-04. */
@media (max-width:760px) and (orientation:portrait){
  body.arbol-page .menu-test04{
    position:relative !important; left:auto !important; top:auto !important; bottom:auto !important;
    width:100% !important; min-width:0 !important; height:auto !important;
    border-right:0 !important; border-bottom:1px solid #b78a22 !important;
    box-shadow:none !important; padding-bottom:5px !important;
    overflow:hidden !important;
  }
  body.arbol-page .menu-test04-escudo{
    height:78px !important; min-height:78px !important;
  }
  body.arbol-page .menu-test04-escudo img{
    width:82px !important; height:70px !important;
  }
  body.arbol-page .menu-test04-titulo{
    font-size:15px !important; margin:-2px 6px 6px !important;
  }
  body.arbol-page .menu-test04-navegacion{
    display:grid !important;
    grid-template-columns:repeat(2,1fr) !important;
    gap:4px !important; padding:0 7px !important;
  }
  body.arbol-page .menu-test04-item{
    min-height:48px !important; padding:3px !important;
  }
  body.arbol-page .menu-test04-icono{font-size:26px !important}
  body.arbol-page .menu-test04-frase{display:none !important}
  body.arbol-page .arbol-pantalla{
    position:relative !important; left:auto !important; right:auto !important;
    top:auto !important; bottom:auto !important;
    width:100% !important; height:auto !important;
    min-height:calc(100dvh - 125px) !important; margin:0 !important;
  }
}


/* PWA-SIMPLE-108 — Matices finales del menú y POP UP del Árbol. */

/* 1) POP UPS del Árbol: reservar el ancho del menú en horizontal,
      y colocar el visor por encima del menú en móvil vertical. */
@media (orientation: landscape){
  body.arbol-page .hermano-popup{
    left:170px !important;
    right:0 !important;
    width:auto !important;
    inset-block:0 !important;
    padding:18px !important;
  }
}
@media (orientation: portrait) and (max-width:760px){
  body.arbol-page .hermano-popup{
    left:0 !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:100% !important;
    z-index:2147483647 !important;
    padding:10px !important;
  }
  body.arbol-page .hermano-popup-fondo{
    z-index:0 !important;
  }
  body.arbol-page .hermano-popup-card{
    z-index:1 !important;
    width:96vw !important;
    max-width:96vw !important;
    max-height:94dvh !important;
    margin:0 auto !important;
  }
}

/* 2) Árbol horizontal/escritorio: escudo un poco mayor que TEST-04,
      pero coherente con el menú compartido. */
@media (orientation: landscape) and (min-width:761px){
  body.arbol-page .menu-test04-escudo{
    height:136px !important;
    min-height:136px !important;
  }
  body.arbol-page .menu-test04-escudo img{
    width:136px !important;
    height:116px !important;
  }
  body.arbol-page .menu-test04-titulo{
    font-size:17px !important;
    margin:-3px 6px 9px !important;
  }
  body.arbol-page .menu-test04-icono{
    font-size:27px !important;
  }
}

/* 3) Árbol en móvil horizontal: el menú conserva la columna vertical,
      pero con las mismas proporciones compactas que las demás páginas. */
@media (orientation: landscape) and (max-width:760px){
  body.arbol-page .menu-test04{
    width:170px !important;
    min-width:170px !important;
    height:100dvh !important;
  }
  body.arbol-page .menu-test04-escudo{
    height:78px !important;
    min-height:78px !important;
  }
  body.arbol-page .menu-test04-escudo img{
    width:78px !important;
    height:58px !important;
  }
  body.arbol-page .menu-test04-titulo{
    font-size:12px !important;
    margin:0 4px 4px !important;
  }
  body.arbol-page .menu-test04-icono{
    font-size:22px !important;
  }
  body.arbol-page .menu-test04-item{
    min-height:38px !important;
    height:38px !important;
  }
  body.arbol-page .menu-test04-frase{
    bottom:5px !important;
    font-size:9px !important;
    line-height:1.15 !important;
  }
}

/* 4) Árbol en móvil vertical: conservar dos columnas, pero recuperar
      la frase inferior del menú compartido. */
@media (orientation: portrait) and (max-width:760px){
  body.arbol-page .menu-test04{
    padding-bottom:8px !important;
  }
  body.arbol-page .menu-test04-frase{
    display:block !important;
    position:relative !important;
    left:auto !important; right:auto !important; bottom:auto !important;
    margin:8px 10px 4px !important;
    padding-top:7px !important;
    font-size:10px !important;
    line-height:1.25 !important;
  }
}

/* 5) Resto de páginas: en horizontal también mantienen el menú vertical,
      no una cuadrícula de dos columnas. */
@media (orientation: landscape) and (max-width:760px){
  body.seccion-page .menu-lateral-seccion{
    position:fixed !important;
    left:0 !important; top:0 !important; bottom:0 !important;
    width:170px !important; min-width:170px !important;
    height:100dvh !important;
    min-height:0 !important;
    border-right:1px solid #b78a22 !important;
    border-bottom:0 !important;
    overflow:hidden !important;
    z-index:50000 !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-escudo{
    height:78px !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-escudo img{
    width:78px !important; height:58px !important;
    object-fit:contain !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-titulo{
    font-size:12px !important;
    margin:0 4px 4px !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-navegacion{
    display:flex !important;
    flex-direction:column !important;
    gap:5px !important;
    padding:0 7px !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-item{
    min-height:38px !important; height:38px !important;
    display:flex !important; align-items:center !important;
    justify-content:flex-start !important;
    gap:7px !important; padding:3px 6px !important;
    font-size:12px !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-icono{
    width:30px !important; flex:0 0 30px !important;
    font-size:22px !important; text-align:center !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-label{
    display:inline !important;
  }
  body.seccion-page .menu-lateral-seccion .menu-frase{
    left:8px !important; right:8px !important; bottom:5px !important;
    font-size:9px !important; line-height:1.15 !important;
  }
  body.seccion-page .seccion-contenido{
    position:fixed !important;
    left:170px !important;
    top:0 !important;
    width:calc(100vw - 170px) !important;
    height:100dvh !important;
  }
}

/* 6) Evitar tooltips nativos por title en los menús compartidos. */
body.seccion-page .menu-lateral-seccion a[title]{
  /* El atributo se elimina también del HTML en esta versión. */
}


/* PWA-SIMPLE-109 — Ajuste fino del Árbol en ordenador.
   No modifica el menú aprobado en móvil. */

/* Escudo del menú del Árbol: igualar al tamaño del menú compacto común. */
@media (orientation: landscape) and (min-width:761px){
  body.arbol-page .menu-test04-escudo{
    height:150px !important;
    min-height:150px !important;
  }
  body.arbol-page .menu-test04-escudo img{
    width:150px !important;
    height:126px !important;
    object-fit:contain !important;
  }

  /* El POP UP queda centrado exclusivamente en el área de contenido,
     nunca debajo del menú lateral. */
  body.arbol-page .hermano-popup{
    left:170px !important;
    right:0 !important;
    width:auto !important;
    padding:18px 24px !important;
    justify-content:center !important;
    align-items:center !important;
  }
  body.arbol-page .hermano-popup-card{
    width:min(1040px, calc(100vw - 220px)) !important;
    max-width:calc(100vw - 220px) !important;
    max-height:92vh !important;
    margin:0 auto !important;
  }
}

/* Los + son controles transparentes: su centro coincide exactamente con
   los círculos + de la imagen original del usuario. */
body.arbol-page .arbol-plus{
  z-index:3000 !important;
}


/* PWA-SIMPLE-110 — Igualación final del escudo y tooltip del menú Árbol. */
@media (orientation: landscape) and (min-width:761px){
  body.arbol-page .menu-test04-escudo{
    height:170px !important;
    min-height:170px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
  }
  body.arbol-page .menu-test04-escudo img{
    width:190px !important;
    height:150px !important;
    object-fit:cover !important;
    object-position:left top !important;
  }
  body.arbol-page .menu-test04-item[title]{cursor:pointer !important}
}


/* PWA-SIMPLE-111 — Ajuste fino del escudo y tooltip del menú Árbol. */
@media (orientation: landscape) and (min-width:761px){
  body.arbol-page .menu-test04-escudo{
    height:125px !important;
    min-height:125px !important;
  }
  body.arbol-page .menu-test04-escudo img{
    width:125px !important;
    height:105px !important;
    object-fit:contain !important;
    object-position:center !important;
  }
  body.arbol-page .menu-test04-item[title]{cursor:pointer !important}
  body.arbol-page .menu-test04-icono[title]{cursor:pointer !important}
}


/* PWA-SIMPLE-112 — El tooltip del menú del Árbol debe ser idéntico al resto
   de páginas: title en el enlace <a>, no en el icono. */
@media (orientation: landscape) and (min-width:761px){
  body.arbol-page .menu-test04-item[title]{
    cursor:pointer !important;
  }
  body.arbol-page .menu-test04-icono[title]{
    /* no debe existir; se deja neutro para evitar un segundo tooltip */
  }
}


/* PWA-SIMPLE-113 — Nueva página Árbol construida desde pagina9.html.
   El menú anterior no se modifica. */
.arbol-nuevo-contenido{
  padding:0 !important;
  overflow:hidden !important;
  align-items:center !important;
  justify-content:center !important;
}
.arbol-nuevo-marco{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-sizing:border-box;
  padding:12px 12px 12px 12px;
}
.arbol-nuevo-imagen{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  max-width:100%;
  max-height:100%;
}
@media(max-width:760px) and (orientation:portrait){
  .arbol-nuevo-contenido{
    height:calc(100vh - 290px) !important;
    min-height:360px !important;
  }
  .arbol-nuevo-marco{
    padding:8px;
  }
  .arbol-nuevo-imagen{
    width:100%;
    height:100%;
    object-fit:contain;
  }
}
@media(max-width:760px) and (orientation:landscape){
  .arbol-nuevo-contenido{
    position:fixed !important;
    left:170px !important;
    top:0 !important;
    width:calc(100vw - 170px) !important;
    height:100dvh !important;
  }
  .arbol-nuevo-marco{
    padding:6px;
  }
}


/* PWA-SIMPLE-114 — Integración del Árbol en la página limpia basada en 9.
   El menú NO se modifica. */

body.arbol-page .arbol-nuevo-contenido{
  position:relative !important;
  overflow:hidden !important;
}

body.arbol-page .arbol-nuevo-marco{
  position:relative !important;
}

body.arbol-page .arbol-nuevo-imagen{
  position:relative !important;
  z-index:1 !important;
}

/* Los controles + y POP UP quedan por encima de la imagen. */
body.arbol-page .arbol-plus,
body.arbol-page .hermano-popup{
  z-index:3000 !important;
}


/* PWA-SIMPLE-125 — FASE 1 / PASO 1: INICIO.
   No modifica menú, POP UP ni los siete +. */
body.seccion-page .arbol-inicio-contenedor{
  position:relative !important;
}
body.seccion-page #enlace-inicio-arbol{
  position:absolute !important;
  z-index:3200 !important;
  display:block !important;
  background:transparent !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  text-decoration:none !important;
}


/* PWA-SIMPLE-130 — PASO 2 FRANCISCO.
   Único cambio estructural: activar el contenedor que popup-hermanos.js
   necesita para posicionar las zonas. */
body.arbol-page .arbol-interactivo .hermano-popup-trigger{
  cursor:pointer !important;
  pointer-events:auto !important;
}


/* PWA-SIMPLE-143 — posiciones de los seis POP UP copiadas de PWA-094.
   Solo ordenador: no modifica el sistema móvil. */
@media (min-width:761px){
  body.arbol-page .hermano-popup-trigger{
    position:absolute !important;
    top:300px !important;
    width:170px !important;
    height:315px !important;
    z-index:1490 !important;
    pointer-events:auto !important;
    cursor:pointer !important;
  }
  body.arbol-page .hermano-popup-trigger.trigger-francisco{left:42px !important}
  body.arbol-page .hermano-popup-trigger.trigger-rosa{left:248px !important}
  body.arbol-page .hermano-popup-trigger.trigger-manuel{left:456px !important}
  body.arbol-page .hermano-popup-trigger.trigger-juan{left:664px !important}
  body.arbol-page .hermano-popup-trigger.trigger-laura{left:872px !important}
  body.arbol-page .hermano-popup-trigger.trigger-vicente{left:1080px !important}
}


/* PWA-SIMPLE-146 — CORRECCIÓN DE ZONA VICENTE.
   Solo ordenador. Los POP UP no se modifican. */
@media (min-width:761px){
  body.seccion-page .hermano-popup-trigger.trigger-vicente{
    left:1288px !important;
  }
}
/* PWA-SIMPLE-148 — CORRECCIÓN DE ZONA LAURA.
   Solo ordenador. No se modifica ningún POP UP. */
@media (min-width:761px){
  body.seccion-page .hermano-popup-trigger.trigger-laura{
    left:1080px !important;
  }
}
/* PWA-SIMPLE-150 — AJUSTE DE POSICIONES DE ZONAS
   Solo ordenador. No modifica POP UP, INICIO ni +. */
@media (min-width:761px){
  /* Primer grupo: separar las zonas que estaban superpuestas. */
  body.seccion-page .hermano-popup-trigger.trigger-rosa{
    left:250px !important;
  }
  body.seccion-page .hermano-popup-trigger.trigger-manuel{
    left:460px !important;
  }

  /* Segundo grupo: centrar Laura y Vicente sobre sus fotografías. */
  body.seccion-page .hermano-popup-trigger.trigger-laura{
    left:1040px !important;
  }
  body.seccion-page .hermano-popup-trigger.trigger-vicente{
    left:1248px !important;
  }
}

/* PWA-SIMPLE-160 — ESCUDOS SIN ENLACE
   Los escudos son exclusivamente decorativos. */
.pareja-escudo.escudo-sin-enlace{
  cursor:default !important;
  pointer-events:none !important;
  user-select:none !important;
}

/* PWA-SIMPLE-162 — MENÚ LATERAL HORIZONTAL EN COLUMNA
   Único cambio funcional: en horizontal los cuatro iconos/enlaces del
   menú lateral se presentan en una columna vertical. El modo vertical
   no se modifica. */
@media (orientation: landscape) and (min-width:761px){
  .menu-lateral-seccion .menu-navegacion{
    display:flex !important;
    flex-direction:column !important;
    flex-wrap:nowrap !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
  }
  .menu-lateral-seccion .menu-item{
    display:flex !important;
    flex:0 0 auto !important;
    width:100% !important;
    box-sizing:border-box !important;
  }
}

/* PWA-SIMPLE-163 — FOTOGRAFÍAS HORIZONTALES EN VISOR
   En horizontal se reserva espacio para el menú lateral.
   Las fotos verticales prácticamente no cambian porque quedan limitadas
   por su altura. No modifica el modo vertical. */
@media (orientation: landscape) and (min-width:761px){
  .seccion-page .visor-fotografias .visor-contenido{
    padding-left:210px !important;
    padding-right:70px !important;
  }
  .seccion-page .visor-fotografias .visor-contenido img{
    max-width:calc(100vw - 370px) !important;
  }
}


/* PWA-SIMPLE-171 — POP UP VERTICAL FINAL
   Corrección única y limpia:
   - toma como referencia el menú lateral real de 290px CSS;
   - coloca la tarjeta inmediatamente debajo del menú;
   - pone el POP UP por encima del z-index del menú para que nunca oculte
     la X ni la cabecera;
   - recupera toda la altura restante de la pantalla.
   El modo horizontal no se modifica. */
@media (orientation: portrait) and (max-width:760px){
  body.seccion-page .hermano-popup{
    position:fixed !important;
    top:290px !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    inset:auto 0 0 0 !important;
    padding:0 10px 8px !important;
    display:none !important;
    align-items:flex-start !important;
    justify-content:center !important;
    z-index:60000 !important;
    box-sizing:border-box !important;
  }

  body.seccion-page .hermano-popup.abierto{
    display:flex !important;
  }

  body.seccion-page .hermano-popup-fondo{
    z-index:0 !important;
  }

  body.seccion-page .hermano-popup-card{
    position:relative !important;
    z-index:1 !important;
    margin:0 !important;
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    height:calc(100dvh - 290px - 8px) !important;
    max-height:none !important;
    box-sizing:border-box !important;
    overflow:auto !important;
  }

  body.seccion-page .hermano-popup-cerrar{
    position:absolute !important;
    right:12px !important;
    top:10px !important;
    z-index:10 !important;
  }
}

/* PWA-SIMPLE-172 — JUAN VERTICAL
   Solo refuerza la zona táctil de Juan en móvil vertical.
   El resto de posiciones y el modo horizontal quedan intactos. */
@media (orientation: portrait) and (max-width:760px){
  body.seccion-page .hermano-popup-trigger.trigger-juan{
    z-index:14999 !important;
    pointer-events:auto !important;
  }
}

/* PWA-SIMPLE-173 — BLOQUEO HORIZONTAL APROBADO
   El cambio de Juan es solo vertical. Estas reglas fijan de nuevo la
   geometría horizontal aprobada para que ningún ajuste móvil pueda
   escorar los POP UP bajo el menú lateral. */
@media (orientation: landscape) and (min-width:761px){
  body.seccion-page .hermano-popup{
    position:fixed !important;
    left:170px !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:auto !important;
    inset-block:0 !important;
    padding:18px 18px 18px 220px !important;
    box-sizing:border-box !important;
    align-items:center !important;
    justify-content:center !important;
  }
  body.seccion-page .hermano-popup-card{
    width:min(1040px, calc(100vw - 238px)) !important;
    max-width:calc(100vw - 238px) !important;
    max-height:92vh !important;
    margin:0 auto !important;
    box-sizing:border-box !important;
  }
}
