@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;500&family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500&display=swap');
:root{--ground:#101214;--ink:#f0eee8;--muted:#aaaeb2;--blue:#aec7e3;--line:#ffffff25;--serif:Georgia,'Times New Roman',serif;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased}body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.045;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='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23ffffff' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}a{color:inherit;text-decoration:none}button{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:7px}::selection{background:var(--blue);color:var(--ground)}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:var(--blue);color:var(--ground);padding:15px}.skip:focus{top:12px}.nav{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:28px;padding:26px 6.5%;z-index:3}.wordmark{font-size:31px;letter-spacing:-1.5px}.nav-line{height:1px;background:var(--line);flex:1}.nav nav{display:flex;gap:36px;font-size:14px;letter-spacing:1px}.nav a{transition:color .2s}.nav a:hover{color:var(--blue)}.hero{position:relative;min-height:850px;min-height:100svh;display:grid;place-items:center;overflow:hidden;padding:100px 24px 20px}.hero-backdrop{position:absolute;inset:-3% 0;background:url('assets/bench-background.jpg') center/cover;opacity:.4;will-change:transform}.hero-content{position:relative;z-index:1;text-align:center;width:100%;max-width:1080px}.portrait-stage{position:relative;display:flex;justify-content:center;width:min(100%,760px);margin:0 auto}.portrait{width:clamp(190px,25vw,330px);height:auto;aspect-ratio:1;border-radius:50%;object-fit:cover;border:5px solid #181b1f;outline:1px solid #b7c8d570;box-shadow:0 0 0 7px #10121470}.scribble{font:24px/1.1 'Caveat',cursive;color:#c4c5c6;letter-spacing:.3px}.note-left{position:absolute;left:3%;top:36%;transform:rotate(-11deg);text-align:left}.note-right{position:absolute;right:0;top:46%;transform:rotate(9deg);text-align:left}h1{font-size:clamp(64px,9.3vw,138px);line-height:1.05;font-weight:400;letter-spacing:-6px;margin:22px 0 0}.handle{display:inline-block;margin-top:8px;color:var(--blue);font-size:19px;letter-spacing:3px}.hero-description{font-size:clamp(17px,1.8vw,23px);letter-spacing:1px;line-height:1.5;margin:32px 0 24px}.button{display:inline-flex;justify-content:center;align-items:center;gap:22px;padding:16px 29px;background:var(--blue);color:#111a24;font-size:17px;min-height:50px;transition:background .25s,transform .25s}.button:hover{background:#d0e0f0;transform:translateY(-3px)}.button:active{transform:translateY(1px)}.scroll-cue{display:flex;align-items:center;flex-direction:column;font-family:'DM Sans',sans-serif;font-size:9px;letter-spacing:4px;margin:27px auto 0;width:80px;color:#ccced0}.scroll-cue span{height:30px;width:1px;background:#b9c7d5;margin-bottom:11px}.scroll-cue b{font-size:19px;font-weight:400;line-height:1;margin-top:3px}.section{padding:80px 8%;border-top:1px solid var(--line);position:relative;overflow:hidden}.section-number{display:flex;gap:24px;align-items:center;font-size:12px;letter-spacing:2px;margin:0 0 30px;color:#c0c5ca}.section-number span{width:60px;height:1px;background:#7b828a}h2{font-weight:400;font-size:clamp(40px,4.6vw,68px);line-height:1.04;letter-spacing:-2.5px;margin:0}em{font-style:normal;color:var(--blue)}.about{display:grid;grid-template-columns:1.2fr 1fr;min-height:440px;padding-right:0;align-items:center}.about-copy{position:relative;z-index:1}.body-copy{max-width:455px;font-size:20px;line-height:1.65;letter-spacing:.4px;margin:26px 0 0}.about-note{display:block;text-align:right;max-width:460px;transform:rotate(-8deg);margin-top:8px}.about-art{height:100%;position:absolute;right:0;top:0;width:40%;overflow:hidden;background:#a4a6af}.about-art img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;filter:grayscale(.65) brightness(.52);transform:scale(1.12)}.about-art::after{position:absolute;inset:0;content:'';background:#10121420}.curiosity{display:grid;grid-template-columns:1fr 1.15fr;gap:5%;padding-top:90px;padding-bottom:85px}.interests{margin-top:38px;display:grid;gap:13px}.interest{display:flex;text-align:left;gap:24px;align-items:center;border:0;background:transparent;color:var(--ink);padding:13px 0;cursor:pointer;transition:transform .3s,color .3s;min-height:84px;width:100%}.interest .index{font-size:28px;color:var(--blue);padding-right:20px;border-right:1px solid #8c9bad70}.interest strong{display:block;font-weight:400;font-size:27px}.interest small{display:block;color:var(--muted);font-size:15px;line-height:1.4;margin-top:5px}.interest-arrow{margin-left:auto;opacity:0;color:var(--blue);transition:opacity .2s,transform .3s}.interest:hover,.interest.active{transform:translateX(5px)}.interest.active .interest-arrow,.interest:hover .interest-arrow{opacity:1}.interest.active strong{color:var(--blue)}.lab{display:flex;flex-direction:column;justify-content:center;padding-top:20px;min-width:0}.agent-scene{height:310px;position:relative;perspective:800px}.pane{position:absolute;width:120px;height:225px;top:15px;background:#9fbddd0a;border:1px solid #afc7e446;transform:rotateY(-28deg) skewY(15deg);transition:transform .8s var(--ease),border-color .4s;box-shadow:inset 0 0 45px #aec7e309}.pane-one{left:15%;top:10px}.pane-two{left:36%;top:32px}.pane-three{left:57%;top:54px}.pane span{font:8px 'DM Sans',sans-serif;letter-spacing:2px;color:#a9bad1;position:absolute;top:13px;left:12px}.pane i{display:block;height:30px;width:55px;border:1px solid #aec7e430;margin:20px auto;background:#aec7e309}.pane i:first-of-type{margin-top:50px}.tool-node{margin:75px auto;width:45px;height:45px;text-align:center;padding:9px;border:1px solid #aec7e470;color:var(--blue);font-size:22px}.agent-path{position:absolute;top:30px;left:-5%;width:110%;height:270px;overflow:visible}.path-track{stroke:#71869b;stroke-width:1}.path-live{stroke:#d0e5fc;stroke-width:2;stroke-dasharray:650;stroke-dashoffset:650;transition:stroke-dashoffset 2.5s linear}.path-dots circle{fill:var(--blue);stroke:#aec7e330;stroke-width:8}.path-labels{fill:#d4d9e0;font-family:'Caveat',cursive;font-size:19px}.diagram-note{position:absolute;left:25%;bottom:2px;transform:rotate(-9deg);font-size:22px}.lab-controls{padding:15px 2% 0 8%;max-width:460px}.lab-label{font:9px 'DM Sans',sans-serif;letter-spacing:2px;color:#9fabb7}.lab-controls p{font-size:17px;line-height:1.6;margin:14px 0;min-height:55px;color:#d1d4d8}.run-button{border:0;border-bottom:1px solid #aec7e470;color:var(--blue);background:transparent;padding:0 0 7px;font-size:16px;cursor:pointer}.run-button span{display:inline-block;margin-left:16px;transition:transform .3s}.run-button:hover span{transform:translateX(6px)}.run-button:disabled{opacity:.6;cursor:wait}.lab-controls .run-status{font:11px/1.6 'DM Sans',sans-serif;color:#a8b1bb;min-height:36px;margin-top:12px}.running .path-live{stroke-dashoffset:0}.running .pane{border-color:#c1dcfba0;transform:rotateY(-12deg) skewY(8deg)}.contact{display:grid;grid-template-columns:1fr 240px;gap:30px;align-items:center;padding-top:65px;padding-bottom:65px}.contact h2{font-size:clamp(37px,4.6vw,66px)}.contact-copy{font-size:23px;margin:22px 0 28px}.contact-hint{color:var(--muted);font:12px/1.6 'DM Sans',sans-serif;margin-top:20px}.contact-portrait{position:relative;text-align:center}.contact-portrait img{width:175px;height:175px;border-radius:50%;border:4px solid #252a30;outline:1px solid #a1b3c460}.contact-portrait .scribble{position:absolute;right:-10px;top:80px;font-size:20px;text-align:left;transform:rotate(12deg)}.contact-portrait a{display:block;color:var(--blue);letter-spacing:2px;margin-top:16px;font-size:15px}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:25px 8%;color:#a9aeb4;font:11px 'DM Sans',sans-serif;letter-spacing:1px}footer a:hover{color:var(--blue)}
@keyframes enter{from{opacity:.3;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes portrait-enter{from{clip-path:circle(40%);transform:scale(.96)}to{clip-path:circle(51%);transform:scale(1)}}@media(prefers-reduced-motion:no-preference){.portrait{animation:portrait-enter 1.2s var(--ease) both}h1{animation:enter 1s var(--ease) both}.handle{animation:enter 1s .08s var(--ease) both}.hero-description{animation:enter 1s .16s var(--ease) both}.hero .button{animation:enter 1s .24s var(--ease) both}.note-left,.note-right{animation:enter 1.2s .2s var(--ease) both}.section .section-number,.section h2,.body-copy,.about-note,.interest,.lab-controls,.contact-copy,.contact .button{transition:opacity .8s var(--ease),translate .8s var(--ease)}.awaiting{opacity:.15;translate:0 22px}.seen{opacity:1;translate:0 0}.about-art img{transition:transform 1.4s var(--ease)}.about-art.seen img{transform:scale(1)}.interest:nth-child(2){transition-delay:.08s}.interest:nth-child(3){transition-delay:.16s}}
@media(min-width:1500px){.section{padding-left:max(8%,calc((100vw - 1280px)/2));padding-right:max(8%,calc((100vw - 1280px)/2))}.about{padding-right:0}.hero{min-height:950px}}
@media(max-width:760px){.nav{padding:20px 6%;gap:22px}.wordmark{font-size:27px}.nav nav{gap:20px;font-size:12px;letter-spacing:.5px}.nav-line{display:none}.nav{justify-content:space-between}.hero{min-height:780px;min-height:96svh;padding:115px 20px 25px}.hero-backdrop{background-position:50% center;opacity:.36}.portrait{width:220px}.portrait-stage{max-width:460px}.note-left{left:-1%;top:22%;font-size:19px;max-width:80px}.note-right{right:-1%;top:65%;font-size:18px;max-width:90px}h1{font-size:clamp(55px,11.2vw,85px);letter-spacing:-3px;margin-top:35px}.handle{font-size:15px}.hero-description{max-width:310px;margin:29px auto 23px;font-size:18px;letter-spacing:.3px}.scroll-cue{margin-top:30px}.section{padding:55px 7%}.section-number{margin-bottom:24px}h2{font-size:43px;letter-spacing:-1.7px}.about{display:block;padding-bottom:0}.about-art{position:relative;top:auto;right:auto;width:calc(100% + 16.3%);margin:32px -8.15% 0;height:280px}.about-art img{object-position:50% 32%;filter:grayscale(.65) brightness(.6)}.body-copy{font-size:18px;max-width:480px}.about-note{margin-top:16px;max-width:100%}.curiosity{display:block}.interests{margin-top:30px;gap:7px}.interest{min-height:80px}.interest strong{font-size:25px}.interest small{font-size:14px}.lab{padding-top:30px}.agent-scene{height:285px;max-width:470px;width:100%;margin:auto}.pane{width:27%;height:210px}.pane-one{left:12%}.pane-two{left:34%}.pane-three{left:56%}.agent-path{top:27px;height:245px}.lab-controls{padding:20px 0 0;max-width:none}.contact{grid-template-columns:1fr;gap:36px}.contact h2{font-size:43px;max-width:360px}.contact-copy{font-size:20px;line-height:1.5}.contact-portrait{width:220px;justify-self:end;margin-right:15px}.contact-portrait img{width:130px;height:130px}.contact-portrait .scribble{right:-4px;top:50px}.contact-portrait a{font-size:13px}footer{padding:23px 7%;gap:20px;font-size:10px;line-height:1.6}}
@media(max-width:380px){.portrait{width:190px}.note-left{font-size:16px;left:-8px}.note-right{font-size:16px;right:-8px}.nav nav{gap:15px}.hero{padding-top:110px}.section h2{font-size:38px}.interest{gap:15px}.interest .index{padding-right:15px}.pane span{font-size:6px}.contact h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.hero-backdrop{transform:none!important}.awaiting{opacity:1;translate:none}.path-live{transition:none}.about-art img{transform:none}}

/* Readable captions and comfortable touch targets across screen sizes. */
.section-number,.lab-controls .run-status,.contact-hint,footer{font-size:13px}
.lab-label{font-size:13px;letter-spacing:.5px;text-transform:none}
.pane span{font-size:11px;letter-spacing:.5px}
.nav nav a{min-height:44px;display:inline-flex;align-items:center}
.run-button{min-height:44px}
@media(max-width:760px){
  .note-left{left:4px;max-width:75px}
  .note-right{right:4px;max-width:85px}
  .pane span{font-size:10px;left:8px;letter-spacing:0}
  footer{font-size:13px;letter-spacing:0;flex-wrap:wrap}
}
@media(max-width:380px){.note-left{left:2px}.note-right{right:2px}}

/* User-shared video, kept at its original square aspect ratio. */
.video-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:7%;align-items:center}
.video-copy .body-copy{max-width:340px}
.video-figure{margin:0;min-width:0;width:100%;max-width:540px;justify-self:end}
.portfolio-video{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:var(--ground);color:var(--ink)}
.portfolio-video:focus-visible{outline:2px solid var(--blue);outline-offset:7px}
.video-figure figcaption{margin-top:16px;color:var(--muted);font:14px/1.6 'DM Sans',sans-serif}
.video-figure figcaption a{display:inline-block;color:var(--blue);text-decoration:underline;text-underline-offset:4px;padding:10px 0}
@media(max-width:760px){.video-section{grid-template-columns:1fr;gap:30px}.video-figure{max-width:540px;justify-self:center}.video-copy .body-copy{margin-top:20px}}

/* Project stories: real portfolio preview plus an explicitly upcoming project slot. */
.projects{border-top:0;background:#14181c;padding-top:100px;padding-bottom:80px}
.projects-intro{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:58px}
.projects-intro h2{max-width:650px}
.projects-intro .body-copy{max-width:300px;margin:0;font-size:18px}
.project{display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:7%;min-width:0}
.project+.project{margin-top:90px}
.project-image{display:block;position:relative;overflow:hidden;min-width:0;background:#20262d;aspect-ratio:8/5}
.project-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.project-image[href]:hover img,.project-image[href]:focus-visible img{transform:scale(1.035)}
.project-copy{min-width:0}
.project-copy h3{font-size:clamp(29px,3vw,43px);font-weight:400;line-height:1.12;letter-spacing:-1px;margin:0 0 23px}
.project-copy>p:not(.project-note){font-size:18px;line-height:1.65;margin:0;max-width:420px}
.project-copy .project-note{margin:22px 0;color:var(--blue);font-size:25px}
.project-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px 25px;font:14px/1.5 'DM Sans',sans-serif}
.project-links a{display:inline-flex;align-items:center;gap:16px;min-height:44px;color:var(--blue);text-decoration:underline;text-underline-offset:6px;transition:transform .2s}
.project-links a:hover{transform:translateX(3px)}
.project-pending{color:var(--muted)}
.project-next{grid-template-columns:1fr 1.25fr}
.project-next .project-image{grid-column:2;grid-row:1}
.project-next .project-copy{grid-column:1;grid-row:1}
.project-preview img{filter:brightness(.55);object-position:50% 45%}
.project-preview-caption{position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;color:var(--ink);font-size:clamp(28px,3.4vw,48px);letter-spacing:-1.5px}
.projects-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin:55px 0 0;color:var(--muted);font:14px/1.6 'DM Sans',sans-serif}
@media(prefers-reduced-motion:no-preference){.project-image,.project-copy{transition:opacity .8s var(--ease),translate .8s var(--ease)}}
@media(max-width:760px){.nav nav{gap:16px}.projects{padding-top:55px;padding-bottom:55px}.projects-intro{display:block;margin-bottom:32px}.projects-intro .body-copy{margin-top:22px;max-width:340px}.project,.project-next{grid-template-columns:1fr;gap:27px}.project+.project{margin-top:58px}.project-next .project-image,.project-next .project-copy{grid-column:auto;grid-row:auto}.project-copy h3{font-size:32px;max-width:350px;margin-bottom:17px}.project-copy>p:not(.project-note){font-size:18px}.project-copy .project-note{margin:16px 0}.project-preview-caption{font-size:32px}.projects-footer{margin-top:40px;gap:12px}.nav nav{letter-spacing:0}}
@media(max-width:380px){.nav{gap:12px}.nav nav{gap:12px}.nav .wordmark{font-size:25px}.project-copy h3{font-size:29px}}
/* Keep project descriptions comfortable on tablets too. */
@media(min-width:761px) and (max-width:1000px){.projects-intro{display:block}.projects-intro .body-copy{margin-top:24px;max-width:440px}.project,.project-next{grid-template-columns:1fr;gap:30px}.project-next .project-image,.project-next .project-copy{grid-column:auto;grid-row:auto}.project-copy>p:not(.project-note){max-width:560px}.project-copy h3{font-size:36px}}