/* =====================================================================
   NYITÓKÉP v2 – térbeli kártyapakli (szétnyílik, lebeg) + mozgó piros fény
   + mobilon a szöveg a kártyák aljára ér, mögötte állandó elmosott sáv.
   (Bene 1. visszajelzése, 2026-10-05.)
   ===================================================================== */
.ny {
  --kartya-w: clamp(176px, 50vw, 300px);
  position: relative; min-height: max(100svh, 640px); overflow: hidden; isolation: isolate;
  display: flex; flex-direction: column;
}

/* --- Fény: három lassan mozgó folt – mintha a kártyák a semmiben repülnének --- */
.ny-feny { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.ny-feny i { position: absolute; left: 50%; border-radius: 50%; will-change: transform; }
.ny-feny-alap {
  top: 12%; width: 170vw; height: 66svh; margin-left: -85vw;
  background: radial-gradient(closest-side, rgba(226, 40, 48, .72), rgba(160, 18, 28, .34) 50%, rgba(10, 9, 9, 0) 100%);
  animation: ny-ut1 17s var(--pasztaz) infinite alternate;
}
.ny-feny-mely {
  top: 4%; width: 110vw; height: 46svh; margin-left: -55vw; opacity: .6;
  background: radial-gradient(closest-side, rgba(120, 12, 22, .9), rgba(10, 9, 9, 0));
  animation: ny-ut2 23s ease-in-out infinite;
}
.ny-feny-szin {
  top: 26%; width: 120vw; height: 38svh; margin-left: -60vw; color: #c4232b; opacity: .34;
  background: radial-gradient(closest-side, currentColor, rgba(0, 0, 0, 0));
  transition: color 1.2s var(--pasztaz);
  animation: ny-ut3 29s ease-in-out infinite alternate;
}
@keyframes ny-ut1 { 0% { transform: translate(-12%, 2%) scale(1); } 50% { transform: translate(4%, -5%) scale(1.08); } 100% { transform: translate(13%, 3%) scale(.96); } }
@keyframes ny-ut2 { 0% { transform: translate(18%, 6%) scale(.9); } 33% { transform: translate(-14%, -4%) scale(1.1); } 66% { transform: translate(-4%, 10%) scale(1); } 100% { transform: translate(18%, 6%) scale(.9); } }
@keyframes ny-ut3 { from { transform: translate(-10%, -6%) scale(1.05); } to { transform: translate(10%, 4%) scale(.92); } }

/* --- Pakli (térben) --- */
.ny-pakli-blokk { position: static; flex: 1; min-height: 0; padding-top: calc(var(--fejlec) + 4px); }
/* mobilon a pakli a szekcióhoz igazodik: az alja a szövegsáv fölött kicsit belelóg a sávba (Bene: ráérkezik a szöveg) */
.ny-story { display: flex; gap: 4px; width: min(230px, 62%); margin: 0 auto; position: relative; z-index: 12; }
.ny-story i { flex: 1; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .22); overflow: hidden; }
.ny-story b { display: block; height: 100%; background: #fff; transform-origin: 0 50%; transform: scaleX(0); }
.ny-story i.kesz b { transform: scaleX(1); }
.ny-story i.fut b { animation: ny-story var(--ny-ido, 6s) linear forwards; }
@keyframes ny-story { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.ny-sugo { position: relative; z-index: 12; margin: 8px 0 0; text-align: center; font: 600 11px/1 var(--font-cim); letter-spacing: .08em; color: rgba(255, 255, 255, .5); transition: opacity .5s; }
.ny-sugo span { color: var(--piros-vilagos); }
.ny.erintve .ny-sugo { opacity: 0; }

.ny-pakli {
  position: absolute; left: 0; right: 0; top: calc(var(--fejlec) + 44px); bottom: auto; height: calc(var(--kartya-w) * 16 / 9);
  perspective: 1100px; perspective-origin: 50% 40%; transform-style: preserve-3d;
  touch-action: pan-y; -webkit-user-select: none; user-select: none;
}
.ny-lap {
  position: absolute; left: 50%; bottom: 0; width: var(--kartya-w); margin-left: calc(var(--kartya-w) / -2);
  aspect-ratio: 9 / 16; max-height: 100%;
  border-radius: 16px; overflow: hidden; background: #111;
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 30px 60px -16px rgba(0, 0, 0, .9);
  transform-origin: 50% var(--forgaspont, 138%);
  transition: transform .9s var(--be), opacity .6s var(--be);
  /* lebegés: külön "translate"/"rotate" tulajdonság, így nem ütközik a JS által írt transformmal */
  animation: ny-lebeg var(--d, 7s) ease-in-out infinite alternate;
  animation-delay: calc(var(--k, 0) * -1.7s);
  will-change: transform;
}
@keyframes ny-lebeg { from { translate: 0 -5px; rotate: -.5deg; } to { translate: 0 6px; rotate: .6deg; } }
.ny-lap img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.ny-lap::after { content: ""; position: absolute; inset: 0; background: #000; opacity: .48; transition: opacity .7s var(--be); }
.ny-lap.elol::after { opacity: 0; }
.ny-lap-cimke { position: absolute; left: 12px; top: 12px; z-index: 2; font: 800 10px/1 var(--font-cim); letter-spacing: .12em; text-transform: uppercase;
  background: rgba(0, 0, 0, .6); padding: 6px 8px; border-radius: 5px; }
.ny-lap.elol { box-shadow: 0 40px 80px -12px rgba(0, 0, 0, .95), 0 0 0 1px rgba(255, 255, 255, .24), 0 0 60px -10px rgba(216, 38, 45, .35); }
.ny-lap.elol::before { content: ""; position: absolute; z-index: 2; right: 12px; top: 10px; width: 32px; height: 32px; border-radius: 50%;
  background: rgba(0, 0, 0, .55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / 16px no-repeat; }

/* --- Szövegsáv: a kártyák aljára ér, mögötte mindig elmosott üveg --- */
.ny-sav { position: relative; z-index: 20; padding: 26px var(--pad) 0; }
.ny-blur {
  position: absolute; inset: 0; z-index: -1;
  -webkit-backdrop-filter: blur(18px) saturate(1.15); backdrop-filter: blur(18px) saturate(1.15);
  background: linear-gradient(to bottom, rgba(10, 9, 9, .18) 0, rgba(10, 9, 9, .62) 90px, rgba(10, 9, 9, .86) 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 46px); mask-image: linear-gradient(to bottom, transparent 0, #000 46px);
}
.ny-szoveg { position: relative; }
.ny-ki { margin: 0 0 10px; color: #e6e4e8; }
.ny-cim { font-size: clamp(36px, 9.6vw, 104px); margin-bottom: 10px; text-wrap: balance; }
.ny-al { margin-bottom: 16px; }
.ny-gombok { display: flex; flex-wrap: wrap; gap: 10px; }
.ny-biza { margin: 12px 0 0; font-size: 13px; color: var(--halvany); }
@media (max-width: 420px) { .ny-gombok { flex-wrap: nowrap; gap: 8px; } .ny-gombok .gomb { padding: 0 15px; font-size: 15px; gap: 8px; flex: 1 1 auto; } }

/* --- Logósáv (bizonyíték az első képernyőn) --- */
.ny-logosav { margin: 14px calc(var(--pad) * -1) 0; padding: 12px 0 calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(255, 255, 255, .08); display: flex; align-items: center; gap: 14px; overflow: hidden; }
.ny-logosav-cim { flex: none; padding-left: var(--pad); font: 700 10px/1.2 var(--font-cim); letter-spacing: .16em; text-transform: uppercase; color: var(--halvany); max-width: 92px; }
.ny-logosav-ablak { overflow: hidden; flex: 1; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.ny-logosav-sor { display: flex; gap: 34px; width: max-content; animation: ny-logok 34s linear infinite; }
.ny-logosav-sor span { font: 800 15px/1 var(--font-cim); letter-spacing: .06em; color: rgba(255, 255, 255, .42); white-space: nowrap; }
@keyframes ny-logok { to { transform: translateX(-50%); } }

/* --- Asztali nyilak (érintőképernyőn húzás van helyette) --- */
.ny-nyil { display: none; }
@media (hover: hover) and (min-width: 900px) {
  .ny-sugo { display: none; }
  .ny-nyil { display: grid; place-items: center; position: absolute; z-index: 30; top: 50%; width: 48px; height: 48px; border-radius: 50%;
    background: rgba(20, 18, 20, .72); border: 1px solid rgba(255, 255, 255, .14); font: 600 22px/1 var(--font-cim); transition: background-color .2s, transform .3s var(--pattan); }
  .ny-nyil:hover { background: var(--piros); transform: scale(1.06); }
  .ny-nyil.bal { left: 2%; } .ny-nyil.jobb { right: 2%; }
}

/* --- Asztal: két oszlop; a pakli jobbra, nagyobb; a szöveg balra a fény sötétebb részén --- */
@media (min-width: 900px) {
  .ny { --kartya-w: clamp(240px, 21vw, 330px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); grid-template-rows: 1fr auto; min-height: max(100svh, 720px); }
  .ny-pakli-blokk { position: relative; grid-column: 2; grid-row: 1; padding-top: calc(var(--fejlec) + 14px); }
  .ny-lap { transform-origin: 50% 100%; }
  .ny-pakli { top: calc(var(--fejlec) + 40px); height: auto; bottom: 11svh; left: 7%; right: -3%; }
  .ny-sav { grid-column: 1; grid-row: 1; align-self: center; margin: 0; padding: calc(var(--fejlec) + 10px) 0 0 max(var(--pad), calc((100vw - var(--max)) / 2)); }
  .ny-blur { display: none; }
  .ny-logosav { margin: 22px 0 0; padding: 12px 0; border-top: 1px solid rgba(255, 255, 255, .08); }
  .ny-logosav-cim { max-width: none; padding-left: 0; }
  .ny-feny-alap { left: 72%; top: 24%; width: 90vw; margin-left: -45vw; height: 82svh; }
  .ny-feny-mely { left: 70%; top: 10%; width: 60vw; margin-left: -30vw; height: 60svh; }
  .ny-feny-szin { left: 72%; top: 38%; width: 56vw; margin-left: -28vw; }
  .ny::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(90deg, rgba(10, 9, 9, .75) 0%, rgba(10, 9, 9, .25) 48%, rgba(10, 9, 9, 0) 68%); }
}

/* képkészítő mód és csökkentett mozgás: nincs lebegés */
.kepmod .ny-lap { animation: none; }
@media (prefers-reduced-motion: reduce) { .ny-lap { animation: none; } }