:root{--paper:#eeece7;--ink:#252a24;--orange:#c64e1c;--green:#353a34;--sage:#d8dec8}*{box-sizing:border-box}body{margin:0;background:var(--ink);font-family:Arial,Helvetica,sans-serif;color:var(--paper)}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid var(--orange);outline-offset:5px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#hero{height:100svh;min-height:420px;position:relative;overflow:hidden;isolation:isolate}#stage{position:absolute;inset:0}.scene{position:absolute;inset:0;overflow:hidden;visibility:hidden;contain:layout paint}.scene.active{visibility:visible}.clip{overflow:hidden}.clip>span{display:block;will-change:transform}header,footer{position:absolute;z-index:20;left:3.5%;right:3.5%;display:flex;align-items:center;justify-content:space-between;gap:20px}header{top:26px;pointer-events:none;mix-blend-mode:difference;color:#eeece7}.signature{font-weight:900;font-size:34px;letter-spacing:-3px;line-height:1}.signature span{font-size:12px;vertical-align:top;letter-spacing:0;margin-left:4px}.topLabel,.edition,footer,.sceneNote,.endEyebrow{font:12px 'Courier New',monospace;letter-spacing:.04em}.topLabel{position:absolute;left:50%;transform:translateX(-50%)}footer{bottom:24px;color:#eeece7;mix-blend-mode:difference}.controls{display:flex;align-items:center;gap:18px}button{background:none;border:0;padding:8px 0;font:12px 'Courier New',monospace;border-bottom:1px solid #eeece760}button:hover{border-color:currentColor}.progress{position:absolute;bottom:0;left:0;right:0;height:3px;z-index:30;background:#ffffff20}#progress{height:100%;background:var(--orange);transform-origin:left;transform:scaleX(0)}.sceneNote{position:absolute;bottom:90px;left:0;width:100%;text-align:center}.liquid{position:absolute;inset:-50%;background:repeating-radial-gradient(ellipse at 35% 50%,#c64e1c 0%,#d87640 10%,#eeece7 19%,#d8dec8 23%,#c64e1c 32%);filter:blur(24px);will-change:transform}#phoneScene{background:var(--orange)}.phoneWords{position:absolute;top:50%;left:9%;transform:translateY(-50%);font-size:clamp(65px,10vw,175px);line-height:.89;letter-spacing:-.075em;font-weight:700;color:var(--ink)}#feel{color:var(--paper)}#phone{position:absolute;height:67%;aspect-ratio:9/18.7;top:16%;left:62%;border:7px solid #252a24;border-radius:42px;overflow:hidden;background:#252a24;box-shadow:25px 35px 70px #252a2466;will-change:transform}#phone video{width:100%;height:100%;object-fit:cover}.island{position:absolute;top:9px;left:35%;width:30%;height:17px;background:#141714;border-radius:15px}#filmScene{background:#111}#filmScene video{width:100%;height:100%;object-fit:cover}.filmShade{position:absolute;inset:0;background:linear-gradient(90deg,#0006,transparent 65%)}.filmTitle{position:absolute;left:7%;top:50%;transform:translateY(-50%);font-size:clamp(60px,9vw,145px);font-weight:600;line-height:.92;letter-spacing:-.065em}.filmTitle span{display:block}#galleryScene{background:var(--ink);perspective:1400px}.galleryBack{position:absolute;inset:0;display:grid;place-content:center;text-align:center;font-size:20vw;line-height:.85;font-weight:800;letter-spacing:-.075em;color:#eeece710}#cards{position:absolute;inset:0;transform-style:preserve-3d}.card{position:absolute;left:50%;top:50%;width:59%;height:62%;object-fit:cover;box-shadow:0 22px 65px #0007;will-change:transform,opacity}#storyScene{background:var(--green);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0}.storyLine{font-size:clamp(50px,8.6vw,145px);font-weight:600;line-height:1.03;letter-spacing:-.065em;white-space:nowrap}.word{display:inline-block;overflow:hidden;padding:0 .09em}.word>span{display:inline-block;will-change:transform}#story2{color:var(--sage)}#brandScene{background:var(--paper);color:var(--ink)}.brandHeading{position:absolute;top:17%;left:7%;font-size:clamp(44px,6.5vw,100px);line-height:.98;letter-spacing:-.06em;z-index:2}#worlds{color:var(--orange)}#brandImages{position:absolute;inset:0}#brandImages img{position:absolute;width:28%;height:36%;object-fit:cover;top:48%;left:9%;box-shadow:0 20px 35px #252a2420}#brandImages img:nth-child(2){left:37%;top:43%}#brandImages img:nth-child(3){left:65%;top:38%}#paletteScene{display:flex}#paletteScene>div{width:25%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--green);color:var(--paper);font-size:4vw;font-weight:bold;letter-spacing:-.04em}#paletteScene>div:nth-child(2){background:var(--orange)}#paletteScene>div:nth-child(3){background:var(--sage);color:var(--ink)}#paletteScene>div:nth-child(4){background:var(--paper);color:var(--ink)}#skillsScene{background:var(--ink);display:flex;flex-direction:column;justify-content:center;gap:12px}.skillRow{display:flex;align-items:center;white-space:nowrap;width:max-content;gap:16px;will-change:transform}.skillRow span{font-size:clamp(40px,6.2vw,100px);letter-spacing:-.05em;border:1px solid #eeece760;border-radius:100px;padding:13px 36px;line-height:1.1}.skillRow b{font-size:7vw;color:var(--orange);font-weight:400}#endScene{background:var(--sage);color:var(--ink);display:flex;flex-direction:column;justify-content:center;align-items:center}.endEyebrow{margin-bottom:25px}.name{font-size:clamp(80px,13.2vw,220px);font-weight:600;letter-spacing:-.075em;line-height:.85;text-align:center}.period{color:var(--orange)}#endLine{font-size:clamp(19px,2.4vw,36px);letter-spacing:-.04em;margin-top:36px}#loading{position:absolute;inset:0;background:var(--ink);z-index:40;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:32px;letter-spacing:-1px}#loading span{font:12px monospace;margin-top:20px;letter-spacing:0}#loading.done{display:none}@media(max-width:650px){header{top:20px}.edition{display:none}.topLabel{position:static;transform:none}footer{bottom:20px;align-items:flex-end}#chapter{display:none}.controls{width:100%;justify-content:space-between;gap:8px}.controls button{font-size:11px}#clock{font-size:11px}.phoneWords{left:7%;top:35%;font-size:19vw;z-index:1}#phone{height:45%;top:41%;left:49%;border-width:5px;border-radius:26px}.island{height:10px;top:6px}.sceneNote{bottom:75px;font-size:10px;padding:0 22px}.filmTitle{font-size:19vw;top:35%}#filmScene video{object-position:56% center}.card{width:84%;height:46%}.storyLine{font-size:10vw}.brandHeading{top:24%;font-size:11vw}#brandImages img{height:25%;width:48%;top:49%;left:-7%}#brandImages img:nth-child(2){left:26%;top:53%}#brandImages img:nth-child(3){left:59%;top:57%}.skillRow span{font-size:10vw;padding:15px 25px}.skillRow b{font-size:15vw}#paletteScene>div{font-size:4.4vw;writing-mode:vertical-rl}.endEyebrow{font-size:9px;text-align:center}.name{font-size:21vw}#endLine{font-size:22px}.sceneNote{line-height:1.5}}

/* Revised typography for the longer creative statement. */
.phoneWords{left:7%;font-size:clamp(38px,5.7vw,98px);line-height:1.04;letter-spacing:-.055em;max-width:53%}
#them{font-size:1.5em;line-height:1.03}#feel{font-size:.91em}
.storyLine{font-size:clamp(30px,6.4vw,108px);letter-spacing:-.045em}
#story2{font-size:clamp(26px,5.2vw,88px);margin-top:12px}
.name{letter-spacing:-.04em}
@media(max-width:650px){.phoneWords{left:7%;top:24%;max-width:90%;font-size:9.4vw;line-height:1.07}#phone{top:43%;height:43%;left:48%}.storyLine{font-size:8vw;max-width:94%;white-space:normal;text-align:center}#story2{font-size:7.5vw;max-width:88%;line-height:1.16;margin-top:16px}.name{font-size:20.4vw}}

/* Consistent type, clear glyph bounds, and complete campaign artwork. */
.phoneWords{font-size:clamp(34px,5.1vw,88px);line-height:1.15;color:var(--ink)}
#make,#them,#feel{font:inherit;color:inherit;line-height:inherit}
.phoneWords .clip{padding:.08em .1em;margin:-.08em -.1em}
.storyLine,#story2{font-size:clamp(26px,4.8vw,82px);line-height:1.35;letter-spacing:-.035em;max-width:94%;white-space:normal;text-align:center}
.word{overflow:visible;padding:.12em .08em;margin:-.12em 0}
#storyScene{padding:0 3%;will-change:clip-path}
#brandImages img{width:31%;height:auto;max-height:38%;object-fit:contain;left:5%;top:48%;z-index:1}
#brandImages img:nth-child(2){left:34%;top:45%;z-index:2}
#brandImages img:nth-child(3){left:63%;top:42%;z-index:3}
.name{font-size:clamp(70px,12vw,200px);letter-spacing:-.025em;line-height:1}
.name .clip{padding:.07em .12em;margin:-.07em -.12em}
@media(max-width:650px){.phoneWords{font-size:9vw;max-width:92%;line-height:1.15}.storyLine,#story2{font-size:7.1vw;line-height:1.4;max-width:96%;letter-spacing:-.025em}#brandImages img{width:42%;height:auto;max-height:30%;left:0%;top:51%}#brandImages img:nth-child(2){left:28%;top:56%}#brandImages img:nth-child(3){left:56%;top:61%}.name{font-size:17vw;letter-spacing:-.025em}}

/* Shared motion typography across adjacent scenes. */
.phoneWords,.filmTitle{font-family:Arial,Helvetica,sans-serif;font-size:clamp(48px,min(9vw,14svh),145px);font-weight:600;line-height:.92;letter-spacing:-.065em;color:var(--paper)}
.phoneWords{max-width:55%;left:7%;top:48%}
.phoneWords .clip{padding:.08em .12em;margin:-.08em -.12em}
#storyScene{align-items:flex-start;padding:0 7%;gap:0}
.storyLine,#story2,.brandHeading{font-family:Arial,Helvetica,sans-serif;font-size:clamp(36px,6.5vw,100px);font-weight:400;line-height:.98;letter-spacing:-.06em;text-align:left}
.storyLine,#story2{max-width:100%;margin:0;white-space:normal}
#story2{color:var(--orange);max-width:100%;margin-top:.15em}
#storyScene{background:var(--paper);color:var(--ink)}
.word{padding:.14em .055em;margin:-.14em 0;overflow:visible}
@media(max-width:650px){.phoneWords,.filmTitle{font-size:min(14vw,7svh);line-height:.92;letter-spacing:-.065em}.phoneWords{top:23%;max-width:90%;left:7%}.storyLine,#story2,.brandHeading{font-size:11vw;line-height:1.08;letter-spacing:-.06em}.storyLine,#story2{max-width:100%;text-align:left}#story2{margin-top:.25em}}

.phoneWords{color:var(--ink)}
