/* ============================================
   Stazione virtuale 3D — esperienza navigabile in tempo reale
   ============================================ */
.st3d-root{position:relative;width:100%;aspect-ratio:16/9;max-height:78vh;min-height:340px;background:#04101f;
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}
.st3d-root canvas{display:block;width:100%;height:100%;outline:none;touch-action:none;}

.st3d-root [hidden]{display:none !important;}
.st3d-start,.st3d-fallback{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 120% at 50% 0%,rgba(10,46,102,.92),rgba(4,16,31,.97));padding:18px;}
.st3d-start-card{max-width:520px;text-align:center;color:#fff;}
.st3d-start-icon{font-size:2.6rem;margin-bottom:6px;}
.st3d-start-card h2{font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:clamp(1.5rem,4vw,2.1rem);margin:.2em 0;}
.st3d-start-card p{color:#dbe7f4;font-size:.95rem;}
.st3d-controls-legend{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left;margin:16px 0;font-size:.78rem;color:#cfe0f0;}
.st3d-controls-legend div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 12px;}
.st3d-controls-legend strong{color:var(--gold);display:block;margin-bottom:3px;font-size:.82rem;}
.st3d-start-note{font-size:.72rem;color:#9db2c8;margin-top:12px;}
@media(max-width:640px){.st3d-controls-legend{grid-template-columns:1fr;}}

.st3d-loading{position:absolute;inset:0;z-index:35;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;
  background:#04101f;color:#cfe0f0;font-size:.85rem;}
.st3d-loading-bar{width:min(280px,70%);height:6px;border-radius:99px;background:rgba(255,255,255,.15);overflow:hidden;}
.st3d-loading-bar span{display:block;height:100%;width:0%;background:linear-gradient(90deg,var(--aqua),var(--gold));transition:width .25s ease;}

.st3d-crosshair{position:absolute;top:50%;left:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;
  background:#fff;box-shadow:0 0 0 1.5px rgba(0,0,0,.5);z-index:20;pointer-events:none;}

.st3d-hud{position:absolute;top:12px;left:12px;right:12px;z-index:20;display:flex;justify-content:space-between;
  align-items:flex-start;gap:8px;pointer-events:none;}
.st3d-hud-badge{pointer-events:none;background:rgba(4,16,31,.72);color:#fff;font-size:.74rem;border-radius:999px;
  padding:7px 13px;backdrop-filter:blur(6px);}
.st3d-hud-exit{pointer-events:auto;background:rgba(4,16,31,.72);color:#fff;border:0;border-radius:999px;
  padding:7px 13px;font-size:.78rem;font-weight:700;cursor:pointer;backdrop-filter:blur(6px);}
.st3d-hud-exit:hover{background:rgba(4,16,31,.92);}

.st3d-hotspot-btn{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:25;
  background:var(--gold);color:#1d2f45;border:0;border-radius:999px;padding:10px 18px;font-weight:800;
  font-size:.85rem;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.35);animation:st3d-pop .5s ease;}
@keyframes st3d-pop{from{transform:translateX(-50%) scale(.8);opacity:0}to{transform:translateX(-50%) scale(1);opacity:1}}

.st3d-panel{position:absolute;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;
  background:rgba(4,16,31,.62);padding:16px;}
.st3d-panel-card{position:relative;max-width:440px;width:100%;background:#fff;border-radius:16px;padding:22px 22px 18px;
  box-shadow:0 24px 60px rgba(0,0,0,.4);max-height:80%;overflow:auto;}
.st3d-panel-card h3{margin:0 0 8px;color:var(--navy);font-family:Georgia,"Times New Roman",serif;}
.st3d-panel-card p{font-size:.9rem;color:#41586a;}
.st3d-panel-close{position:absolute;top:10px;right:12px;border:0;background:#eef4f9;color:var(--navy2);
  width:28px;height:28px;border-radius:50%;cursor:pointer;font-weight:800;}

.st3d-joy{position:absolute;left:20px;bottom:20px;width:104px;height:104px;border-radius:50%;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);z-index:22;touch-action:none;}
.st3d-joy-nub{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;
  background:rgba(255,255,255,.55);}
.st3d-look-zone{position:absolute;right:0;top:0;bottom:0;width:55%;z-index:21;touch-action:none;}

@media(max-width:700px){.st3d-root{aspect-ratio:auto;height:78vh;max-height:none;border-radius:0;}}