/*
Theme Name: Museo Caral XR
Theme URI: https://3d.zonacaral.gob.pe
Author: Virtual Studio
Description: Tema liviano para la colección 3D de la Zona Arqueológica Caral. Tres diseños automáticos: pantalla táctil vertical (1080x1920), celular con AR y PC en dos columnas. Sin dependencias de terceros.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: caral-xr
*/

/* ===== Fuentes (incluidas en el tema, sin Google Fonts) ===== */
@font-face{font-family:"Poppins";font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/poppins-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Poppins";font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/poppins-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Poppins";font-weight:600;font-style:normal;font-display:swap;src:url(assets/fonts/poppins-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Marcellus SC";font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/marcellus-sc-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Marcellus SC";font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/marcellus-sc-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ===== Variables ===== */
:root{
  --oro:#dab280; --fondo:#1a1919; --texto:#f2efe9; --icono:#817f72;
  --titulo:"Marcellus SC",Georgia,serif; --cuerpo:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;
  --nav-h:92px;
}

/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box}
html{background:var(--fondo);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;min-height:100dvh;color:var(--texto);font-family:var(--cuerpo);
  background:linear-gradient(to bottom,transparent,var(--fondo) 45%),url(assets/img/fondo-movil.jpg) center top/cover no-repeat;
  background-color:var(--fondo);
  overflow-x:hidden;
}
img{max-width:100%;height:auto}
a{color:inherit}
h1,h2{font-family:var(--titulo);font-weight:400;color:var(--oro);text-transform:none;letter-spacing:normal;margin:0}
p{margin:0 0 .8em}

.logo{position:absolute;top:14px;left:14px;z-index:60;width:40px;opacity:.9;line-height:0}
.logo img{width:100%}

/* ===== Visor 3D (model-viewer) ===== */
model-viewer{
  display:block;width:100%;background:transparent;outline:none;
  --poster-color:transparent;
  --progress-bar-color:rgba(128,128,128,.6);     /* gris medio transparente (antes: rojo en móvil) */
  --progress-bar-height:6px;
}
model-viewer::part(default-progress-bar){height:6px;background-color:rgba(128,128,128,.55)}
model-viewer::part(default-ar-button){bottom:14px;right:14px}
.pieza__visor .progress-bar{display:none}          /* restos del snippet antiguo, ya no hacen falta */
.pieza__visor p{margin:0;font-size:0;line-height:0}  /* wpautop mete el visor en un <p> */

/* ===== Ficha de pieza — MÓVIL (por defecto) ===== */
.pieza{min-height:100vh;min-height:100dvh;padding:0 0 calc(var(--nav-h) + 24px)}
.pieza__visor model-viewer{display:block;width:100%!important;height:70vh!important;height:70svh!important;min-height:380px;max-height:none}
.pieza__texto{padding:0 28px;text-align:center}
.pieza__titulo{font-size:46px;line-height:1.05;padding:0 6%;margin:4px 0 14px}
.pieza__descripcion p{font-size:17px;line-height:26px;opacity:.92;margin:0 0 .7em}
.pieza__codigo{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--oro);opacity:.85;margin:.4em 0 0}
.pieza__volver{margin:18px 0 0;font-size:13px;opacity:.75}
.pieza__volver a{text-decoration:none;border-bottom:1px solid rgba(218,178,128,.4)}

/* ===== Menú inferior ===== */
.menu-zonas{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:47px 0 max(8px,env(safe-area-inset-bottom));
  background:linear-gradient(to top,rgba(26,25,25,.97) 68%,rgba(26,25,25,0))}
