:root{--ink:#101010;--paper:#f4f0e8;--yellow:#ffd84d;--coral:#ff6848;--blue:#4c6fff;--lav:#b89cff;--line:rgba(244,240,232,.2)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:"DM Sans",sans-serif;overflow-x:hidden}body.no-scroll{overflow:hidden}::selection{background:var(--yellow);color:var(--ink)}a{color:inherit;text-decoration:none}button{font:inherit}.grain{position:fixed;inset:0;pointer-events:none;opacity:.055;z-index:90;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='.8'/%3E%3C/svg%3E")}.loader{position:fixed;inset:0;background:var(--yellow);color:var(--ink);z-index:999;display:grid;place-content:center;text-align:center;transition:clip-path .9s cubic-bezier(.77,0,.18,1);clip-path:inset(0)}.loader.done{clip-path:inset(0 0 100% 0)}.loader span{font:800 clamp(5rem,15vw,12rem)/.8 Syne}.loader small{text-transform:uppercase;letter-spacing:.2em}.loader-line{width:180px;height:3px;background:#0002;margin:30px auto 15px;overflow:hidden}.loader-line:after{content:"";display:block;height:100%;background:var(--ink);animation:load 1.35s ease forwards}@keyframes load{from{width:0}to{width:100%}}.cursor{position:fixed;width:48px;height:48px;border:1px solid var(--paper);border-radius:50%;pointer-events:none;z-index:100;display:grid;place-items:center;mix-blend-mode:difference;transform:translate(-50%,-50%);transition:width .2s,height .2s,background .2s}.cursor span{font:700 9px Syne;letter-spacing:.1em}.cursor.active{width:72px;height:72px;background:var(--paper);color:var(--ink);mix-blend-mode:normal}.nav-wrap{position:fixed;top:18px;left:3vw;right:3vw;z-index:80;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid transparent;border-radius:16px;transition:.3s}.nav-wrap.scrolled{background:rgba(16,16,16,.82);border-color:var(--line);backdrop-filter:blur(15px)}.brand{display:flex;align-items:center;gap:10px;font-weight:600}.brand b{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--ink);font:800 14px Syne}.nav-wrap nav{display:flex;gap:28px}.nav-wrap nav a{font-size:14px;opacity:.7;transition:.2s}.nav-wrap nav a:hover{opacity:1}.availability{display:flex;align-items:center;gap:9px;border:1px solid var(--line);padding:10px 15px;border-radius:100px;font-size:13px}.availability i{width:8px;height:8px;background:#74e884;border-radius:50%;box-shadow:0 0 0 5px #74e822;animation:pulse 1.8s infinite}@keyframes pulse{50%{box-shadow:0 0 0 1px #74e800}}.menu-button{display:none;background:none;border:0;color:white}.hero{min-height:100svh;position:relative;padding:150px 5vw 70px;display:grid;grid-template-columns:1fr;align-content:center}.hero-copy{position:relative;z-index:2;max-width:1100px}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:13px}.eyebrow b{color:var(--yellow);margin:0 8px}.hero h1,.section-head h2,.about h2,.contact h2{font-family:Syne,sans-serif;margin:25px 0;font-weight:800;letter-spacing:-.065em}.hero h1{font-size:clamp(4rem,8.2vw,9.2rem);line-height:.78}.hero h1 span{display:block;transform:translateY(120%);animation:title-in .9s .65s cubic-bezier(.16,1,.3,1) forwards}.hero h1 span:nth-child(2){animation-delay:.76s}.hero h1 span:nth-child(3){animation-delay:.87s}@keyframes title-in{to{transform:translateY(0)}}.hero h1 span{overflow:hidden}.hero h1 .accent{color:var(--yellow);font-style:italic}.hero-intro{max-width:510px;font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.55;color:#d0ccc5}.hero-actions{display:flex;gap:12px;margin-top:35px}.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;border-radius:100px;padding:17px 23px;font-weight:600;transition:transform .25s}.button-primary{background:var(--paper);color:var(--ink)}.button-ghost{border:1px solid var(--line)}.button:hover{transform:translateY(-3px)}.hero-art{position:relative;height:min(72vh,780px);align-self:end;display:grid;place-items:center}.hero-portrait{position:relative;z-index:2;width:min(80%,400px);aspect-ratio:1;border-radius:24px;overflow:hidden;border:1px solid var(--line);box-shadow:0 30px 60px #0009;animation:float 5s ease-in-out infinite}.hero-portrait img{width:100%;height:100%;object-fit:cover;display:block}@keyframes float{50%{transform:translateY(-12px)}}.orbit{position:absolute;width:88%;top:8%;right:0;fill:none;stroke:var(--coral);stroke-width:3;stroke-dasharray:12 10;animation:spin 24s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.scribble{position:absolute;z-index:3;background:var(--paper);color:var(--ink);padding:7px 10px;font:bold 12px Syne;transform:rotate(-7deg)}.s-one{top:18%;left:4%}.s-two{right:2%;bottom:18%;transform:rotate(6deg);background:var(--blue);color:white}.scroll-cue{position:absolute;left:5vw;bottom:25px;font-size:12px;text-transform:uppercase;letter-spacing:.15em;display:flex;gap:10px;align-items:center}.scroll-cue span{height:1px;width:40px;background:var(--paper)}.marquee{background:var(--yellow);color:var(--ink);overflow:hidden;transform:rotate(-1deg);width:102%;margin-left:-1%;padding:15px 0;font:800 17px Syne;white-space:nowrap}.marquee div{display:inline-block;animation:marquee 23s linear infinite}@keyframes marquee{to{transform:translateX(-50%)}}.section-pad{padding:130px 5vw}.section-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:55px}.section-head p,.about-title>p{font-size:13px;text-transform:uppercase;letter-spacing:.15em;color:#aaa}.section-head h2,.about h2{font-size:clamp(3.5rem,7.8vw,8rem);line-height:.88;margin:0}.section-head em,.about h2 span,.contact h2 em{color:var(--yellow);font-style:italic}.reel-card{position:relative;width:100%;height:min(68vw,700px);border:0;background:var(--blue);overflow:hidden;cursor:pointer;text-align:left;color:white}.reel-stage{position:absolute;inset:0;background:linear-gradient(145deg,#4c6fff,#211758);background-size:cover;background-position:center;display:grid;place-items:center}.reel-stage.has-thumb{background-color:#000}.reel-stage.has-thumb:before,.reel-stage.has-thumb:after{content:"";display:block;position:absolute;inset:0;border:0;border-radius:0;width:auto;aspect-ratio:auto;background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.55))}.reel-stage.has-thumb:after{display:none}.reel-stage.has-thumb+.play{z-index:3}.reel-stage:not(.has-thumb):before,.reel-stage:not(.has-thumb):after{content:"";position:absolute;border:2px solid #ffffff42;border-radius:50%;width:36%;aspect-ratio:1}.reel-stage:not(.has-thumb):after{width:57%}.reel-character{font-size:clamp(8rem,24vw,24rem);color:var(--yellow);animation:pulseScale 2s steps(4) infinite}@keyframes pulseScale{50%{transform:rotate(45deg) scale(.82)}}.frame{position:absolute;border:1px solid #ffffff55;padding:8px 10px;font:700 11px Syne;letter-spacing:.1em}.f1{top:14%;left:8%}.f2{top:28%;right:9%}.f3{bottom:13%;left:18%}.play{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:3;width:100px;height:100px;background:var(--paper);color:var(--ink);border-radius:50%;display:grid;place-items:center;padding-left:6px;font-size:25px;transition:.3s}.reel-card:hover .play{transform:scale(1.12)}.reel-caption{position:absolute;left:25px;bottom:25px;font-size:13px;letter-spacing:.12em}.media-note{color:#888;font-size:13px}.about{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:10vw;border-top:1px solid var(--line)}.about-title h2{position:sticky;top:140px}.about-copy{padding-top:60px}.about-copy p{font-size:17px;color:#aaa;line-height:1.7}.about-copy .large-copy{font-size:clamp(1.6rem,2.7vw,2.7rem);line-height:1.25;color:var(--paper)}.text-link{display:inline-flex;gap:40px;border-bottom:1px solid var(--paper);padding:12px 0;margin-top:20px}.rotating-stamp{position:absolute;left:43%;bottom:65px;width:130px}.rotating-stamp svg{width:100%;animation:spin 16s linear infinite;overflow:visible}.rotating-stamp text{fill:var(--coral);font:700 12px Syne;letter-spacing:1.5px}.rotating-stamp circle{fill:var(--coral)}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.stats article{padding:65px 5vw;border-right:1px solid var(--line);position:relative}.stats article:last-child{border:0}.stats strong{font:800 clamp(4rem,8vw,8rem) Syne;letter-spacing:-.08em}.stats sup{font:800 2rem Syne;color:var(--yellow)}.stats p{color:#aaa}.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:35px}.filters button{border:1px solid var(--line);background:none;color:var(--paper);border-radius:100px;padding:11px 18px;cursor:pointer}.filters button.active{background:var(--paper);color:var(--ink)}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 22px}.project{transition:opacity .3s,transform .3s}.project.hidden{display:none}.project-visual{aspect-ratio:16/10;height:auto;position:relative;overflow:hidden;display:grid;place-items:center;border-radius:12px;transition:transform .5s cubic-bezier(.16,1,.3,1)}.project:hover .project-visual{transform:translateY(-4px)}.project-visual>span{position:absolute;left:14px;bottom:12px;font:700 10px Syne;letter-spacing:.1em;z-index:1}.visual-one{background:var(--coral)}.walk-cycle{display:flex;width:100%;justify-content:space-around}.walk-cycle i{font-style:normal;font-size:clamp(2rem,5vw,5rem);display:block;animation:walk 1.2s steps(2) infinite}.walk-cycle i:nth-child(2){animation-delay:.2s}.walk-cycle i:nth-child(3){animation-delay:.4s}.walk-cycle i:nth-child(4){animation-delay:.6s}@keyframes walk{50%{transform:translateY(-35px) rotate(10deg)}}.visual-two{background:var(--lav);color:var(--ink)}.morph{width:42%;aspect-ratio:1;background:var(--ink);animation:morph 4s ease-in-out infinite}@keyframes morph{25%{border-radius:50%;transform:rotate(90deg)}50%{clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(180deg)}75%{border-radius:20%;transform:rotate(270deg)}}.visual-three{background:#101b35;align-items:end}.moon{position:absolute;width:30%;aspect-ratio:1;border-radius:50%;background:var(--yellow);top:15%;left:13%;box-shadow:0 0 50px #ffd84d55}.landscape{height:54%;width:110%;background:var(--blue);clip-path:polygon(0 75%,15% 40%,31% 66%,48% 14%,65% 70%,82% 32%,100% 70%,100% 100%,0 100%);animation:land 5s ease-in-out infinite}@keyframes land{50%{transform:translateX(-4%)}}.visual-four{background:var(--yellow);color:var(--ink)}.mouth{width:35%;aspect-ratio:1;border:8px solid var(--ink);border-radius:48% 52% 44% 56%;display:grid;place-items:center;animation:talk .5s steps(3) infinite}.mouth i{width:30%;height:4px;background:var(--ink)}@keyframes talk{50%{transform:scaleY(.35)}}.wave{position:absolute;width:100%;height:80px;background:repeating-linear-gradient(90deg,transparent 0 15px,var(--ink) 16px 19px);bottom:15%;animation:wave 1.2s linear infinite}@keyframes wave{to{transform:translateX(34px)}}.project-meta{display:flex;justify-content:space-between;align-items:center;padding-top:12px}.project-meta p{font-size:12px;color:#888}.project-meta h3{font:700 clamp(1rem,1.3vw,1.25rem) Syne;margin:3px 0 0}.project-meta>b{font-size:1.3rem}.expertise{background:var(--paper);color:var(--ink)}.expertise .section-head p{color:#555}.expertise-list{border-top:1px solid #222}.expertise-list article{display:grid;grid-template-columns:70px 1fr 1fr 80px;align-items:center;gap:25px;border-bottom:1px solid #222;padding:35px 10px;transition:.25s}.expertise-list article:hover{background:var(--yellow);padding-left:25px;padding-right:25px}.expertise-list h3{font:700 clamp(1.5rem,3vw,3rem) Syne;margin:0}.expertise-list p{max-width:470px}.mini-anim{font-size:3rem;text-align:center;display:block;animation:mini 1.5s ease-in-out infinite}@keyframes mini{50%{transform:translateY(-10px)}}.mini-anim.square{animation:spin 4s linear infinite}.mini-anim.cut{animation:cut 1s steps(2) infinite}@keyframes cut{50%{transform:rotate(90deg)}}.timeline{position:relative;padding-left:100px}.timeline-line{position:absolute;left:30px;top:0;bottom:0;width:2px;background:var(--line)}.timeline-line i{position:sticky;top:50%;display:block;width:18px;height:18px;background:var(--yellow);border-radius:50%;translate:-8px}.timeline article{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:50px;background:#181818;border:1px solid var(--line)}.role span{color:var(--yellow);font-size:13px;letter-spacing:.1em}.role h3{font:700 clamp(2rem,4vw,4rem) Syne;margin:18px 0 5px}.role p,.role-detail li{color:#999}.role-detail strong{font-size:1.5rem;line-height:1.4}.role-detail li{margin:14px 0}.process{padding-top:20px}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}.process-grid article{min-height:330px;padding:25px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;transition:.3s}.process-grid article:last-child{border:0}.process-grid article:hover{background:var(--blue)}.process-icon{font-size:5rem;align-self:center;transition:.3s}.process-grid article:hover .process-icon{transform:scale(1.2) rotate(12deg)}.process-grid h3{font:700 1.4rem Syne}.contact{min-height:90vh;position:relative;background:var(--coral);color:var(--ink);overflow:hidden}.contact .eyebrow{font-weight:700}.contact h2{font-size:clamp(4rem,10.5vw,11rem);line-height:.78;position:relative;z-index:2}.contact h2 em{color:var(--paper)}.contact-row{position:relative;z-index:2;display:flex;align-items:center;gap:35px;flex-wrap:wrap}.button-light{background:var(--ink);color:var(--paper)}.contact-row>a:not(.button){border-bottom:1px solid var(--ink)}.contact-row span{opacity:.6}.contact-orbit{position:absolute;right:4%;top:20%;font-size:30vw;color:var(--yellow);animation:spin 16s linear infinite;opacity:.8}footer{display:flex;align-items:center;justify-content:space-between;padding:35px 5vw;border-top:1px solid var(--line);font-size:13px}footer p{color:#888}.modal{position:fixed;inset:0;background:#0c0c0ceF;z-index:200;place-items:center;text-align:center;padding:4vw}.modal[hidden]{display:none}.modal:not([hidden]){display:grid}.modal-body{width:min(1100px,92vw)}.modal-title{color:var(--yellow);letter-spacing:.15em;text-transform:uppercase;font:700 14px Syne;margin:0 0 14px}.modal-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;border:1px solid var(--line);overflow:hidden}.modal-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.modal-close{position:absolute;right:30px;top:20px;border:0;background:none;color:white;font-size:3rem;cursor:pointer;line-height:1;z-index:2}
.modal-hint{color:#bbb;font-size:13px;line-height:1.5;max-width:640px;margin:16px auto 0}.modal-hint:empty{display:none}
@media(max-width:560px){.modal{padding:16px}.modal-close{right:12px;top:8px;font-size:2.4rem}.modal-body{width:100%}.modal-title{margin-top:34px}}
.thumb{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(145deg,#4c6fff,#211758);background-size:cover;background-position:center}.thumb.has-thumb:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.5))}.thumb-play{position:relative;z-index:1;width:56px;height:56px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;padding-left:4px;font-size:17px;transition:transform .3s;box-shadow:0 8px 30px rgba(0,0,0,.35)}.project:hover .thumb-play{transform:scale(1.12)}.project:nth-child(3n+1) .thumb:not(.has-thumb){background:linear-gradient(145deg,#ff6848,#7a1d0e)}.project:nth-child(3n+2) .thumb:not(.has-thumb){background:linear-gradient(145deg,#b89cff,#2a1d55)}.project:nth-child(3n) .thumb:not(.has-thumb){background:linear-gradient(145deg,#4c6fff,#101b35)}.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s,transform .8s}.reveal.visible{opacity:1;transform:none}@media(max-width:900px){.cursor{display:none}.nav-wrap nav,.availability{display:none}.menu-button{display:block}.menu-button span{display:block;width:25px;height:2px;background:white;margin:6px}.nav-wrap.menu-open nav{display:flex;position:fixed;inset:0;background:var(--yellow);color:var(--ink);z-index:-1;flex-direction:column;justify-content:center;align-items:center;gap:8px;font:800 9vw Syne}.hero{grid-template-columns:1fr;padding-top:135px}.hero-copy{align-self:end}.hero-art{position:relative;right:auto;bottom:auto;height:auto;opacity:1;width:min(60%,340px);margin:20px 0 0}.hero-intro{max-width:65%}.scroll-cue{display:none}.section-head,.about{display:block}.section-head h2{margin-top:25px}.about-title h2{position:static}.about-copy{padding-top:10px}.rotating-stamp{display:none}.project-grid{grid-template-columns:1fr 1fr}.expertise-list article{grid-template-columns:40px 1fr}.expertise-list article p{grid-column:2}.mini-anim{display:none}.timeline{padding-left:40px}.timeline-line{left:0}.timeline article{grid-template-columns:1fr}.process-grid{grid-template-columns:1fr 1fr}.process-grid article:nth-child(2){border-right:0}.process-grid article{border-bottom:1px solid var(--line)}.contact-row{align-items:flex-start;flex-direction:column}}@media(max-width:560px){
  .section-pad{padding:80px 20px}
  .nav-wrap{left:10px;right:10px;top:12px;padding:10px 12px}
  .brand span{display:none}
  /* Hero: stacked, natural height, art sits below copy — no ghosted overlap */
  .hero{grid-template-columns:1fr;padding:110px 18px 40px;min-height:auto;gap:10px}
  .hero h1{font-size:clamp(2rem,11vw,3.4rem);margin:14px 0;line-height:.95;overflow-wrap:break-word;word-break:break-word;hyphens:auto}
  .hero-intro{max-width:100%;font-size:1.05rem}
  .hero-actions{flex-direction:column;align-items:stretch;gap:12px;margin-top:28px}
  .button{width:100%;max-width:100%;gap:12px;padding:16px 20px}
  .eyebrow{font-size:11px;letter-spacing:.1em;line-height:1.6}
  .hero-copy{min-width:0}
  .hero *{max-width:100%}
  .hero-art{position:relative;right:auto;bottom:auto;width:68%;height:auto;max-height:none;opacity:1;margin:20px auto 0;justify-self:center}
  .orbit{display:none}
  .scribble{display:none}
  .marquee{font-size:14px;padding:12px 0}
  /* Sections */
  .section-head h2,.about h2{font-size:clamp(2rem,10vw,3.2rem);overflow-wrap:break-word;word-break:break-word;hyphens:auto}
  .hero h1,.section-head h2,.about h2,.contact h2,.section-head em,.about h2 span,.contact h2 em{overflow-wrap:break-word;word-break:break-word}
  .section-head{margin-bottom:36px}
  .stats{grid-template-columns:1fr}
  .stats article{padding:40px 20px;border-right:0;border-bottom:1px solid var(--line)}
  .stats article:last-child{border:0}
  .about-copy .large-copy{font-size:1.5rem}
  .about-copy p{font-size:16px}
  /* Works */
  .filters{gap:8px;margin-bottom:26px}
  .filters button{padding:10px 15px;font-size:14px}
  .project-grid{gap:26px;grid-template-columns:1fr}
  .project-visual{aspect-ratio:16/9}
  .thumb-play{width:64px;height:64px;font-size:19px}
  .project-meta h3{font-size:1.15rem}
  .project-meta>b{font-size:1.4rem}
  /* Expertise / timeline / process */
  .expertise-list article{padding:26px 6px;gap:16px}
  .timeline{padding-left:18px}
  .timeline-line{left:0}
  .timeline article{padding:24px;gap:24px}
  .role-detail strong{font-size:1.25rem}
  .process-grid{grid-template-columns:1fr}
  .process-grid article{min-height:180px;border-right:0}
  /* Contact */
  .contact h2{font-size:15vw}
  .contact-orbit{font-size:55vw;right:-10%;top:auto;bottom:-6%;opacity:.5}
  .contact-row{gap:20px}
  .contact-row .button-light{width:100%}
  .marquee{width:100%;margin-left:0;transform:none}
  footer{flex-direction:column;gap:8px;align-items:flex-start;text-align:left}
  footer .brand{display:flex}
}
@media(max-width:400px){
  .hero h1{font-size:clamp(1.7rem,10.5vw,2.8rem)}
  .section-pad{padding:64px 16px}
  .nav-wrap{left:8px;right:8px}
  .eyebrow b{margin:0 4px}
}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.cursor{display:none}}