/* Home "Jugar en serio" (/es/, /en/, /fr/). Hoja propia: todo va bajo .hv2. La tipografía (Archivo), el azul
   accesible de los botones y la cabecera son del sistema de diseño común (src/theme.css).
   Tono: cercano y con humor, pero con datos. La página se juega como una partida: el héroe es una mano de
   videojuegos reales, los resultados salen como "logros" y un marcador cuenta lo que has visto. */
.hv2{
  --ink:#0B1B30; --ink-2:#13263F; --paper:#F3F6FA; --white:#FFFFFF;
  --signal:#007EFE; --sky:#36B4FA;
  /* oro de trofeo: logros, récords y marcador. Solo sobre fondo oscuro o como fondo con texto --ink */
  --gold:#FFB547;
  /* azul oscuro de la marca para botones y enlaces con texto: #007EFE da 4:1 con blanco, por debajo del
     4,5:1 de WCAG AA para texto de 16 px; este da unos 5,5:1 y sigue siendo el azul de la casa */
  --action:#0064D1; --action-hover:#0073F0;
  --slate:#566A82; --rule:#D9E1EB; --mist:#A9B8CC;
  --gutter:clamp(16px,4vw,32px);
  background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--font-body);font-stretch:100%;
}
/* resets con especificidad de elemento (0,0,1): ganan a los globales de style.css por orden de carga y
   pierden frente a cualquier clase de componente (.hv2-lead, .hv2-link...). */
:where(.hv2) h1,:where(.hv2) h2,:where(.hv2) h3{margin:0;text-wrap:balance}
:where(.hv2) p{margin:0;text-wrap:pretty}
:where(.hv2) ul{list-style:none;margin:0;padding:0}
:where(.hv2) a{color:inherit}
.hv2 [hidden]{display:none!important}
.hv2-wrap{max-width:1200px;margin-inline:auto;padding-inline:var(--gutter)}
.hv2-section{padding-block:clamp(64px,7.5vw,104px);content-visibility:auto;contain-intrinsic-size:auto 900px}
.hv2 h2{font-size:clamp(32px,3.9vw,50px);line-height:1.02;letter-spacing:-.025em;font-weight:800;font-stretch:118%}
.hv2 .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hv2 :focus-visible{outline:3px solid var(--gold);outline-offset:3px}

