/* ============================================================
   CARNE LATENTE — TOUR 360°
   Entrada al recorrido, modal panorámico, marcadores y panel
   de obra. Prefijo tv-. Paleta y easing de la casa.
   ============================================================ */

/* Bloqueo de scroll con el modal abierto */
html.tv-locked{overflow:hidden}

/* ---------- Entrada (.tv-enter) ---------- */
.tv-enter{
  min-height:100svh;align-content:center;
  padding-block:clamp(80px,11vw,150px);
  background:var(--bg-2);
  box-shadow:0 0 0 100vmax var(--bg-2);clip-path:inset(0 -100vmax);
}
.tv-enter-title{
  margin:0 0 18px;
  font:300 clamp(34px,4.6vw,68px)/1.04 var(--serif);
  letter-spacing:-.02em;
}
.tv-enter-text{
  margin:0;max-width:46ch;
  font:300 17px/1.65 var(--sans);color:var(--secondary);
}
.tv-enter .tv-enter-btn{margin-top:28px}
.tv-enter-hint{
  margin:14px 0 0;
  font:300 12px/1.6 var(--sans);color:var(--muted);
}

/* Vista previa: botón sin estilo del navegador */
.tv-enter-preview{
  position:relative;display:block;width:100%;padding:0;
  aspect-ratio:2.25/1;overflow:hidden;
  border:1px solid var(--line);border-radius:3px;
  background:var(--bg);cursor:pointer;
  -webkit-appearance:none;appearance:none;
}
.tv-enter-preview picture,.tv-enter-preview img{display:block;width:100%;height:100%}
.tv-enter-preview img{object-fit:cover;transition:transform .8s cubic-bezier(.22,.61,.24,1),filter .8s cubic-bezier(.22,.61,.24,1)}
.tv-enter-preview::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 45%,rgba(11,7,8,.55) 100%);
}
.tv-enter-preview:hover img{transform:scale(1.03);filter:saturate(1.2)}
.tv-enter-preview:focus-visible{outline:1px solid var(--accent2);outline-offset:3px}
.tv-enter-badge{
  position:absolute;left:16px;bottom:14px;z-index:2;
  font:400 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;
  color:var(--text);border:1px solid var(--accent2);padding:6px 12px;
  background:rgba(11,7,8,.55);
}

@media(min-width:900px){
  .tv-enter .container-xxl,.tv-enter.container-xxl{
    display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:clamp(36px,6vw,88px);align-items:center;
  }
}
@media(max-width:899px){
  .tv-enter{display:flex;flex-direction:column;justify-content:center}
  .tv-enter-copy{margin-bottom:32px}
}

