/* V23 — a personal signature, with the image and the original marks doing the work. */
.duo-scene{position:relative;background:#050505;isolation:isolate}
.duo-stage{position:relative;height:100svh;min-height:540px;overflow:hidden;color:#f0eee9}
.duo-image,.duo-grade,.duo-grain{position:absolute;inset:0;pointer-events:none}
.duo-image img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:grayscale(1) contrast(1.06) brightness(.9);transform:scale(var(--duo-scale,1.05));transform-origin:35% 45%;display:block}
.duo-grade{background:linear-gradient(#03030388,transparent 30%,transparent 53%,#03030366 88%,#0303039c),radial-gradient(ellipse at 45% 45%,transparent 40%,#0003)}
.duo-grain{background:url('assets/grain.svg') repeat;background-size:150px;opacity:.075;mix-blend-mode:soft-light}
.duo-names{position:absolute;z-index:2;top:clamp(100px,12svh,140px);left:var(--pad,4vw);right:var(--pad,4vw);display:flex;justify-content:space-between;gap:25px;font-size:9px;line-height:1.8;letter-spacing:.18em;text-shadow:0 1px 15px #000;opacity:var(--duo-copy,1)}
.duo-names span:last-child{text-align:right}
.duo-names i{font-style:normal;color:#d2d1cb}
#duo-title{position:absolute;z-index:3;left:var(--pad,4vw);right:var(--pad,4vw);bottom:9svh;margin:0;font-size:clamp(65px,12.7vw,205px);font-weight:400;letter-spacing:-.065em;line-height:1;opacity:var(--duo-copy,1);transform:translateY(calc((1 - var(--duo-copy,1)) * 14px))}
#duo-title a{display:inline-block;color:inherit;text-decoration:none;position:relative}
#duo-title a::after{content:"";position:absolute;left:0;right:0;height:1px;bottom:-12px;background:#f0eee9;transform:scaleX(0);transform-origin:left;transition:transform .6s}
#duo-title a:hover::after,#duo-title a:focus-visible::after{transform:scaleX(1)}
#duo-title a:focus-visible{outline:1px solid #d8463a;outline-offset:14px}
.duo-cut{display:none}
body[data-page="home"].opening-film-ready .camera-journey{height:400svh}
.opening-film-ready .camera-journey .duo-scene{position:absolute;inset:0;height:100%;z-index:8;pointer-events:none;background:transparent}
.opening-film-ready .camera-journey .duo-stage{position:sticky;top:0;min-height:0;opacity:var(--duo-opacity,0);pointer-events:auto}
.opening-film-ready .duo-scene[inert] .duo-stage{pointer-events:none}
.opening-film-ready .duo-cut{display:block;position:absolute;inset:0;z-index:11;pointer-events:none}
.duo-cut>div{position:sticky;top:0;height:100svh;background:#030303;opacity:var(--duo-cut,0)}
/* The large white original marks and moon separators return to a slow orbit. */
.personal-brands{background:#0b0b0b;padding:35px 0 clamp(75px,8vw,125px);overflow:hidden}
.brands-ticker{overflow:hidden;border-top:1px solid #ffffff14;padding:15px 0}
.brands-ticker:last-child{border-bottom:1px solid #ffffff14}
.brands-track{display:flex;width:max-content;animation:personal-brand-travel 75s linear infinite;animation-play-state:var(--brands-motion,running)}
.brands-ticker--2 .brands-track{animation-direction:reverse;animation-duration:82s}
.brands-group{display:flex;align-items:center;justify-content:space-around;min-width:100vw;flex:none;gap:clamp(24px,3.4vw,65px);padding-right:clamp(24px,3.4vw,65px)}
.brands-entry{display:flex;align-items:center;flex:none;gap:clamp(30px,4vw,76px);height:clamp(95px,10vw,150px)}
.brand-original-mark{display:block;flex:none;width:clamp(155px,15vw,240px);height:80px;overflow:hidden;mix-blend-mode:screen;opacity:.85;transition:opacity .4s}
.brand-original-mark--gopro{width:clamp(120px,12vw,180px);height:65px;object-fit:contain;filter:grayscale(1);margin:0 20px}
.brands-moon{width:clamp(25px,2.5vw,40px);height:24px;object-fit:contain;opacity:.55;filter:grayscale(1)}
.brands-ticker:hover .brands-track,.personal-brands:focus-within .brands-track{animation-play-state:paused}
.brands-entry:hover .brand-original-mark{opacity:1}
@keyframes personal-brand-travel{to{transform:translateX(-50%)}}
@media(max-width:700px){
 body[data-page="home"].opening-film-ready .camera-journey{height:380svh}
 .duo-stage{min-height:520px}
 .duo-image img{object-position:43% 50%}
 .duo-names{top:100px;gap:18px;font-size:7px;letter-spacing:.11em}
 .duo-names i{display:block;font-size:6px}
 #duo-title{font-size:13.5vw;bottom:12svh;letter-spacing:-.07em}
 .personal-brands{padding-top:18px}
 .brands-ticker{padding:6px 0}
 .brands-entry{height:105px;gap:30px}
 .brands-group{gap:30px;padding-right:30px}
 .brand-original-mark{width:160px;height:65px}
 .brand-original-mark--gopro{width:130px;height:50px;margin:0 15px}
 .brands-moon{width:25px;height:18px}
}
@media(prefers-reduced-motion:reduce){
 body[data-page="home"].opening-film-ready .camera-journey{height:auto}
 .opening-film-ready .camera-journey .duo-scene{position:relative;inset:auto;height:auto;pointer-events:auto;background:#050505}
 .opening-film-ready .camera-journey .duo-stage{position:relative;opacity:1;min-height:520px}
 .opening-film-ready .duo-cut{display:none}
 .duo-image img{transform:none}
 .duo-names,#duo-title{opacity:1;transform:none}
 .brands-track{animation:none;display:block;width:100%}
 .brands-group{width:100%;min-width:0;flex-wrap:wrap;gap:12px 30px;padding:10px var(--pad,4vw)}
 .brands-group--repeat{display:none}
 .brand-original-mark{width:145px;height:65px}
 .brands-entry{height:90px;gap:20px}
 .brands-moon{width:20px}
}
