:root{--ink:#1e2524;--paper:#f2efe8;--acid:#d9ff43;--rust:#c85d39;--muted:#77817c}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:500 16px/1.5 Manrope,Arial,sans-serif}
.noise{position:fixed;inset:0;opacity:.17;pointer-events:none;z-index:4;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='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
main,footer{max-width:1440px;margin-inline:auto}
.nav{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:absolute;top:0;left:0;right:0;width:100%;max-width:1440px;margin-inline:auto;z-index:3}
.logo{display:inline-flex;align-items:center;gap:11px;font:700 25px/.95 Playfair Display,serif;letter-spacing:-.07em}
.logo-mark{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 3px 4px #1f334b25)}
.logo-name{color:var(--ink)}
nav{display:flex;gap:27px;font-size:12px}
.availability{font:11px DM Mono,monospace;display:flex;gap:9px;align-items:center}
.availability i{width:8px;height:8px;border-radius:50%;background:#75b85c;box-shadow:0 0 0 4px #75b85c33}
.hero{min-height:770px;padding:154px 8vw 64px;display:grid;grid-template-columns:1.05fr .95fr;position:relative;overflow:hidden;background:#d2d7d0}
.hero:before{content:"";position:absolute;width:720px;height:720px;border-radius:50%;background:var(--acid);right:-180px;top:-270px}
.hero-copy{position:relative;z-index:1}
.eyebrow,.mono{font:11px/1.4 DM Mono,monospace;letter-spacing:.08em}
.hero h1,.statement h2,.section-heading h2,.timeline h2,.skills h2,.contact h2{font:700 clamp(58px,8vw,118px)/.88 Playfair Display,serif;letter-spacing:-.07em;margin:32px 0 16px}
.hero h1{white-space:nowrap}
.hero h1 em,h2 em{color:var(--rust);font-weight:600}
.role{font:700 20px Manrope;margin:0 0 22px}
.intro{max-width:370px;font-size:17px;line-height:1.65}
.hero-actions{display:flex;align-items:center;gap:24px;margin-top:38px}
.button{background:var(--ink);color:white;padding:15px 19px;font-size:12px}
.button b{font-size:17px;margin-left:14px}
.text-link{font-size:12px;border-bottom:1px solid}
.portrait-wrap{position:relative;z-index:1;align-self:end;justify-self:center;width:min(390px,100%)}
.portrait-frame{height:490px;overflow:hidden;background:#77817c;border-radius:195px 195px 0 0}
.portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:50% 36%;filter:saturate(.78) contrast(1.08)}
.vertical-note{position:absolute;right:-28px;top:50px;writing-mode:vertical-rl;font:10px DM Mono;letter-spacing:.11em}
.experience-badge{position:absolute;bottom:29px;left:-45px;width:156px;height:156px;border-radius:50%;background:var(--acid);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transform:rotate(-12deg)}
.experience-badge strong{font:700 46px/1 Playfair Display}
.experience-badge span{font-size:10px;line-height:1.35}
.hero-index{position:absolute;bottom:28px;left:8vw;right:8vw;display:flex;justify-content:space-between;font:10px DM Mono;letter-spacing:.08em}
.statement{padding:150px 8vw;display:grid;grid-template-columns:1.2fr .8fr;gap:5vw}
.statement h2{grid-column:1;margin:25px 0}
.statement-side{align-self:end;padding-bottom:12px;font-size:16px}
.line{height:1px;background:var(--ink);margin:34px 0}
.projects{background:var(--ink);color:#f5f2e9;padding:120px 8vw}
.projects h2{margin:25px 0 58px}
.projects h2 em{color:var(--acid)}
.project-main{display:grid;grid-template-columns:1fr 1fr;min-height:500px;background:#d9ddcf;color:var(--ink);padding:45px}
.project-number{font:11px DM Mono;opacity:.65}
.project h3{font:700 42px/.95 Playfair Display;margin:45px 0 9px;letter-spacing:-.04em}
.project p:not(.project-number):not(.project-type){max-width:385px;font-size:14px;line-height:1.7}
.project-summary{margin-bottom:12px}
.project-scope{font-size:16px!important;line-height:1.55!important;opacity:.82}
.project-scope strong{font-family:DM Mono,monospace;font-size:1em;letter-spacing:.06em;text-transform:uppercase}
.project-type{font:11px DM Mono}
.tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:27px}
.tags span{border:1px solid #8d928a;padding:5px 9px;font:10px DM Mono}
.project-art{margin:-45px -45px -45px 20px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.art-pos{background:var(--rust)}
.art-pos>span{font:700 240px/.8 Playfair Display;color:#efad79}
.chart{position:absolute;inset:auto 35px 35px;display:flex;gap:8px;align-items:end;height:140px}
.chart i{width:20%;display:block;background:var(--acid)}
.chart i:nth-child(1){height:25%}
.chart i:nth-child(2){height:49%}
.chart i:nth-child(3){height:37%}
.chart i:nth-child(4){height:78%}
.chart i:nth-child(5){height:100%}
.project-art small{position:absolute;right:35px;top:35px;font:10px DM Mono}
.project-grid{display:grid;grid-template-columns:1fr 1fr}
.project-grid .project{padding:45px;border:1px solid #56605a;min-height:430px}
.project-grid .project.dark{background:#333b39}
.timeline{padding:140px 8vw}
.timeline h2{margin:24px 0 74px}
.timeline-list{border-top:1px solid #bdc2b9}
.timeline-list article{display:grid;grid-template-columns:150px 1fr 1.25fr;gap:20px;padding:30px 0;border-bottom:1px solid #bdc2b9}
.time{font:11px DM Mono}
.timeline h3{margin:0;font:700 24px/1 Playfair Display}
.timeline article p{margin:4px 0;font-size:12px}
.timeline .detail{line-height:1.65;color:#505955}
.skills{padding:120px 8vw;background:var(--acid)}
.skills-title{display:flex;justify-content:space-between;align-items:end}
.skills h2{margin:24px 0}
.skills-title>p{max-width:280px;font-size:14px}
.skill-groups{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #778a2a;margin-top:65px}
.skill-groups>div{padding:25px 24px 0 0;border-right:1px solid #778a2a}
.skill-groups>div+div{padding-left:24px}
.skill-label{font:10px DM Mono}
.skill-groups ul{padding:0;list-style:none;font:600 19px/2.05 Playfair Display}
.education{padding:95px 8vw;display:grid;grid-template-columns:1fr 2fr;gap:30px}
.education>div{display:grid;grid-template-columns:1fr 1fr;gap:25px}
.education article{border-top:2px solid;padding-top:18px}
.education span{font:10px DM Mono}
.education h3{font:700 23px/1.05 Playfair Display;margin:28px 0 12px}
.education p{font-size:12px}
.contact{padding:135px 8vw 100px;background:var(--rust);color:#fff0d9}
.contact h2{margin:25px 0 42px}
.contact h2 em{color:var(--acid)}
.contact-links{display:grid;gap:14px;max-width:max-content}
.contact-links a{font:600 clamp(25px,4vw,54px) Playfair Display;border-bottom:1px solid;display:inline-flex;justify-content:space-between;gap:38px}
.contact-channels{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.contact-channels a{border:1px solid #fff0d999;padding:9px 13px;font-size:16px}
.contact-note{margin:72px 0 0;font-size:12px;max-width:300px}
footer{background:var(--rust);color:#fff0d9;padding:20px 8vw;border-top:1px solid #df896a;display:flex;justify-content:space-between;font:9px DM Mono;letter-spacing:.06em}
.hero,.projects,.skills,.contact,footer{clip-path:inset(0 -100vmax)}
.hero{box-shadow:0 0 0 100vmax #d2d7d0}
.projects{box-shadow:0 0 0 100vmax var(--ink)}
.skills{box-shadow:0 0 0 100vmax var(--acid)}
.contact,footer{box-shadow:0 0 0 100vmax var(--rust)}
@media(max-width:700px){.nav{height:65px;padding:0 6vw}
.logo{gap:8px;font-size:23px}.logo-mark{width:39px;height:39px}
.nav nav,.availability{display:none}
.hero{padding:113px 7vw 70px;display:block;min-height:830px}
.hero h1{font-size:72px}
.portrait-wrap{width:72%;margin:45px auto 0}
.portrait-frame{height:355px}
.experience-badge{left:-35px;width:118px;height:118px}
.experience-badge strong{font-size:34px}
.hero-index{left:7vw;right:7vw}
.statement{padding:90px 7vw;display:block}
.statement h2,.section-heading h2,.timeline h2,.skills h2,.contact h2{font-size:50px}
.statement-side{margin-top:45px}
.projects,.timeline,.skills{padding:85px 7vw}
.project-main{display:block;padding:28px;min-height:0}
.project h3{margin:30px 0 10px}
.project-art{height:245px;margin:30px -28px -28px}
.project-grid{display:block}
.project-grid .project{padding:30px;min-height:0}
.timeline-list article{display:block;padding:25px 0}
.timeline h3{margin-top:15px}
.timeline .detail{margin-top:17px}
.skills-title{display:block}
.skill-groups{display:block;margin-top:40px}
.skill-groups>div,.skill-groups>div+div{padding:20px 0;border-right:0;border-bottom:1px solid #778a2a}
.skill-groups ul{font-size:18px}
.education{padding:70px 7vw;display:block}
.education>div{display:block;margin-top:34px}
.education article+article{margin-top:40px}
.contact{padding:90px 7vw 70px}
.contact-links a{font-size:28px}
footer{padding:18px 7vw;gap:12px;font-size:8px}
.vertical-note{right:-23px}
}
.eyebrow,.mono,nav,.availability,.button,.text-link,.vertical-note,.experience-badge span,.hero-index,.project-number,.project-type,.tags span,.project-art small,.time,.skill-label,.education span,footer{font-size:16px!important}
.project p:not(.project-number):not(.project-type),.timeline article p,.skills-title>p,.education p,.contact-note{font-size:16px!important}
@media(min-width:701px){
  .nav{padding-left:clamp(32px,3vw,48px);padding-right:clamp(32px,3vw,48px)}
  .hero,.statement,.projects,.timeline,.skills,.education,.contact,footer{padding-left:clamp(32px,3vw,48px);padding-right:clamp(32px,3vw,48px)}
  .hero-index{left:clamp(32px,3vw,48px);right:clamp(32px,3vw,48px)}
}

/* Polygon visual system — derived from the portrait mark */
body{background:#e7ece6;background-image:linear-gradient(125deg,#edf2eb 0%,#dfe7e0 48%,#eef1e8 100%)}
.hero{background:linear-gradient(132deg,#dce5dc 0%,#eef2e9 56%,#c8d6c9 100%)}
.hero:before{width:680px;height:680px;right:-155px;top:-255px;border-radius:0;clip-path:polygon(9% 0,100% 0,100% 79%,72% 100%,18% 85%,0 32%);background:linear-gradient(135deg,#c9ff29 0%,#e2ff6a 62%,#b6db4a 100%);transform:rotate(8deg)}
.portrait-wrap{width:min(435px,100%)}
.portrait-frame{height:520px;border-radius:0;clip-path:polygon(21% 0,76% 0,100% 17%,100% 82%,79% 100%,20% 100%,0 82%,0 21%);background:#12213a;box-shadow:18px 20px 0 #1e252420}
.portrait-frame img{object-fit:contain;object-position:center bottom;filter:none;background:linear-gradient(145deg,#9eafad,#ecf1e9)}
.portrait-wrap:before{content:"";position:absolute;z-index:-1;width:110px;height:110px;right:-42px;bottom:78px;background:#b8d3b8;clip-path:polygon(50% 0,100% 29%,82% 100%,18% 100%,0 29%)}
.vertical-note{right:-34px;top:58px;letter-spacing:.13em}
.experience-badge{border-radius:0;clip-path:polygon(50% 0,90% 18%,100% 62%,70% 100%,22% 93%,0 50%,20% 13%);background:linear-gradient(135deg,#d9ff43,#b9e83a);transform:rotate(-12deg)}
.button{clip-path:polygon(0 0,91% 0,100% 30%,100% 100%,9% 100%,0 70%)}
.statement{background:linear-gradient(110deg,#f4f1e9 0%,#e7eee4 72%,#d6e2d3 100%)}
.statement-side{position:relative}.statement-side:after{content:"";position:absolute;right:0;bottom:-32px;width:78px;height:78px;background:#c85d39;opacity:.9;clip-path:polygon(50% 0,100% 100%,0 84%)}
.project-main{clip-path:polygon(0 0,94% 0,100% 12%,100% 88%,94% 100%,6% 100%,0 88%)}
.project-grid .project{clip-path:polygon(0 0,94% 0,100% 11%,100% 100%,0 100%)}
.project-grid .project+ .project{clip-path:polygon(6% 0,100% 0,100% 100%,0 100%,0 11%)}
.art-pos{background:linear-gradient(145deg,#c85d39 0%,#a84238 100%)}
.skills{background:linear-gradient(135deg,#d9ff43 0%,#ccf451 57%,#b6df76 100%)}
.skill-groups>div{position:relative}.skill-groups>div:before{content:"";position:absolute;right:15px;top:16px;width:12px;height:12px;background:#1e2524;clip-path:polygon(50% 0,100% 100%,0 100%)}
.education article{padding:22px 20px 18px;background:#f9f5ed;clip-path:polygon(0 0,92% 0,100% 14%,100% 100%,8% 100%,0 86%)}
.contact{background:linear-gradient(135deg,#c85d39 0%,#ad4938 63%,#8e3b37 100%)}
@media(max-width:700px){.portrait-frame{height:390px}.portrait-wrap:before{right:-26px;bottom:45px;width:74px;height:74px}}

.poly-shards{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.poly-shards span{position:absolute;display:block;clip-path:polygon(50% 0,100% 100%,0 100%)}
.hero-shards span:nth-child(1){width:240px;height:220px;right:32%;top:28px;background:#7f9c96;opacity:.25;transform:rotate(18deg)}
.hero-shards span:nth-child(2){width:170px;height:160px;right:5%;bottom:35px;background:#c85d39;opacity:.23;transform:rotate(125deg)}
.hero-shards span:nth-child(3){width:115px;height:135px;left:42%;bottom:27px;background:#1e2524;opacity:.12;transform:rotate(-35deg)}
.hero-shards span:nth-child(4){width:80px;height:100px;left:6%;top:105px;background:#d9ff43;opacity:.45;transform:rotate(19deg)}
.projects,.skills{position:relative;overflow:hidden}
.projects>*:not(.poly-shards),.skills>*:not(.poly-shards){position:relative;z-index:1}
.project-shards span:nth-child(1){width:380px;height:340px;left:-110px;bottom:-120px;background:#d9ff43;opacity:.08;transform:rotate(12deg)}
.project-shards span:nth-child(2){width:240px;height:220px;right:-50px;top:40px;background:#c85d39;opacity:.20;transform:rotate(140deg)}
.project-shards span:nth-child(3){width:115px;height:150px;left:43%;top:105px;background:#9eb7a0;opacity:.2;transform:rotate(-25deg)}
.skill-shards span:nth-child(1){width:265px;height:260px;right:-68px;top:-55px;background:#1e2524;opacity:.11;transform:rotate(13deg)}
.skill-shards span:nth-child(2){width:180px;height:190px;left:43%;bottom:-86px;background:#c85d39;opacity:.18;transform:rotate(95deg)}
.skill-shards span:nth-child(3){width:95px;height:110px;left:8%;top:55px;background:#fff;opacity:.35;transform:rotate(-35deg)}
@media(max-width:700px){.hero-shards span:nth-child(1){width:150px;height:145px;right:2%;top:60px}.hero-shards span:nth-child(3){left:50%;bottom:40px}.project-shards span:nth-child(3),.skill-shards span:nth-child(3){display:none}}

