/* FYNTRA CINEMATIC INTRO — Spline robot */
html.fyntra-intro-seen #fyntraIntro{display:none!important}
body.fyntra-intro-active{overflow:hidden!important;touch-action:none}
body.fyntra-intro-active > header,
body.fyntra-intro-active > .mobile-menu,
body.fyntra-intro-active > #floatingLinesBackground,
body.fyntra-intro-active > main,
body.fyntra-intro-active > footer{
  pointer-events:none;
}

.fyntra-intro{
  --intro-bg:#050508;
  --intro-violet:#9d6cff;
  --intro-eye-x:50%;
  --intro-eye-y:43%;
  position:fixed;
  inset:0;
  z-index:6000;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 46%,rgba(157,108,255,.075),transparent 28%),
    linear-gradient(180deg,#050508 0%,#030306 100%);
  color:#f7f5fa;
  isolation:isolate;
  opacity:1;
  visibility:visible;
  transition:opacity .28s ease,visibility .28s ease;
}
.fyntra-intro[aria-hidden="true"]{opacity:0;visibility:hidden;pointer-events:none}
.fyntra-intro::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent 49.92%,rgba(255,255,255,.045) 50%,transparent 50.08%),
    linear-gradient(0deg,transparent 49.92%,rgba(255,255,255,.035) 50%,transparent 50.08%);
  background-size:100% 100%;
  opacity:.48;
}
.fyntra-intro::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%,transparent 42%,rgba(3,3,6,.28) 72%,rgba(3,3,6,.76) 100%),
    linear-gradient(to bottom,rgba(5,5,8,.22),transparent 23%,transparent 72%,rgba(5,5,8,.56));
}

.fyntra-intro__scene{
  position:absolute;
  inset:-4%;
  z-index:0;
  transform:scale(1.04);
  transform-origin:var(--intro-eye-x) var(--intro-eye-y);
  will-change:transform,filter,opacity;
  transition:
    transform 1.02s cubic-bezier(.16,1,.3,1),
    filter .78s ease,
    opacity .35s ease;
}
.fyntra-intro spline-viewer{
  width:100%;
  height:100%;
  display:block;
  background:transparent;
}

.fyntra-intro__brand{
  position:absolute;
  z-index:5;
  left:50%;
  top:clamp(28px,5.5vh,64px);
  transform:translateX(-50%);
  width:min(230px,46vw);
  opacity:0;
  animation:introBrandIn .8s .15s cubic-bezier(.16,1,.3,1) forwards;
  pointer-events:none;
}
.fyntra-intro__brand img{width:100%;height:auto;filter:drop-shadow(0 12px 30px rgba(0,0,0,.4))}
.fyntra-intro__studio{
  position:absolute;
  z-index:5;
  left:50%;
  top:calc(clamp(28px,5.5vh,64px) + 54px);
  transform:translateX(-50%);
  color:rgba(255,255,255,.46);
  font:600 9px/1 "DM Sans",system-ui,sans-serif;
  letter-spacing:.42em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:0;
  animation:introBrandIn .8s .34s cubic-bezier(.16,1,.3,1) forwards;
}

.fyntra-intro__footer{
  position:absolute;
  z-index:6;
  left:50%;
  bottom:max(26px,env(safe-area-inset-bottom));
  width:min(620px,calc(100% - 34px));
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  text-align:center;
}
.fyntra-intro__hint{
  margin:0;
  color:rgba(255,255,255,.48);
  font-size:10px;
  font-weight:600;
  letter-spacing:.19em;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(8px);
  animation:introHintIn .65s .62s ease forwards;
}
.fyntra-intro__enter{
  position:relative;
  min-width:210px;
  min-height:54px;
  padding:0 26px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(7,7,10,.72);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  cursor:pointer;
  font:600 12px/1 "DM Sans",system-ui,sans-serif;
  letter-spacing:.08em;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 16px 54px rgba(0,0,0,.35),inset 0 0 0 1px rgba(157,108,255,.06);
  opacity:0;
  transform:translateY(14px);
  animation:introButtonIn .7s .72s cubic-bezier(.16,1,.3,1) forwards;
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;
}
.fyntra-intro__enter::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(110deg,transparent 22%,rgba(157,108,255,.85),rgba(255,255,255,.72),rgba(157,108,255,.7),transparent 78%);
  background-size:220% 100%;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  animation:introBorderSweep 3.2s linear infinite;
  pointer-events:none;
}
.fyntra-intro__enter:hover{
  border-color:rgba(157,108,255,.55);
  background:rgba(19,13,31,.82);
  box-shadow:0 18px 64px rgba(89,46,176,.3),inset 0 0 26px rgba(157,108,255,.07);
  transform:translateY(-2px);
}
.fyntra-intro__enter:focus-visible{outline:2px solid #fff;outline-offset:4px}
.fyntra-intro__enter .intro-arrow{font-size:17px;transition:transform .25s ease}
.fyntra-intro__enter:hover .intro-arrow{transform:translateX(4px)}

.fyntra-intro__status{
  position:absolute;
  z-index:5;
  left:22px;
  bottom:22px;
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.34);
  font:600 8px/1 "DM Sans",system-ui,sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
  pointer-events:none;
  transition:opacity .3s ease;
}
.fyntra-intro__status i{
  width:6px;height:6px;border-radius:50%;background:var(--intro-violet);
  box-shadow:0 0 14px rgba(157,108,255,.7);
  animation:introPulse 1.15s ease-in-out infinite;
}
.fyntra-intro.is-ready .fyntra-intro__status{opacity:0}

