/* Portadas de novedades: fondo con el color del tema, icono del juego y réplica del aviso en pantalla */
.pv { --a: var(--teal); position: relative; height: 150px; overflow: hidden; isolation: isolate; border-radius: inherit; border-bottom-left-radius: 0; border-bottom-right-radius: 0;
  background:
    radial-gradient(120% 140% at 88% 0%, color-mix(in srgb, var(--a) 34%, transparent), transparent 58%),
    radial-gradient(90% 120% at 0% 100%, color-mix(in srgb, var(--a) 14%, transparent), transparent 60%),
    linear-gradient(160deg, #101a24, #0a1118); }
.pv::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5;
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 38px), repeating-linear-gradient(0deg, rgba(255,255,255,.045) 0 1px, transparent 1px 38px);
  -webkit-mask-image: linear-gradient(200deg, #000 10%, transparent 75%); mask-image: linear-gradient(200deg, #000 10%, transparent 75%); }
.pv-ico { position: absolute; right: 7%; top: 50%; width: 118px; height: 118px; transform: translateY(-50%) rotate(-8deg); background: var(--a); opacity: .9;
  -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; filter: drop-shadow(0 0 26px color-mix(in srgb, var(--a) 60%, transparent)); transition: transform .5s var(--ease, ease); }
.card.hv:hover .pv-ico, .pv-g:hover .pv-ico { transform: translateY(-50%) rotate(-2deg) scale(1.06); }
.pv-et { position: absolute; top: 14px; left: 16px; padding: 3px 11px; border-radius: 99px; background: color-mix(in srgb, var(--a) 18%, rgba(8, 12, 16, .6)); color: var(--a); font: 700 11px var(--body); letter-spacing: .1em; text-transform: uppercase; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--a) 40%, transparent); }
.pv-hud { position: absolute; left: 16px; bottom: 16px; display: flex; align-items: center; gap: 10px; max-width: calc(100% - 175px); padding: 9px 14px 9px 10px; border-radius: 7px; background: rgba(23, 21, 19, .92); border-left: 3px solid var(--a); box-shadow: 0 10px 24px rgba(0, 0, 0, .45); }
.pv-hi { flex: none; width: 28px; height: 28px; border-radius: 6px; background: color-mix(in srgb, var(--a) 70%, #1a1a1a); position: relative; }
.pv-hi::after { content: ""; position: absolute; inset: 5px; background: #fff; -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.pv-hud small { display: block; font: 700 9px var(--body); letter-spacing: .16em; text-transform: uppercase; color: #9aa3a8; }
.pv-hud b { display: block; font: 600 13.5px/1.25 var(--body); color: #f1f1ea; }
.pv-g { height: 230px; border-radius: 22px; margin-bottom: 20px; } .pv-g .pv-ico { width: 170px; height: 170px; } .pv-g .pv-hud { left: 22px; bottom: 22px; } .pv-g .pv-et { top: 20px; left: 22px; font-size: 12px; }
@media (max-width: 640px) { .pv-ico { width: 92px; height: 92px; } .pv-g { height: 190px; } .pv-g .pv-ico { width: 130px; height: 130px; } .pv-hud { max-width: calc(100% - 32px); } .pv .pv-ico { right: 4%; opacity: .6; } }
