/* ===== Curtain intro ===== */
.curtain{position:fixed;inset:0;z-index:200;display:flex;pointer-events:none}

html:not(.js) .curtain{display:none}

.curtain .panel{position:relative;width:51%;height:100%;
  background:
    repeating-linear-gradient(90deg, rgba(0,0,0,.55) 0, rgba(255,255,255,.05) 22px, rgba(0,0,0,.6) 46px),
    linear-gradient(90deg,#0c0a08,#241f17 60%,#0a0807);
  transition:transform 1.5s cubic-bezier(.76,0,.24,1)}

.curtain .panel.r{background:
    repeating-linear-gradient(90deg, rgba(0,0,0,.6) 0, rgba(255,255,255,.05) 22px, rgba(0,0,0,.55) 46px),
    linear-gradient(90deg,#0a0807,#241f17 40%,#0c0a08)}

.curtain .panel::after{content:"";position:absolute;top:0;bottom:0;width:30px}

.curtain .panel.l::after{right:0;background:linear-gradient(90deg,transparent,rgba(248,205,30,.45))}

.curtain .panel.r::after{left:0;background:linear-gradient(270deg,transparent,rgba(248,205,30,.45))}

.curtain .seam{position:absolute;top:0;bottom:0;left:50%;width:3px;transform:translateX(-50%);z-index:2;background:linear-gradient(180deg,rgba(248,205,30,.1),rgba(248,205,30,.65),rgba(248,205,30,.1));box-shadow:0 0 24px 4px rgba(248,205,30,.35);transition:opacity .5s ease}

.curtain .c-logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;width:min(320px,56vw);transition:opacity .5s ease,transform .9s cubic-bezier(.76,0,.24,1)}

.curtain.open .panel.l{transform:translateX(-100%)}

.curtain.open .panel.r{transform:translateX(100%)}

.curtain.open .seam{opacity:0}

.curtain.open .c-logo{opacity:0;transform:translate(-50%,-50%) scale(1.15)}

.curtain.gone{display:none}
.curtain-done .curtain{display:none!important}