/* An entrance into the page, not a loading screen. All content works without JS. */
html{scroll-padding-top:100px}
header{padding-top:26px;padding-bottom:26px}
nav>a{position:relative;padding:8px 0}
nav>a::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s}
nav>a:hover::after{transform:scaleX(1)}
.hero{padding-top:150px;min-height:0;padding-bottom:22px;isolation:isolate}
.hero-top{padding-bottom:24px;border-bottom:1px solid var(--line)}
.hero h1{font-size:clamp(74px,11.9vw,190px);margin:35px 0 25px;line-height:1;letter-spacing:-.068em}
.hero h1 .title-window{display:block;overflow:hidden;perspective:1100px;padding-bottom:.12em;margin-bottom:-.12em}
.hero h1 .title-motion{display:block;transform-origin:50% 100%}
.hero h1 .title-window-italic{padding-right:.12em}
.hero h1 em{margin-left:25%;letter-spacing:-.075em}
.hero-description{padding-bottom:15px}
.hero-description p{font-size:18px;line-height:1.55}
.hero-brand{margin-top:55px;perspective:1200px;position:relative;padding:0 0 8px}
.brand-stage{position:relative;transform-style:preserve-3d;transform-origin:50% 50%;transition:filter .5s;will-change:transform}
.brand-stage img{filter:drop-shadow(0 1px 0 #b34071) drop-shadow(0 2px 0 #8f2b55) drop-shadow(0 4px 0 #57203a) drop-shadow(0 16px 18px #0009);backface-visibility:hidden}
.quote{transition:transform .25s,box-shadow .25s,background .25s;border-radius:6px;min-height:52px}
.quote span{transition:transform .25s}.quote:hover span{transform:translate(3px,-3px)}
.eyebrow,.service-kicker{font-size:13px}.hero-edition{font-size:12px}
.studio{padding-top:110px;padding-bottom:110px}
.service-choices button{transition:background .25s,color .25s,transform .25s}.service-choices button:hover{transform:translateY(-3px)}
.service-arrows button{transition:background .25s,transform .25s}.service-arrows button:not(:disabled):hover{background:var(--pink);color:#0b0b0d;transform:scale(1.08)}
.contact{border-radius:36px 36px 0 0}.email{transition:background .25s,transform .25s}.email:hover{transform:translateY(-3px)}
@media(max-width:700px){
 header{padding:20px 6%;height:80px}.brand img{width:105px}nav{gap:15px}nav .quote{font-size:12px;padding:11px 15px;min-height:44px;gap:12px}
 .hero{padding-top:118px;padding-bottom:25px}.hero-top{padding-bottom:20px}.hero-edition{display:none}
 .hero h1{font-size:clamp(60px,12.7vw,90px);margin-top:34px;margin-bottom:30px;line-height:1.04}
 .hero h1 em{margin-left:12%}.hero-description p{font-size:16px}.hero-brand{margin-top:38px}
 .brand-stage img{filter:drop-shadow(0 1px 0 #b34071) drop-shadow(0 2px 0 #57203a) drop-shadow(0 8px 10px #0008)}
 .contact{border-radius:24px 24px 0 0}
}
@media(prefers-reduced-motion:reduce){.brand-stage{transform:none!important;will-change:auto}.title-motion{transform:none!important;opacity:1!important}*{scroll-behavior:auto!important}}
