/* ═══════════════════════════════════════════════════════════
   KISS FERI PHOTOGRAPHY: a mozgásréteg közös stílusa
   (az assets/js/motion.js párja, minden nyilvános oldal betölti)
   Narancs oldalváltó függöny, egyedi kurzor, fényfolt a
   kártyákon, fénycsík a fő gombon, a nyitócímek maszkja.
   Csökkentett mozgás kérésénél az egész kikapcsol (lent).
   ═══════════════════════════════════════════════════════════ */
:root{--signal:#FF3D00;--near:#0A0A0B}

/* Lenis: amíg fut, a böngésző saját sima görgetése ki van kapcsolva, hogy ne dolgozzon duplán. A Lenis 1.3 a lenis-smooth
   osztályt csak görgetés közben teszi ki, így eddig a fókusz és a programból indított görgetés (scrollIntoView)
   1,5 s-ig csúszott; a belső linkeket a Lenis maga görgeti simán (motion.js). */
html.lenis{scroll-behavior:auto !important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}

/* ── a függöny: belső linkre lecsúszik (0,5 mp), az új oldalon az első festéstől takar, és
   CSS keyframes húzza fel (JS nélkül is), a motion.js csak a végét várja meg. A függönyt szándékosan
   nem a GSAP mozgatja: a CSS-ben megadott eltolást pixelben megjegyezné, és duplán tolna. ── */
.curtain{position:fixed;inset:0;z-index:900;display:grid;place-items:center;background:var(--signal);color:var(--near);
  pointer-events:none;transform:translateY(-101%);will-change:transform;contain:strict}
.curtain__name{font-family:"Anton",Impact,"Arial Narrow",sans-serif;font-size:clamp(48px,10vw,170px);line-height:1;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
.curtain-on .curtain{transform:none;animation:curtainUp .5s cubic-bezier(.76,0,.24,1) .22s forwards}
.curtain-on .curtain__name{animation:curtainName .5s cubic-bezier(.22,1,.36,1) both}
/* az esküvői oldalak függönye krém, dőlt serif felirattal: oda nem narancs teli lappal érkezünk */
.curtain--day{background:#F2EDE4;color:#191713}
.curtain--day .curtain__name{font-family:"Instrument Serif",Georgia,serif;font-style:italic;text-transform:none;letter-spacing:0;font-size:clamp(56px,11vw,180px);color:#191713}
.curtain--day .curtain__name::after{content:"";display:block;width:.5em;height:3px;border-radius:3px;background:#C98A4B;margin:.12em auto 0}
@keyframes curtainUp{to{transform:translateY(-101%);visibility:hidden}}
@keyframes curtainName{from{opacity:0;transform:translateY(.25em)}}
.curtain.is-idle{visibility:hidden;transform:translateY(-101%);animation:none}
.curtain.is-below{transform:translateY(101%);animation:none;visibility:visible}
.curtain.is-cover{transform:none;transition:transform .5s cubic-bezier(.76,0,.24,1);animation:none;visibility:visible;pointer-events:auto}

/* ── egyedi kurzor: narancs pont + gyűrű, csak egérrel (a motion.js rakja be) ── */
body.has-cur,body.has-cur a,body.has-cur button,body.has-cur summary,body.has-cur label,body.has-cur .card__hit,body.has-cur .film,body.has-cur .half{cursor:none}
body.has-cur input,body.has-cur textarea,body.has-cur select{cursor:auto}
.cur{position:fixed;left:0;top:0;z-index:1000;pointer-events:none;opacity:0;transition:opacity .3s}
.cur.on{opacity:1}
.cur.is-hidden{opacity:0}
.cur__dot{position:absolute;left:0;top:0;width:8px;height:8px;transition:opacity .25s}
/* a látvány a belső elemen van: a külsőt a GSAP mozgatja, és ott a CSS scale és rotate nem érvényesülne */
.cur__dv{display:block;width:100%;height:100%;border-radius:50%;background:var(--signal);transition:scale .25s,rotate .35s cubic-bezier(.22,1,.36,1),translate .35s cubic-bezier(.22,1,.36,1)}
.cur__ring{position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;border:1.5px solid #fff;mix-blend-mode:difference;
  display:grid;place-items:center;transition:width .3s cubic-bezier(.22,1,.36,1),height .3s cubic-bezier(.22,1,.36,1),background .3s,border-color .3s,scale .2s}
.cur__txt{font-family:"Inter",system-ui,sans-serif;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--near);opacity:0;transition:opacity .25s;white-space:nowrap}
.cur.is-link .cur__ring{width:52px;height:52px}
.cur.is-link .cur__dv{scale:.5}
.cur.is-view .cur__ring,.cur.is-drag .cur__ring{width:86px;height:86px;background:var(--signal);border-color:var(--signal);mix-blend-mode:normal}
.cur.is-view .cur__dot,.cur.is-drag .cur__dot{opacity:0}
.cur.is-view .cur__txt,.cur.is-drag .cur__txt{opacity:1}
.cur.is-down .cur__ring{scale:.82}
/* az esküvői oldalakon a pont helyett egy kis csokor jár az egér után, a gyűrű borostyán */
body.eskuvo:not(.galeria--kreativ) .cur__dot{width:clamp(64px,6vw,120px);height:auto;aspect-ratio:64/76;transition:opacity .25s}
body.eskuvo:not(.galeria--kreativ) .cur__dv{border-radius:0;background:none;transform-origin:50% 40%}
body.eskuvo:not(.galeria--kreativ) .cur__dot svg{display:block;width:100%;height:100%;filter:drop-shadow(0 2px 3px rgba(60,40,20,.28))}
body.eskuvo:not(.galeria--kreativ) .cur__ring,body.eskuvo:not(.galeria--kreativ) .cur__txt{display:none !important}   /* az esküvői oldalon nincs gyűrű és felirat, csak a csokor; a mérete a képernyővel nő */
/* linken a csokor kisebb lesz és jobbra lent félreáll, hogy a felirat olvasható maradjon; a pontos helyet egy borostyán pötty mutatja */
body.eskuvo:not(.galeria--kreativ) .cur.is-link .cur__dv{rotate:-12deg;scale:.52;translate:34% 36%}
body.eskuvo:not(.galeria--kreativ) .cur__dot::after{content:"";position:absolute;left:50%;top:40%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:#B5712A;box-shadow:0 0 0 2px rgba(251,244,234,.9);opacity:0;transition:opacity .2s}
body.eskuvo:not(.galeria--kreativ) .cur.is-link .cur__dot::after{opacity:1}
body.eskuvo:not(.galeria--kreativ) .cur.is-view .cur__dot{opacity:1}
body.eskuvo:not(.galeria--kreativ) .cur.is-view .cur__dv{rotate:10deg;scale:1.18}

/* ── fényfolt a kártyákon (react-bits "SpotlightCard" vanilla portja) ── */
.spot{position:relative}
.spot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),var(--spot,rgba(255,61,0,.16)),transparent 64%)}
.spot:hover::after{opacity:1}

/* ── fénycsík a fő gombon (react-bits "ShinyText" ötlete gombra) ── */
.shine{position:relative;overflow:hidden;isolation:isolate}
.shine::before{content:"";position:absolute;top:-60%;bottom:-60%;left:0;width:34%;pointer-events:none;z-index:1;
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.55) 50%,transparent 100%);
  transform:translateX(-160%) skewX(-18deg);animation:shine 4.4s cubic-bezier(.6,0,.3,1) 1.4s infinite}
