.light-gate{--seam:69.5%;position:relative;height:calc(100svh - 90px);min-height:610px;overflow:hidden;isolation:isolate;background:#f0e9dc;color:#292b27}
.light-scene,.light-opening,.light-scene picture,.light-scene img{position:absolute;inset:0;width:100%;height:100%}
.light-scene{z-index:0;transform-origin:var(--seam) 73%}
.light-scene img{object-fit:cover;object-position:70% center}
.light-opening{z-index:1;pointer-events:none}
.light-cover{position:absolute;top:0;bottom:0;background:#f0e9dc;visibility:hidden}
.light-cover-left{left:0;width:var(--seam)}
.light-cover-right{right:0;width:calc(100% - var(--seam))}
.light-slit,.light-edge{position:absolute;top:7%;bottom:7%;left:var(--seam);width:2px;background:#fffef7;opacity:0;box-shadow:0 0 16px 7px #fffef7bd,0 0 55px 18px #fff8de59}
.light-slit{transform-origin:50% 74%}
.light-glow{position:absolute;inset:0;background:radial-gradient(ellipse at var(--seam) 78%,#fffdf2 0%,#fff9e6aa 18%,transparent 65%);opacity:0}
.light-copy{position:absolute;inset:0;z-index:2;pointer-events:none}
.light-title{position:absolute;top:16%;left:var(--gutter);margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(76px,8.2vw,150px);line-height:1.18;letter-spacing:.035em}
.light-prefix,.light-create{display:block}
.light-create{margin-top:.15em}
.light-description{position:absolute;left:var(--gutter);bottom:9%;margin:0;font-size:14px;line-height:2;letter-spacing:.1em}
.light-running .light-scene{animation:light-camera 5s cubic-bezier(.22,.61,.36,1) .7s both}
.light-running .light-cover{visibility:visible}
.light-running .light-cover-left{animation:light-open-left 3.05s cubic-bezier(.76,0,.24,1) 1.6s both}
.light-running .light-cover-right{animation:light-open-right 3.05s cubic-bezier(.76,0,.24,1) 1.6s both}
.light-running .light-slit{animation:light-seam 2.8s ease .75s both}
.light-running .light-edge-left{animation:light-edge-left 3.05s cubic-bezier(.76,0,.24,1) 1.6s both}
.light-running .light-edge-right{animation:light-edge-right 3.05s cubic-bezier(.76,0,.24,1) 1.6s both}
.light-running .light-glow{animation:light-bloom 3.6s ease 1.5s both}
.light-running .light-prefix{animation:light-prefix 1.35s ease .2s both}
.light-running .light-create{animation:light-words 1.2s ease 3.8s both}
.light-running .light-description{animation:light-words 1.2s ease 4.15s both}
@keyframes light-camera{from{transform:scale(1.065)}to{transform:scale(1)}}
@keyframes light-open-left{to{transform:translateX(-100%)}}
@keyframes light-open-right{to{transform:translateX(100%)}}
@keyframes light-seam{0%{opacity:0;transform:scaleY(.025)}25%{opacity:1}60%{opacity:1;transform:scaleY(1)}100%{opacity:0;transform:scaleY(1)}}
@keyframes light-edge-left{0%{opacity:0}15%{opacity:.55}70%{opacity:.25}100%{left:0;opacity:0}}
@keyframes light-edge-right{0%{opacity:0}15%{opacity:.55}70%{opacity:.25}100%{left:100%;opacity:0}}
@keyframes light-bloom{0%,100%{opacity:0}45%{opacity:.32}}
@keyframes light-prefix{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:blur(0)}}
@keyframes light-words{from{opacity:0}to{opacity:1}}
@media(min-width:1700px){.light-title{top:20%}}
@media(max-width:900px){.light-gate{height:calc(100svh - 76px);min-height:580px}.light-title{font-size:10vw;top:19%}}
@media(max-width:700px){.light-gate{--seam:74%;height:calc(100svh - 72px);min-height:620px;max-height:1000px}.light-scene img{object-position:74% center}.light-title{top:21%;left:24px;font-size:clamp(53px,14.5vw,90px);line-height:1.18}.light-create{margin-top:.1em}.light-description{left:24px;bottom:8%;font-size:11px;line-height:2}.light-scene{transform-origin:74% 77%}}
@media(prefers-reduced-motion:reduce){.light-running .light-gate *{animation:none}.light-cover{display:none}}
html.reduce-motion .light-gate *{animation:none}.reduce-motion .light-cover{display:none}