:root{--bg:#f3eee4;--ink:#15120f;--mute:#6b645a;--acc:#e0502a;--card:#e9e2d4;--line:#15120f22;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#12100d;--ink:#f1ebdf;--mute:#a39b8d;--card:#1d1a15;--line:#f1ebdf22}}
:root[data-theme=dark]{--bg:#12100d;--ink:#f1ebdf;--mute:#a39b8d;--card:#1d1a15;--line:#f1ebdf22}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box;margin:0}
body{background:var(--bg);color:var(--ink);font:400 17px/1.6 "Instrument Sans",system-ui,sans-serif;overflow-x:hidden}
h1,h2,h3,.serif{font-family:Fraunces,Georgia,serif;font-weight:300;letter-spacing:-.03em;line-height:.98}
a{color:inherit}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:calc(14px + env(safe-area-inset-top,0px)) 4vw 14px;mix-blend-mode:normal;background:linear-gradient(var(--bg),transparent)}
.logo{font:600 20px Fraunces,serif;text-decoration:none;letter-spacing:-.02em}.logo i{color:var(--acc);font-style:normal}
nav ul{display:flex;gap:clamp(10px,2vw,28px);list-style:none;padding:0;flex-wrap:wrap}
nav a.l{text-decoration:none;font-size:14px;font-weight:500;padding:4px 0;border-bottom:2px solid transparent}
nav a.l[aria-current=page]{border-color:var(--acc)}
.btn{display:inline-block;background:var(--acc);color:#fff;text-decoration:none;font-weight:600;padding:14px 26px;border-radius:99px;transition:transform .2s}
.btn:hover{transform:translateY(-2px)}.btn.o{background:none;color:var(--ink);border:1.5px solid var(--ink)}
.pin{height:280vh;position:relative}.stick{position:sticky;top:0;height:100vh;overflow:hidden}
#cv{position:absolute;inset:0;width:100%;height:100%}
.hl{position:absolute;left:4vw;right:4vw;bottom:12vh;will-change:transform,opacity}
.hl h1,.hl h2.hh{font-size:clamp(46px,10.5vw,170px)}.hl h1 em,.hl h2.hh em{color:var(--acc);font-style:italic}
.hl p{max-width:44ch;margin-top:22px;color:var(--mute)}
.scrollcue{position:absolute;right:4vw;top:50%;writing-mode:vertical-rl;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.wrap{padding:14vh 4vw}
.kick{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--acc);font-weight:600;margin-bottom:18px}
h2{font-size:clamp(38px,6.5vw,100px)}h3{font-size:28px;line-height:1.1}
.win{position:absolute;left:50%;top:54%;width:min(900px,92vw);height:min(470px,62vh);transform:translate(-50%,-50%);border:1.5px solid var(--ink);border-radius:18px;background:var(--bg)}
.win:before{content:"";position:absolute;left:16px;top:14px;width:10px;height:10px;border-radius:50%;background:var(--acc);box-shadow:18px 0 var(--mute),36px 0 var(--line)}
.tile{position:absolute;width:30%;min-width:112px;padding:14px;border-radius:12px;background:var(--card);border:1px solid var(--line);font-size:13px;line-height:1.35;will-change:transform}
.tile b{display:block;font:600 19px Fraunces,serif;margin-bottom:4px}
.cap{position:absolute;left:4vw;top:13vh;max-width:520px}.cap h2{font-size:clamp(34px,5vw,72px)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:48px}
.card{border:1px solid var(--line);border-radius:18px;padding:28px;background:var(--card);display:flex;flex-direction:column;gap:12px}
.tag{font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:4px 10px;border-radius:99px;border:1px solid var(--ink);align-self:flex-start}
.tag.a{background:var(--acc);border-color:var(--acc);color:#fff}
.big{font:300 clamp(80px,16vw,240px)/.9 Fraunces,serif;letter-spacing:-.05em}
.rev{transition:none;will-change:transform,opacity}
.vid{aspect-ratio:16/9;border:1.5px dashed var(--ink);border-radius:18px;display:grid;place-items:center;text-align:center;padding:24px;margin-top:40px;background:var(--card)}
details{border-bottom:1px solid var(--line);padding:18px 0}summary{cursor:pointer;font:400 24px Fraunces,serif;letter-spacing:-.02em}details p{margin-top:10px;color:var(--mute);max-width:70ch}
ul.ck{padding-left:20px;margin-top:14px}ul.ck li{margin:6px 0}
.warn{border-left:4px solid var(--acc);padding:12px 18px;background:var(--card);margin:20px 0;font-size:15px}
footer{padding:8vh 4vw 6vh;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;color:var(--mute);font-size:14px}
.pg{padding-top:18vh}.pg h1{font-size:clamp(48px,9vw,140px)}
.btn,.card,.tag{transition:transform .5s cubic-bezier(.34,1.7,.5,1),box-shadow .3s}
.card:hover{transform:translateY(-8px) rotate(-.6deg) scale(1.02);box-shadow:8px 8px 0 var(--ink)}
.btn:hover{transform:scale(1.08) rotate(-1.5deg)}.btn:active{transform:scale(.94)}
.stack{position:absolute;left:50%;top:58%;width:min(540px,78vw);height:320px;transform-style:preserve-3d}
.layer{position:absolute;inset:0;border:1.5px solid var(--ink);border-radius:16px;background:var(--card);padding:20px;font:600 28px Fraunces,serif;display:flex;align-items:flex-end;will-change:transform}
.layer small{font:400 14px "Instrument Sans";color:var(--mute);margin-left:12px;padding-bottom:4px}
.mf{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:4vw}
.mf span{display:inline-block;font:300 clamp(40px,9vw,150px)/1 Fraunces,serif;letter-spacing:-.04em;will-change:transform,opacity}
.vp video{width:100%;border-radius:18px;display:block;margin-top:40px}
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}main,footer{position:relative;z-index:1}
#bar{position:fixed;top:0;left:0;right:0;height:3px;background:var(--acc);transform:scaleX(0);transform-origin:0 50%;z-index:70}
#wipe{position:fixed;inset:0;background:var(--acc);z-index:80;transform:translateY(100%);pointer-events:none}
.mq{overflow:hidden;white-space:nowrap;padding:2vh 0;background:var(--acc);color:#fff;border-block:1.5px solid var(--ink);margin:6vh 0;will-change:transform}
.mq.o{background:var(--bg);color:transparent;-webkit-text-stroke:1.5px var(--ink)}
.mi{display:inline-block;will-change:transform}.mi span{display:inline-block;font:300 clamp(40px,8vw,120px)/1.1 Fraunces,serif;letter-spacing:-.03em;padding-right:2vw}
.ring{position:absolute;left:50%;top:58%;width:220px;height:250px;margin:-125px 0 0 -110px;transform-style:preserve-3d}
.face{position:absolute;inset:0;border:1.5px solid var(--ink);border-radius:16px;background:var(--card);padding:18px;font-size:14px;line-height:1.35}
.face b{display:block;font:600 24px Fraunces,serif;margin-bottom:6px}
.thr{position:absolute;left:50%;top:60%;width:min(960px,90vw);aspect-ratio:16/9;border:1.5px solid var(--ink);border-radius:18px;overflow:hidden;background:var(--card);box-shadow:14px 14px 0 var(--ink);will-change:transform}
.adf{aspect-ratio:16/9;margin-top:40px;border:1.5px solid var(--ink);border-radius:18px;overflow:hidden;background:var(--card)}
.adp{width:100%;height:100%;display:grid;place-items:center}.adp iframe{width:100%;height:100%;border:0}
.hs{position:absolute;left:0;top:44vh;display:flex;gap:4vw;padding:0 4vw;will-change:transform}
.pn{flex:0 0 min(70vw,520px);height:46vh;border:1.5px solid var(--ink);border-radius:20px;background:var(--card);padding:28px;display:flex;flex-direction:column;justify-content:flex-end;will-change:transform}
.pn i{font:300 90px/1 Fraunces,serif;font-style:normal;color:var(--acc);margin-bottom:auto}.pn h3{font-size:clamp(30px,4vw,48px)}
.fam{position:absolute;left:4vw;right:4vw;top:42vh;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.fc{border:1.5px solid var(--ink);border-radius:18px;background:var(--card);padding:20px;min-height:36vh;display:flex;flex-direction:column;gap:8px;transform-origin:50% 100%;will-change:transform}
.fc.a{background:var(--acc);color:#fff;border-color:var(--acc)}.fc.a .tag{border-color:#fff}
.wmk{white-space:nowrap;margin-top:12px}.wmk span{font-size:clamp(30px,10.5vw,190px)}
@media(max-width:700px){.fam{grid-template-columns:1fr 1fr}.fc{min-height:22vh}.pn{height:50vh}.tile{width:44%}.scrollcue{display:none}.win{height:56vh}}
@media(prefers-reduced-motion:reduce){.pin{height:auto}.stick{position:relative;height:auto;min-height:100vh}}

/* ---- shared additions ---- */
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
a.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--bg);padding:8px 14px;border:1.5px solid var(--ink);border-radius:8px}
a.skip:focus{left:8px}
nav a.l{transition:transform .4s cubic-bezier(.34,1.7,.5,1)}nav a.l:hover{transform:translateY(-2px) rotate(-2deg)}
#wipe{display:grid;place-items:center;color:#fff;font:600 clamp(28px,6vw,72px) Fraunces,Georgia,serif;letter-spacing:-.03em}
#wipe:after{content:"AutoHireEngine"}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
.lead{max-width:56ch;margin:26px 0;color:var(--mute);font-size:19px}
.draft{border:1.5px dashed var(--acc);background:var(--card);padding:16px 20px;border-radius:14px;margin:24px 0;font-size:15px}
.tbc{display:inline-block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;padding:2px 9px;border-radius:99px;background:var(--acc);color:#fff;vertical-align:middle}
.legal h2{font-size:clamp(26px,3.4vw,40px);margin:48px 0 12px}.legal p,.legal li{max-width:70ch;color:var(--mute)}
.crumb{font-size:13px;color:var(--mute);margin-bottom:18px}.crumb a{text-decoration:none;border-bottom:1px solid var(--line)}
/* story */
.beat{position:absolute;inset:0;display:grid;place-content:center;padding:0 6vw;will-change:transform,opacity}
.bq{font:300 clamp(34px,6.8vw,112px)/1.02 Fraunces,Georgia,serif;letter-spacing:-.035em;max-width:17ch}
.bq em{color:var(--acc)}.bq.w{max-width:24ch;font-size:clamp(30px,5.4vw,84px)}
.tun{position:absolute;inset:0;transform-style:preserve-3d}
.tr{position:absolute;left:0;right:0;top:46%;text-align:center;white-space:nowrap;font:300 clamp(34px,8vw,128px)/1 Fraunces,Georgia,serif;letter-spacing:-.04em;will-change:transform,opacity}
.tr:nth-child(odd){color:transparent;-webkit-text-stroke:1.5px var(--ink)}.tr:nth-child(3n){color:var(--acc);-webkit-text-stroke:0}
.one{position:absolute;inset:0;display:grid;place-content:center;padding:0 6vw;text-align:center;opacity:0;will-change:transform,opacity}
.beat .kick{margin-bottom:22px}.beat p.s{max-width:46ch;margin-top:24px;color:var(--mute);font-size:19px}
/* journey */
#jr .stick{overflow:hidden}
.jwrap{position:absolute;inset:0;perspective:1100px;-webkit-mask-image:radial-gradient(ellipse 80% 75% at 50% 50%,#000 45%,transparent 100%);mask-image:radial-gradient(ellipse 80% 75% at 50% 50%,#000 45%,transparent 100%)}
.jcam{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.jscene{position:absolute;left:0;top:0;width:1800px;height:4000px;transform-origin:0 0;will-change:transform}
#jsvg{width:1800px;height:4000px;overflow:visible;display:block}
#jpath{fill:none;stroke:var(--line);stroke-width:6;stroke-dasharray:2 18;stroke-linecap:round}
#jdraw{fill:none;stroke:var(--acc);stroke-width:10;stroke-linecap:round}
.st circle{fill:var(--bg);stroke:var(--ink);stroke-width:3}.st .sr1{fill:none;stroke:var(--line);stroke-width:2}
.st .sn{font:300 170px Fraunces,Georgia,serif;fill:none;stroke:var(--ink);stroke-width:2;opacity:.3}
.st .sw{font:300 100px Fraunces,Georgia,serif;fill:var(--ink);letter-spacing:-3px}
.st{transform-box:fill-box;transform-origin:center}
.st.on circle{stroke:var(--acc);fill:var(--acc)}.st.on .sn{stroke:var(--acc);opacity:1}.st.on .sw{fill:var(--acc);font-style:italic}
.st.on{animation:pop .8s cubic-bezier(.34,1.7,.5,1)}@keyframes pop{from{transform:scale(.88)}}
#jorb{fill:var(--acc)}#jorb circle:first-child{fill:var(--acc);opacity:.25;animation:pulse 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pulse{50%{transform:scale(1.8);opacity:0}}
.jcap{position:absolute;left:4vw;bottom:5vh;display:grid;grid-template-columns:auto 1fr;gap:6px 20px;align-items:center;max-width:min(680px,92vw);padding:20px 26px;background:var(--bg);border:1.5px solid var(--ink);border-radius:18px;box-shadow:8px 8px 0 var(--ink);z-index:3}
.jcap.in{animation:cin .7s cubic-bezier(.34,1.56,.64,1)}@keyframes cin{from{opacity:0;transform:translateY(40px) rotate(-1.5deg) scale(.96)}}
.jn{grid-row:span 3;font:300 clamp(52px,8vw,96px)/1 Fraunces,Georgia,serif;color:var(--acc)}
.jcap h2{font-size:clamp(24px,3.2vw,38px);line-height:1.05}.jcap p{font-size:15px;color:var(--mute);line-height:1.45}
.jcap .btn{justify-self:start;padding:10px 20px;font-size:14px;margin-top:6px}
.jdots{position:absolute;right:3vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:3}
.jdots button{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--ink);background:var(--bg);cursor:pointer;padding:0;transition:transform .45s cubic-bezier(.34,1.9,.5,1),background .2s}
.jdots button.on{background:var(--acc);border-color:var(--acc);transform:scale(1.5)}
.jtop{position:absolute;left:4vw;top:13vh;z-index:3;max-width:420px}
.jlist{list-style:none;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.jlist li{border:1px solid var(--line);border-radius:16px;padding:20px;background:var(--card)}.jlist h3{font-size:24px;margin-bottom:6px}.jlist p{color:var(--mute);font-size:15px}.jlist a{display:inline-block;margin-top:10px;font-weight:600}
.js-motion .jlist{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
html:not(.js-motion) #jr{display:none}
/* support & editorial sections */
.sec{display:grid;grid-template-columns:minmax(200px,1fr) 2fr;gap:5vw;padding:12vh 4vw;border-top:1px solid var(--line)}
.sec>h2{position:sticky;top:16vh;align-self:start;font-size:clamp(34px,5vw,72px)}.sec .kick{margin-bottom:10px}
.stp{padding:0;margin:0;counter-reset:s}.stp li{list-style:none;counter-increment:s;position:relative;padding:22px 0 22px 90px;border-bottom:1px solid var(--line)}
.stp li:before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:12px;font:300 56px Fraunces,Georgia,serif;color:var(--acc)}
.stp h3{font-size:24px;margin-bottom:4px}.stp p{color:var(--mute);max-width:60ch}
.tbl{width:100%;border-collapse:collapse}.tbl th,.tbl td{padding:14px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.tbl th{font-weight:600;width:38%}
.rb label{display:block;font-size:13px;font-weight:600;margin:14px 0 4px}
.rb input,.rb textarea{width:100%;font:inherit;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px}
.rb input:focus,.rb textarea:focus{border-color:var(--acc);outline:none}.rb textarea{min-height:90px}
.btn[aria-disabled=true]{opacity:.45;cursor:not-allowed}
.mailbox{border:1.5px solid var(--ink);border-radius:18px;padding:24px;background:var(--card);margin-bottom:26px}.mailbox .serif{font-size:clamp(24px,3vw,36px)}
.topics{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-top:30px}
@media(max-width:800px){.sec{grid-template-columns:1fr}.sec>h2{position:static}.jcap{grid-template-columns:1fr}.jn{grid-row:auto}.jdots{display:none}.jtop{top:11vh}}
@media(prefers-reduced-motion:reduce){
 .pin{height:auto!important}
 .beat{position:relative!important;inset:auto;padding:8vh 6vw}.tun,.one{display:none}
 .ring{position:static;width:auto;height:auto;margin:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));transform:none!important;padding:0 4vw}
 .face{position:relative;transform:none!important;opacity:1!important}.hs{position:static;flex-wrap:wrap}.fam,.stack{position:static;transform:none!important}.layer{position:relative;transform:none!important;margin:8px 0}
 .thr,.tile{position:relative;transform:none!important}}

#sring .face{text-decoration:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;color:var(--ink)}#sring .face:hover b{color:var(--acc)}

@media(max-width:700px){nav{gap:4px}nav ul{width:100%;overflow-x:auto;flex-wrap:nowrap;gap:9px;padding-bottom:4px}nav a.l{white-space:nowrap;font-size:11.5px}.jtop{top:15vh}.cap{top:15vh}}
nav{background:linear-gradient(var(--bg) 62%,transparent)}

/* ---- branded video player ---- */
.adp .vplayer,.vplayer{position:relative;width:100%;height:100%;background:#0b0a09;overflow:hidden;border-radius:inherit;outline-offset:-4px}
.vplayer video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;margin:0;border-radius:0;cursor:pointer}
.vplayer button{font:inherit;cursor:pointer;border:0;padding:0}
.vplayer svg{width:100%;height:100%;fill:currentColor;display:block}
.vbig{position:absolute;left:50%;top:50%;width:clamp(68px,9vw,112px);height:clamp(68px,9vw,112px);margin:calc(clamp(68px,9vw,112px)/-2) 0 0 calc(clamp(68px,9vw,112px)/-2);border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;border:2px solid #f3eee4;box-shadow:6px 6px 0 #f3eee4;transition:transform .55s cubic-bezier(.34,1.9,.5,1),opacity .25s,box-shadow .3s}
.vbig svg{width:46%;height:46%;margin-left:5%}.vplayer[data-s=ended] .vbig svg{margin-left:0}
.vbig:hover{transform:scale(1.14) rotate(-4deg);box-shadow:9px 9px 0 #f3eee4}.vbig:active{transform:scale(.92)}
.vbig:before{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px solid var(--acc);opacity:0;animation:vring 2.2s ease-out infinite}
@keyframes vring{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.vplayer[data-s=playing] .vbig{transform:scale(0) rotate(90deg);opacity:0;pointer-events:none}
.vbar{position:absolute;left:14px;right:14px;bottom:14px;display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--bg);color:var(--ink);border:1.5px solid var(--ink);border-radius:99px;box-shadow:4px 4px 0 var(--ink);transition:transform .5s cubic-bezier(.34,1.5,.5,1),opacity .3s}
.vplayer[data-s=playing]:not(:hover):not(:focus-within):not(.drag) .vbar{transform:translateY(calc(100% + 8px));opacity:0}
.vpp,.vfs{flex:none;width:38px;height:38px;border-radius:50%;background:var(--acc);color:#fff;padding:9px!important;transition:transform .45s cubic-bezier(.34,1.9,.5,1)}
.vfs{background:transparent;color:var(--ink);width:34px;height:34px;padding:8px!important}.vfs:hover{color:var(--acc)}
.vpp:hover,.vfs:hover{transform:scale(1.15) rotate(-5deg)}.vpp:active,.vfs:active{transform:scale(.88)}
.vtrack{position:relative;flex:1;height:22px;cursor:pointer;touch-action:none;display:flex;align-items:center}
.vtrack:before{content:"";position:absolute;left:0;right:0;height:5px;border-radius:99px;background:var(--line)}
.vfill{position:absolute;left:0;right:0;height:5px;border-radius:99px;background:var(--acc);transform-origin:0 50%;transform:scaleX(0)}
.vknob{position:absolute;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:var(--bg);border:2.5px solid var(--acc);transition:transform .35s cubic-bezier(.34,1.9,.5,1)}
.vtrack:hover .vknob,.vplayer.drag .vknob,.vtrack:focus-visible .vknob{transform:scale(1.5)}
.vt{flex:none;font:500 13px "Instrument Sans",system-ui,sans-serif;font-variant-numeric:tabular-nums;min-width:86px;text-align:right}
.vplayer:focus-visible{outline:3px solid var(--acc)}
@media(max-width:560px){.vt{display:none}.vbar{left:8px;right:8px;bottom:8px;gap:8px}}
@media(prefers-reduced-motion:reduce){.vbig:before{animation:none}}
html{scroll-padding-top:90px}