/* ---------- Modal ---------- */
.tv-modal{
  position:fixed;inset:0;width:100%;height:100%;height:100svh;
  max-width:none;max-height:none;margin:0;border:0;padding:0;
  background:var(--bg);color:var(--text);
}
.tv-modal[open]{display:flex;flex-direction:column}
.tv-modal::backdrop{background:#000}
.tv-modal-top{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:calc(12px + env(safe-area-inset-top)) var(--pad) 12px;
  border-bottom:1px solid var(--line);
}
.tv-modal-title{
  margin:0;font:400 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;
  color:var(--secondary);
}
.tv-modal-room{color:var(--text)}
.tv-modal-close{
  min-width:44px;min-height:44px;display:grid;place-items:center;
  background:transparent;border:1px solid var(--accent);color:var(--text);
  font:300 16px/1 var(--sans);cursor:pointer;padding:0 14px;
  transition:border-color .3s ease,color .3s ease;
}
.tv-modal-close:hover{border-color:var(--accent2);color:#fff}
.tv-modal-close:focus-visible{outline:1px solid var(--accent2);outline-offset:2px}

.tv-modal-stage{position:relative;flex:1;min-height:0;background:#0b0708}
.tv-pano{position:absolute;inset:0}
.tv-modal-loading{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  margin:0;font:italic 300 18px/1.5 var(--serif);color:var(--secondary);
  text-align:center;max-width:34ch;pointer-events:none;
}
.tv-modal-loading[hidden]{display:none}
.tv-modal-fallback{position:absolute;left:50%;bottom:24px;transform:translateX(-50%)}
.tv-modal-fallback[hidden]{display:none}

/* Sin controles de Pannellum: zoom propio, ocultamos lo que traiga la librería */
.tv-pano .pnlm-about-msg,.tv-pano .pnlm-load-box p + p,.tv-pano .pnlm-panorama-info,.tv-pano .pnlm-controls-container{display:none!important}
.tv-zoom{position:absolute;left:12px;top:12px;z-index:3;display:flex;flex-direction:column;gap:8px}
.tv-zoom button{
  width:44px;height:44px;display:grid;place-items:center;padding:0;
  background:rgba(20,12,14,.7);border:1px solid var(--line);border-radius:50%;
  font:300 22px/1 var(--sans);color:var(--text);cursor:pointer;
  transition:border-color .3s ease,background-color .3s ease;
}
.tv-zoom button:hover{border-color:var(--accent2);background:rgba(140,31,53,.45)}
.tv-zoom button:focus-visible{outline:1px solid var(--accent2);outline-offset:2px}

/* Selector de salas */
.tv-rooms{
  display:flex;justify-content:center;gap:10px;
  padding:14px var(--pad) calc(14px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line);background:var(--bg);
  max-width:100%;overflow-x:auto;
}
.tv-room-btn{
  min-height:44px;padding:10px 20px;flex:none;
  background:transparent;border:1px solid var(--line);border-radius:999px;
  font:400 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;
  color:var(--secondary);cursor:pointer;white-space:nowrap;
  transition:border-color .3s ease,color .3s ease;
}
.tv-room-btn:hover{border-color:var(--accent2);color:var(--text)}
.tv-room-btn[aria-current="true"]{border-color:var(--accent2);color:var(--text)}
.tv-room-btn:focus-visible{outline:1px solid var(--accent2);outline-offset:2px}
.tv-modal-hint{
  margin:0;padding:0 var(--pad) calc(10px + env(safe-area-inset-bottom));
  text-align:center;font:300 12px/1.6 var(--sans);color:var(--muted);
}

/* ---------- Marcadores ---------- */
/* Pannellum posiciona el hotspot (position:absolute + transform): no tocarlos aquí. */
.tv-hs{
  position:absolute;display:grid;place-items:center;
  width:34px;height:34px;border-radius:50%;
  border:1px solid var(--accent2);background:rgba(11,7,8,.55);
  cursor:pointer;
}
.tv-hs-inner{
  display:grid;place-items:center;width:100%;height:100%;
  font:400 11px var(--sans);letter-spacing:.05em;color:var(--text);
  border-radius:50%;transition:background-color .3s ease;
}
.tv-hs:hover .tv-hs-inner,.tv-hs:focus-visible .tv-hs-inner{background:var(--accent)}
.tv-hs:focus-visible{outline:1px solid var(--accent2);outline-offset:2px}
.tv-hs-tag{
  display:none;position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);
  padding:6px 12px;white-space:nowrap;
  background:rgba(11,7,8,.85);border:1px solid var(--line);
  font:400 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--text);
}
.tv-hs:hover .tv-hs-tag,.tv-hs:focus-visible .tv-hs-tag,.tv-hs:focus-within .tv-hs-tag{display:block}
/* Etiqueta siempre visible bajo el marcador de siguiente sala */
.tv-hs-tag--always{
  display:block;bottom:auto;top:calc(100% + 10px);
  background:rgba(11,7,8,.75);
}
/* Siguiente sala: círculo grande con degradado vino→rojo y pulso */
.tv-hs--next{width:56px;height:56px;border:0;background:linear-gradient(120deg,var(--accent),var(--accent2))}
.tv-hs--next .tv-hs-inner{font-size:24px;background:none}
.tv-hs--next::before{
  content:"";position:absolute;inset:-1px;border-radius:50%;
  border:1px solid var(--accent2);
  animation:tv-hs-pulse 2.4s cubic-bezier(.22,.61,.24,1) infinite;
}
.tv-hs--next:hover .tv-hs-inner{background:none;filter:brightness(1.12)}
@keyframes tv-hs-pulse{
  0%{transform:scale(1);opacity:.9}
  70%{transform:scale(1.35);opacity:0}
  100%{transform:scale(1.35);opacity:0}
}
/* Nota discreta de la sala 3 */
.tv-hs--note{width:30px;height:30px;border-color:var(--line)}
.tv-hs--note .tv-hs-inner{font-family:var(--serif);font-style:italic;font-size:14px}
.tv-hs-note{
  display:none;position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);
  width:max-content;max-width:min(260px,60vw);padding:12px 14px;white-space:normal;
  background:rgba(11,7,8,.92);border:1px solid var(--accent);
  font:italic 300 15px/1.5 var(--serif);color:var(--text);text-align:left;
}
.tv-hs--note:hover .tv-hs-note,.tv-hs--note:focus-visible .tv-hs-note,.tv-hs--note:focus-within .tv-hs-note{display:block}

/* ---------- Tarjeta de obra (solo texto, a un lado) ---------- */
.tv-work{
  position:absolute;right:clamp(16px,2.4vw,32px);bottom:clamp(16px,3vw,40px);z-index:5;
  width:min(340px,34vw);padding:22px 24px 24px;
  background:rgba(11,7,8,.88);border:1px solid var(--accent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  animation:tv-work-in .5s cubic-bezier(.22,.61,.24,1);
}
.tv-work[hidden]{display:none}
@keyframes tv-work-in{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:none}
}
.tv-work-num{display:block;margin:0 0 8px;padding-right:32px;font:400 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--accent2)}
.tv-work-title{margin:0 0 12px;font:300 clamp(22px,2.4vw,28px)/1.08 var(--serif);text-transform:uppercase;letter-spacing:-.01em}
.tv-work-quote{margin:0;font:italic 300 17px/1.55 var(--serif);color:var(--secondary)}
.tv-work-close{
  position:absolute;top:10px;right:10px;width:36px;height:36px;display:grid;place-items:center;padding:0;
  background:transparent;border:1px solid var(--line);border-radius:50%;
  font:300 14px/1 var(--sans);color:var(--text);cursor:pointer;
  transition:border-color .3s ease;
}
.tv-work-close:hover{border-color:var(--accent2)}
.tv-work-close:focus-visible{outline:1px solid var(--accent2);outline-offset:2px}

@media(max-width:767px){
  .tv-work{
    left:12px;right:12px;bottom:12px;width:auto;
    max-height:44svh;overflow-y:auto;padding:18px 20px 20px;
  }
  .tv-hs-note{position:fixed;left:var(--pad);right:var(--pad);transform:none;max-width:none}
}

@media(prefers-reduced-motion:reduce){
  .tv-enter-preview img,.tv-hs::before,.tv-work{transition:none!important;animation:none!important}
  .tv-hs-tag,.tv-hs-note{transition:none}
}