/* Ocio (página 50280) — maqueta INT-OCIO (escritorio) y UX-OCIO (móvil). Marcado en inc/ocio.php; la escena .si-plano y
   el bloque .si-mover vienen de playas.css. */
.si-oculto{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.si-ocio-ranking .si-interior h1{font-size:clamp(40px,6vw,84px);line-height:1;max-width:760px;text-shadow:0 2px 18px rgba(0,0,0,.55)}
.si-ocio-ranking .si-entradilla{max-width:600px}

/* Ranking: tarjeta con número grande, nombre, zona y texto */
.si-ranking{list-style:none;margin:8px 0 32px!important;padding:0;display:grid;gap:14px}
.si-rk{position:relative;margin:0;padding:14px 16px 6px;border-radius:16px;background:rgba(10,8,26,.66);border:1px solid rgba(255,255,255,.13);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);scroll-margin-top:90px}
.si-interior .wp-block-post-content .si-rk h3{margin:0 0 0 clamp(64px,17vw,84px)!important;padding:0;font-size:clamp(23px,6vw,28px);line-height:1.15;text-align:left}
.si-interior .wp-block-post-content .si-rk h3::before{display:none}
.si-interior .si-rk .si-rk__num{display:block;position:absolute;left:14px;top:6px;margin:0;vertical-align:baseline;font:700 clamp(62px,17vw,76px)/.9 var(--wp--preset--font-family--titulos,Georgia,serif);
  color:color-mix(in srgb,var(--c) 45%,#ff4d8d);letter-spacing:-.04em;text-shadow:0 0 22px color-mix(in srgb,var(--c) 50%,transparent),0 2px 4px rgba(0,0,0,.6);background:none;
  min-width:0;height:auto;padding:0;border-radius:0}
.si-rk__zona{display:inline-block;margin:6px 0 0 clamp(64px,17vw,84px);padding:3px 12px;border-radius:999px;font:600 14px/1.4 system-ui,sans-serif;
  color:#fff;background:color-mix(in srgb,var(--c) 42%,rgba(20,8,24,.8));border:1px solid color-mix(in srgb,var(--c) 70%,transparent)}
.si-rk__txt{margin:12px 0 0}
.si-rk__txt p{margin:0 0 .6em}
.si-rk .si-mas{min-height:40px}

/* «Moverse por Ibiza»: Discobus y taxi */
.si-mover--ocio .si-mover__lista{grid-template-columns:repeat(2,minmax(0,1fr))}
.si-mover--ocio .si-mover__det,.si-mover--ocio .si-mover__mas{display:none}
.si-mover--ocio .si-mover__lista .si-ico{width:30px;height:30px;color:var(--c);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--c) 50%,transparent))}

/* Escritorio ancho: la maqueta INT-OCIO tal cual. Cada local en su sitio de la carretera (top/left en % de la escena),
   letra en cqw para que todo escale junto. */
@media (min-width:1000px){
  .si-ocio-ranking .migas{position:relative;z-index:3}
  .si-interior .si-plano--ocio>h1{width:62%;font-size:5.1cqw}
  .si-interior .si-plano--ocio>.si-entradilla{top:13.2%;width:45%}
  .si-interior .si-plano>.si-ranking{inset:0;margin:0!important;display:block;pointer-events:none}
  .si-plano .si-rk{box-sizing:border-box;position:absolute;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);width:min(25%,calc((97 - var(--x)) * 1%));
    padding:0 0 0 7.2cqw;background:none;border:0;border-radius:0;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:auto}
  .si-interior .si-plano .si-rk .si-rk__num{left:0;top:-.3cqw;font-size:6.6cqw}
  .si-interior .wp-block-post-content .si-plano .si-rk h3{margin:0 0 .5cqw!important;font-size:2.05cqw;line-height:1.08;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 14px rgba(0,0,0,.55)}
  .si-plano .si-rk__zona{display:none}
  .si-plano .si-rk__txt{margin:0;font-size:1.22cqw;line-height:1.36}
  .si-plano .si-rk__txt p{margin:0 0 .4em}
  .si-plano .si-rk .si-texto.cortado{max-height:calc(1.36em * 4);-webkit-mask-image:linear-gradient(#000 60%,#0000);mask-image:linear-gradient(#000 60%,#0000)}
  .si-plano .si-rk .si-mas{min-height:0;margin-top:.2cqw;font-size:1.1cqw}
  /* Abierto: panel oscuro para que se lea sobre la escena y pise a los vecinos */
  .si-plano .si-rk:has(.si-mas[aria-expanded="true"]){z-index:2;padding:1cqw 1.2cqw 1cqw 8.4cqw;margin:-1cqw 0 0 -1.2cqw;border-radius:1.2cqw;
    background:rgba(10,8,26,.86);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
  .si-interior .si-plano .si-rk:has(.si-mas[aria-expanded="true"]) .si-rk__num{left:1.2cqw;top:.7cqw}

  /* Rótulos de lugar sobre la escena */
  .si-ocio__lugar{position:absolute;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);font:700 1.75cqw/1 var(--wp--preset--font-family--titulos,Georgia,serif);
    color:#fff;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 14px rgba(0,0,0,.6)}

  /* Moverse por Ibiza: al pie, Discobus | taxi con su raya en medio, publicidad a la derecha */
  .si-interior .si-plano>.si-mover--ocio{top:82.6%}
  .si-plano .si-mover--ocio .si-mover__lista{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;max-width:52cqw;margin-top:1.4cqw}
  .si-plano .si-mover--ocio .si-mover__lista li+li{border-left:1px solid rgba(255,255,255,.35);padding-left:2.6cqw}
  .si-plano .si-mover--ocio .si-mover__lista a{align-items:flex-start;gap:1.4cqw;padding-right:2cqw}
  .si-plano .si-mover--ocio .si-mover__lista .si-ico{width:4cqw;height:4cqw}
  .si-plano .si-mover--ocio .si-mover__lista strong{font:700 1.75cqw/1.15 var(--wp--preset--font-family--titulos,Georgia,serif);color:var(--c-txt)}
  .si-plano .si-mover--ocio .si-mover__det{display:block;font-size:1.25cqw;line-height:1.35;margin:.4cqw 0 .8cqw}
  .si-plano .si-mover--ocio .si-mover__mas{display:block;font:600 1.25cqw/1.2 system-ui,sans-serif;font-style:normal;color:var(--c-txt);text-decoration:underline;text-underline-offset:3px}
  .si-plano .si-mover--ocio .si-mover__mas::after{content:" →";text-decoration:none}
  .si-plano .si-mover--ocio .si-mover__lista small::after{content:none}
}
