*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.home{margin:0;background:#000;color:#F5F5F3;font:16px/1.5 -apple-system,BlinkMacSystemFont,"SF Pro Display","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
.mast{text-align:center;padding:clamp(56px,10vw,112px) 20px clamp(40px,6vw,72px)}
.wordmark{margin:0;color:#FF6100;font-weight:900;font-size:clamp(64px,13vw,148px);line-height:.95;letter-spacing:-.055em}
.tag{margin:18px 0 0;color:#8E8E8A;font-size:clamp(16px,2vw,19px);font-weight:500;letter-spacing:-.01em}
.apps3{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px)}
.app{display:flex;flex-direction:column;align-items:center;text-align:center}
.shot{width:100%;max-width:300px;border-radius:30px;border:1px solid #1f1f1f;box-shadow:0 30px 80px rgba(0,0,0,.8),0 0 0 6px #0b0b0b}
.app h2{margin:32px 0 6px;font-size:22px;font-weight:750;letter-spacing:-.025em}
.app p{margin:0 0 20px;color:#8E8E8A;font-size:15px;max-width:300px;min-height:2.9em}
.badge{display:inline-block;border-radius:10px;transition:opacity .2s}
.badge:hover,.badge:focus-visible{opacity:.8}
.badge img{height:50px;width:auto}
.foot{margin-top:clamp(64px,9vw,112px);padding:28px 20px 40px;border-top:1px solid #141414;text-align:center;color:#6B6B68;font-size:14px}
.foot nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;margin-bottom:8px}
.foot a{color:#A1A19D}.foot a:hover{color:#FF6100}
.foot p{margin:0}
@media(max-width:820px){.apps3{grid-template-columns:1fr;max-width:420px;gap:64px}.shot{max-width:280px}.app p{min-height:0}}
/* hero with background photo */
.v2 .hero-bg{position:relative;isolation:isolate;overflow:hidden;height:clamp(560px,52vw,760px);padding:0;text-align:left}
.v2 .bg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.v2 .bg picture,.v2 .bg img{display:block;width:100%;height:100%}
.v2 .bg img{object-fit:cover;max-width:none;opacity:.6;object-position:0% 30%;transform:scale(1.22);transform-origin:0% 40%}
.v2 .hero-bg .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.25) 38%,rgba(0,0,0,0) 55%),linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 70%,#000 100%)}
.v2 .hero-text{max-width:1120px;margin:0 auto;padding:clamp(72px,9vw,128px) 24px 0}
.v2 .wordmark{text-shadow:0 4px 30px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.5)}
.v2 .tag{color:#E2E2DE;text-shadow:0 1px 3px rgba(0,0,0,.95),0 2px 16px rgba(0,0,0,.9)}
.v2 .lower{flex:1;background:#000;padding:clamp(16px,3vw,40px) 0 0}
.v2 .app{padding:22px 18px 26px;border-radius:30px;background:linear-gradient(180deg,#0d0d0d,#080808);border:1px solid #181818}
@media(max-width:820px){
 .v2 .hero-bg{height:auto;min-height:0;text-align:center;display:flex;flex-direction:column}
 .v2 .bg{order:1}
 .v2 .hero-text{padding:56px 20px 0}
 .v2 .bg{position:relative;inset:auto;z-index:0;height:min(118vw,520px);margin-top:20px}
 .v2 .bg img{transform:none;object-position:47% 40%;opacity:.75}
 .v2 .hero-bg .bg::after{background:linear-gradient(180deg,#000 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 72%,#000 100%)}
}