.fyntra-intro__eye{
  position:absolute;
  z-index:7;
  left:var(--intro-eye-x);
  top:var(--intro-eye-y);
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translate(-50%,-50%) scale(.2);
  background:#c8adff;
  box-shadow:0 0 18px 4px rgba(157,108,255,.45),0 0 70px 18px rgba(115,60,231,.18);
  opacity:0;
  pointer-events:none;
}
.fyntra-intro__iris{
  position:absolute;
  z-index:8;
  left:var(--intro-eye-x);
  top:var(--intro-eye-y);
  width:14px;
  height:14px;
  border-radius:50%;
  transform:translate(-50%,-50%) scale(0);
  background:radial-gradient(circle,#fff 0 4%,#d7c0ff 8%,#9d6cff 24%,#5a2fbd 46%,#120b1f 72%,#050508 100%);
  box-shadow:0 0 35px rgba(157,108,255,.9),0 0 90px rgba(157,108,255,.46);
  opacity:0;
  pointer-events:none;
}
.fyntra-intro__wash{
  position:absolute;
  z-index:9;
  left:var(--intro-eye-x);
  top:var(--intro-eye-y);
  width:2vmax;
  height:2vmax;
  border-radius:50%;
  transform:translate(-50%,-50%) scale(0);
  background:#9d6cff;
  box-shadow:0 0 80px rgba(157,108,255,.85);
  opacity:0;
  pointer-events:none;
}

.fyntra-intro.is-entering .fyntra-intro__brand,
.fyntra-intro.is-entering .fyntra-intro__studio,
.fyntra-intro.is-entering .fyntra-intro__footer,
.fyntra-intro.is-entering .fyntra-intro__status{
  opacity:0!important;
  transition:opacity .18s ease!important;
  animation:none!important;
}
.fyntra-intro.is-entering .fyntra-intro__scene{
  transform:scale(6.2);
  filter:contrast(1.14) brightness(.72) saturate(1.2);
}
.fyntra-intro.is-entering .fyntra-intro__eye{animation:introEyeIgnite .46s cubic-bezier(.16,1,.3,1) forwards}
.fyntra-intro.is-entering .fyntra-intro__iris{animation:introIrisOpen .78s .12s cubic-bezier(.16,1,.3,1) forwards}
.fyntra-intro.is-entering .fyntra-intro__wash{animation:introWash .62s .48s cubic-bezier(.5,0,.2,1) forwards}

@keyframes introBrandIn{from{opacity:0;transform:translate(-50%,-14px);filter:blur(7px)}to{opacity:1;transform:translate(-50%,0);filter:blur(0)}}
@keyframes introHintIn{to{opacity:1;transform:none}}
@keyframes introButtonIn{to{opacity:1;transform:none}}
@keyframes introBorderSweep{to{background-position:-220% 0}}
@keyframes introPulse{50%{opacity:.35;transform:scale(.75)}}
@keyframes introEyeIgnite{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}45%{opacity:1;transform:translate(-50%,-50%) scale(2.8)}100%{opacity:1;transform:translate(-50%,-50%) scale(1.45)}}
@keyframes introIrisOpen{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}30%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%) scale(8)}}
@keyframes introWash{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}20%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%) scale(95)}}

@media(max-width:720px){
  .fyntra-intro{--intro-eye-x:50%;--intro-eye-y:42%}
  .fyntra-intro__scene{inset:-2% -12%;transform:scale(1.08)}
  .fyntra-intro__brand{width:min(196px,48vw);top:max(24px,env(safe-area-inset-top))}
  .fyntra-intro__studio{top:calc(max(24px,env(safe-area-inset-top)) + 48px);font-size:8px;letter-spacing:.34em}
  .fyntra-intro__footer{bottom:max(24px,calc(env(safe-area-inset-bottom) + 12px));gap:11px}
  .fyntra-intro__enter{width:min(100%,270px);min-height:52px}
  .fyntra-intro__hint{font-size:9px;letter-spacing:.15em}
  .fyntra-intro__status{left:14px;bottom:14px}
  .fyntra-intro.is-entering .fyntra-intro__scene{transform:scale(6.8)}
}

@media(prefers-reduced-motion:reduce){
  .fyntra-intro__brand,.fyntra-intro__studio,.fyntra-intro__hint,.fyntra-intro__enter{animation:none!important;opacity:1!important;transform:translateX(-50%)!important}
  .fyntra-intro__hint,.fyntra-intro__enter{transform:none!important}
  .fyntra-intro__enter::before,.fyntra-intro__status i{animation:none!important}
  .fyntra-intro.is-entering .fyntra-intro__scene{transform:scale(1.12);filter:none}
  .fyntra-intro.is-entering .fyntra-intro__eye,.fyntra-intro.is-entering .fyntra-intro__iris{display:none}
  .fyntra-intro.is-entering .fyntra-intro__wash{animation:none;opacity:1;transform:translate(-50%,-50%) scale(95);transition:transform .25s ease,opacity .25s ease}
}
