:root{--red:#ff3b30;--yellow:#ffd60a;--blue:#0a66ff;--ink:#07090d;--paper:#f5f0e6;--white:#fff;--pink:#d6a6ad}*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:clip}body{margin:0;background:var(--ink);color:var(--ink);font-family:Inter,Arial,sans-serif;overflow-x:clip}.skip-link{position:fixed;left:12px;top:-80px;z-index:2000;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);padding:12px;font-weight:900}.skip-link:focus{top:12px}h1,h2,h3,p,figure{margin:0}img{display:block;max-width:100%}a{color:inherit}.eyebrow{display:inline-flex;align-items:center;min-height:34px;padding:7px 11px;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--red);font:900 12px/1 'Barlow Condensed',sans-serif;letter-spacing:.16em;text-transform:uppercase}.eyebrow.dark{background:var(--ink);color:var(--white);border-color:var(--ink);box-shadow:5px 5px 0 var(--blue)}.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:13px 20px;border:4px solid var(--ink);font:900 14px/1 'Archivo Black',sans-serif;text-transform:uppercase;text-decoration:none;box-shadow:7px 7px 0 var(--red);transition:transform .18s ease,box-shadow .18s ease}.button:hover,.button:focus-visible{transform:translate(-2px,-2px);box-shadow:9px 9px 0 var(--red)}.button.yellow{background:var(--yellow);color:var(--ink)}.button.black{background:var(--ink);color:var(--white);box-shadow:7px 7px 0 var(--pink)}.button.black:hover,.button.black:focus-visible{box-shadow:9px 9px 0 var(--pink)}.work-hero{position:relative;min-height:820px;padding:150px clamp(24px,6vw,92px) 80px;display:grid;grid-template-columns:minmax(0,.85fr) minmax(460px,1.15fr);align-items:center;gap:clamp(40px,6vw,100px);overflow:hidden;background:var(--ink);color:var(--white);border-bottom:12px solid var(--blue)}.hero-halftone{position:absolute;inset:0;pointer-events:none;opacity:.17;background-image:radial-gradient(#fff 1px,transparent 1.4px);background-size:10px 10px;mask-image:linear-gradient(90deg,#000,transparent 70%)}.hero-copy,.hero-stack{position:relative;z-index:2}.hero-copy h1{margin:25px 0 24px;font:900 clamp(58px,6.8vw,112px)/.85 'Archivo Black',sans-serif;letter-spacing:-.07em;text-transform:uppercase;-webkit-text-stroke:2px var(--ink);text-shadow:7px 7px 0 var(--blue)}.hero-copy h1 em{color:var(--yellow);font-style:normal;text-shadow:7px 7px 0 var(--red)}.hero-copy p{max-width:620px;margin-bottom:30px;color:rgba(255,255,255,.82);font:700 clamp(17px,1.5vw,22px)/1.55 'Barlow Condensed',sans-serif}.hero-stack{min-height:590px}.stack-frame{position:absolute;background:#fff;border:7px solid var(--ink);box-shadow:13px 13px 0 var(--blue);overflow:hidden}.stack-frame img{width:100%;height:100%;object-fit:cover}.stack-main{z-index:3;inset:70px 0 auto 6%;transform:rotate(1.5deg);aspect-ratio:16/10}.stack-dj{z-index:2;width:54%;aspect-ratio:16/9;right:-6%;top:0;transform:rotate(7deg);box-shadow:11px 11px 0 var(--yellow)}.stack-cake{z-index:4;width:48%;aspect-ratio:16/9;left:-4%;bottom:0;transform:rotate(-7deg);box-shadow:11px 11px 0 var(--red)}.featured{padding:110px clamp(22px,6vw,92px) 130px;background:var(--paper);overflow:hidden}.section-head{max-width:1280px;margin:0 auto 54px;display:flex;justify-content:space-between;align-items:start;gap:24px}.project-meta{margin-top:20px;font:900 13px 'Barlow Condensed',sans-serif;letter-spacing:.14em;text-transform:uppercase}.featured-title{max-width:1280px;margin:0 auto 65px;display:grid;grid-template-columns:1.3fr .7fr;align-items:end;gap:60px}.featured-title h2,.archive-head h2,.work-cta h2{font:900 clamp(52px,7.3vw,114px)/.84 'Archivo Black',sans-serif;letter-spacing:-.065em;text-transform:uppercase}.featured-title h2 em,.archive-head h2 em,.work-cta h2 em,.loop-copy h3 em{color:var(--blue);font-style:normal}.featured-title p{font:700 19px/1.6 'Barlow Condensed',sans-serif}.browser-stage{position:relative;max-width:1280px;margin:0 auto 100px;padding-right:110px}.browser-window{background:#fff;border:7px solid var(--ink);box-shadow:16px 16px 0 var(--pink);overflow:hidden}.browser-bar{height:42px;padding:0 15px;display:flex;align-items:center;gap:8px;background:var(--ink);color:#fff}.browser-bar i{width:10px;height:10px;border-radius:50%;background:var(--red)}.browser-bar i:nth-child(2){background:var(--yellow)}.browser-bar i:nth-child(3){background:var(--blue)}.browser-bar span{margin-left:12px;font:700 11px Inter,sans-serif;opacity:.7}.desktop-browser img{width:100%;height:auto}.phone-window{position:absolute;right:0;bottom:-40px;width:min(25%,280px);padding:26px 9px 10px;background:var(--ink);border:5px solid var(--ink);border-radius:28px;box-shadow:10px 10px 0 var(--blue);overflow:hidden}.phone-window img{width:100%;height:auto;border-radius:13px}.phone-speaker{position:absolute;top:9px;left:50%;width:58px;height:6px;border-radius:10px;background:#333;transform:translateX(-50%)}.case-grid{max-width:1280px;margin:0 auto 100px;display:grid;grid-template-columns:1fr 1fr;gap:28px}.case-panel{padding:42px;background:#fff;border:6px solid var(--ink);box-shadow:11px 11px 0 var(--pink)}.case-panel.blue{background:var(--blue);color:#fff;box-shadow:11px 11px 0 var(--yellow)}.case-panel span{font:900 12px 'Barlow Condensed',sans-serif;letter-spacing:.16em}.case-panel h3{margin:18px 0 16px;font:900 clamp(30px,3.3vw,52px)/.93 'Archivo Black',sans-serif;letter-spacing:-.04em}.case-panel p{font:600 16px/1.7 Inter,sans-serif}.loop-section{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center}.loop-copy h3{margin:25px 0 24px;font:900 clamp(42px,5vw,76px)/.88 'Archivo Black',sans-serif;letter-spacing:-.05em}.loop-copy p{font:600 16px/1.75 Inter,sans-serif}.feature-list,.project-copy ul{padding:0;margin:26px 0;list-style:none;display:grid;gap:10px}.feature-list li,.project-copy li{position:relative;padding-left:24px;font:800 14px/1.4 Inter,sans-serif}.feature-list li:before,.project-copy li:before{content:'+';position:absolute;left:0;color:var(--blue);font-weight:900}.portfolio-window{border:7px solid var(--ink);box-shadow:15px 15px 0 var(--pink);overflow:hidden}.portfolio-window img{width:100%;height:auto}.archive{padding:120px clamp(22px,6vw,92px);background:var(--ink);color:#fff}.archive-head{max-width:1280px;margin:0 auto 85px}.archive-head h2{max-width:1050px;margin:28px 0}.archive-head h2 em{color:var(--yellow);text-shadow:6px 6px 0 var(--red)}.archive-head>p{max-width:700px;color:rgba(255,255,255,.7);font:700 18px/1.6 'Barlow Condensed',sans-serif}.project{max-width:1280px;margin:0 auto 80px;display:grid;grid-template-columns:1.15fr .85fr;border:7px solid #000;box-shadow:14px 14px 0 var(--blue);background:#fff;color:var(--ink)}.project:nth-of-type(odd){grid-template-columns:.85fr 1.15fr}.project:nth-of-type(odd) .project-visual{order:2}.project-landscape{box-shadow:14px 14px 0 #78c06b}.project-cpa{box-shadow:14px 14px 0 #8ba7c2}.project-cupcake{box-shadow:14px 14px 0 #f58fa3}.project-visual{position:relative;min-height:520px;overflow:hidden;background:#111}.project-visual img{width:100%;height:100%;object-fit:cover}.visual-note{position:absolute;left:14px;bottom:14px;max-width:calc(100% - 28px);padding:7px 9px;background:rgba(7,9,13,.9);color:#fff;font:900 9px Inter,sans-serif;letter-spacing:.1em}.project-copy{padding:clamp(34px,5vw,72px);display:flex;flex-direction:column;justify-content:center}.project-copy h3{margin:20px 0;font:900 clamp(34px,4.4vw,70px)/.88 'Archivo Black',sans-serif;letter-spacing:-.055em}.project-copy>p:not(.project-meta){font:600 16px/1.7 Inter,sans-serif}.project-copy ul{grid-template-columns:1fr 1fr}.identity{margin-top:14px;padding-top:18px;border-top:3px solid var(--ink);font:900 10px 'Barlow Condensed',sans-serif;letter-spacing:.13em}.work-cta{padding:120px 24px;text-align:center;background:var(--yellow);border-top:12px solid var(--red)}.work-cta h2{margin:28px auto 22px;max-width:1000px}.work-cta p{max-width:670px;margin:0 auto 28px;font:700 19px/1.6 'Barlow Condensed',sans-serif}.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:none}@media(max-width:1000px){.work-hero{grid-template-columns:1fr;min-height:auto;padding-top:135px}.hero-stack{min-height:540px}.featured-title,.loop-section{grid-template-columns:1fr}.featured-title{gap:24px}.loop-section{gap:50px}.browser-stage{padding-right:70px}.project,.project:nth-of-type(odd){grid-template-columns:1fr}.project:nth-of-type(odd) .project-visual{order:0}.project-visual{min-height:390px}}@media(max-width:640px){.work-hero{padding:118px 18px 55px;gap:28px}.hero-copy h1{font-size:clamp(48px,15.5vw,68px);text-shadow:5px 5px 0 var(--blue)}.hero-copy p{font-size:17px}.hero-stack{min-height:340px}.stack-main{inset:50px 0 auto 2%;border-width:4px;box-shadow:8px 8px 0 var(--blue)}.stack-dj{width:55%;right:-8%;border-width:4px}.stack-cake{width:50%;left:-6%;border-width:4px}.featured,.archive{padding:75px 18px 90px}.section-head{margin-bottom:35px}.featured-title{margin-bottom:45px}.featured-title h2,.archive-head h2,.work-cta h2{font-size:clamp(43px,13vw,62px)}.featured-title h2{font-size:clamp(34px,9.2vw,40px)}.browser-stage{padding:0 24px 70px 0;margin-bottom:55px}.browser-window{border-width:4px;box-shadow:9px 9px 0 var(--pink)}.browser-bar{height:32px}.phone-window{right:-2px;bottom:0;width:31%;padding:16px 5px 5px;border-width:3px;border-radius:17px;box-shadow:6px 6px 0 var(--blue)}.phone-speaker{top:5px;width:34px;height:4px}.case-grid{grid-template-columns:1fr;margin-bottom:70px}.case-panel{padding:28px;border-width:4px;box-shadow:8px 8px 0 var(--pink)}.loop-section{gap:38px}.loop-copy h3{font-size:42px}.portfolio-window{border-width:4px;box-shadow:9px 9px 0 var(--pink)}.archive-head{margin-bottom:55px}.project{margin-bottom:55px;border-width:4px;box-shadow:8px 8px 0 var(--blue)}.project-landscape{box-shadow:8px 8px 0 #78c06b}.project-cpa{box-shadow:8px 8px 0 #8ba7c2}.project-cupcake{box-shadow:8px 8px 0 #f58fa3}.project-visual{min-height:250px}.project-copy{padding:28px 22px}.project-copy h3{font-size:42px}.project-copy ul{grid-template-columns:1fr}.work-cta{padding:80px 18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.button{transition:none}}
