/* v08 Hero: reference proportions with the original side gutters. */
@font-face{font-family:TransferAnton;src:url('assets/fonts/Anton-Regular.ttf') format('truetype');font-display:block}
.transfer-hero{--paper:#f8f6ef;--orange:#f23719;--hero-gutter:6%;position:relative;isolation:isolate;overflow:hidden;width:100%;margin-left:0;background:var(--paper);color:#191919}
.col .transfer-hero{width:100vw;margin-left:calc(50% - 50vw)}
.transfer-hero,.transfer-hero *{box-sizing:border-box}
.transfer-hero .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.transfer-hero__color{position:absolute;inset:0;background:var(--orange);clip-path:polygon(85.2% 0,100% 0,100% 100%,55% 100%);z-index:-1}
.transfer-hero__stage{position:relative;height:48.8vw;max-height:min(760px,calc(100svh - 120px))}
.transfer-hero__person{position:absolute;height:100%;width:auto;max-width:none;right:var(--hero-gutter);top:0;bottom:auto;object-fit:contain;z-index:1}
.transfer-hero__title{position:absolute;inset:0;margin:0;font-size:inherit;font-weight:400;line-height:1;z-index:2}
.transfer-hero__word{position:absolute;left:var(--hero-gutter);fill:#191919;stroke:#191919;stroke-width:20;stroke-linejoin:miter;paint-order:stroke fill;font-family:TransferAnton,sans-serif;font-size:1000px;font-weight:400;letter-spacing:-10px;overflow:visible}
.transfer-hero__make{top:5%;width:54%;height:39.5%}
.transfer-hero__different{top:45%;width:57.5%;height:30.5%}
.transfer-hero__identity{position:absolute;z-index:3;left:var(--hero-gutter);bottom:0;max-width:52%;font-family:'Work Sans','Noto Sans SC',sans-serif}
.transfer-hero__name{margin:0;font:400 clamp(25px,3.15vw,47px)/1.12 TransferAnton,sans-serif;letter-spacing:.005em}
.transfer-hero__roles{display:flex;flex-wrap:wrap;gap:0 .45em;margin:5px 0 0;font-size:clamp(10px,1.1vw,15px);line-height:1.4;color:#63625f;letter-spacing:-.02em}
.transfer-hero__roles{--type-pause:160ms}
.transfer-hero__roles > span{white-space:nowrap}
.transfer-hero__roles > span+span::before{content:'·';margin-right:.45em}
.transfer-hero__inverse,.transfer-hero__shade{display:none}
.transfer-hero .transfer-cue{position:absolute;z-index:4;left:48%;bottom:0;display:grid;place-items:center;width:44px;height:40px;color:var(--orange);transform:translateX(-50%);animation:transfer-cue-in .7s 2.4s backwards}
.transfer-hero .transfer-cue svg{display:block;width:18px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;animation:transfer-drift 2.5s ease-in-out infinite}
.transfer-hero__identity .type-char,.transfer-hero__roles > span+span::before{opacity:1;animation:transfer-type 1ms backwards;animation-delay:calc(100ms + var(--i)*32ms + var(--type-pause,0ms))}
@keyframes transfer-type{from{opacity:0}to{opacity:1}}
@keyframes transfer-cue-in{from{opacity:0}to{opacity:1}}
@keyframes transfer-drift{0%,100%{transform:translateY(-3px)}50%{transform:translateY(3px)}}
@media(min-width:601px) and (max-width:800px){.transfer-hero__stage{min-height:0}.transfer-hero__name{font-size:24px}.transfer-hero__roles{font-size:9px}}
@media(max-width:600px){
  .transfer-hero{--stage-width:calc(100vw - 24px);--stage-height:min(125vw,68svh);padding:12px 12px 44px}
  .transfer-hero__stage{height:var(--stage-height);min-height:0;max-height:none}
  .transfer-hero__color{clip-path:polygon(86% 0,100% 0,100% calc(100% - 44px),57% calc(100% - 44px))}
  .transfer-hero__person{top:-1%;left:-2%;right:auto;bottom:auto;height:104%;width:auto;object-fit:contain;clip-path:inset(0 0 2.9%)}
  .transfer-hero__word{left:4%}
  .transfer-hero__make{top:42%;width:72%;height:23%}
  .transfer-hero__different{top:66%;width:92%;height:16%}
  .transfer-hero__inverse{display:block;position:absolute;inset:0;z-index:2;pointer-events:none;clip-path:inset(45% 0 0);mask:url('assets/hero/person.png') no-repeat;mask-size:auto 104%;mask-position:calc(var(--stage-width) * -.02) calc(var(--stage-height) * -.01);-webkit-mask:url('assets/hero/person.png') no-repeat;-webkit-mask-size:auto 104%;-webkit-mask-position:calc(var(--stage-width) * -.02) calc(var(--stage-height) * -.01)}
  .transfer-hero__inverse .transfer-hero__word{fill:#fffdf6;stroke:#fffdf6}
  .transfer-hero__shade{display:block;position:absolute;inset:74% 0 0;z-index:1;background:linear-gradient(transparent,#191919 98%);mask:url('assets/hero/person.png') no-repeat;-webkit-mask:url('assets/hero/person.png') no-repeat;mask-size:auto calc(var(--stage-height) * 1.04);-webkit-mask-size:auto calc(var(--stage-height) * 1.04);mask-position:calc(var(--stage-width) * -.02) calc(var(--stage-height) * -.75);-webkit-mask-position:calc(var(--stage-width) * -.02) calc(var(--stage-height) * -.75)}
  .transfer-hero__identity{left:4%;top:auto;bottom:0;max-width:92%;color:#fff;mix-blend-mode:difference}
  .transfer-hero__name{font:750 clamp(16px,4.6vw,21px)/1.2 'Work Sans',sans-serif;letter-spacing:.025em}
  .transfer-hero__roles{max-width:290px;margin-top:5px;font-size:clamp(8px,2.3vw,10px);line-height:1.6;letter-spacing:0;color:#fff}
  .transfer-hero .transfer-cue{left:50%;top:100%;bottom:auto;height:44px}
}
@media(prefers-reduced-motion:reduce){.transfer-hero *,.transfer-hero__roles > span+span::before{animation:none!important}}