/* Fit lucky's longer name and portrait to the reference's left/right composition. */
.nav{display:grid;grid-template-columns:1fr auto 1fr;gap:24px}
.nav .logo{justify-self:start}
.nav ul{grid-column:2;justify-self:center}
.hero{height:100svh;min-height:640px;overflow:hidden;isolation:isolate}
.hero-img-wrap{top:3svh;right:0;width:min(64vw,calc(97svh * .84));height:97svh;z-index:0;opacity:1}
.hero-video{width:100%;height:100%;object-fit:contain;object-position:right bottom;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 12%);mask-image:linear-gradient(to right,transparent 0,#000 12%)}
.hero-img-wrap::after{background:linear-gradient(to top,var(--void) 0%,transparent 28%)}
.hero-inner{z-index:2;padding-bottom:14svh}
.hero-title{font-size:clamp(72px,9vw,204px);line-height:.86}
.hero-title > .line{padding-bottom:.06em;overflow:hidden}
.hero-title .outline{font-size:1.02em;letter-spacing:-.045em}
.eyes{margin-bottom:clamp(24px,3svh,44px)}
.eye{width:clamp(58px,6.5vw,104px)}
.hero-sub{position:relative;margin-top:5svh}
.hero-sub p{max-width:min(38vw,440px)}
.hero-meta{position:absolute;right:0;top:calc(100% + 24px);bottom:auto;font-size:10px;color:#aaa69e;align-self:flex-end}
/* Preserve complete lettering in title covers, and use selected frames for visual works. */
.work-cover{object-fit:var(--cover-fit,contain);object-position:var(--cover-position,50% 50%);background:#0b0b0c}
.work[data-cover-kind="title"]:hover .work-cover,.work[data-cover-kind="image"]:hover .work-cover{transform:none}
.work-info{opacity:1;transform:none;padding:clamp(16px,1.8vw,26px)}
.work-info h3{font-family:var(--inter);font-size:clamp(16px,1.6vw,24px);line-height:1.35;letter-spacing:0;text-transform:none}
.work-info .cat{font-size:9px;letter-spacing:.1em}
.work-info .yr{font-size:10px}
.wp-card img{object-fit:var(--cover-fit,contain);object-position:var(--cover-position,50% 50%)}
.wp-card[data-cover-kind="title"]:hover img,.wp-card[data-cover-kind="image"]:hover img{transform:none}
@media(min-width:1800px){.hero-sub p{font-size:17px;max-width:500px}.hero-meta{font-size:12px}.nav .logo{font-size:34px}}
@media(max-width:980px){
 .nav{grid-template-columns:auto 1fr}.nav ul{grid-column:2;justify-self:end;gap:22px}
 .hero-img-wrap{width:70vw;height:92svh;top:8svh}
 .hero-title{font-size:10vw}.hero-title .outline{font-size:.89em}
 .hero-inner{padding-bottom:12svh}.hero-sub p{max-width:42vw}
}
@media(max-width:820px){
 .hero-img-wrap{width:82vw;right:-5vw;opacity:.72}
 .hero-title{font-size:12vw}.hero-title .outline{font-size:.74em}
 .hero-sub p{max-width:370px}.hero-meta{display:none}
}
@media(max-width:480px){
 .nav{display:flex;justify-content:space-between;gap:14px}.nav .logo{font-size:25px}.nav ul{gap:13px;width:auto;margin:0}.nav ul a{font-size:10px}
 .hero{min-height:680px}
 .hero-img-wrap{top:11svh;right:-14vw;width:105vw;height:76svh;opacity:.72}
 .hero-video{object-position:right top;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 20%);mask-image:linear-gradient(to right,transparent 0,#000 20%)}
 .hero-inner{padding-bottom:9svh}.hero-title{font-size:14.6vw;line-height:.94}.hero-title .outline{font-size:.63em}
 .hero-sub{margin-top:4svh}.hero-sub p{max-width:290px;font-size:12px;line-height:1.75}.eye{width:52px}.eyes{gap:8px;margin-bottom:24px}
}