/* Guía digital de Orce — marca turística «ORCE · Primeros Pobladores de Europa» + ambiente del Altiplano. */
@font-face{font-family:Jost;font-weight:600;font-display:swap;src:url(/fonts/jost-600.woff2) format("woff2")}
@font-face{font-family:Jost;font-weight:700;font-display:swap;src:url(/fonts/jost-700.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(/fonts/inter-400.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:600;font-display:swap;src:url(/fonts/inter-600.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:700;font-display:swap;src:url(/fonts/inter-700.woff2) format("woff2")}
:root{
  /* Marca (muestreada del logo) */
  --naranja:#E37D29;--teja:#D35327;--verde:#9CB82B;--azul:#3396D3;--azul-osc:#3172B8;--negro:#111111;
  /* Neutros Altiplano */
  --bg:#F4EEE5;--card:#FFFFFF;--line:#E3D8C8;--ink:#19181B;--mute:#6B5E52;--ocre:#4C1712;
  /* Roles */
  --pri:var(--naranja);--pri-ink:var(--negro);--acc:var(--verde);--acc-ink:var(--negro);--info:var(--azul-osc);
  --fs:16px;--tit:Jost,"Futura","Century Gothic",system-ui,sans-serif;--txt:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r:14px
}
html.contraste{--bg:#000;--card:#111;--ink:#fff;--mute:#e6e6e6;--pri:#FFB066;--pri-ink:#000;--line:#777;--ocre:#000}
*{box-sizing:border-box}
html{font-size:var(--fs)}
body{margin:0;font-family:var(--txt);background:#d9cfbf;color:var(--ink)}
h1,h2,h3,.tit{font-family:var(--tit);font-weight:700;letter-spacing:.005em}
.etq{font-family:var(--tit);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem}
@media(min-width:600px){body{display:flex;justify-content:center;align-items:flex-start;padding:24px 0;background:#2a211b}
 #telefono{width:400px;height:860px;border-radius:44px;border:12px solid #111;box-shadow:0 20px 60px #0008;overflow:hidden;position:relative}}
#telefono{background:var(--bg);display:flex;flex-direction:column;min-height:100vh;position:relative}
@media(min-width:600px){#telefono{min-height:0}}
header.barra{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--card);color:var(--ink);position:sticky;top:0;z-index:10;border-bottom:1px solid var(--line)}
header.barra .logo{height:40px;width:auto;display:block}
header.barra h1{font-size:1rem;margin:0;flex:1;line-height:1.15;font-weight:600}
header.barra button,header.barra a{background:transparent;border:2px solid transparent;color:inherit;font:600 .95rem var(--tit);padding:6px 8px;border-radius:10px;cursor:pointer;text-decoration:none;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
header.barra button:hover,header.barra a:hover{border-color:var(--line)}
main#vista{flex:1;overflow-y:auto;padding:14px 14px 90px}
nav.tabs{position:absolute;bottom:0;left:0;right:0;display:flex;background:var(--card);border-top:1px solid var(--line);z-index:20}
@media(max-width:599px){nav.tabs{position:fixed}}
nav.tabs a{flex:1;text-align:center;padding:8px 2px 10px;color:var(--mute);text-decoration:none;font-size:.7rem;min-height:56px;border-top:3px solid transparent}
nav.tabs a span{display:block;font-size:1.25rem}
nav.tabs a b{font-weight:600}
nav.tabs a[aria-current=page]{color:var(--ink);border-top-color:var(--pri)}
a{color:var(--ink)}
:focus-visible{outline:3px solid var(--azul-osc);outline-offset:2px}
html.contraste :focus-visible{outline-color:#FFB066}
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--pri);color:var(--pri-ink);border:0;border-radius:999px;padding:10px 16px;font:600 .92rem var(--tit);letter-spacing:.02em;cursor:pointer;text-decoration:none;min-height:44px}
.btn.sec{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
.btn.acc{background:var(--verde);color:var(--negro)}
.btn:disabled{opacity:.5}
.fila{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
/* Portada: paisaje a sangre con degradado y línea temporal */
.hero{margin:-14px -14px 0;position:relative;min-height:330px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:18px 16px 16px;background:#3a2a20 center/cover no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,17,17,0) 25%,rgba(17,17,17,.55) 60%,rgba(17,17,17,.88) 100%)}
.hero>*{position:relative}
.hero .etq{color:#FFC48F}
.hero h2{font-size:1.75rem;line-height:1.1;margin:6px 0 6px;color:#fff}
.hero p{margin:0;color:#f3ece2;font-size:.95rem}
.linea-t{margin:0 -14px 12px;background:var(--ocre);color:#f4e6d6;padding:10px 14px 12px;font-family:var(--tit)}
.linea-t ol{list-style:none;margin:0;padding:12px 0 0;display:flex;justify-content:space-between;position:relative}
.linea-t ol::before{content:"";position:absolute;left:4px;right:4px;top:5px;height:2px;background:linear-gradient(90deg,var(--teja),var(--naranja),var(--verde),var(--azul))}
.linea-t li{position:relative;text-align:center;font-size:.66rem;line-height:1.2;flex:1}
.linea-t li::before{content:"";display:block;width:10px;height:10px;border-radius:50%;background:#f4e6d6;margin:-11px auto 6px;border:2px solid var(--ocre)}
.linea-t li b{display:block;font-size:.78rem;color:#fff}
.linea-t .etq{color:#e9c9a8}
.accesos{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.accesos a{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:10px 4px;text-align:center;color:var(--ink);text-decoration:none;font-size:.7rem;line-height:1.2;font-weight:600}
.accesos a span{display:block;font-size:1.45rem;margin-bottom:4px}
/* Tarjetas de guía: foto con degradado y título encima */
.tarjeta{position:relative;border-radius:var(--r);overflow:hidden;margin:12px 0;display:block;color:#fff;text-decoration:none;min-height:190px;background:#3a2a20}
.tarjeta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tarjeta::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,17,17,0) 30%,rgba(17,17,17,.85) 100%)}
.tarjeta .c{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;z-index:1}
.tarjeta h3{margin:4px 0 2px;font-size:1.2rem;color:#fff}
.tarjeta p{margin:0;color:#efe6da;font-size:.82rem}
.tarjeta .epoca{position:absolute;top:10px;right:10px;z-index:1;background:rgba(76,23,18,.9);color:#fff;font:600 .7rem var(--tit);padding:4px 9px;border-radius:999px;letter-spacing:.04em}
.chip{display:inline-block;font:600 .68rem var(--tit);text-transform:uppercase;letter-spacing:.06em;padding:3px 9px;border-radius:999px;background:var(--line);color:var(--ink);margin-right:4px}
.chip.c-naranja{background:var(--naranja);color:var(--negro)}.chip.c-teja{background:var(--teja);color:var(--negro)}.chip.c-verde{background:var(--verde);color:var(--negro)}.chip.c-azul{background:var(--azul-osc);color:#fff}.chip.c-azulc{background:var(--azul);color:var(--negro)}
html.contraste .chip{background:#333;color:#fff}
.lista{list-style:none;margin:0;padding:0}
.lista li a{display:flex;gap:10px;align-items:center;padding:10px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin:8px 0;color:var(--ink);text-decoration:none}
.lista img{width:58px;height:58px;object-fit:cover;border-radius:10px}
.num{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:28px;border-radius:8px;background:var(--negro);color:#fff;font:700 .85rem var(--tit);letter-spacing:.04em}
.poi-hero{margin:-14px -14px 10px;position:relative;min-height:260px;display:flex;align-items:flex-end;color:#fff}
.poi-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.poi-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,17,17,0) 40%,rgba(17,17,17,.82) 100%)}
.poi-hero .num{position:absolute;left:14px;top:14px;z-index:1;background:var(--pri);color:var(--pri-ink)}
.poi-hero .tt{position:relative;z-index:1;padding:14px 16px}
.poi-hero .tt h2{color:#fff;margin:4px 0 0;font-size:1.5rem;line-height:1.15}
.poi-hero .tt .etq{color:#FFC48F}
h2{font-size:1.3rem;margin:8px 0 8px}
.texto{line-height:1.65;font-size:1rem}
.aviso{background:#fff;border:1px solid var(--line);border-left:5px solid var(--azul-osc);border-radius:10px;padding:10px 12px;font-size:.88rem;margin:10px 0;color:var(--ink)}
html.contraste .aviso{background:#222;color:#fff;border-color:#FFB066}
.ok{border-left-color:var(--verde)}
.seccion{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin:12px 0}
.seccion h3{margin:0 0 8px;font-size:1rem}
audio,video{width:100%}
model-viewer{width:100%;height:320px;background:radial-gradient(circle at 50% 35%,#fff,#E9DFD0 70%);border-radius:var(--r)}
.mapa{height:300px;border-radius:var(--r);border:1px solid var(--line)}
.mapa.alto{height:440px}
.teclado{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:300px;margin:16px auto}
.teclado button{font:600 1.4rem var(--tit);padding:14px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);min-height:56px}
.pantalla{font:700 2rem var(--tit);text-align:center;letter-spacing:.3em;padding:10px;border:2px solid var(--ink);border-radius:14px;background:var(--card);max-width:300px;margin:0 auto;min-height:62px}
.toast{position:absolute;left:12px;right:12px;top:66px;background:var(--negro);color:#fff;padding:12px 14px;border-radius:14px;z-index:50;box-shadow:0 8px 24px #0006;font-size:.9rem;border-left:5px solid var(--naranja)}
@media(max-width:599px){.toast{position:fixed}}
.toast a{color:#FFC48F}
.financia{display:flex;gap:10px;align-items:center;font-size:.72rem;color:var(--mute);padding:12px 0;border-top:1px solid var(--line);margin-top:18px}
.financia strong{color:var(--ink)}
.quiz button.op{display:block;width:100%;text-align:left;margin:6px 0;padding:12px;border-radius:12px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:600 1rem var(--txt)}
.quiz button.op.bien{border-color:#5f7a10;background:#eef5d8;color:#26330a}
.quiz button.op.mal{border-color:#a33;background:#fbe6e6;color:#5a1010}
.insignias{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.insignia{text-align:center;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:10px;font-size:.75rem}
.insignia span{font-size:2rem;display:block}
.insignia.off{opacity:.4;filter:grayscale(1)}
#pano{width:100%;height:260px;border-radius:var(--r)}
.perfil svg{width:100%;height:auto;background:var(--card);border:1px solid var(--line);border-radius:12px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center;font-size:.75rem}
.stats b{display:block;font:700 1.1rem var(--tit)}
.facil{font-size:1.15rem;line-height:1.8}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
select,input,textarea{font:inherit;padding:8px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);min-height:44px}
label{font-size:.92rem}
fieldset{border:1px solid var(--line)}
.candado{text-align:center;padding:20px}
.candado span{font-size:3rem}
/* Comparador antes / ahora */
.comparar{position:relative;overflow:hidden;border-radius:12px;aspect-ratio:4/3;background:#000}
.comparar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cmp-sup{position:absolute;inset:0}
.cmp-linea{position:absolute;top:0;bottom:0;width:3px;background:#fff;box-shadow:0 0 6px #0008;transform:translateX(-1px);pointer-events:none}
.cmp-et{position:absolute;top:8px;background:rgba(17,17,17,.75);color:#fff;font:600 .7rem var(--tit);padding:3px 8px;border-radius:6px;letter-spacing:.03em}
.cmp-et.izq{left:8px}.cmp-et.der{right:8px}
/* Viaje a la Prehistoria: toque de juego, mismos colores */
.juego{background:linear-gradient(180deg,#fff,#f6fae8);border:2px solid var(--verde)}
.cartas{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:10px 0;padding:0;list-style:none}
.carta{display:block;background:var(--card);border:3px solid var(--verde);border-radius:16px;overflow:hidden;color:var(--ink);text-decoration:none;box-shadow:0 3px 0 #6f861a;position:relative}
.carta img{width:100%;height:110px;object-fit:cover;display:block}
.carta .c{padding:8px 10px}
.carta .c strong{font-family:var(--tit);font-size:.95rem;display:block;line-height:1.15}
.carta .nc{position:absolute;top:6px;left:6px;background:var(--negro);color:#fff;font:700 .7rem var(--tit);border-radius:999px;padding:2px 8px}
.carta .sel{position:absolute;top:6px;right:6px;background:var(--verde);color:var(--negro);font:700 .7rem var(--tit);border-radius:999px;padding:2px 8px}
.sellos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sello{border:2px dashed var(--line);border-radius:12px;padding:6px;text-align:center;font-size:.72rem;display:flex;flex-direction:column;gap:3px;filter:grayscale(1);opacity:.6;background:#fff}
.sello img{width:100%;height:60px;object-fit:cover;border-radius:8px}
.sello.si{border-style:solid;border-color:var(--verde);filter:none;opacity:1;position:relative}
.sello.si::after{content:"✓";position:absolute;top:4px;right:6px;background:var(--verde);color:var(--negro);border-radius:50%;width:22px;height:22px;line-height:22px;font-weight:700}
/* Pantalla de bienvenida con el logo oficial */
#splash{position:absolute;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:100;transition:opacity .4s}
#splash img{width:62%;max-width:240px;height:auto}
#splash.fuera{opacity:0;pointer-events:none}
@media(max-width:599px){#splash{position:fixed}}
@media(prefers-reduced-motion:reduce){#splash{transition:none}}
header.barra [hidden]{display:none!important}