.shine--hover::before{animation:none}
.shine--hover:hover::before{animation:shine 1.1s cubic-bezier(.6,0,.3,1) forwards}
@keyframes shine{0%{transform:translateX(-160%) skewX(-18deg)}30%,100%{transform:translateX(420%) skewX(-18deg)}}

/* ── a nyitócímek: betűnként csúsznak fel a szavak maszkja mögül (SplitText) ──
   amíg a motion.js nem rakta össze a betűket, a cím a maszk mögött vár, hogy ne villanjon kétszer */
.mo:not(.mo-ready) :is(.hero__name,.poster__h,.half__t,.vhero .big,.gal__head .big){visibility:hidden}
.mo .hero__word,.mo .hero__em{animation:none;opacity:1;transform:none}
.mo .poster__l i{animation:none;transform:none}
.mo .half__t{animation:none}
.js .big.is-split .big__line{opacity:1;transform:none;transition:none}
/* a maszk felül .26em-mel magasabb a betűnél, hogy a nagybetűs ékezetek (Á, É, Í, Ő, Ű) ne vágódjanak le */
.sw{display:inline-block;overflow:hidden;vertical-align:top;padding:.26em .04em .1em;margin:-.26em -.04em -.1em;white-space:nowrap}
.ch{display:inline-block;will-change:transform}
/* a szétszedett betűk között nincs alávágás és ligatúra; a kész, kibontott cím is így áll, hogy az animáció végén ne ugorjon */
.is-split{font-kerning:none;font-variant-ligatures:none}
.bw{display:inline-block;will-change:transform,filter}

/* a parallaxis és a dőlés GSAP-ból jön: a CSS átmenet a transformon itt ne vitatkozzon vele */
.mo .sheet .card__hit img,.mo .masonry .card__hit img,.mo .vgrid .card__hit img,.mo .intro__pic img{transition:filter .4s}
.mo .card__hit,.mo .frame .card__hit{transition:box-shadow .5s cubic-bezier(.22,1,.36,1),filter .4s}
.mo .card:hover .card__hit img{transform:none}

/* a szétszedett címek és bevezetők egyben olvasható másolata a felolvasónak (motion.js, splitA11y) */
.mo-sr{position:absolute !important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* a képfal oszlopai: a beúszás marad, de a képek az első pillanattól látszanak (LCP) */
.mo body.eskuvo .wall__col{opacity:1}

@media (prefers-reduced-motion:reduce){
  .curtain,.cur{display:none !important}
  .spot::after,.shine::before{display:none}
  .mo .hero__name,.mo .poster__h,.mo .half__t{visibility:visible}
}

/* mozgás szünetel (WCAG 2.2.2, a gombot a foto.js és a kreativ.js kezeli): csak a hurkok állnak meg,
   a belépő animációk nem, így szünetelt állapotban betöltve sem marad semmi félig látható */
html.kf-paused .shine::before,html.kf-paused .grain,html.kf-paused .band__run,html.kf-paused .rec i,
html.kf-paused .hero__scroll i,html.kf-paused .strip__run{animation-play-state:paused !important}
html.kf-paused #fog{visibility:hidden}
