@font-face{font-family:RoswoAnton;src:url('/assets/fonts/anton-hero.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
/* Approved Anton hero. Keep the site's navigation and remaining type system. */
.hero{display:flex;flex-direction:column;justify-content:center;gap:1.5rem;min-height:calc(100svh - var(--masthead-height,85px));padding:1rem var(--gutter) 2rem}
.hero .type-stage{display:block;position:relative;isolation:isolate;width:100%;max-width:1000px;margin:auto;flex:none;padding:8px 0 12px}
.hero .hero-title{position:relative;z-index:1;font-family:RoswoAnton,Impact,sans-serif;font-size:min(22vw,220px,calc((100svh - 190px)/2.76));font-weight:400;font-synthesis:none;line-height:.91;letter-spacing:-.012em;margin:0;color:var(--paper);-webkit-text-fill-color:var(--paper);pointer-events:none;text-shadow:0 0 16px #0007}
.hero .hero-title .type-line{display:block;position:relative;line-height:.91;width:max-content;max-width:100%;font-weight:400;letter-spacing:inherit}
.hero .hero-title .line-ideas{margin:0;color:var(--paper);-webkit-text-fill-color:var(--paper)}
.hero .hero-title .line-hate{margin:0 0 0 auto;color:var(--orange);-webkit-text-fill-color:var(--orange)}
.hero .line-hate:before{display:none}
.hero .hero-title .line-slow{margin:0 0 0 8%;width:92%;line-height:.94;color:var(--paper);-webkit-text-fill-color:var(--paper)}
.hero .hero-title .type-line>span{animation:none;transform:none}
.hero .word-window{display:block;height:.94em;width:100%;overflow:hidden;position:relative}
.hero .slogan-word{display:block;position:absolute;inset:0;height:.94em;line-height:.94}
.hero .slogan-text{display:block;width:max-content;transform-origin:left center;white-space:nowrap;line-height:.94;letter-spacing:inherit}
.hero .type-stage .hero-art{position:absolute;inset:0 -4.95%;width:auto;height:auto;max-width:none;max-height:none;transform:none;pointer-events:none;z-index:0;mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 83%,transparent)}
.hero #idea-form{display:block;position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .7s}
.hero .has-sculpture #idea-form{opacity:1}
.hero .type-stage .flight-fallback{position:absolute;width:17%;height:auto;left:14%;top:38%;opacity:.85;transform:none}
.hero .has-sculpture .flight-fallback{opacity:0}
.hero .hero-bottom{position:relative;z-index:2;flex:none;width:100%;margin:0;padding-top:1rem}
@media(max-width:650px){
 .hero{min-height:0;padding:0 var(--gutter) 1.25rem;gap:0}
 .hero .type-stage{padding:24px 0 24px}
 .hero .hero-bottom{padding-top:0}
 .hero + .work{padding-top:2rem}
 .hero .hero-title{font-size:min(30vw,132px);line-height:.91}
 .hero .hero-title .line-slow{margin-left:0;width:100%}
 .hero .type-stage .hero-art{inset:0 calc(var(--gutter)*-1)}
}
@media(prefers-reduced-motion:reduce){.hero #idea-form{transition:none}}

/* A little more desktop leading; keep the approved horizontal placement. */
@media(min-width:651px){
 .hero .hero-title .line-ideas,.hero .hero-title .line-hate{line-height:.93}
 .hero .type-stage .flight-fallback{width:min(12.32vw,123.2px,calc((100svh - 190px)/2.76*.56));left:19%;top:47%;transform:translate(-50%,-50%)}
}
@media(min-width:900px){.hero .type-stage .flight-fallback{left:23.5%}}

/* Grow the entire composition together on wide displays, within the viewport height. */
@media(min-width:1441px){
 .hero{--wide-hero-type:min(calc(220px + (100vw - 1440px)*.18),calc((100svh - var(--masthead-height,85px) - 165px)/2.8))}
 .hero .type-stage{max-width:calc(var(--wide-hero-type)*4.5454545)}
 .hero .hero-title{font-size:var(--wide-hero-type)}
 .hero .type-stage .flight-fallback{width:calc(var(--wide-hero-type)*.56)}
}