*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0b0b0b;color:#f0eee8;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}.grain{position:fixed;inset:0;pointer-events:none;z-index:99;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}.progress{position:fixed;top:0;left:0;height:2px;background:#ff3b30;width:0;z-index:120}.cursor{position:fixed;width:34px;height:34px;border:1px solid #fff8;border-radius:50%;z-index:121;pointer-events:none;mix-blend-mode:difference}nav{position:fixed;z-index:100;top:0;left:0;right:0;padding:28px 3vw;display:flex;justify-content:space-between;font:700 12px/1 monospace;mix-blend-mode:difference}nav a{color:white;text-decoration:none}nav div{display:flex;gap:28px}.hero{height:100svh;min-height:720px;position:relative;padding:9.5vh 3vw 4vh;overflow:hidden}.meta{font:11px/1.5 monospace;color:#aaa;position:relative;z-index:4}.meta b,.red,.hero-foot a{color:#ff3b30}.hero-photo{position:absolute;right:2vw;top:11vh;width:39vw;height:80vh;overflow:hidden}.hero-photo:after{content:"";position:absolute;inset:0;box-shadow:inset 30px 0 80px #0b0b0b}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.04)}.hero h1{position:absolute;z-index:5;left:3vw;top:27vh;margin:0;font-size:clamp(72px,10.5vw,170px);line-height:.83;letter-spacing:-.075em}.hero h1 span{display:block}.hero-foot{position:absolute;z-index:5;left:3vw;bottom:7vh;display:flex;flex-direction:column;gap:14px}.hero-foot small{font:11px monospace}.hero-foot strong{font-size:clamp(25px,2.5vw,44px)}.hero-foot a{font:12px monospace;text-decoration:none}.hero-side{position:absolute;right:1.5vw;bottom:8vh;z-index:5;writing-mode:vertical-rl;font:9px/1.5 monospace;letter-spacing:.12em;color:#777}.eyebrow{font:11px monospace;letter-spacing:.05em;color:#aaa}.intro,.work,.currently,.dont-touch{padding:14vh 5vw}.intro-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:10vw;align-items:end}.intro h2,.route h2,.family h2,.work h2,.human h2,.end h2,.dont-touch h2{font-size:clamp(55px,8vw,130px);line-height:.86;letter-spacing:-.06em;margin:.25em 0}.intro h2 i,.work h2 i,.human h2 i{font-style:normal;color:#ff3b30}.lead{font-size:clamp(23px,2.4vw,40px);font-weight:700;line-height:1.05}.intro-grid p:not(.lead){max-width:570px;line-height:1.65}.route{min-height:100vh;padding:12vh 5vw;display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:7vw;background:#efede7;color:#0b0b0b}.route .eyebrow{color:#666}.route h2 span{color:#ff3b30}.route-copy>p:last-child{max-width:470px;line-height:1.6}.stack{position:relative;height:70vh}.card{position:absolute;margin:0;width:55%;background:#111;padding:8px 8px 28px;box-shadow:0 20px 70px #0003;transition:transform .4s}.card img{width:100%;height:58vh;object-fit:cover}.card figcaption{color:#eee;font:10px monospace;padding:10px 3px}.c1{left:2%;top:6%;transform:rotate(-5deg)}.c2{right:1%;top:0;transform:rotate(5deg)}.stack:hover .c1{transform:rotate(-9deg) translateX(-15px)}.stack:hover .c2{transform:rotate(8deg) translateX(15px)}.family{min-height:100vh;padding:10vh 5vw;display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}.family-photo{height:78vh;overflow:hidden}.family-photo img{width:100%;height:100%;object-fit:cover}.family>div:last-child>p:not(.eyebrow){font-size:18px;line-height:1.55;max-width:520px}.family .soft{font:11px monospace;color:#777!important}.work h2{max-width:1200px}.work-lead{font-size:20px;color:#aaa;max-width:680px;line-height:1.5}.work-grid{display:grid;grid-template-columns:repeat(2,1fr);margin-top:9vh;border-top:1px solid #333}.work article{min-height:310px;padding:35px;border-bottom:1px solid #333;transition:background .25s,color .25s,transform .25s}.work article:nth-child(odd){border-right:1px solid #333}.work article:hover{background:#efede7;color:#111;transform:translateY(-4px)}.work article b{font:11px monospace;color:#ff3b30}.work article h3{font-size:clamp(28px,3vw,50px);margin:60px 0 15px;max-width:540px}.work article p{max-width:520px;color:#aaa;line-height:1.55}.work article:hover p{color:#555}.portrait-break{height:100vh;position:relative;overflow:hidden;background:#e8e3d9}.portrait-break img{width:55%;height:100%;object-fit:cover;display:block;margin:auto;transition:transform .1s linear}.ticker{position:absolute;top:47%;left:0;white-space:nowrap;font-size:8vw;font-weight:900;color:#ff3b30;mix-blend-mode:multiply;animation:ticker 20s linear infinite}.tiny-note{position:absolute;right:4vw;bottom:4vh;color:#111;font:11px monospace;transform:rotate(-4deg)}@keyframes ticker{to{transform:translateX(-50%)}}.now{border-top:1px solid #333;margin-top:8vh}.now div{display:grid;grid-template-columns:1fr 2fr;padding:25px 0;border-bottom:1px solid #333}.now small{font:11px monospace;color:#777}.now b{font-size:clamp(22px,3vw,50px)}.dont-touch{min-height:92vh;position:relative;overflow:hidden;background:#ff3b30;color:#0b0b0b;display:flex;flex-direction:column;justify-content:center}.dont-touch .eyebrow{color:#56120e}.dont-touch h2{font-size:clamp(70px,10vw,165px);max-width:1100px}.dont-touch button{width:max-content;padding:18px 24px;border:2px solid #0b0b0b;background:transparent;font:700 12px monospace;cursor:pointer;transition:.2s}.dont-touch button:hover{background:#0b0b0b;color:#ff3b30}.button-note{font:11px monospace;margin-top:15px}.chaos-face{position:absolute;right:-18vw;bottom:-25vh;width:48vw;height:80vh;opacity:0;transform:rotate(25deg) translateY(100px);transition:.45s cubic-bezier(.2,.8,.2,1);pointer-events:none}.chaos-face img{width:100%;height:100%;object-fit:cover;clip-path:polygon(10% 0,100% 5%,90% 100%,0 90%)}body.chaos .chaos-face{opacity:1;transform:rotate(8deg) translateY(0)}body.chaos main{animation:shake .28s linear 2}body.chaos .dont-touch h2{transform:skewX(-8deg)}@keyframes shake{25%{transform:translateX(9px)}50%{transform:translateX(-7px)}75%{transform:translateX(4px)}}.human{padding:12vh 5vw;min-height:100vh;display:grid;grid-template-columns:.9fr 1.1fr;gap:6vw;align-items:center}.human-copy p{font-size:18px;line-height:1.55;max-width:650px}.human-copy strong{display:block;margin-top:40px;color:#ff3b30;font:700 12px monospace}.human-images{height:78vh;position:relative}.human-images figure{position:absolute;margin:0;overflow:hidden;transition:transform .4s}.human-images figure:first-child{width:58%;height:68%;left:0;top:0;transform:rotate(-3deg)}.human-images figure:last-child{width:58%;height:68%;right:0;bottom:0;transform:rotate(3deg)}.human-images:hover figure:first-child{transform:rotate(-7deg) translate(-15px,-10px)}.human-images:hover figure:last-child{transform:rotate(7deg) translate(15px,10px)}.human-images img{width:100%;height:100%;object-fit:cover}.end{min-height:100vh;padding:5vh 5vw 0;display:grid;grid-template-columns:.85fr 1.15fr;gap:6vw;align-items:center;background:#efede7;color:#0b0b0b;overflow:hidden}.end-stage{height:95vh;position:relative;align-self:end}.end-person{position:absolute;bottom:-5vh;left:0;width:88%;height:92%;object-fit:cover;object-position:center;clip-path:polygon(7% 0,93% 0,100% 86%,87% 100%,8% 100%,0 78%);filter:contrast(1.03);transform:translateY(35vh) rotate(-3deg);transition:none}.end-shadow{position:absolute;width:68%;height:72%;left:11%;bottom:0;background:#ff3b30;border-radius:50% 50% 0 0;transform:translateY(15vh)}.end-scribble{position:absolute;z-index:4;left:3%;top:12%;font:italic 27px cursive;color:#ff3b30;transform:rotate(-8deg)}.end-copy{position:relative;z-index:3}.end small{font:11px/1.5 monospace}.end-copy>p{max-width:570px;font-size:18px;line-height:1.55}.end a{display:inline-block;margin-top:15px;color:#ff3b30;font-weight:800;text-decoration:none}footer{padding:35px 3vw;display:flex;justify-content:space-between;gap:20px;font:10px monospace;color:#777}.reveal{opacity:0;transform:translateY(45px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}.reveal.on{opacity:1;transform:none}@media(max-width:800px){.cursor{display:none}nav{padding:20px}.hero{min-height:760px}.hero-photo{right:-10vw;top:15vh;width:80vw;height:65vh;opacity:.75}.hero h1{top:28vh;font-size:18vw}.hero-foot{bottom:5vh}.hero-side{display:none}.intro-grid,.route,.family,.human,.end{grid-template-columns:1fr}.route{padding-top:10vh}.stack{height:65vh}.card{width:65%}.card img{height:50vh}.work-grid{grid-template-columns:1fr}.work article:nth-child(odd){border-right:0}.portrait-break img{width:100%}.dont-touch{min-height:80vh}.chaos-face{width:80vw;right:-35vw}.human-images{height:65vh}.end{padding-top:10vh}.end-stage{height:60vh;order:2}.end-person{height:65vh;width:90%}.end-copy{order:1}footer{flex-direction:column}}
.brands{padding:14vh 0 11vh;background:#efede7;color:#0b0b0b;overflow:hidden}.brands-head{padding:0 5vw;display:grid;grid-template-columns:1.25fr .75fr;column-gap:8vw;align-items:end}.brands-head .eyebrow{grid-column:1/-1;color:#666}.brands-head h2{font-size:clamp(52px,7vw,115px);line-height:.86;letter-spacing:-.06em;margin:.35em 0}.brands-head h2 i{font-style:normal;color:#ff3b30}.brands-head>p:last-child{font-size:17px;line-height:1.55;max-width:530px;margin-bottom:6vh}.brand-marquee{border-top:1px solid #c7c3bb;border-bottom:1px solid #c7c3bb;overflow:hidden;background:#f5f3ed}.brand-track{width:max-content;display:flex;align-items:stretch;animation:brandrun 36s linear infinite}.brand-marquee:hover .brand-track{animation-play-state:paused}.brand-logo,.brand-word{width:260px;height:150px;border-right:1px solid #c7c3bb;display:flex;align-items:center;justify-content:center;padding:35px;flex:0 0 auto;transition:.25s}.brand-logo img{max-width:100%;max-height:64px;filter:grayscale(1) contrast(1.3)}.brand-logo:hover,.brand-word:hover{background:#ff3b30;color:#0b0b0b;transform:translateY(-6px)}.brand-logo:hover img{filter:grayscale(1) brightness(0)}.brand-word{font-size:27px;font-weight:900;letter-spacing:-.04em;text-align:center}.brand-word span{display:block;font:8px monospace;letter-spacing:.14em;margin-top:6px}.milo{font-style:italic;font-size:42px}.petstock{font-size:24px}.vjb{font-size:38px}.foodresq{line-height:.8}.mars,.jam{font-size:28px}@keyframes brandrun{to{transform:translateX(-50%)}}.brand-grid{margin:8vh 5vw 0;border-top:1px solid #bbb}.brand-grid>div{display:grid;grid-template-columns:.7fr 2fr;padding:20px 0;border-bottom:1px solid #bbb;gap:30px}.brand-grid small{font:10px monospace;color:#777}.brand-grid b{font-size:clamp(16px,2vw,28px);letter-spacing:-.03em}
@media(max-width:800px){.brands-head{grid-template-columns:1fr}.brands-head>p:last-child{margin-bottom:5vh}.brand-logo,.brand-word{width:190px;height:120px}.brand-grid>div{grid-template-columns:1fr;gap:8px}}

img{display:block;max-width:100%}
section{scroll-margin-top:72px}
.chapters{padding:14vh 5vw;background:#111;color:#f0eee8;overflow:hidden}
.chapters-head{display:grid;grid-template-columns:1.15fr .85fr;column-gap:8vw;align-items:end;margin-bottom:9vh}
.chapters-head .eyebrow{grid-column:1/-1}
.chapters-head h2{font-size:clamp(52px,7vw,115px);line-height:.86;letter-spacing:-.06em;margin:.35em 0}
.chapters-head h2 i{font-style:normal;color:#ff3b30}
.chapters-head>p:last-child{font-size:17px;line-height:1.6;color:#aaa;max-width:560px;margin-bottom:1vh}
.chapter-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:2vw;align-items:start}
.chapter-card{margin:0;background:#efede7;color:#0b0b0b;padding:9px 9px 0;box-shadow:0 24px 70px #0007;transition:transform .35s ease}
.chapter-card:nth-child(1){transform:rotate(-2deg)}
.chapter-card:nth-child(2){transform:translateY(6vh) rotate(1.5deg)}
.chapter-card:nth-child(3){transform:rotate(-1deg)}
.chapter-card:hover{transform:translateY(-10px) rotate(0)}
.chapter-card img{width:100%;height:56vh;min-height:420px;object-fit:cover}
.chapter-nielsen img{object-position:center top}
.chapter-unilever img{object-position:center top}
.chapter-wsu img{object-position:center center}
.chapter-card figcaption{display:flex;flex-direction:column;gap:10px;padding:22px 15px 25px}
.chapter-card small{font:10px monospace;color:#777}
.chapter-card b{font-size:clamp(23px,2.2vw,36px);line-height:.95;letter-spacing:-.04em}
.chapter-card span{font-size:15px;line-height:1.55;color:#555}
.feature{padding:12vh 5vw;background:#efede7;color:#0b0b0b;display:grid;grid-template-columns:1.08fr .92fr;gap:6vw;align-items:center}
.feature-image{position:relative;overflow:hidden;min-height:68vh;background:#151515}
.feature-image img{width:100%;height:68vh;object-fit:cover;object-position:center;filter:saturate(.92) contrast(1.03)}
.feature-image:after{content:"";position:absolute;inset:0;box-shadow:inset 0 -120px 100px #0008;pointer-events:none}
.feature-image>span{position:absolute;z-index:2;left:24px;bottom:22px;color:#fff;font:700 11px monospace;letter-spacing:.08em}
.feature-copy .eyebrow{color:#666}
.feature-copy h2{font-size:clamp(62px,8vw,132px);line-height:.82;letter-spacing:-.07em;margin:.28em 0}
.feature-copy h2 i{font-style:normal;color:#ff3b30}
.feature-lead{font-size:18px;line-height:1.6;max-width:630px}
.feature blockquote{margin:32px 0;padding-left:22px;border-left:4px solid #ff3b30;font-size:clamp(24px,2.4vw,39px);font-weight:800;line-height:1.05;letter-spacing:-.035em}
.feature-notes{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}
.feature-notes span{padding:9px 11px;border:1px solid #b8b3a9;font:10px monospace}
.story-link{display:inline-block;color:#0b0b0b;text-decoration:none;border-bottom:2px solid #ff3b30;padding:10px 0;font:700 12px monospace}
.listen-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,1fr);margin-top:4vh;border-top:1px solid #aaa;border-left:1px solid #aaa}
.listen-grid a{min-height:235px;padding:30px;display:flex;flex-direction:column;color:#0b0b0b;text-decoration:none;border-right:1px solid #aaa;border-bottom:1px solid #aaa;transition:background .25s,color .25s}
.listen-grid a:hover{background:#0b0b0b;color:#efede7}
.listen-grid small{font:10px monospace;color:#ff3b30}
.listen-grid b{font-size:clamp(25px,3vw,48px);line-height:.96;letter-spacing:-.045em;margin:auto 0 20px;max-width:700px}
.listen-grid span{font-size:15px;line-height:1.45;color:#666}
.listen-grid a:hover span{color:#aaa}

@media(max-width:800px){
  html{scroll-padding-top:64px}
  body{font-size:16px;-webkit-font-smoothing:antialiased}
  nav{padding:18px;padding-top:max(18px,env(safe-area-inset-top));align-items:center;font-size:10px;background:linear-gradient(180deg,#0b0b0bcc,transparent);mix-blend-mode:normal}
  nav div{gap:14px}
  .hero{height:100svh;min-height:680px;padding:86px 18px 28px}
  .meta{font-size:10px}
  .hero-photo{right:-18vw;top:14vh;width:105vw;height:69vh;opacity:.68}
  .hero-photo:after{box-shadow:inset 50px 0 90px #0b0b0b,inset 0 -100px 100px #0b0b0b}
  .hero h1{left:18px;top:31vh;width:calc(100vw - 36px);font-size:clamp(48px,15.5vw,70px);line-height:.88;letter-spacing:-.075em}
  .hero-foot{left:18px;right:18px;bottom:30px;gap:11px}
  .hero-foot strong{font-size:clamp(22px,7vw,31px);line-height:.98;max-width:90vw}
  .intro,.work,.currently,.dont-touch,.chapters{padding:10vh 20px}
  .intro h2,.route h2,.family h2,.work h2,.human h2,.end h2,.dont-touch h2,.chapters-head h2,.brands-head h2{font-size:clamp(45px,14vw,64px);line-height:.88;letter-spacing:-.055em}
  .intro-grid{gap:28px}
  .intro-grid p:not(.lead),.route-copy>p:last-child,.family>div:last-child>p:not(.eyebrow),.human-copy p,.end-copy>p,.feature-lead{font-size:16px;line-height:1.6}
  .route{min-height:auto;padding:10vh 20px;gap:40px}
  .stack{height:560px;width:100%}
  .card{width:72%;padding-bottom:22px}
  .card img{height:445px}
  .c1{left:0;top:8%}
  .c2{right:0;top:0}
  .family{min-height:auto;padding:10vh 20px;gap:44px}
  .family-photo{height:62svh;min-height:460px}
  .chapters-head{grid-template-columns:1fr;gap:10px;margin-bottom:6vh}
  .chapters-head>p:last-child{font-size:16px;margin:0}
  .chapter-gallery{grid-template-columns:1fr;gap:30px}
  .chapter-card,.chapter-card:nth-child(1),.chapter-card:nth-child(2),.chapter-card:nth-child(3){transform:none}
  .chapter-card img{height:auto;min-height:0;aspect-ratio:4/5;object-fit:cover}
  .chapter-card figcaption{padding:20px 14px 23px}
  .chapter-card b{font-size:30px}
  .work-lead{font-size:17px}
  .work-grid{margin-top:6vh}
  .work article{min-height:250px;padding:28px 4px}
  .work article h3{font-size:36px;line-height:.98;margin:38px 0 14px}
  .feature{padding:10vh 20px;grid-template-columns:1fr;gap:42px}
  .feature-image{min-height:0;aspect-ratio:4/3}
  .feature-image img{height:100%;position:absolute;inset:0}
  .feature-image>span{left:16px;bottom:15px;font-size:9px}
  .feature-copy h2{font-size:clamp(58px,19vw,84px);margin:.3em 0}
  .feature blockquote{font-size:29px;margin:27px 0}
  .feature-notes{gap:6px;margin:24px 0}
  .feature-notes span{font-size:9px}
  .listen-grid{grid-template-columns:1fr;margin-top:0}
  .listen-grid a{min-height:220px;padding:24px 20px}
  .listen-grid b{font-size:32px}
  .brands{padding:10vh 0 9vh}
  .brands-head{padding:0 20px}
  .brand-logo,.brand-word{width:170px;height:108px;padding:27px}
  .brand-grid{margin:6vh 20px 0}
  .brand-grid b{font-size:20px;line-height:1.15}
  .portrait-break{height:78svh;min-height:560px}
  .portrait-break img{width:100%;object-position:center top}
  .ticker{font-size:16vw;top:48%}
  .now{margin-top:6vh}
  .now div{grid-template-columns:92px 1fr;gap:14px;padding:22px 0}
  .now b{font-size:24px;line-height:1}
  .dont-touch{min-height:82svh}
  .dont-touch button{width:100%;min-height:54px}
  .chaos-face{width:105vw;height:68vh;right:-52vw;bottom:-18vh}
  .human{min-height:auto;padding:10vh 20px;gap:45px}
  .human-images{height:540px}
  .human-images figure:first-child,.human-images figure:last-child{width:65%;height:68%}
  .end{min-height:auto;padding:10vh 20px 0;gap:20px}
  .end-copy h2{font-size:clamp(58px,19vw,86px)}
  .end-stage{height:58svh;min-height:450px}
  .end-person{height:62svh;max-height:560px;width:100%;object-fit:contain;object-position:center bottom}
  .end-shadow{width:82%;left:9%;height:65%}
  footer{padding:30px 20px;font-size:9px;line-height:1.5}
}

@media(max-width:420px){
  nav div{gap:10px}
  nav a{font-size:9px}
  .hero h1{font-size:15.2vw}
  .stack{height:500px}
  .card img{height:390px}
  .chapter-card b,.listen-grid b{font-size:28px}
  .human-images{height:470px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
