@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--paper:#f6f5f0;--ink:#20211e;--green:#d4f663;--line:#d4d5cc}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Space Grotesk','Noto Sans SC',sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}header{height:94px;margin:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:30px;font-weight:700;letter-spacing:-2px}.brand span{font-size:12px;vertical-align:top;margin-left:5px}nav{display:flex;gap:38px;font-size:13px}sup{font-size:9px;margin-left:4px}.contact-nav{font-size:13px}.contact-nav span{margin-left:28px;font-size:22px}main>section{margin:0 5%}.hero{padding-top:38px}.eyebrow{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px}.availability{display:flex;gap:8px;align-items:center}i{display:inline-block;width:7px;height:7px;background:#638c2d;border-radius:50%;margin-right:6px}h1{font-size:clamp(72px,11.6vw,180px);line-height:1.18;letter-spacing:-.075em;margin:36px 0 22px;font-weight:900}.second{margin-left:22%}.asterisk{display:inline-block;color:var(--green);background:var(--ink);font-family:Arial;font-size:.72em;line-height:1;width:.97em;height:.97em;text-align:center;border-radius:50%;margin:0 .08em;vertical-align:8%;animation:rotate 35s linear infinite}.hero-bottom{display:flex;align-items:center;justify-content:space-between;position:relative;padding:0 0 38px}.hero-bottom p{font-size:13px;line-height:1.9;margin:0}.hero-bottom strong{font-weight:500}.round-link{display:grid;place-items:center;border:1px solid var(--ink);width:66px;height:66px;border-radius:50%;font-size:28px;margin-right:17%;transition:.3s}.round-link:hover{background:var(--green);transform:translateY(5px)}.vertical-note{font-size:10px;writing-mode:vertical-rl;letter-spacing:2px}.hero-caption{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:17px 0;font-size:9px;letter-spacing:1.5px}.work{padding-top:94px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.section-heading h2{font-size:25px;margin:0;letter-spacing:-1px}.section-heading h2 span{font-size:12px;font-weight:400;color:#73756e;letter-spacing:0;margin-left:10px}.section-heading>span{font-size:11px}.filters{display:flex;gap:9px;margin-bottom:30px}.filters button{padding:9px 17px;border:1px solid var(--line);border-radius:25px;font-size:11px;background:transparent}.filters button.active{background:var(--ink);color:var(--paper);border-color:var(--ink)}.projects{display:grid;grid-template-columns:1fr 1fr;gap:44px 28px}.project{border:0;background:none;padding:0;text-align:left;min-width:0}.project[hidden]{display:none}.art{aspect-ratio:1.23;position:relative;overflow:hidden;isolation:isolate;transition:filter .4s}.project:hover .art{filter:saturate(1.2)}.project-open{position:absolute;bottom:20px;right:20px;background:var(--paper);width:36px;height:36px;display:grid;place-items:center;border-radius:50%;font-size:22px;transition:transform .3s}.project:hover .project-open{transform:rotate(45deg)}.art-small{position:absolute;top:24px;left:26px;font-size:8px;letter-spacing:1px;z-index:3}.art-one{background:#d3ec55}.art-label{position:absolute;left:7%;top:12%;font-size:clamp(35px,5.5vw,85px);font-weight:700;line-height:.95;letter-spacing:-5px;z-index:2}.orb{position:absolute;width:64%;aspect-ratio:1;bottom:-14%;right:-4%;border-radius:50%;background:radial-gradient(circle at 33% 28%,#fff6b4 0,#ece785 11%,#a8ae3d 30%,#383f17 60%,#141c0b 79%);box-shadow:-20px 25px 35px #4e5a264a;transition:transform .7s}.project:hover .orb{transform:translate(-10px,-12px)}.art-one .art-small{top:auto;bottom:24px;max-width:150px;line-height:1.6}.art-two{background:#191f29;color:#f5e9dd}.portal{position:absolute;width:53%;height:115%;left:24%;top:10%;border-radius:50% 50% 0 0;background:radial-gradient(ellipse at 50% 65%,#fedabb 0,#c68d80 23%,#777282 43%,#343f4d 61%,#17202a 75%);box-shadow:0 0 0 1px #b9c7c03b,0 0 0 15px #b9c7c00b,0 0 0 32px #b9c7c009;transform:rotate(22deg)}.garden-title{position:absolute;top:33%;left:12%;font:clamp(36px,5vw,80px)/.95 Georgia,serif;letter-spacing:-3px}.garden-title em{font-weight:400}.art-three{background:#e6c0da}.type-play{position:absolute;top:13%;left:13%;font-size:clamp(70px,12vw,170px);font-weight:900;line-height:.9;transform:rotate(-9deg);color:#472f89}.type-play span{margin-left:100px}.ribbon{position:absolute;width:80%;height:35%;border:28px solid #e85826;border-radius:50%;transform:rotate(-35deg);top:28%;left:25%;box-shadow:inset 0 8px 12px #8832184d,0 12px 16px #9943463b}.art-bottom{position:absolute;bottom:25px;left:26px;font-size:9px;letter-spacing:2px}.art-four{background:#c2c9bd;display:grid;place-items:center}.book{width:53%;height:76%;background:#eee9df;box-shadow:16px 25px 25px #333b344d;transform:rotate(-13deg);padding:9% 7%;border-left:5px solid #ded9cf;position:relative;transition:transform .5s}.project:hover .book{transform:rotate(-6deg)}.book:after{content:'';position:absolute;background:#e95632;border-radius:50%;width:45%;aspect-ratio:1;right:-10%;bottom:19%}.book>span{font-family:serif;font-size:clamp(25px,4vw,62px);line-height:1.1;letter-spacing:-4px}.book small{position:absolute;bottom:9%;left:12%;font-size:7px;line-height:1.5}.art-four .art-small{top:auto;bottom:24px}.project-meta{display:flex;justify-content:space-between;align-items:start;gap:12px;margin-top:16px}.project-meta h3{font-size:12px;font-weight:500;margin:0}.project-meta>span{font-size:10px;color:#777;white-space:nowrap}.demo-note{font-size:10px;color:#83857c;line-height:1.8;margin-top:24px}.about{display:grid;grid-template-columns:1fr 1fr;gap:8%;padding-top:120px;padding-bottom:100px}.about-art{background:#e9e8df;position:relative;min-height:440px;overflow:hidden;padding:30px}.about-art>span{font-size:46px;line-height:.95;font-weight:700;letter-spacing:-3px;position:relative;z-index:2}.abstract-flower{font:350px/1 Arial;color:#8b9b7c;position:absolute;right:0;bottom:10px;transform:rotate(15deg)}.about-art small{position:absolute;bottom:25px;font-size:9px;letter-spacing:2px}.about-copy{padding-top:16px}.about-copy h2{font-size:48px;line-height:1.35;letter-spacing:-3px;margin:26px 0}.about-copy h2 span{color:#8a9480}.about-copy p{font-size:13px;color:#71736a;line-height:2;max-width:420px}.skills{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}.skills span{border:1px solid #c6c8bb;padding:7px 12px;font-size:10px;border-radius:20px}.text-button{border:0;background:none;text-decoration:underline;text-underline-offset:5px;font-size:11px}.contact{background:var(--green);padding:40px 45px 48px!important;margin:0!important}.contact h2{font-size:clamp(48px,7.3vw,112px);line-height:1.25;letter-spacing:-6px;margin:43px 0}.contact h2>span{margin-left:20%}.contact-bottom{display:flex;align-items:center;justify-content:space-between}.contact-bottom>button{border:0;border-bottom:1px solid;background:none;padding:0 0 8px;font-size:20px}.contact-bottom>button span{margin-left:50px}.contact-bottom p{font-size:11px;line-height:1.9}footer{margin:0 5%;display:flex;justify-content:space-between;align-items:center;padding:32px 0}footer>span,footer>a:last-child{font-size:10px;color:#74766c}dialog{width:min(850px,92vw);padding:0;border:0;background:var(--paper);max-height:90vh;overflow:auto}dialog::backdrop{background:#111b;backdrop-filter:blur(7px)}.close{position:absolute;right:15px;top:15px;width:38px;height:38px;border:0;border-radius:50%;background:#f6f5f0;z-index:8;font-size:25px}#detail-art .art{aspect-ratio:1.8;pointer-events:none}.detail-copy{padding:32px}.detail-copy>span{font-size:11px}.detail-copy h2{font-size:27px}.detail-copy p{font-size:13px;line-height:1.9;color:#74766c}.detail-grid{display:grid;grid-template-columns:1fr 1fr;margin-top:25px}.detail-grid small{font-size:10px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:12px 20px;font-size:12px;border-radius:5px;opacity:0;pointer-events:none;transition:.2s}#toast.show{opacity:1}#email-form{margin-top:28px}#email-form label{display:block;font-size:12px;margin-bottom:10px}#email-form input{padding:12px;border:1px solid #798c3b;font:inherit;width:min(300px,70%);background:#ffffff70}#email-form button{padding:12px 20px;border:1px solid var(--ink);background:var(--ink);color:white}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #8b56da;outline-offset:5px}@keyframes rotate{to{transform:rotate(360deg)}}@media(min-width:1500px){body{max-width:1600px;margin:auto}}@media(max-width:700px){header{height:75px}nav{gap:17px;font-size:11px}.contact-nav{display:none}h1{font-size:17vw;margin-top:45px}.second{margin-left:10%}.availability{font-size:8px;letter-spacing:0}.eyebrow{font-size:9px}.hero-bottom{padding-top:20px}.hero-bottom p{font-size:11px}.round-link{margin-right:5%;width:48px;height:48px}.hero-caption{font-size:7px}.work{padding-top:60px}.section-heading h2{font-size:21px}.section-heading h2 span{font-size:9px}.section-heading>span{font-size:9px}.filters{gap:6px}.filters button{font-size:10px;padding:8px 12px}.projects{grid-template-columns:1fr;gap:30px}.art-label{font-size:12vw}.garden-title{font-size:12vw}.type-play{font-size:26vw}.book>span{font-size:9vw}.project-meta h3{font-size:11px}.about{grid-template-columns:1fr;padding-top:70px;padding-bottom:65px;gap:28px}.about-art{min-height:350px}.abstract-flower{font-size:300px;right:15px}.about-copy h2{font-size:42px}.text-button{font-size:10px}.contact{padding:30px 5% 35px!important}.contact h2{font-size:12vw;letter-spacing:-3px}.contact h2>span{margin-left:8%}.contact-bottom{align-items:start;gap:20px;flex-direction:column}.contact-bottom>button{font-size:17px}footer{flex-wrap:wrap;gap:22px}footer>span{font-size:9px}footer>a:last-child{margin-left:auto}.detail-copy{padding:23px}.detail-copy h2{font-size:22px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.second{display:block;white-space:nowrap}@media(max-width:700px){h1{font-size:15vw}.second{margin-left:7%}.asterisk{margin:0 .02em}}

