.hero{background:var(--mosi);height:100svh;min-height:680px;position:relative;overflow:hidden}.hero__canvas{width:100%;height:100%;position:absolute;inset:0}.no-webgl .hero__canvas{background:var(--mosi) url(/_astro/hero-still.IUiv28P3.webp) 61.8% 38.2%/cover no-repeat}.hero__copy{left:max(var(--gutter),calc((100% - var(--frame))/2 + var(--gutter)));width:calc(38.2% - var(--gutter));z-index:2;min-width:330px;position:absolute;top:38.2%;transform:translateY(-38.2%)}.hero__role{margin:0 0 var(--s3);font-size:var(--t0);letter-spacing:.42em;color:var(--ink2)}.hero__nameRow{align-items:flex-start;gap:var(--s2);display:flex}.hero__name{font-family:var(--brand);font-weight:900;font-size:clamp(50.8px,5.7vw,var(--t4));letter-spacing:-.03em;margin:0;line-height:.95}.hero__seal{mix-blend-mode:multiply;opacity:.94;flex:none;width:31px;height:52px;margin-top:8px;overflow:visible;transform:rotate(-2deg)}.hero__names{margin:var(--s2) 0 0;font-family:var(--serif);font-size:var(--t1);letter-spacing:.12em;color:var(--ink2)}.hero__names .x{color:var(--dim);margin:0 .4em;font-weight:400}.hero__names .hanja{letter-spacing:.2em;font-family:var(--brand);margin-left:.45em}.hero__feat{margin:var(--s4) 0 0;padding-top:var(--s2);border-top:1px solid var(--line)}.hero__featTitle{font-family:var(--serif);font-weight:600;font-size:var(--t1);color:var(--ink);margin:0}.hero__featTitle span{color:var(--ink2);margin-left:.5em;font-size:15px;font-style:italic;font-weight:400}.hero__featLine{color:var(--dim);margin:6px 0 0;font-size:14px;line-height:1.75}.hero__featActs{margin:var(--s2) 0 0;align-items:center;gap:var(--s1) var(--s3);flex-wrap:wrap;display:flex}.hero__play{cursor:pointer;font-family:var(--serif);letter-spacing:.12em;background-color:#0000;border:0;font-size:15px;font-weight:600}.hero__play small{font-family:var(--sans);letter-spacing:.12em;color:var(--dim);font-size:12px;font-weight:400}.hero__vert{right:max(var(--gutter),calc((100% - var(--frame))/2 + var(--gutter)));writing-mode:vertical-rl;font-family:var(--brand);letter-spacing:.5em;color:var(--ink2);z-index:2;margin:0;font-size:15px;position:absolute;top:50%;transform:translateY(-50%)}.hero__scroll{left:max(var(--gutter),calc((100% - var(--frame))/2 + var(--gutter)));bottom:var(--s3);z-index:2;letter-spacing:.4em;color:var(--dim);align-items:center;gap:14px;font-size:11px;display:flex;position:absolute}.hero__scroll:after{content:"";transform-origin:0;width:64px;height:1px;animation:ll-scroll 2.6s var(--ease) infinite;background:currentColor}@keyframes ll-scroll{0%{transform:scaleX(0)}45%{transform:scaleX(1)}to{opacity:0;transform:scaleX(1)}}.hero__replay{right:max(var(--gutter),calc((100% - var(--frame))/2 + var(--gutter)));bottom:var(--s3);z-index:5;letter-spacing:.2em;color:var(--dim);font-size:11px;transition:color .3s;position:absolute}.hero__replay:hover{color:var(--ink)}.hero__vert,.hero__seal,.hero__role{-webkit-user-select:none;user-select:none;pointer-events:none}.js-intro [data-stage]{opacity:0;transform:translateY(8px)}.js-intro [data-stage].on{opacity:1;transition:opacity .7s var(--ease),transform .7s var(--ease);transform:none}.js-intro .hero__names[data-stage].on{transition-delay:80ms}.js-intro .hero__feat[data-stage].on{transition-delay:.16s}.js-intro .site-header[data-stage].on{transition-delay:.24s}.js-intro .hero__seal[data-stage]{opacity:0}.js-intro .hero__seal[data-stage].on{opacity:.94;animation:ll-stamp .48s var(--ease) both}@keyframes ll-stamp{0%{opacity:0;transform:translateY(-12px)scale(1.45)rotate(-9deg)}45%{opacity:.94;transform:translateY(0)scale(.9,.86)rotate(-2deg)}72%{transform:scale(1.04,1.06)rotate(-2deg)}to{opacity:.94;transform:scale(1)rotate(-2deg)}}.js-intro .hero__name[data-stage]{opacity:1;clip-path:inset(0 100% 0 0);transform:none}.js-intro .hero__name[data-stage].on{clip-path:inset(0);transition:clip-path .75s cubic-bezier(.7,0,.2,1)}html:not(.js-intro) .hero__replay{opacity:1}@media (width<=820px){.hero__vert{display:none}.hero__copy{width:auto;min-width:0;top:auto;bottom:10vh;right:var(--gutter);transform:none}.hero__copy:before{content:"";z-index:-1;background:radial-gradient(at 40%,#e7e0d0eb 35%,#e7e0d000 75%);position:absolute;inset:-28px -20px}.hero__feat{margin-top:var(--s3)}.hero__scroll{display:none}.hero__replay{bottom:var(--s2)}}@media (height<=700px) and (width>=821px){.hero__feat{margin-top:var(--s3)}}@media (prefers-reduced-motion:reduce){.hero__scroll:after{animation:none}}