/* botones y enlaces: sin flechas añadidas; el texto dice exactamente lo que pasa */
.hv2-actions{display:flex;flex-wrap:wrap;gap:12px}
.hv2-btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;border-radius:999px;font:680 16.5px/1.1 var(--font-body);text-decoration:none;transition:background-color .2s,box-shadow .2s,transform .2s}
.hv2-btn-primary{background:var(--action);color:#fff;box-shadow:0 5px 0 #003F86}
.hv2-btn-primary:hover{background:var(--action-hover)}
/* se hunde al pulsar, como un botón de recreativa */
.hv2-btn-primary:active{transform:translateY(4px);box-shadow:0 1px 0 #003F86}
.hv2-btn-quiet{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.34)}
.hv2-btn-quiet:hover{box-shadow:inset 0 0 0 1.5px #fff}
.hv2-link{font-weight:650;color:var(--action);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}
.hv2-link:hover{text-decoration-thickness:2.5px}
.hv2-head{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:20px 64px;align-items:end;margin-bottom:44px}
.hv2-head p{color:var(--slate);max-width:44ch}
.hv2-head .hv2-link{display:inline-block;margin-top:14px}

/* ============ héroe ============ */
.hv2-hero{position:relative;isolation:isolate;overflow:clip;background:var(--ink);color:#fff;padding-top:clamp(124px,11.5vw,168px)}
.hv2-hero::before{content:"";position:absolute;z-index:-1;right:-14%;top:4%;width:80%;height:96%;background:radial-gradient(closest-side,rgba(0,126,254,.32),rgba(0,126,254,0) 72%)}
.hv2-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(32px,4vw,64px);align-items:center;padding-bottom:clamp(64px,7vw,104px)}
/* el titular ocupa todo el ancho, como la pantalla de título de un juego; debajo, texto y mano de juegos */
.hv2 h1{grid-column:1/-1;grid-row:1;font-size:clamp(42px,5.6vw,82px);line-height:.96;letter-spacing:-.032em}
.hv2 h1.hv2-h1-long{font-size:clamp(38px,4.8vw,70px)} /* titular largo (FR): que no pase de tres líneas en escritorio */
.hv2-h1-a{font-stretch:122%;font-weight:840}
/* la coletilla va como una pegatina: el guiño del tono, no un segundo titular */
.hv2-h1-b{display:inline-block;margin-left:.2em;padding:.12em .36em .16em;border-radius:.2em;background:var(--gold);color:var(--ink);font-size:.46em;font-weight:760;font-stretch:112%;letter-spacing:-.015em;vertical-align:.32em;transform:rotate(-3deg)}
.hv2-hero-copy{grid-column:1;grid-row:2;align-self:start;padding-top:clamp(28px,3vw,44px)}
.hv2-lead{max-width:32em;color:#C3D0E0;font-size:clamp(17px,1.35vw,20px);line-height:1.55}
.hv2-hero .hv2-actions{margin-top:36px}

/* la mano de juegos: cinco portadas reales en abanico. Al pasar el ratón se abre un poco más. */
.hv2-hand{grid-column:2;grid-row:2;position:relative;aspect-ratio:1/.72;margin-top:-4%}
.hv2-hand ul{position:absolute;inset:0}
.hv2-hand li{--r:calc(var(--i) * 9deg);--x:calc(var(--i) * 13%);position:absolute;left:21%;bottom:12%;width:58%;transform-origin:50% 150%;transform:translateX(var(--x)) rotate(var(--r));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.hv2-hand li:nth-child(1),.hv2-hand li:nth-child(5){z-index:1}
.hv2-hand li:nth-child(2),.hv2-hand li:nth-child(4){z-index:2}
.hv2-hand li:nth-child(3){z-index:3}
.hv2-hand img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:14px 14px 0 0}
.hv2-hand span{display:block;padding:9px 14px 11px;border-radius:0 0 14px 14px;background:#fff;color:var(--ink);font-size:15px;font-weight:760;font-stretch:112%;line-height:1.2}
.hv2-hand li{border-radius:14px;box-shadow:0 30px 50px -24px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.06)}
.hv2-hero-grid:hover .hv2-hand li{--r:calc(var(--i) * 12deg);--x:calc(var(--i) * 17%)}

/* logros del héroe: resultados reales, con forma de aviso de videojuego */
.hv2-achs{grid-column:2;grid-row:2;align-self:stretch;position:relative;z-index:5;pointer-events:none}
.hv2-ach{position:absolute;display:flex;align-items:center;gap:12px;max-width:19em;padding:12px 18px 12px 12px;border-radius:16px;background:rgba(19,38,63,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 0 1px rgba(255,181,71,.45),0 24px 40px -20px rgba(0,0,0,.8);color:#fff;font-size:15px;font-weight:620;line-height:1.3;text-decoration:none;pointer-events:auto}
.hv2-ach svg{flex:none;width:38px;height:38px;padding:8px;border-radius:11px;background:var(--gold);color:var(--ink)}
.hv2-ach small{display:block;margin-bottom:2px;color:var(--gold);font-size:12.5px;font-weight:650}
.hv2-ach:hover{box-shadow:0 0 0 1.5px var(--gold),0 24px 40px -20px rgba(0,0,0,.8)}
.hv2-ach-1{top:4%;left:-10%}
.hv2-ach-2{bottom:0;right:-3%}

/* ============ logos: todos los clientes, en dos cintas que corren en sentidos opuestos ============ */
/* las cintas en bucle (.hv2-mq) son comunes: están en src/theme.css */
.hv2-logos{padding-block:44px 52px;background:var(--white);border-bottom:1px solid var(--rule)}
.hv2 .hv2-logos h2{margin-bottom:28px;font-size:clamp(19px,1.7vw,22px);line-height:1.3;font-weight:680;font-stretch:108%;letter-spacing:-.01em;text-align:center;color:var(--slate)}

/* ============ marcador de resultados ============ */
.hv2-table-wrap{border-radius:18px;overflow:clip;background:var(--white);box-shadow:0 0 0 1px var(--rule),0 30px 60px -44px rgba(11,27,48,.45)}
.hv2-table{width:100%;border-collapse:collapse}
.hv2-table th,.hv2-table td{padding:22px 28px;text-align:left;vertical-align:middle;border-top:1px solid var(--rule)}
.hv2-table thead th{border-top:0;padding-block:15px;background:#F8FAFC;color:var(--slate);font-size:14px;font-weight:600}
.hv2-table tbody th{font-size:19px;font-weight:680}
.hv2-table tbody th a{text-decoration:none}
.hv2-table tbody th a:hover{text-decoration:underline;text-underline-offset:4px}
.hv2-table td:nth-child(2){color:var(--slate);max-width:26em}
.hv2-res{display:flex;align-items:baseline;gap:16px}
.hv2-num{flex:none;min-width:3.6em;font-stretch:125%;font-weight:800;font-size:clamp(28px,3vw,40px);line-height:1;letter-spacing:-.025em;font-variant-numeric:tabular-nums lining-nums}
.hv2-res span{color:var(--ink)}

/* ============ elige a tu equipo ============ */
.hv2-team{background:var(--white)}
/* dos "personajes" para elegir; funciona sin JavaScript (radios + :has) */
.hv2-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:760px;margin:0 0 36px;padding:0;border:0;min-width:0}
.hv2-pick label{position:relative;display:block;padding:18px 22px 18px 58px;border-radius:18px;background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--rule);cursor:pointer;transition:background-color .2s,box-shadow .2s,color .2s}
.hv2-pick input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.hv2-pick label::before{content:"";position:absolute;left:20px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--mist);background:#fff;transition:box-shadow .2s}
.hv2-pick strong{display:block;font-size:19px;font-weight:760;font-stretch:112%;line-height:1.2}
.hv2-pick span{display:block;margin-top:2px;color:var(--slate);font-size:14.5px}
.hv2-pick label:hover{box-shadow:inset 0 0 0 1.5px var(--slate)}
.hv2-pick label:has(:checked){background:var(--ink);color:#fff;box-shadow:inset 0 0 0 2px var(--ink),0 18px 30px -20px rgba(11,27,48,.8)}
.hv2-pick label:has(:checked)::before{background:var(--ink);box-shadow:inset 0 0 0 7px var(--gold)}
.hv2-pick label:has(:checked) span{color:var(--mist)}
.hv2-pick label:has(:focus-visible){outline:3px solid var(--gold);outline-offset:3px}

.hv2-sols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.hv2-sc{position:relative;display:flex;flex-direction:column;border-radius:18px;background:var(--paper);overflow:clip;transition:opacity .35s,filter .35s}
.hv2-sc img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.hv2-sc-body{flex:1;display:flex;flex-direction:column;padding:20px 22px 22px}
.hv2-sc h3{font-size:21px;line-height:1.2;font-weight:780;font-stretch:112%;letter-spacing:-.01em}
.hv2-sc h3 em{margin-left:4px;padding:2px 9px;border-radius:999px;background:var(--ink);color:#fff;font-style:normal;font-size:13px;font-weight:650;font-stretch:100%;vertical-align:3px}
.hv2-sc-body > p{margin-top:8px;color:var(--slate);font-size:15.5px;line-height:1.5}
.hv2-tags{display:flex;gap:6px;margin-top:14px}
.hv2-tags li{padding:3px 10px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--rule);color:var(--ink);font-size:13px;font-weight:620}
.hv2-sc-link{margin-top:auto;padding-top:16px;font-weight:680;color:var(--action);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}
/* toda la tarjeta es clicable por el enlace visible */
.hv2-sc-link::after{content:"";position:absolute;inset:0}
.hv2-sc:hover .hv2-sc-link{text-decoration-thickness:2.5px}
.hv2-sc-only{display:none;margin-top:12px;color:var(--ink);font-size:14px;font-weight:620}
/* cada equipo ve su versión de cada solución, y las que no le tocan pasan al final, atenuadas */
.hv2-team:has([value=plantilla]:checked) .hv2-sc[data-for=ambos] .hv2-for-ventas,
.hv2-team:has([value=ventas]:checked) .hv2-sc[data-for=ambos] .hv2-for-plantilla{display:none}
.hv2-team:has([value=plantilla]:checked) .hv2-sc[data-for=ventas],
.hv2-team:has([value=ventas]:checked) .hv2-sc[data-for=plantilla]{order:1;opacity:.5;filter:saturate(.3)}
.hv2-team:has([value=plantilla]:checked) .hv2-sc[data-for=ventas] .hv2-sc-only,
.hv2-team:has([value=ventas]:checked) .hv2-sc[data-for=plantilla] .hv2-sc-only{display:block}
.hv2-sc:hover{opacity:1!important;filter:none!important}

/* ============ catálogo: la estantería de juegos ============ */
.hv2-shelf{background:var(--ink);color:#fff}
.hv2-shelf .hv2-head p{color:var(--mist)}
.hv2-shelf .hv2-link{color:var(--sky)}
.hv2-covers{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:30px 18px}
.hv2-covers a{display:block;text-decoration:none}
.hv2-covers img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:10px;box-shadow:0 22px 34px -22px rgba(0,0,0,.9);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.hv2-covers a:hover img{transform:translateY(-6px) rotate(-1.5deg)}
.hv2-covers strong{display:block;margin-top:12px;font-size:16px;font-weight:760;font-stretch:112%;line-height:1.2}
.hv2-covers span{display:block;margin-top:3px;color:var(--mist);font-size:14px;line-height:1.35}
.hv2-covers a:hover strong{text-decoration:underline;text-underline-offset:4px}

/* ============ empresa grande ============ */
/* récords: tres cifras de clientes reales, con la barra dorada de una puntuación máxima */
.hv2-records{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:64px}
.hv2-records li{padding:26px 28px 28px;border-radius:18px;background:var(--ink);color:#fff}
.hv2-records b{display:block;font-size:clamp(48px,5.4vw,72px);line-height:.95;font-weight:820;font-stretch:125%;letter-spacing:-.035em;font-variant-numeric:tabular-nums lining-nums}
.hv2-records b::after{content:"";display:block;width:36px;height:5px;margin:16px 0 14px;border-radius:5px;background:var(--gold)}
.hv2-records span{display:block;color:#C3D0E0;font-size:16px;line-height:1.4}
.hv2-records a{color:#fff;font-weight:650;text-underline-offset:3px}
.hv2-powers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 48px}
.hv2-powers li{padding-top:24px;border-top:1px solid var(--rule)}
.hv2-powers svg{display:block;width:44px;height:44px;padding:10px;border-radius:12px;background:#E3EEFB;color:var(--action)}
.hv2-powers h3{margin-top:16px;font-size:19px;font-weight:740;font-stretch:108%;line-height:1.25}
.hv2-powers p{margin-top:6px;color:var(--slate);font-size:16px}

/* ============ voces y premios ============ */
.hv2-voices{background:var(--white)}
.hv2 .hv2-voices-t{margin-bottom:36px}
.hv2-voices figure,.hv2-voices blockquote{margin:0}
.hv2-quote{max-width:900px}
.hv2-quote p{font-size:clamp(26px,3vw,38px);line-height:1.22;font-weight:520;font-stretch:104%;letter-spacing:-.018em}
.hv2-who{display:flex;align-items:center;gap:14px;margin-top:28px;font-size:16px;line-height:1.35}
.hv2-who img{flex:none;width:52px;height:52px;border-radius:50%;object-fit:cover}
.hv2-who span{display:block;color:var(--slate);font-size:15px}
.hv2-quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:64px;padding-top:44px;border-top:1px solid var(--rule)}
.hv2-quotes blockquote{margin:0}
.hv2-quotes p{font-size:18px;line-height:1.5}
.hv2-quotes .hv2-who{margin-top:18px}
.hv2-quotes .hv2-who img{width:44px;height:44px}

.hv2-awards{margin-top:88px}
.hv2-awards h3{max-width:22em;margin-bottom:28px;font-size:22px;line-height:1.25;font-weight:700}
.hv2-awards h3 b{display:block;font-size:48px;line-height:1;font-stretch:125%;font-weight:820;letter-spacing:-.03em}
.hv2-awards h3 b::after{content:"";display:block;width:36px;height:5px;margin:12px 0 14px;border-radius:5px;background:var(--gold)}
/* misma cinta en bucle que los logos (.hv2-mq), más lenta porque cada premio pide un vistazo */
.hv2-mq-aw ul{gap:28px;padding-right:28px;animation-duration:120s}
.hv2-mq-aw li{flex:none;width:clamp(96px,9vw,120px)}
.hv2-mq-aw img{width:100%;height:auto;aspect-ratio:207/199;object-fit:contain;opacity:1}
.hv2-mq-aw small{display:block;margin-top:6px;color:var(--slate);font-size:12.5px;font-weight:600;text-align:center}

/* ============ cierre ============ */
.hv2-final{background:var(--ink);color:#fff}
.hv2-final .hv2-wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px 72px;align-items:end}
.hv2 .hv2-final h2{font-size:clamp(40px,5.4vw,72px);font-stretch:125%;font-weight:840;line-height:.98}
.hv2-final p{color:#C3D0E0}
.hv2-final .hv2-actions{margin-top:28px}

/* ============ marcador de la partida (lo activa home-v2.js) ============ */
.hv2-hud{position:fixed;z-index:60;left:16px;bottom:16px;display:flex;align-items:center;gap:12px;padding:8px 8px 8px 16px;border-radius:999px;background:rgba(11,27,48,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 0 1px rgba(255,181,71,.4),0 16px 36px -14px rgba(0,0,0,.6);color:#fff;font-size:13.5px;font-weight:600;line-height:1}
.hv2-hud-lvl b{color:var(--gold);font-weight:780}
.hv2-hud-bar{display:block;width:88px;height:8px;border-radius:9px;background:rgba(255,255,255,.14);overflow:hidden}
.hv2-hud-bar i{display:block;height:100%;border-radius:inherit;background:var(--gold);transform-origin:0 50%;transform:scaleX(0);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.hv2-hud-n{color:#C3D0E0}
.hv2-hud-n b{color:#fff}
.hv2-hud-go{padding:9px 14px;border-radius:999px;background:var(--gold);color:var(--ink);font-weight:760;text-decoration:none}
.hv2-hud-go:hover{background:#FFC46B}
.hv2-hud-x{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#C3D0E0;cursor:pointer}
.hv2-hud-x:hover{background:rgba(255,255,255,.16);color:#fff}
.hv2-hud-x svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.hv2-toasts{position:fixed;z-index:61;left:16px;bottom:74px;display:grid;gap:10px;pointer-events:none}
.hv2-toast{display:flex;align-items:center;gap:12px;max-width:min(22em,calc(100vw - 32px));padding:10px 16px 10px 10px;border-radius:16px;background:var(--ink-2);box-shadow:0 0 0 1px rgba(255,181,71,.5),0 20px 40px -16px rgba(0,0,0,.7);color:#fff;font-size:14.5px;font-weight:620;line-height:1.3;transition:opacity .4s,transform .4s}
.hv2-toast svg{flex:none;width:34px;height:34px;padding:7px;border-radius:10px;background:var(--gold);color:var(--ink)}
.hv2-toast small{display:block;margin-bottom:2px;color:var(--gold);font-size:12px;font-weight:650}
.hv2-toast.is-out{opacity:0;transform:translateY(8px)}

/* ============ movimiento ============ */
@media (prefers-reduced-motion:no-preference){
  /* el único movimiento de entrada: se reparte la mano y después saltan los dos logros */
  .hv2-hero-copy{animation:hv2-in .8s cubic-bezier(.2,.8,.2,1) both}
  .hv2-hand li{animation:hv2-deal .9s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(.15s + (var(--i) + 2) * .07s)}
  .hv2-ach{animation:hv2-pop .5s cubic-bezier(.3,1.5,.5,1) both}
  .hv2-ach-1{animation-delay:1.05s}
  .hv2-ach-2{animation-delay:1.45s}
  .hv2-toast{animation:hv2-pop .45s cubic-bezier(.3,1.5,.5,1) both}
  @keyframes hv2-in{from{opacity:0;transform:translateY(16px)}}
  @keyframes hv2-deal{from{opacity:0;transform:translateY(40px) rotate(0deg)}}
  @keyframes hv2-pop{from{opacity:0;transform:scale(.85) translateY(10px)}}
}
@media (prefers-reduced-motion:reduce){
  .hv2 *{transition:none!important}
}

/* ============ responsive ============ */
@media (max-width:1060px){
  .hv2-hero{padding-top:156px}
  .hv2-hero-grid{grid-template-columns:1fr}
  .hv2 h1{font-size:clamp(44px,7.6vw,72px)}
  .hv2-hand,.hv2-achs{grid-column:1;grid-row:3;width:100%;max-width:560px;justify-self:center}
  .hv2-hand{margin-top:24px}
  .hv2-ach-1{left:0}
  .hv2-ach-2{right:0}
  .hv2-covers{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hv2-sols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hv2-powers{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .hv2-head{grid-template-columns:1fr}
  .hv2-records{grid-template-columns:1fr;gap:14px}
  .hv2-quotes{grid-template-columns:1fr;gap:32px}
  .hv2-final .hv2-wrap{grid-template-columns:1fr}
  /* en móvil la estantería se desliza con el dedo en vez de apilarse en seis filas */
  .hv2-covers{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:46%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);padding-bottom:14px;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);scrollbar-width:thin}
  .hv2-covers li{scroll-snap-align:start}
}
@media (max-width:640px){
  .hv2-hero{padding-top:136px}
  .hv2 h1{font-size:10.2vw}
  .hv2-h1-a{font-stretch:104%}
  .hv2-pick{grid-template-columns:1fr}
  .hv2-sols,.hv2-powers{grid-template-columns:1fr}
  .hv2-ach{max-width:15.5em;font-size:13.5px;padding:9px 12px 9px 9px}
  .hv2-ach svg{width:32px;height:32px;padding:6px}
  .hv2-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .hv2-table,.hv2-table tbody,.hv2-table tr,.hv2-table th,.hv2-table td{display:block}
  .hv2-table tr{padding:20px 20px 22px;border-top:1px solid var(--rule)}
  .hv2-table tbody tr:first-child{border-top:0}
  .hv2-table th,.hv2-table td{padding:0;border:0}
  .hv2-table td:nth-child(2){margin:4px 0 12px;font-size:15px}
  .hv2-covers{grid-auto-columns:70%}
  /* el marcador ocupa el ancho, pegado abajo, sin tapar el contenido con sombras enormes */
  .hv2-hud{left:12px;right:12px;bottom:12px;justify-content:space-between}
  .hv2-hud-bar{flex:1;width:auto}
  .hv2-toasts{left:12px;right:12px;bottom:70px}
}
/* en pantalla ancha, el titular corta siempre en "Formamos a tu equipo / con videojuegos." */
@media (min-width:1061px){.hv2-h1-a > span:first-child{display:block}}