/* JAMESMOTION — a quiet frame for expressive work. */
:root{--ink:#090A12;--blue:#3D5AFE;--paper:#F8F9FB;--muted:#6B6D79;--line:#DDDFE6;--ease:cubic-bezier(.2,.75,.25,1);--gutter:clamp(22px,5.1vw,88px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}body.modal-open{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{color:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:6px}button:disabled{cursor:default}::selection{background:var(--blue);color:white}svg{display:block}svg:not(#motion-sculpture){overflow:visible}a svg,.reset-reel svg,.dialog-close svg,.copy-email svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.wrap{width:calc(100% - var(--gutter)*2);max-width:1450px;margin-inline:auto}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:700;text-transform:uppercase;margin:0;line-height:1.6}.blue-text{color:var(--blue)}.blue-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--blue);margin-right:10px;vertical-align:1px}.section-space{margin-top:112px}.section-number{color:var(--muted);margin-bottom:20px}.text-link{display:inline-flex;gap:23px;align-items:center;font-size:13px;font-weight:700;padding:7px 0;border-bottom:1px solid var(--ink)}.text-link svg{width:16px;height:16px;transition:transform .4s var(--ease)}.text-link:hover svg{transform:translate(3px,-3px)}.skip-link{position:fixed;left:20px;top:-100px;padding:15px;background:var(--ink);color:white;z-index:30}.skip-link:focus{top:15px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{height:102px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:inline-flex;align-items:center;font-size:22px;line-height:1;font-weight:800;letter-spacing:-1.2px}.wordmark span{color:var(--blue)}.wordmark i{align-self:flex-start;background:var(--blue);width:5px;height:5px;border-radius:50%;margin:0 0 0 4px}.site-header nav{display:flex;align-items:center;gap:34px;font-size:12px;font-weight:600}.nav-link{position:relative;padding:15px 0}.nav-link:after{content:"";position:absolute;height:2px;background:var(--blue);left:0;right:100%;bottom:8px;transition:right .3s var(--ease)}.nav-link:hover:after{right:0}.nav-contact{display:flex;align-items:center;gap:21px;border:1px solid #B8BAC4;padding:12px 17px;margin-left:7px;border-radius:3px;transition:background .3s,color .3s,border-color .3s}.nav-contact svg{width:15px;height:15px}.nav-contact:hover{background:var(--ink);color:white;border-color:var(--ink)}
.hero{padding-top:49px}.hero-intro{display:flex;justify-content:space-between;align-items:center}.hero-note{font-size:11px;color:var(--muted);margin:0}.hero-heading{display:flex;align-items:center;justify-content:space-between;padding:16px 0 31px}.hero h1{font-size:clamp(65px,8.4vw,131px);font-weight:550;letter-spacing:-.071em;line-height:1.05;margin:0}.hero h1 span{color:var(--blue)}.hero-asterisk{width:clamp(50px,6.25vw,92px);height:clamp(50px,6.25vw,92px);margin:10px 17px 0 25px}.hero-asterisk svg{fill:var(--blue);animation:asterisk-turn 24s linear infinite}.reel-stage{aspect-ratio:2.1;background:var(--ink);position:relative;border-radius:5px;overflow:hidden}.reel-poster{background:var(--ink);color:white;position:absolute;inset:0;width:100%;height:100%;border:0;text-align:left;isolation:isolate;padding:0;overflow:hidden}.reel-poster:focus-visible{outline-offset:-7px;outline-color:#BCC7FF}.reel-topline{position:absolute;left:3%;right:3%;top:6%;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.7px;z-index:3;color:#CACBD7}.reel-topline>span{display:flex;align-items:center;gap:9px}.reel-topline svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.2}.live-dot{width:5px;height:5px;background:#B7C1FF;border-radius:50%;box-shadow:0 0 14px #4968FF}.reel-copy{position:absolute;top:22%;left:5.8%;font-size:clamp(50px,8.6vw,134px);line-height:.97;letter-spacing:-.07em;font-weight:550;z-index:2}.reel-copy em{font-style:normal;color:#A9B7FF}.reel-art{position:absolute;width:58%;right:-4%;top:-13%;aspect-ratio:1;z-index:1;filter:drop-shadow(0 20px 28px #0007);transform:rotate(-15deg);transition:transform 1.8s var(--ease)}.reel-art>svg{animation:sculpture-turn 65s linear infinite;width:100%;height:100%}.reel-poster:hover .reel-art{transform:rotate(0) scale(1.04)}.play-reel{position:absolute;left:6%;bottom:16.5%;z-index:4;display:flex;align-items:center;gap:15px;font-size:13px;font-weight:650}.play-reel small{font-size:7px;letter-spacing:1.5px;display:block;margin-top:5px;font-weight:500;color:#9396AC}.play-circle{width:49px;height:49px;display:grid;place-items:center;border-radius:50%;border:1px solid #787A8D;background:#FFFFFF08;backdrop-filter:blur(8px);transition:background .4s,transform .5s var(--ease)}.play-circle svg{fill:white;width:17px;height:17px;margin-left:1px}.reel-poster:hover .play-circle{background:var(--blue);border-color:var(--blue);transform:scale(1.1)}.reel-bottomline{position:absolute;left:3%;right:3%;bottom:5.5%;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1.4px;color:#8B8FA4;z-index:3}.reel-bottomline>span:first-child{color:#C2C5D7;font-size:9px;font-weight:700;letter-spacing:0}.reel-cross{font-size:24px;line-height:12px}.reel-player{position:absolute;inset:0;background:#000}.reel-player iframe,.project-video iframe{width:100%;height:100%;border:0;display:block}.reset-reel{position:absolute;right:12px;top:12px;border:1px solid #ffffff55;background:#090A12B8;color:white;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;z-index:5}.reset-reel[hidden],.reel-player[hidden],.reel-poster[hidden]{display:none}.reel-caption{display:flex;justify-content:space-between;gap:15px;margin-top:18px;font-size:11px;color:var(--muted)}.reel-caption p{margin:0}.reel-caption a{display:flex;align-items:center;gap:18px;color:var(--ink);font-weight:600}.reel-caption svg{width:14px;height:14px;transition:transform .3s}.reel-caption a:hover svg{transform:translateY(4px)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:34px}h2{font-size:clamp(32px,3.45vw,52px);font-weight:500;letter-spacing:-.055em;line-height:1.14;margin:0}.section-heading>p{color:var(--muted);font-size:12px;line-height:1.8;margin:0 0 4px}.count{font-size:13px;letter-spacing:-.3px;vertical-align:top;display:inline-block;margin:5px 0 0 10px}.project-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 22px}.project-card{display:block;width:100%;padding:0;border:0;background:none;text-align:left;min-width:0}.project-thumbnail{display:block;position:relative;aspect-ratio:1;background:#ECEEF2;border:1px solid #E5E7ED;overflow:hidden;border-radius:3px;transition:background .6s var(--ease),transform .6s var(--ease),border-color .6s}.project-card:nth-child(3n+2) .project-thumbnail{background:#E7E9EF}.project-card:nth-child(3n+3) .project-thumbnail{background:#EFF0F4}.project-no{position:absolute;top:16px;left:17px;font-size:9px;color:#696D7A;letter-spacing:1px}.project-hover{position:absolute;left:50%;top:50%;height:51px;width:51px;background:var(--blue);color:#fff;border-radius:50%;display:grid;place-items:center;transform:translate(-50%,-20%) scale(.75);opacity:0;transition:opacity .35s,transform .55s var(--ease)}.project-hover svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6}.project-card:hover .project-thumbnail,.project-card:focus-visible .project-thumbnail{background:#E4E8F9;border-color:#D4DBFF;transform:translateY(-4px)}.project-card:hover .project-hover,.project-card:focus-visible .project-hover{opacity:1;transform:translate(-50%,-50%) scale(1)}.project-info{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:13px}.project-title{font-size:12px;font-weight:650}.project-tag{font-size:9px;color:var(--muted)}.work-footnote{margin:27px 0 0;font-size:10px;color:var(--muted);display:flex;align-items:center;gap:9px}.tiny-plus{color:var(--blue);font-size:17px}
.capabilities{display:grid;grid-template-columns:1fr 1.2fr;gap:10%;padding-top:58px;border-top:1px solid var(--line)}.capabilities-intro>p:not(.eyebrow){font-size:13px;line-height:1.9;color:var(--muted);max-width:320px;margin:23px 0 24px}.capability-list>div{border-bottom:1px solid var(--line);padding:25px 0;display:grid;grid-template-columns:24px 1fr 64px;column-gap:13px;align-items:center;position:relative}.capability-list>div:first-child{border-top:1px solid var(--line)}.capability-number{font-size:9px;color:var(--muted);grid-column:1;align-self:start;margin-top:6px}.capability-list h3{font-size:20px;font-weight:550;letter-spacing:-.7px;margin:0 0 8px;grid-column:2}.capability-list p{font-size:11px;line-height:1.65;color:var(--muted);margin:0;grid-column:2}.capability-symbol{grid-column:3;grid-row:1/3;width:50px;height:50px;fill:none;stroke:var(--blue);stroke-width:1.2;transition:transform 1s var(--ease)}.capability-list>div:hover .capability-symbol{transform:rotate(20deg)}
.tools-panel{background:#EDEFF5;border-radius:5px;display:grid;grid-template-columns:1fr 1fr;align-items:center;overflow:hidden;min-height:460px}.tools-copy{padding:62px 0 62px 57px;position:relative;z-index:1}.tools-copy .eyebrow{color:var(--blue);font-size:9px;letter-spacing:1.1px;margin-bottom:21px}.tools-copy h2{font-size:clamp(34px,3.6vw,54px)}.tools-copy>p:not(.eyebrow){font-size:12px;line-height:1.9;color:var(--muted);max-width:310px;margin:20px 0 25px}.tools-art{height:100%;position:relative;display:grid;place-items:center;perspective:1100px}.tools-window{background:#F8F9FD;width:86%;max-width:420px;border:1px solid #D1D5E1;border-radius:7px;box-shadow:0 25px 50px #1B245C10;transform:rotate(-5deg) rotateY(-8deg);transition:transform 1.5s var(--ease);overflow:hidden}.tools-art:hover .tools-window{transform:rotate(0) rotateY(0)}.window-title{height:36px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;border-bottom:1px solid #DDE0E9;font-size:7px;letter-spacing:1px;color:#797D8F}.window-dots{display:flex;gap:4px}.window-dots i{width:4px;height:4px;border-radius:50%;background:#C2C6D3}.tool-canvas{height:220px;position:relative;display:grid;place-items:center;background-image:radial-gradient(#D4D9E8 .7px,transparent .7px);background-size:15px 15px}.tool-orbit{position:relative;width:150px;height:150px;animation:asterisk-turn 35s linear infinite}.tool-orbit div{position:absolute;inset:0;border:17px solid var(--blue);border-radius:50%;transform:rotateY(65deg) rotateZ(20deg)}.tool-orbit div:nth-child(2){transform:rotate(60deg) rotateY(65deg) rotateZ(20deg);opacity:.75}.tool-orbit div:nth-child(3){transform:rotate(120deg) rotateY(65deg) rotateZ(20deg);opacity:.6}.canvas-cross{position:absolute;color:#7E879F;font-size:15px}.cross-one{top:18px;left:18px}.cross-two{bottom:28px;right:20px}.canvas-caption{position:absolute;bottom:13px;font-size:7px;letter-spacing:.5px;color:#81869C}.tool-timeline{height:75px;position:relative;border-top:1px solid #D9DDE8;background:#F2F3F8}.timeline-ruler{position:absolute;top:0;height:13px;width:100%;border-bottom:1px solid #E0E3EC;background-image:repeating-linear-gradient(90deg,transparent 0,transparent 13px,#D6DAE8 14px,#D6DAE8 15px)}.timeline-track{position:absolute;height:12px;border-radius:2px;left:15%;background:#BAC6FF}.track-one{top:24px;width:67%}.track-two{top:43px;width:50%;background:#D4DBF8;left:26%}.timeline-playhead{position:absolute;top:4px;bottom:0;width:1px;background:var(--blue);left:55%;animation:playhead 8s ease-in-out infinite alternate}.timeline-playhead:before{content:"";position:absolute;left:-4px;top:0;width:9px;height:8px;background:var(--blue);clip-path:polygon(0 0,100% 0,100% 60%,50% 100%,0 60%)}.keyframe{width:5px;height:5px;background:var(--blue);position:absolute;transform:rotate(45deg);top:27px}.key-one{left:23%}.key-two{left:51%}.key-three{left:74%}.tools-sticker{position:absolute;bottom:37px;right:14px;background:var(--blue);color:white;transform:rotate(6deg);font-size:10px;line-height:1.6;padding:18px 21px;box-shadow:0 5px 15px #14216217;letter-spacing:.6px}.tools-sticker strong{font-weight:750}
.about{display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:12%;padding-bottom:111px}.portrait-placeholder{background:#E9EBF0;aspect-ratio:1/.98;position:relative;max-height:510px;border-radius:3px;display:grid;place-items:center;overflow:hidden}.portrait-corner{position:absolute;right:25px;top:18px;color:#9B9EAD;font-size:23px}.portrait-outline{width:56%;opacity:.65}.portrait-outline svg{width:100%;fill:none;stroke:#C2C6D2;stroke-width:1.2}.portrait-label{position:absolute;bottom:25px;left:27px;font-size:8px;letter-spacing:1.3px;color:#858A9A}.portrait-label small{display:block;font-size:10px;letter-spacing:0;margin-top:6px;color:#686D7E}.about-copy h2{font-size:clamp(32px,3.3vw,49px)}.about-lead{font-size:21px;letter-spacing:-.6px;line-height:1.5;margin:23px 0 19px}.about-copy>p:not(.about-lead):not(.eyebrow){font-size:12px;line-height:1.95;color:var(--muted);max-width:390px;margin:13px 0}.about-copy .text-link{margin-top:15px}
.contact{padding:59px 0 49px;background:#EBEEFC;border-top:1px solid #DEE3F9}.contact-top{display:flex;justify-content:space-between;align-items:center}.contact-mark{font-size:58px;line-height:1;color:var(--blue);font-weight:400}.contact h2{font-size:clamp(52px,7.2vw,108px);font-weight:500;line-height:1.07;letter-spacing:-.065em;margin:10px 0 39px}.contact h2>span{color:var(--blue)}.contact-bottom{display:flex;align-items:center;gap:22px}.email-link{display:flex;align-items:center;gap:26px;font-size:clamp(17px,2.25vw,30px);letter-spacing:-.7px;border-bottom:1px solid var(--ink);padding:8px 0}.email-link svg{width:22px;height:22px;transition:transform .4s var(--ease)}.email-link:hover svg{transform:translate(4px,-4px)}.copy-email{display:flex;align-items:center;gap:7px;background:none;border:1px solid #C4CBE6;border-radius:3px;padding:10px 12px;font-size:9px;transition:background .3s,border-color .3s;white-space:nowrap}.copy-email svg{width:13px;height:13px}.copy-email:hover{background:#DCE2FA;border-color:#A6B1E2}.contact-bottom>p{margin:0 0 0 auto;color:var(--muted);font-size:11px;line-height:1.8}.site-footer{display:flex;justify-content:space-between;align-items:center;padding-top:33px;padding-bottom:34px}.site-footer .wordmark{font-size:16px;letter-spacing:-.8px}.site-footer .wordmark i{width:4px;height:4px}.site-footer>p{font-size:9px;color:var(--muted);margin:0}.back-to-top{display:flex;gap:20px;align-items:center;font-size:10px}.back-to-top span{color:var(--blue);font-size:18px;transition:transform .3s}.back-to-top:hover span{transform:translateY(-4px)}
dialog{width:min(1000px,calc(100% - 40px));max-height:calc(100dvh - 48px);border:0;border-radius:7px;padding:0;background:var(--paper);color:var(--ink);overscroll-behavior:contain;box-shadow:0 20px 100px #0004}dialog::backdrop{background:#090A12C4;backdrop-filter:blur(10px)}dialog[open]{animation:dialog-enter .4s var(--ease)}.dialog-top{display:flex;align-items:center;justify-content:space-between;padding:16px 24px}.dialog-top .eyebrow{font-size:9px;color:var(--muted)}.dialog-top .eyebrow span{color:var(--ink);margin-left:20px}.dialog-close{border:1px solid var(--line);border-radius:50%;width:34px;height:34px;background:none;display:grid;place-items:center;transition:background .3s}.dialog-close:hover{background:#E6E9F1}.project-video{aspect-ratio:16/9;background:var(--ink)}.dialog-details{padding:30px 34px;display:grid;grid-template-columns:1.8fr 1fr;gap:60px}.dialog-details h2{font-size:38px;margin:7px 0 14px}.dialog-details p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.8;margin:0}.dialog-details .demo-note{font-size:9px!important;margin-top:18px!important}.dialog-details dl{margin:3px 0 0;font-size:10px}.dialog-details dl>div{padding:0 0 12px;margin-bottom:12px;border-bottom:1px solid var(--line)}.dialog-details dt{color:var(--muted);margin-bottom:5px}.dialog-details dd{margin:0;font-weight:600}.dialog-details dd a{color:var(--blue)}.dialog-footer{padding:20px 34px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1px;color:var(--muted)}.dialog-footer button{border:0;background:none;font-size:11px;font-weight:650;display:flex;gap:20px;align-items:center;padding:6px 0;color:var(--ink);letter-spacing:0}.dialog-footer button span{color:var(--blue);font-size:20px}
@keyframes asterisk-turn{to{transform:rotate(360deg)}}@keyframes sculpture-turn{to{transform:rotate(360deg)}}@keyframes playhead{from{left:28%}to{left:78%}}@keyframes dialog-enter{from{opacity:0;transform:translateY(15px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:1600px){.reel-copy{font-size:139px}}
@media(max-width:1000px){.site-header{height:85px}.hero{padding-top:38px}.section-space{margin-top:85px}.hero-heading{padding-bottom:27px}.hero h1{font-size:9vw}.reel-stage{aspect-ratio:1.9}.reel-copy{top:26%}.reel-art{top:-5%;width:63%;right:-8%}.play-reel{bottom:16%}.play-circle{width:40px;height:40px}.reel-bottomline{font-size:6px}.project-grid{gap:28px 17px}.project-tag{font-size:8px}.capabilities{gap:6%;grid-template-columns:1fr 1.15fr}.capability-list h3{font-size:18px}.tools-copy{padding:45px 0 45px 35px}.tools-panel{min-height:420px}.tools-copy>p:not(.eyebrow){max-width:250px}.tools-sticker{bottom:36px;right:8px;font-size:8px;padding:13px 16px}.tools-window{width:90%}.tool-canvas{height:180px}.tool-orbit{width:125px;height:125px}.about{gap:8%;padding-bottom:85px}.about-copy>p:not(.about-lead):not(.eyebrow){font-size:11px}.about-lead{font-size:19px;margin:17px 0}.about-copy .section-number{margin-bottom:15px}.contact-bottom{gap:16px}.contact-bottom>p{font-size:10px}.email-link{font-size:23px;gap:15px}}
@media(max-width:720px){:root{--gutter:24px}.site-header{height:79px}.wordmark{font-size:20px}.site-header nav{gap:23px}.site-header .nav-link{display:none}.site-header .nav-contact{padding:10px 12px;font-size:10px;gap:15px;margin:0}.hero{padding-top:33px}.eyebrow{font-size:8px;letter-spacing:1.2px}.hero-note{font-size:9px}.hero-heading{padding:20px 0 25px}.hero h1{font-size:10.5vw}.hero-asterisk{width:40px;height:40px;margin:0 2px 0 15px}.reel-stage{aspect-ratio:1.42}.reel-topline{top:6%;left:5%;right:5%;font-size:7px;letter-spacing:1px}.reel-topline>span:last-child:not(:first-child){font-size:0}.reel-topline>span:last-child svg{width:18px;height:18px}.reel-copy{top:26%;left:7%;font-size:12vw;z-index:2}.reel-art{width:76%;right:-23%;top:1%;opacity:.94}.play-reel{left:7%;bottom:17%;font-size:11px;gap:10px}.play-circle{width:35px;height:35px}.play-circle svg{width:14px;height:14px}.play-reel small{font-size:6px;letter-spacing:1px;margin-top:3px}.reel-bottomline{left:5%;right:5%;bottom:6%;font-size:5px;letter-spacing:.5px}.reel-bottomline>span:first-child{font-size:7px}.reel-cross{font-size:18px}.reel-caption{font-size:9px;margin-top:14px}.reel-caption p{max-width:190px;line-height:1.7}.reel-caption a{font-size:9px;gap:10px;align-self:flex-start;margin-top:2px}.reel-caption svg{width:12px;height:12px}.section-space{margin-top:70px}.section-heading{align-items:flex-start;gap:15px;margin-bottom:24px}.section-heading>p{font-size:10px;line-height:1.7;max-width:155px;margin-top:30px}.section-number{margin-bottom:15px}.section-heading h2{font-size:30px}.count{font-size:10px;margin:3px 0 0 6px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 17px}.project-info{padding-top:10px;align-items:flex-start;flex-direction:column;gap:3px}.project-title{font-size:11px}.project-tag{font-size:8px}.project-no{top:12px;left:12px;font-size:8px}.project-hover{height:43px;width:43px}.work-footnote{font-size:8px;line-height:1.7;margin-top:21px}.capabilities{grid-template-columns:1fr;padding-top:37px;gap:32px}.capabilities h2{font-size:35px}.capabilities-intro>p:not(.eyebrow){font-size:12px;max-width:380px;margin:20px 0}.capability-list>div{padding:20px 0;grid-template-columns:25px 1fr 70px}.capability-list h3{font-size:20px}.capability-list p{font-size:11px}.tools-panel{grid-template-columns:1fr}.tools-copy{padding:35px 28px 15px}.tools-copy h2{font-size:39px}.tools-copy>p:not(.eyebrow){max-width:320px}.tools-art{height:330px;padding:20px 30px 45px}.tools-window{max-width:340px;width:100%}.tool-canvas{height:160px}.tool-orbit{width:115px;height:115px}.tools-sticker{right:18px;bottom:33px}.about{grid-template-columns:1fr;gap:37px;padding-bottom:65px}.portrait-placeholder{max-width:100%;aspect-ratio:1.2}.portrait-outline{width:44%}.about-copy h2{font-size:39px}.about-copy>p:not(.about-lead):not(.eyebrow){font-size:12px;max-width:430px}.about-lead{font-size:22px;margin-top:20px}.contact{padding:34px 0 35px}.contact-mark{font-size:45px}.contact h2{font-size:10.5vw;margin:12px 0 26px;letter-spacing:-.06em}.contact-bottom{flex-wrap:wrap;gap:18px}.email-link{font-size:20px;letter-spacing:-.8px;gap:12px}.email-link svg{width:17px;height:17px}.copy-email{padding:10px}.copy-email span{display:none}.contact-bottom>p{width:100%;margin:0;font-size:10px}.contact-bottom>p br{display:none}.site-footer{padding-top:28px;padding-bottom:28px;flex-wrap:wrap;gap:22px}.site-footer .wordmark{font-size:14px}.site-footer>p{font-size:8px;order:3;width:100%}.back-to-top{font-size:9px;gap:15px}.dialog-details{grid-template-columns:1fr;padding:23px;gap:22px}.dialog-details h2{font-size:32px}.dialog-details dl{display:grid;grid-template-columns:1fr 1fr;gap:12px}.dialog-details dl>div{margin:0}.dialog-top{padding:12px 16px}.dialog-top .eyebrow{font-size:8px}.dialog-top .eyebrow span{margin-left:10px}.dialog-footer{padding:16px 23px}.dialog-footer>span{font-size:7px}.dialog-footer button{font-size:10px}dialog{width:calc(100% - 24px);max-height:calc(100dvh - 24px)}}
@media(max-width:380px){:root{--gutter:18px}.hero-note{display:none}.hero h1{font-size:10.5vw}.hero-asterisk{width:31px;height:31px}.hero-heading{padding:17px 0 22px}.reel-caption{flex-direction:column;gap:10px}.reel-caption p{max-width:none}.reel-caption a{align-self:flex-end}.section-heading{flex-direction:column;gap:9px}.section-heading>p{margin:0;max-width:none}.section-heading>p br{display:none}.project-grid{gap:23px 13px}.tools-copy{padding:29px 23px 15px}.tools-art{padding-inline:23px}.tools-sticker{right:10px}.email-link{font-size:18px;gap:10px}.copy-email{padding:9px}.contact-bottom{gap:11px}.site-header nav{gap:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.project-card:hover .project-thumbnail{transform:none}.reel-art{transform:rotate(-15deg)!important}}

/* Ambient animation can also be paused independently of system preferences. */
.dialog-top{position:sticky;top:0;z-index:2;background:var(--paper)}
.caption-actions{display:flex;align-items:center;gap:28px}.motion-toggle{display:flex;gap:7px;align-items:center;border:0;background:none;color:var(--muted);font-size:9px;padding:0;min-height:24px}.motion-toggle svg{width:10px;height:10px;stroke:currentColor;stroke-width:1.3;fill:none}body.motion-paused .hero-asterisk svg,body.motion-paused .reel-art>svg,body.motion-paused .tool-orbit,body.motion-paused .timeline-playhead,body.motion-paused .tool-visual *{animation-play-state:paused!important}
@media(max-width:1000px){.caption-actions{gap:15px}.reel-caption>p{max-width:240px}}
@media(max-width:720px){.reel-caption{flex-wrap:wrap;gap:9px}.reel-caption>p{max-width:none;width:100%}.caption-actions{width:100%;justify-content:space-between}.motion-toggle{font-size:8px}}
@media(prefers-reduced-motion:reduce){.motion-toggle{display:none}.caption-actions{justify-content:flex-end}}

/* Supplied project stills; square frames retain the original grid rhythm. */
.project-thumbnail img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}.project-thumbnail img.thumbnail-contained{object-fit:contain;background:#016FCE}.project-thumbnail .project-no{z-index:1;top:12px;left:12px;padding:4px 6px;background:#090A1280;color:#fff;border-radius:2px;backdrop-filter:blur(6px)}.project-hover{z-index:2}.project-card:hover .project-thumbnail img,.project-card:focus-visible .project-thumbnail img{transform:scale(1.045)}
@media(prefers-reduced-motion:reduce){.project-card:hover .project-thumbnail img,.project-card:focus-visible .project-thumbnail img{transform:none}}

/* The About label introduces the portrait before the biography at every size. */
.about{row-gap:26px}.about-section-label{grid-column:1/-1;margin:0}

.project-role strong{color:var(--ink);font-weight:700}



.dialog-details{grid-template-columns:1fr;gap:0}.project-collaboration{display:flex;flex-direction:column;gap:5px;font-size:10px;letter-spacing:0}.project-collaboration a{color:var(--blue);font-weight:600}

.play-reel{top:50%;bottom:auto;transform:translateY(-50%);font-size:clamp(18px,2vw,26px);gap:18px}.play-circle{width:clamp(48px,6vw,70px);height:clamp(48px,6vw,70px)}.play-circle svg{width:22px;height:22px}.play-reel small{margin-top:8px}

.reel-backdrop{position:fixed;inset:0;z-index:20;background:rgba(9,10,18,.94);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .45s var(--ease),visibility .45s}.reel-focused .reel-backdrop{opacity:1;visibility:visible;pointer-events:auto}.reel-focused .reel-stage{z-index:21;box-shadow:0 24px 90px #0006}@media(prefers-reduced-motion:reduce){.reel-backdrop{transition:none}}

.reel-stage{aspect-ratio:16/9}

.portrait-placeholder{aspect-ratio:1}.about-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
