/* El Velo: a journey through the five existing crops, ending in the full frame. */
body[data-work="el-velo"] .light-sequence{height:280svh}
body[data-work="el-velo"] .light-sticky h2{position:absolute;top:11%;left:var(--page-gutter);font-size:clamp(3rem,7.6vw,8rem);line-height:.95;transform:translateY(var(--veil-title-y,0px));opacity:var(--veil-title-opacity,1)}
body[data-work="el-velo"] .light-image{clip-path:inset(0);transform:scale(var(--veil-field-scale,1.12));opacity:var(--veil-field-opacity,.18)}
body[data-work="el-velo"] .light-grid{opacity:calc(.24 * var(--veil-film-opacity,1))}
.veil-window{position:absolute;left:0;right:0;top:37%;height:43%;overflow:hidden;opacity:var(--veil-film-opacity,1);transform:translate3d(0,var(--veil-film-y,0px),0);will-change:transform,opacity}
.veil-film{display:flex;align-items:stretch;gap:clamp(1rem,2vw,2.5rem);height:100%;width:max-content;padding-inline:var(--page-gutter);transform:translate3d(var(--veil-travel,0px),0,0);will-change:transform}
.veil-shot{position:relative;flex:0 0 43vw;width:43vw;height:100%;margin:0;overflow:hidden;border:1px solid #ffffff30;background:#080909;border-radius:3px;box-shadow:0 20px 60px #0006}
.veil-shot img{width:100%;height:100%;object-fit:cover}
.veil-shot figcaption{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:2.5rem 1.25rem 1rem;font:400 .75rem/1.5 var(--sans);background:linear-gradient(transparent,#080909e6);color:#e8ece6}
.veil-shot figcaption span{font-size:.625rem;letter-spacing:.16em;color:#9accc6}
.veil-reading{position:absolute;top:82%;left:var(--page-gutter);right:var(--page-gutter);display:flex;gap:1.2rem;align-items:center;font:400 .6875rem/1.5 var(--sans);letter-spacing:.1em;opacity:var(--veil-film-opacity,1)}
.veil-current{color:var(--accent);white-space:nowrap}.veil-detail{min-width:11ch}.veil-meter{height:1px;background:#ffffff30;flex:1}.veil-meter i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--veil-meter,.2))}
body[data-work="el-velo"] .light-bottom p{max-width:36ch}
.experience-still .veil-window,.experience-still .veil-reading{display:none}
body[data-work="el-velo"].experience-still .light-sequence{height:auto}
body[data-work="el-velo"].experience-still .light-sticky h2{top:30%;opacity:1;transform:none}
@media(max-width:40rem){body[data-work="el-velo"] .light-sequence{height:260svh}body[data-work="el-velo"] .light-sticky h2{font-size:clamp(2.5rem,12vw,4.8rem);top:13%}.veil-window{top:32%;height:43%}.veil-shot{width:78vw;flex-basis:78vw}.veil-shot figcaption{padding:2rem .8rem .7rem;font-size:.6875rem}.veil-reading{top:77%;font-size:.5625rem;gap:.7rem}.veil-shot figcaption span{font-size:.5625rem}body[data-work="el-velo"] .light-bottom p{font-size:.8125rem;line-height:1.6}.veil-detail{min-width:10ch}}
@media(max-height:38rem) and (min-width:40.01rem){body[data-work="el-velo"] .light-sticky h2{top:12%;font-size:8svh}.veil-window{top:35%;height:36%}.veil-reading{top:73%}body[data-work="el-velo"] .light-bottom p{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){body[data-work="el-velo"] .light-sequence{height:auto}.veil-window,.veil-reading{display:none}body[data-work="el-velo"] .light-image{opacity:1!important;transform:none!important}body[data-work="el-velo"] .light-sticky h2{top:30%;opacity:1;transform:none}}

body[data-work="el-velo"] .light-marker{display:none}
@media(min-width:40.01rem) and (min-height:38.01rem){body[data-work="el-velo"] .light-sticky h2{font-size:clamp(3rem,min(7.6vw,10svh),8rem)}.veil-window{top:33%;height:39%}.veil-reading{top:74%}}
@media(max-width:40rem) and (max-height:60rem){.veil-window{top:30%;height:33%}.veil-reading{top:65%}}
@media(max-width:40rem) and (max-height:42rem){body[data-work="el-velo"] .light-sticky h2{top:13%;font-size:clamp(2.25rem,11vw,3.5rem)}.veil-window{top:31%;height:28%}.veil-reading{top:61%}body[data-work="el-velo"] .light-bottom{gap:.5rem}body[data-work="el-velo"] .light-bottom p{font-size:.75rem}}
@media(max-width:40rem){body[data-work="el-velo"] .light-sticky h2{font-size:clamp(2.25rem,min(12vw,7svh),4.8rem)}}
@media(max-height:38rem) and (min-width:40.01rem){.veil-window{top:33%;height:31%}.veil-reading{top:67%}}
