/* Recorrido por el edificio ICSE (parallax 7 plantas). Compartido: home.html e historia.html.
   Los ajustes de móvil están en mobile.css. */
.tower{position:relative;height:760vh;background:#070f1c}
.tower-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;grid-template-columns:1fr 1fr}
.tower-stars{position:absolute;inset:0;background:
  radial-gradient(1.4px 1.4px at 12% 18%, rgba(255,255,255,.8), transparent),
  radial-gradient(1.2px 1.2px at 28% 42%, rgba(255,255,255,.55), transparent),
  radial-gradient(1.6px 1.6px at 62% 25%, rgba(255,255,255,.7), transparent),
  radial-gradient(1.2px 1.2px at 78% 60%, rgba(255,255,255,.5), transparent),
  radial-gradient(1.3px 1.3px at 88% 14%, rgba(255,255,255,.65), transparent),
  radial-gradient(1.1px 1.1px at 45% 72%, rgba(255,255,255,.4), transparent),
  linear-gradient(180deg,#0a1426 0%,#0b1a30 55%,#0c2038 100%);
  z-index:0}
/* columna del edificio (izquierda) */
.tower-stage{position:relative;grid-column:1;overflow:hidden;z-index:1;perspective:1700px;perspective-origin:50% 45%}
.tower-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.tower-fallback{display:none;width:100%;height:auto}
.tower-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;display:flex;gap:7px;transition:opacity .5s}
.tower-loading span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.65);animation:tld 1s infinite ease-in-out}
.tower-loading span:nth-child(2){animation-delay:.15s}
.tower-loading span:nth-child(3){animation-delay:.3s}
@keyframes tld{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-7px)}}
.floor-scan{position:absolute;left:0;right:0;height:14%;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,105,180,0) 0%,rgba(30,144,224,.16) 45%,rgba(30,144,224,.16) 55%,rgba(0,105,180,0) 100%);
  border-top:1.5px solid rgba(120,200,255,.55);border-bottom:1.5px solid rgba(120,200,255,.55);
  box-shadow:0 0 40px rgba(40,150,230,.35);transition:top .6s cubic-bezier(.22,.61,.36,1);top:43%}
.tower-vignette{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,transparent 60%,rgba(7,15,28,.9) 100%),
             linear-gradient(180deg,rgba(7,15,28,.5) 0%,transparent 18%,transparent 82%,rgba(7,15,28,.6) 100%)}
/* panel de contenido (derecha) */
.tower-panel{position:relative;grid-column:2;z-index:3;display:flex;flex-direction:column;justify-content:center;padding:0 6vw 0 4vw;color:#fff}
.tower-head .eyebrow{color:var(--orange)}
.tower-head h2{font-size:clamp(28px,3.4vw,46px);margin:14px 0 0;color:#fff}
.tower-head h2 b{font-weight:800}
.tower-intro{color:rgba(255,255,255,.72);font-size:16px;line-height:1.6;margin-top:16px;max-width:430px}
.tower-hint{display:inline-flex;align-items:center;gap:9px;margin-top:22px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55);transition:opacity .4s}
.tower-hint svg{width:18px;height:18px;animation:bobArrow 1.6s ease-in-out infinite}
@keyframes bobArrow{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
/* tarjetas de planta */
.floor-cards{position:relative;margin-top:30px;min-height:208px}
.floor-card{position:absolute;inset:0;opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease;pointer-events:none}
.floor-card.active{opacity:1;transform:none;pointer-events:auto}
.floor-card .fnum{display:flex;align-items:baseline;gap:12px}
.floor-card .fnum .lvl{font-weight:800;font-size:54px;line-height:.9;letter-spacing:-.03em;color:var(--blue-bright);font-variant-numeric:tabular-nums}
.floor-card .fnum .ftag{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.floor-card h3{font-size:25px;font-weight:800;margin-top:12px;color:#fff;letter-spacing:-.01em}
.floor-card p{color:rgba(255,255,255,.75);font-size:15px;line-height:1.6;margin-top:8px;max-width:420px}
.floor-card .flink{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-weight:700;font-size:14px;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);padding:10px 18px;border-radius:999px;transition:.2s}
.floor-card .flink:hover{background:var(--orange);border-color:var(--orange)}
.floor-card .flink svg{width:15px;height:15px}
/* ascensor */
.elevator{position:absolute;left:calc(50% - 30px);top:50%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;gap:7px;background:rgba(8,16,30,.6);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:9px 7px}
.elv-btn{position:relative;width:46px;height:34px;border:0;background:transparent;color:rgba(255,255,255,.55);font-family:inherit;font-weight:800;font-size:13px;border-radius:999px;cursor:pointer;transition:.2s;font-variant-numeric:tabular-nums}
.elv-btn:hover{color:#fff;background:rgba(255,255,255,.08)}
.elv-btn.on{background:var(--orange);color:#fff;box-shadow:0 6px 16px -6px rgba(236,98,22,.8)}
@media(max-width:980px){
  .tower{height:auto}
  .tower-sticky{position:relative;height:auto;grid-template-columns:1fr;display:block}
  .tower-stage{position:relative;height:auto}
  .tower-canvas{display:none}
  .tower-fallback{display:block}
  .tower-panel{padding:34px 24px 40px}
  .elevator{display:none}
  .floor-scan{display:none}
  .floor-cards{min-height:230px}
}

/* Recorrido: oculto hasta que se abre; botón para cerrarlo */
.tower[hidden]{display:none}
.tower-close{position:absolute;top:96px;right:24px;z-index:6;display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);color:#fff;font-family:inherit;font-weight:700;font-size:13px;padding:10px 16px;border-radius:999px;cursor:pointer;transition:.2s}
.tower-close:hover{background:#fff;color:var(--ink)}
.tower-close svg{width:15px;height:15px}

.tower-skip{text-decoration:none}
/* Versión siempre visible (historia): algo más corta que en la home */
.tower[data-mode="inline"]{height:620vh}
@media(max-width:980px){.tower-close{top:88px;right:16px}}
/* Móvil: el botón "Saltar el recorrido" nunca pisa el titular */
@media(max-width:980px){
  .tower-skip{font-size:12.5px !important;padding:7px 12px !important}
  .tower[data-mode="inline"] .tower-head{padding-right:136px}
}
