/* GamePass.es — /sorteo/ (01-11-2026, lienzo «El Nexo 3» → Pro-Sorteo-Web). Cartel a todo el ancho con portadas de fondo,
   pasos en tarjetas y letra pequeña discreta. Cian, blanco y oscuro; sin logos de marcas. */
html{color-scheme:dark;background:#080d14}
body{margin:0;min-height:100vh;background:#080d14}
@media (min-width:1181px){
  body>footer{display:none!important}
  /* Sin la cabecera de sección ni los iconos de los lados: el cartel hace de cabecera. */
  .so-page main.n-main>header.nxm-shell-hero,.so-page #nx-ambient-sides{display:none!important}
  .so-page .n-news-scroll{padding:0!important}
  .so-page .n-news-interior.nh{max-width:none!important;padding:0!important;margin:0!important}
  .so-page .gpu-shead{display:none!important}
}
@media (max-width:1180px){
  .so-page .gpu-shead{min-height:0;padding-bottom:0;background:none!important;gap:0}
  .so-page .gpu-shead::before,.so-page .gpu-shead::after{display:none!important}
  .so-page .gpu-shead-tx{display:none}
}

.so{display:flex;flex-direction:column;gap:0;padding-bottom:28px;text-align:left}
.so .so-cta,.so a.so-cta{color:#04121a!important;text-decoration:none!important}
.so-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Cartel ---------- */
.so-hero{position:relative;isolation:isolate;overflow:hidden;background:#080d14}
.so-mos{position:absolute;z-index:-3;display:grid;gap:14px;pointer-events:none}
.so-mos img{display:block;width:100%;height:auto;aspect-ratio:400/229;border-radius:12px;object-fit:cover}
.so-hero::before{content:"";position:absolute;inset:0;z-index:-2}
.so-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 55% at 86% 8%,rgba(0,212,255,.22),rgba(0,212,255,0) 70%)}
.so-in{position:relative;display:flex;flex-direction:column;gap:14px}
.so-eye{font:800 15px/1 "Barlow Condensed",sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#7ee7ff}
.so-h{margin:0;font:400 64px/.9 "Bebas Neue",sans-serif;color:#fff;letter-spacing:.005em}
.so-h em{font-style:normal;color:#00d4ff}
.so-elige{margin:0;font:800 19px/1.25 Barlow,sans-serif;color:#fff}.so-elige span{color:#00d4ff}
.so-cubo{position:absolute;display:block;height:auto;aspect-ratio:1;border-radius:18.75%;transform:rotate(12deg);box-shadow:0 30px 70px -20px rgba(0,212,255,.75),0 0 60px -10px rgba(0,212,255,.45)}
/* GTA VI destacada (Sergi 01-11): una portada nítida, girada como el fondo, encima de él. */
.so-gta{position:absolute;z-index:0;display:block;height:auto;border-radius:12px;transform:rotate(-9deg);box-shadow:0 0 0 2px rgba(255,255,255,.14),0 26px 50px -18px rgba(0,0,0,.9)}
.so-colab{display:flex;align-items:center;gap:10px;margin:2px 0 0;font:600 13.5px/1 Barlow,sans-serif;color:#9aa8b6}
.so-colab img{display:block;width:112px;height:auto}

/* Cuenta atrás */
.so-cd{display:flex;gap:8px}
.so-cd>div{min-width:72px;padding:10px 10px 9px;border-radius:12px;background:rgba(5,10,16,.72);box-shadow:inset 0 0 0 1px rgba(126,231,255,.2);text-align:center;backdrop-filter:blur(6px)}
.so-cd b{display:block;font:400 34px/1 "Bebas Neue",sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.so-cd span{display:block;margin-top:3px;font:800 10.5px/1 "Barlow Condensed",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8fa3b5}
.so-cd>.is-tx{min-width:0;padding:12px 16px}.so-cd>.is-tx b{font-size:26px}

/* Botón y estados */
.so-acc{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.so-form{margin:0}
.so-cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:58px;padding:0 34px;border:0;border-radius:14px;box-sizing:border-box;
  background:#00d4ff;color:#04121a;font:800 18px/1 Barlow,sans-serif;text-decoration:none;cursor:pointer;box-shadow:0 18px 40px -16px rgba(0,212,255,.95);transition:transform .15s ease,box-shadow .15s ease}
.so-cta:hover{transform:translateY(-1px);box-shadow:0 22px 46px -16px rgba(0,212,255,1)}
.so-cta svg{width:20px;height:20px;flex:none}
.so-cta[disabled]{background:rgba(255,255,255,.07);color:#9aa8b6;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);cursor:default;transform:none}
.so-cta:focus-visible,.so-b2:focus-visible,.so a:focus-visible{outline:2px solid #7ee7ff;outline-offset:3px}
.so-sub{margin:0;font:600 13px/1.4 Barlow,sans-serif;color:#9aa8b6}.so-sub a{color:#7ee7ff}
.so-b2{display:flex;align-items:center;justify-content:center;width:100%;height:48px;border:0;border-radius:12px;background:rgba(5,10,16,.6);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);color:#fff;font:700 15px/1 Barlow,sans-serif;cursor:pointer;box-sizing:border-box}
.so-ok{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:rgba(0,212,255,.1);box-shadow:inset 0 0 0 1.5px rgba(0,212,255,.55)}
.so-ok i{flex:none;width:34px;height:34px;border-radius:50%;background:#00d4ff;color:#04121a;display:grid;place-items:center;font:800 18px/1 Barlow,sans-serif;font-style:normal}
.so-ok b{display:block;font:800 16px/1.25 Barlow,sans-serif;color:#fff}.so-ok p{margin:3px 0 0;font:500 13.5px/1.45 Barlow,sans-serif;color:#c9d3dd}
.so-aviso{margin:0;padding:11px 13px;border-radius:12px;background:rgba(255,190,80,.1);box-shadow:inset 0 0 0 1px rgba(255,190,80,.4);font:600 13.5px/1.4 Barlow,sans-serif;color:#ffd99a}
.so-caras{display:flex;align-items:center;gap:10px;margin:0;font:600 13px/1.3 Barlow,sans-serif;color:#b6c2ce}.so-caras b{color:#fff}
.so-fc{display:flex}.so-fc>*{margin-left:-7px}.so-fc>*:first-child{margin-left:0}

/* ---------- Pasos ---------- */
.so-bloque{display:flex;flex-direction:column;gap:14px}
.so-tit{margin:0;font:800 13px/1 "Barlow Condensed",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#7ee7ff}
.so-pasos{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:p}
.so-pasos li{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 18px 18px;border-radius:16px;background:linear-gradient(170deg,#0f1a25,#0a1119);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.so-pasos li::before{counter-increment:p;content:counter(p);display:grid;place-items:center;width:34px;height:34px;margin-bottom:6px;border-radius:10px;background:rgba(0,212,255,.14);box-shadow:inset 0 0 0 1px rgba(0,212,255,.35);font:400 22px/1 "Bebas Neue",sans-serif;color:#7ee7ff}
.so-pasos b{font:800 16px/1.25 Barlow,sans-serif;color:#fff}
.so-pasos span{font:500 14px/1.45 Barlow,sans-serif;color:#aab6c3}

/* ---------- Letra pequeña ---------- */
.so-letra{display:grid;gap:10px 28px;padding-top:16px;border-top:1px solid rgba(255,255,255,.07)}
.so-letra p{margin:0;text-align:left;font:500 12px/1.55 Barlow,sans-serif;color:#7d8c9c}
.so-letra b{color:#aab6c3;font-weight:700}
.so-letra a{color:#7ee7ff}

/* ================= Móvil ================= */
@media (max-width:1180px){
  .so{gap:22px}
  .so-hero{margin:0 -16px;padding:150px 16px 24px}
  .so-mos{left:-45%;right:-45%;top:-14%;grid-template-columns:repeat(4,1fr);transform:rotate(-9deg);opacity:.4}
  .so-hero::before{background:linear-gradient(180deg,rgba(8,13,20,.35) 0%,rgba(8,13,20,.5) 24%,rgba(8,13,20,.9) 48%,#080d14 80%)}
  .so-cubo{right:22px;top:22px;width:112px;height:112px}
  .so-gta{left:18px;top:18px;width:min(48vw,200px)}
  .so-in{gap:13px}
  .so-eye{font-size:13px}
  .so-h{font-size:clamp(58px,17vw,76px)}
  .so-cd>div{flex:1;min-width:0}
  .so-pasos{gap:10px}
  .so-pasos li{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:14px 15px}
  .so-pasos li::before{margin:0}
  .so-pasos b{flex:1}
  .so-pasos span{flex-basis:100%}
}

/* ================= Escritorio ================= */
@media (min-width:1181px){
  .so{gap:34px;padding:0 0 40px}
  .so-hero{min-height:clamp(560px,74vh,700px);display:flex;align-items:flex-end}
  .so-in{padding:56px 56px 54px;max-width:760px;gap:16px}
  .so-h{font-size:clamp(96px,8.4vw,132px)}
  .so-elige{font-size:24px}
  .so-cd>div{min-width:86px;padding:12px 12px 10px}
  .so-cd b{font-size:42px}
  .so-acc{flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px 18px}
  .so-acc .so-cta{width:auto;min-width:300px;height:64px;font-size:19px}
  .so-acc .so-b2{width:auto;padding:0 22px}
  .so-acc .so-ok{flex-basis:100%;max-width:620px}
  .so-bloque,.so-letra{margin:0 56px}
  .so-pasos{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .so-pasos li{padding:22px 22px 22px;min-height:150px}
  .so-letra{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

/* Escritorio: portadas giradas, texto a la izquierda, cubo grande y GTA VI a la derecha. */
@media (min-width:1181px){
  .so .so-mos{left:-12%;right:-12%;top:-30%;grid-template-columns:repeat(5,1fr);gap:18px;transform:rotate(-9deg);opacity:.36}
  .so .so-hero::before{background:linear-gradient(90deg,#080d14 0%,rgba(8,13,20,.92) 30%,rgba(8,13,20,.55) 62%,rgba(8,13,20,.35) 100%),linear-gradient(0deg,#080d14 0%,rgba(8,13,20,0) 45%)}
  .so .so-cubo{right:6%;top:11%;width:clamp(200px,19vw,270px)}
  .so .so-gta{right:12%;bottom:13%;width:clamp(260px,25vw,360px)}
}