/* Tervio brand intro — styles for assets/js/brand-intro.js */
.tv-intro{display:none;position:fixed;inset:0;z-index:9999;overflow:hidden;
  --tv-bg1:#12203f;--tv-bg2:#050810;--tv-ink:#fff;--tv-ink2:rgba(255,255,255,.62);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.tv-intro.tv-light{--tv-bg1:#ffffff;--tv-bg2:#e6ecf6;--tv-ink:#0e1726;--tv-ink2:rgba(14,23,38,.6)}
html.intro-on .tv-intro,.tv-intro.tv-live{display:block}
html.intro-on body{overflow:hidden}
.tv-intro-bg{position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 38%,var(--tv-bg1) 0,var(--tv-bg2) 62%)}
.tv-intro-canvas{position:absolute;inset:0;width:100%;height:100%;transition:opacity .3s}
.tv-intro-stage{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(14px,2.8vh,28px);pointer-events:none}
.tv-intro-mark{position:relative;width:240px;height:240px;transform-origin:0 0;will-change:transform}
.tv-intro-logo{display:block;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .6s ease;max-width:none}
.tv-intro.tv-ignited .tv-intro-logo{opacity:1}
.tv-intro-glint{position:absolute;inset:0;opacity:0;pointer-events:none;
  -webkit-mask:var(--tv-mask) center/contain no-repeat;mask:var(--tv-mask) center/contain no-repeat;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.95) 50%,transparent 62%);
  background-size:300% 100%;background-position:120% 0}
.tv-intro.tv-ignited .tv-intro-glint{animation:tvGlint 1.15s .3s cubic-bezier(.4,0,.2,1) forwards}
@keyframes tvGlint{0%{opacity:1;background-position:120% 0}100%{opacity:1;background-position:-20% 0}}

.tv-intro-word{display:flex;justify-content:center;overflow:hidden;padding:.12em .18em .14em 0;
  font-weight:800;font-size:clamp(28px,6.2vw,56px);line-height:1;color:var(--tv-ink);letter-spacing:.72em;
  transition:letter-spacing 1.3s cubic-bezier(.2,.8,.2,1);min-height:1.3em}
.tv-intro-word .tv-l{display:inline-block;transform:translateY(120%);opacity:0}
.tv-intro.tv-word .tv-intro-word{letter-spacing:.2em}
.tv-intro.tv-word .tv-l{animation:tvLetter .75s cubic-bezier(.2,.9,.2,1) forwards;animation-delay:calc(var(--k) * 55ms)}
@keyframes tvLetter{to{transform:none;opacity:1}}
.tv-intro-tag{font-weight:500;font-size:clamp(11px,1.9vw,15px);letter-spacing:.34em;text-transform:uppercase;color:var(--tv-ink2);
  opacity:0;filter:blur(6px);transform:translateY(8px);transition:opacity .9s ease,filter .9s ease,transform .9s ease;text-align:center;padding:0 1rem}
.tv-intro.tv-tagon .tv-intro-tag{opacity:1;filter:none;transform:none}
.tv-intro.tv-out .tv-intro-word,.tv-intro.tv-out .tv-intro-tag,.tv-intro.tv-out .tv-intro-skip{
  opacity:0!important;transform:translateY(-14px);transition:opacity .35s ease,transform .45s ease}
.tv-intro.tv-out .tv-intro-canvas{opacity:0}

.tv-intro-skip{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));
  background:transparent;color:var(--tv-ink2);border:1px solid currentColor;border-radius:999px;padding:.45rem 1.1rem;
  font-weight:600;font-size:.8rem;line-height:1;font-family:inherit;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;opacity:0;transition:opacity .4s,color .2s;pointer-events:auto}
.tv-intro.tv-skipon .tv-intro-skip{opacity:.9}
.tv-intro-skip:hover,.tv-intro-skip:focus-visible{color:var(--tv-ink);outline:none}
.tv-intro-skip:focus-visible{box-shadow:0 0 0 3px rgba(120,160,255,.55)}

/* Header hand-off: the real header logo stays hidden until the flying logo lands on it. */
html.intro-on .brand-logo{visibility:hidden}
html.intro-reveal .topnav a,html.intro-reveal .brand-word,html.intro-reveal .topbar-right>*{
  animation:tvNavIn .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 45ms + 450ms)}
@keyframes tvNavIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.brand-logo.tv-landed{animation:tvLand 1s ease-out}
@keyframes tvLand{0%{filter:drop-shadow(0 0 0 rgba(26,95,208,0))}35%{filter:drop-shadow(0 0 12px rgba(26,95,208,.7))}100%{filter:drop-shadow(0 0 0 rgba(26,95,208,0))}}

/* Failsafe: if the script never runs or crashes, release the page after 9s. */
html.intro-on .tv-intro{animation:tvFail 0s linear 9s forwards}
@keyframes tvFail{to{opacity:0;visibility:hidden;pointer-events:none}}
html.intro-on .brand-logo{animation:tvShow 0s linear 9s forwards}
@keyframes tvShow{to{visibility:visible}}
html.intro-on body{animation:tvScroll 0s linear 9s forwards}
@keyframes tvScroll{to{overflow:auto}}

@media (prefers-reduced-motion:reduce){
  .tv-intro-glint,.tv-intro .tv-l{animation:none!important}
  .tv-intro .tv-l{transform:none;opacity:1}
  .tv-intro-word{transition:none;letter-spacing:.2em}
}
