/* Opening sequence ("the mould opens"): plays once per visit, on any entry page.
   html.gm-intro is set by a tiny inline script in <head>, so the cover is there before first paint. */
html.gm-intro body{overflow:hidden}
html.gm-intro body::after{content:"";position:fixed;inset:0;z-index:9998;background:#0B1622}

.mv{position:fixed;inset:0;z-index:9999;pointer-events:auto;cursor:pointer;font-family:Inter,"PingFang SC","Noto Sans SC",sans-serif}
.mv-half{position:absolute;left:0;right:0;height:50%;overflow:hidden;transition:transform 1.05s cubic-bezier(.77,0,.18,1)}
.mv-top{top:0}
.mv-bot{bottom:0}
.mv-inner{position:absolute;left:0;right:0;height:100vh;height:100svh;display:grid;place-items:center;background:
  radial-gradient(60% 55% at 50% 50%,#073a66 0%,#0B1622 70%),#0B1622}
.mv-top .mv-inner{top:0}
.mv-bot .mv-inner{bottom:0}
.mv-inner::before{content:"";position:absolute;inset:0;background:linear-gradient(#ffffff0c 1px,transparent 1px) 0 0/44px 44px,linear-gradient(90deg,#ffffff0c 1px,transparent 1px) 0 0/44px 44px;opacity:0;animation:mvFade .9s .1s forwards;-webkit-mask:radial-gradient(70% 70% at 50% 50%,#000,transparent);mask:radial-gradient(70% 70% at 50% 50%,#000,transparent)}
/* steel edge on each half */
.mv-top::after,.mv-bot::after{content:"";position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#4EAEFC 30%,#E5B85C 50%,#4EAEFC 70%,transparent);opacity:0}
.mv-top::after{bottom:0}.mv-bot::after{top:0}
.mv.is-seam .mv-top::after,.mv.is-seam .mv-bot::after{opacity:1;transition:opacity .2s}

.mv-comp{position:relative;display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center}
.mv-logo{height:clamp(54px,9vw,96px);width:auto;max-width:80vw}
.mv-top .mv-logo{animation:mvDown .9s .25s cubic-bezier(.22,.8,.24,1) both}
.mv-bot .mv-logo{animation:mvUp .9s .25s cubic-bezier(.22,.8,.24,1) both}
@keyframes mvDown{from{transform:translateY(-70px);opacity:0}to{transform:none;opacity:1}}
@keyframes mvUp{from{transform:translateY(70px);opacity:0}to{transform:none;opacity:1}}
.mv-tag{font:600 clamp(12px,1.2vw,15px)/1 Inter,sans-serif;letter-spacing:.32em;text-transform:uppercase;color:#9BD3FF;opacity:0;animation:mvTrack 1s 1s cubic-bezier(.22,.8,.24,1) forwards}
@keyframes mvTrack{from{opacity:0;letter-spacing:.7em}to{opacity:1;letter-spacing:.32em}}
@keyframes mvFade{to{opacity:1}}

/* the parting line: a light sweep across the seam */
.mv-seam{position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;z-index:3;background:linear-gradient(90deg,transparent,#E5B85C 45%,#fff 50%,#E5B85C 55%,transparent);transform:scaleX(0);animation:mvSeam 1s .9s cubic-bezier(.65,0,.35,1) forwards;box-shadow:0 0 24px #E5B85C,0 0 60px #4eaefc88}
@keyframes mvSeam{0%{transform:scaleX(0);opacity:1}70%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:.0}}

/* cinema bars + readouts */
.mv-bar{position:absolute;left:0;right:0;height:0;z-index:4;background:#000;transition:height .7s cubic-bezier(.77,0,.18,1)}
.mv-bar.t{top:0}.mv-bar.b{bottom:0}
.mv.is-on .mv-bar{height:8vh}
.mv.is-open .mv-bar{height:0}
.mv-read{position:absolute;z-index:5;bottom:calc(8vh + 18px);font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:#8fa3b8;opacity:0;transition:opacity .4s}
.mv-read.l{left:24px}.mv-read.r{right:24px;text-align:right}
.mv-read b{color:#E5B85C;font-weight:700}
.mv.is-on .mv-read{opacity:1}
.mv.is-open .mv-read{opacity:0}
.mv-skip{position:absolute;z-index:6;top:calc(8vh + 16px);right:20px;padding:8px 14px;border:1px solid #ffffff33;border-radius:999px;background:#ffffff0d;color:#cfdbe7;font:600 12px/1 Inter,sans-serif;letter-spacing:.08em;cursor:pointer;opacity:0;transition:opacity .4s}
.mv.is-on .mv-skip{opacity:1}
.mv-skip:focus-visible{outline:2px solid #E5B85C;outline-offset:2px}

/* the mould opens */
.mv.is-open .mv-top{transform:translateY(-101%)}
.mv.is-open .mv-bot{transform:translateY(101%)}
.mv.is-open .mv-seam{display:none}
.mv.is-open{pointer-events:none}

@media (max-width:600px){.mv-read{display:none}.mv-tag{letter-spacing:.2em}}
@media (prefers-reduced-motion:reduce){.mv{display:none}html.gm-intro body::after{display:none}html.gm-intro body{overflow:auto}}