.contact-bottom>.email-link{border-bottom:1px solid;padding-bottom:8px;font-size:clamp(17px,2.2vw,28px)}.email-link span{margin-left:20px}.project-meta{flex-wrap:wrap}.project-meta>span{white-space:normal}.hero-bottom p{max-width:78%}.detail-copy p{white-space:pre-line}
.garden-title{font-size:clamp(32px,4vw,64px)}@media(max-width:700px){.garden-title{font-size:10vw}}
.document-library{padding-top:100px;padding-bottom:5px;border-top:1px solid var(--line);margin-top:85px}.library-intro{display:flex;justify-content:space-between;gap:24px;align-items:center;margin:35px 0}.library-intro>p{font-size:28px;letter-spacing:-1px}.library-intro>span{font-size:12px;line-height:1.8;color:#787d6d}.document-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.document-card{min-width:0}.document-cover{position:relative;display:flex;align-items:center;justify-content:center;background:#e8e9df;aspect-ratio:1/1.15;padding:26px 35px;overflow:hidden}.document-card:nth-child(2) .document-cover{background:#dfe5d9}.document-card:nth-child(3) .document-cover{background:#e9e3da}.document-cover img{height:100%;width:100%;object-fit:contain;filter:drop-shadow(5px 10px 8px #25321b29);transition:transform .35s}.document-cover:hover img{transform:rotate(-2deg) scale(1.04)}.doc-number{position:absolute;top:14px;left:16px;font-size:10px;color:#626958}.doc-page-count{position:absolute;bottom:13px;right:14px;font-size:9px;letter-spacing:1px;background:var(--paper);padding:7px 10px}.document-card-body{padding-top:20px}.doc-kicker{font-size:9px;letter-spacing:1px;color:#787e6a}.document-card h3{font-size:18px;line-height:1.5;font-weight:500;margin:13px 0}.document-card p{font-size:12px;line-height:1.9;color:#747a6b}.document-actions{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:15px;margin-top:22px;font-size:11px}.document-actions a:first-child{font-weight:600}.mindmap-card{display:flex;gap:28px;align-items:center;border:1px solid var(--line);padding:30px;margin-top:40px;transition:background .2s}.mindmap-card:hover{background:#e9eddf}.map-icon{width:80px;height:80px;background:var(--green);display:grid;place-items:center;font-size:50px;flex-shrink:0}.mindmap-card h3{font-size:21px;font-weight:500;margin:10px 0}.mindmap-card p{font-size:11px;color:#7b806f}.map-action{margin-left:auto;font-size:12px;white-space:nowrap}#project-documents{border-top:1px solid var(--line);margin-top:22px;padding-top:15px}#project-documents:empty{display:none}#project-documents h3{font-size:12px;font-weight:500}#project-documents a{display:block;font-size:12px;padding:10px 0;text-decoration:underline;text-underline-offset:4px}@media(max-width:700px){header nav{gap:13px;font-size:10px}.document-library{padding-top:55px;margin-top:55px}.library-intro{display:block;margin:24px 0}.library-intro>p{font-size:23px}.library-intro>span{font-size:11px}.document-grid{grid-template-columns:1fr;gap:35px}.document-cover{aspect-ratio:1.15}.document-card h3{font-size:19px}.document-library .section-heading>span{font-size:8px}.mindmap-card{gap:16px;padding:20px;flex-wrap:wrap}.map-icon{width:52px;height:52px;font-size:36px}.mindmap-card>div{flex:1;min-width:180px}.mindmap-card h3{font-size:17px}.map-action{margin-left:68px}.document-library .section-heading h2 span{font-size:8px;margin-left:6px}}
/* Readability and chapter navigation */
.portfolio-home{max-width:none}.portfolio-home>header,.portfolio-home>main,.portfolio-home>footer{margin-left:210px;margin-right:48px}.portfolio-home>header{height:88px}.portfolio-home>main>section{margin-left:0;margin-right:0}.portfolio-home header nav{font-size:14px;gap:25px}.portfolio-home .contact-nav{font-size:14px}.chapter-nav{position:fixed;top:0;left:0;bottom:0;width:166px;padding:144px 18px 30px 25px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:10px;z-index:15;background:var(--paper)}.chapter-label{font-size:10px;letter-spacing:2px;color:#777e6a;margin:0 0 20px 12px}.chapter-nav a{font-size:14px;padding:12px 10px;display:flex;align-items:center;gap:12px;border-radius:3px;color:#737a66;transition:background .2s,color .2s}.chapter-nav a>span{font-size:10px}.chapter-nav a.current{background:var(--ink);color:var(--green)}.chapter-nav a:hover{background:#e2e8d7;color:var(--ink)}.hero{padding-top:65px}.hero h1{font-size:clamp(60px,8.8vw,145px)}.hero-bottom p,.about-copy p{font-size:17px;line-height:1.95}.about-copy p{max-width:650px}.eyebrow{font-size:12px}.hero-caption{font-size:11px}.section-heading{padding-bottom:22px;border-bottom:1px solid var(--line)}.section-heading h2{font-size:29px}.section-heading h2 span{font-size:14px}.section-heading>span{font-size:13px}.filters button{font-size:14px;padding:10px 19px}.project-meta h3{font-size:17px;line-height:1.6}.project-meta>span{font-size:13px;line-height:1.7}.project-meta{display:block}.project-meta>span{display:block;margin-top:5px}.demo-note{font-size:13px}.skills span{font-size:13px}.text-button{font-size:14px}.library-intro>span,.document-card p{font-size:16px;line-height:1.9}.document-card h3{font-size:20px}.doc-kicker{font-size:12px}.document-actions{font-size:14px}.mindmap-card p{font-size:14px;line-height:1.8}.map-action{font-size:15px}.detail-copy p{font-size:17px;line-height:1.95}.detail-copy>span,.detail-grid small{font-size:13px}#project-documents h3{font-size:15px}#project-documents a{font-size:16px;line-height:1.8}.contact-bottom p{font-size:15px;line-height:1.9}footer>span,footer>a:last-child{font-size:13px}.project-illustration{background:#e8ecdf}.project-illustration img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s}.project:hover .project-illustration img{transform:scale(1.025)}.concept-label{position:absolute;bottom:18px;left:20px;font-size:10px;padding:6px 9px;border:1px solid #ffffff30;background:#f6f5f0dc;color:#383f2d}.project-illustration .project-open{bottom:18px;right:18px}#detail-art .project-illustration{aspect-ratio:1000/760}.document-grid{gap:20px}.document-cover{padding:22px}.contact{padding:40px!important}.portfolio-home>main>.contact{margin:0!important}
@media(min-width:1700px){.portfolio-home>header,.portfolio-home>main,.portfolio-home>footer{max-width:1400px;margin-left:230px}}@media(max-width:1100px){.portfolio-home>header,.portfolio-home>main,.portfolio-home>footer{margin-left:175px;margin-right:30px}.chapter-nav{width:150px;padding-left:16px;padding-right:12px}.chapter-nav a{font-size:13px;gap:8px}.portfolio-home .contact-nav{display:none}.document-grid{grid-template-columns:1fr 1fr}.document-card:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:25px}.document-card:last-child .document-cover{aspect-ratio:1.1}.about{gap:5%}.about-art{min-height:480px}.about-copy h2{font-size:40px}}
@media(max-width:800px){html{scroll-padding-top:80px}.portfolio-home>header,.portfolio-home>main,.portfolio-home>footer{margin-left:5%;margin-right:5%}.portfolio-home>header{height:75px}.portfolio-home header nav{display:none}.chapter-nav{position:sticky;top:0;bottom:auto;width:100%;height:auto;padding:10px 5%;flex-direction:row;gap:8px;border-right:0;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:thin}.chapter-label{display:none}.chapter-nav a{white-space:nowrap;flex-shrink:0;font-size:12px;padding:9px 10px;gap:6px}.chapter-nav a>span{font-size:9px}.hero h1{font-size:14vw}.hero-bottom p{font-size:15px;max-width:80%}.hero-bottom{gap:12px}.round-link{flex-shrink:0;margin:0;width:42px;height:42px}.vertical-note{display:none}.hero-caption{font-size:8px}.section-heading{flex-wrap:wrap;gap:15px}.section-heading h2{font-size:24px}.section-heading h2 span{font-size:11px}.section-heading>span{font-size:11px}.filters{flex-wrap:wrap}.filters button{font-size:13px;padding:9px 14px}.project-meta h3{font-size:17px}.project-meta>span{font-size:13px}.about-copy p{font-size:16px}.document-grid{grid-template-columns:1fr}.document-card:last-child{display:block;grid-column:auto}.document-card:last-child .document-cover{aspect-ratio:1.15}.document-card p{font-size:16px}.library-intro>span{font-size:15px}.doc-kicker{font-size:11px}.document-actions{font-size:14px}.document-card h3{font-size:21px}.document-library .section-heading h2 span{font-size:10px}.about-art{min-height:350px}.demo-note{font-size:12px}.detail-copy p{font-size:16px}.contact{padding:30px 20px!important}.contact-bottom p{font-size:15px}footer>span,footer>a:last-child{font-size:11px}}
/* Resume-aligned case studies: methods, results and validation context. */
.project-featured{grid-column:1/-1;display:grid;grid-template-columns:1.12fr 1fr;gap:32px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:36px}.project-featured[hidden]{display:none}.project-featured .project-meta{margin:0}.project-meta .project-kicker{font-size:11px;letter-spacing:1px;color:#536a43;margin:0 0 14px}.project-featured .project-meta h3{font-size:clamp(22px,2vw,30px);font-weight:600;line-height:1.5}.project-meta .project-summary{font-size:15px;line-height:1.9;color:#626b58;margin:14px 0 0}.project-meta .project-result{font-size:16px;font-weight:600;line-height:1.8;margin:14px 0 0}.project-context{display:block;font-size:12px;line-height:1.8;color:#737a66;margin-top:5px}.project-featured .project-result{font-size:19px}.project-boundary{border-left:3px solid #8b9b7c;padding-left:14px;margin-top:20px;font-size:13px;line-height:1.9;color:#626b58}.hero-caption{gap:20px}.projects{align-items:start}
@media(max-width:1100px){.project-featured{gap:24px;grid-template-columns:1fr 1fr}.project-featured .project-meta h3{font-size:22px}.project-featured .project-result{font-size:16px}.project-featured .project-summary{font-size:14px}}
@media(max-width:800px){.project-featured{grid-template-columns:1fr;gap:20px;padding-bottom:28px}.project-featured .project-meta h3{font-size:23px}.project-featured .project-summary{font-size:15px}.hero-caption{line-height:1.8}.project-meta .project-result{font-size:15px}.project-featured .project-result{font-size:17px}}
@media(max-width:800px){.hero h1{font-size:13vw}}