.menu-zonas ul{list-style:none;margin:0;padding:0 1.5%;display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.menu-zonas ul::-webkit-scrollbar{display:none}
.menu-zonas li{flex:0 0 20%;scroll-snap-align:center;text-align:center}
.menu-zonas a{display:flex;flex-direction:column;align-items:center;gap:3px;text-decoration:none;color:var(--icono);padding:2px 0;-webkit-tap-highlight-color:transparent}
.menu-zonas img{width:35px;height:35px;object-fit:contain;opacity:.8;transition:opacity .2s,transform .2s}
.menu-zonas span{font-family:var(--titulo);font-size:12px;line-height:1.1;color:var(--texto);opacity:.85;white-space:nowrap}
.menu-zonas a[aria-current="page"] img,.menu-zonas a:hover img{opacity:1;transform:translateY(-2px)}
.menu-zonas a[aria-current="page"] span{color:var(--oro);opacity:1}

/* ===== Zona (rejilla de piezas) ===== */
.zona,.texto{padding:84px 18px calc(var(--nav-h) + 24px);max-width:1500px;margin:0 auto}
.zona__titulo{font-size:38px;line-height:1.05;text-align:center;margin:0 0 24px}
.zona__rejilla{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:22px 14px}
.zona__rejilla a{display:flex;flex-direction:column;align-items:center;text-decoration:none;text-align:center;gap:8px}
.zona__rejilla img{width:100%;aspect-ratio:1/1;object-fit:contain}
.zona__rejilla span{font-family:var(--titulo);font-size:15px;line-height:1.2;color:var(--texto)}
.zona__vacia{text-align:center;opacity:.8}
.texto__cuerpo{font-size:17px;line-height:1.7}

/* ===== Inicio ===== */
.inicio{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 22px calc(var(--nav-h) + 30px)}
.inicio__titulo{font-size:clamp(64px,22vw,150px);line-height:1;color:var(--texto);letter-spacing:.02em}
.inicio__sub{font-size:16px;opacity:.85;margin:10px 0 28px}
.inicio__zonas{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px 12px;max-width:560px;width:100%}
.inicio__zonas a{display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none}
.inicio__zonas img{width:64px;height:64px;object-fit:contain;opacity:.9}
.inicio__zonas span{font-family:var(--titulo);font-size:14px}

/* ===== PANTALLA TÁCTIL vertical (1080×1920): mismas posiciones que el diseño actual, SIN botón AR ===== */
.modo-kiosco body{
  background:linear-gradient(to bottom,transparent,var(--fondo) 45%),url(assets/img/fondo.jpg) center top/cover no-repeat;background-color:var(--fondo);
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
}
.modo-kiosco{--nav-h:10vh}
.modo-kiosco .logo{top:1.4vw;left:1.4vw;width:4vw}
.modo-kiosco model-viewer::part(default-ar-button){display:none}
.modo-kiosco .pieza{padding:3vh 0 calc(var(--nav-h) + 1vh);display:flex;flex-direction:column;min-height:100vh}
.modo-kiosco .pieza__visor model-viewer{height:70vh!important;min-height:0;max-height:none}
.modo-kiosco .pieza__texto{padding:0 7%;margin-top:1vh}
.modo-kiosco .pieza__titulo{font-size:10.5vw;line-height:1.04;padding:1vh 4% 0;margin-bottom:2.2vh}
.modo-kiosco .pieza__descripcion p{font-size:2.85vw;line-height:1.5}
.modo-kiosco .pieza__codigo{font-size:2vw}
.modo-kiosco .pieza__volver{display:none}
.modo-kiosco .menu-zonas ul{overflow:visible;padding:0 1%;scroll-snap-type:none}
.modo-kiosco .menu-zonas li{flex:1 1 0;min-width:0}
.modo-kiosco .menu-zonas img{width:5.2vw;height:5.2vw}
.modo-kiosco .menu-zonas span{font-size:1.7vw}
.modo-kiosco .zona,.modo-kiosco .texto{padding-top:11vh}
.modo-kiosco .zona__titulo{font-size:9vw}
.modo-kiosco .zona__rejilla{grid-template-columns:repeat(3,1fr);gap:4vh 2vw}
.modo-kiosco .zona__rejilla span{font-size:2.6vw}
.modo-kiosco .inicio__titulo{font-size:22vw}
.modo-kiosco .inicio__sub{font-size:3vw}
.modo-kiosco .inicio__zonas{max-width:80vw;gap:4vh 3vw}
.modo-kiosco .inicio__zonas img{width:10vw;height:10vw}
.modo-kiosco .inicio__zonas span{font-size:2.6vw}

/* ===== PC (horizontal): 3D a la izquierda, texto a la derecha, menú abajo ===== */
.modo-pc body{
  background:linear-gradient(to bottom,rgba(26,25,25,.15),var(--fondo) 92%),url(assets/img/fondo.jpg) center top/cover no-repeat fixed;background-color:var(--fondo);
}
.modo-pc{--nav-h:96px}
.modo-pc .logo{top:22px;left:26px;width:46px}
.modo-pc .pieza{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:0;
  min-height:100vh;padding:0 0 var(--nav-h);max-width:none;margin:0}
.modo-pc .pieza__visor{align-self:start}
.modo-pc .pieza__visor model-viewer{height:calc(100vh - var(--nav-h))!important;min-height:420px;max-height:none}
.modo-pc .pieza__texto{text-align:left;padding:0 6vw 0 4.5vw;max-width:none}
.modo-pc .pieza__titulo{font-size:clamp(2.8rem,5vw,5.6rem);line-height:1.06;padding:0;margin:0 0 .5em}
.modo-pc .pieza__titulo::after{content:"";display:block;width:72px;height:2px;margin-top:.55em;background:var(--oro);opacity:.6}
.modo-pc .pieza__descripcion p{font-size:clamp(1.05rem,1.35vw,1.4rem);line-height:1.85}
.modo-pc .pieza__codigo{font-size:.9rem;margin-top:1.2em}
.modo-pc .pieza__volver{margin-top:2em;font-size:.95rem}
.modo-pc .menu-zonas{padding:60px 0 14px}
.modo-pc .menu-zonas ul{justify-content:flex-start;gap:0;overflow-x:auto;scroll-snap-type:x proximity;padding:0;margin:0 auto;width:calc(112px * 7.45);max-width:100%;
  -webkit-mask-image:linear-gradient(to right,#000 88%,transparent);mask-image:linear-gradient(to right,#000 88%,transparent);scrollbar-width:none}
.modo-pc .menu-zonas ul::-webkit-scrollbar{display:none}
.modo-pc .menu-zonas li{flex:0 0 112px;scroll-snap-align:start}
.modo-pc .menu-zonas img{width:48px;height:48px}
.modo-pc .menu-zonas span{font-size:13px}
.modo-pc .zona__rejilla{grid-template-columns:repeat(5,1fr);gap:34px 22px}
.modo-pc .zona__titulo{font-size:clamp(2.6rem,4vw,4.2rem);margin-bottom:.8em}
.modo-pc .zona__rejilla span{font-size:1.1rem}
.modo-pc .inicio__zonas{grid-template-columns:repeat(9,1fr);max-width:1100px}
.modo-pc .inicio__zonas img{width:72px;height:72px}

/* ===== Accesibilidad / preferencias ===== */
a:focus-visible{outline:2px solid var(--oro);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Legibilidad del título sobre el cielo claro (móvil/PC) */
.zona__titulo,.pieza__titulo{text-shadow:0 2px 18px rgba(0,0,0,.85),0 0 4px rgba(0,0,0,.45)}

.modo-kiosco .menu-zonas{padding-top:calc(14px + 4.4vh)}
.pieza__codigo{white-space:pre-line;line-height:1.7}
.modo-kiosco .pieza{padding-bottom:calc(var(--nav-h) + 6vh)}
.modo-pc .pieza{padding-bottom:var(--nav-h)}
.modo-kiosco .pieza__codigo{font-size:1.9vw;line-height:1.5}