.portfolio-home{--paper:#faf9f6;--ink:#252624;--muted:#70726c;--line:#dedfd8;--green:#404d43;background:var(--paper);color:var(--ink)}
.portfolio-home .shell{width:min(1120px,calc(100% - 80px))}
.portfolio-home .site-header{position:static;background:transparent;border:0}
.portfolio-home .nav-wrap{height:104px;gap:28px;border-bottom:1px solid var(--line)}
.portfolio-home .wordmark{font-size:25px;letter-spacing:-1.2px}
.portfolio-home .wordmark span{font-size:16px;letter-spacing:-.5px;color:var(--muted)}
.portfolio-home .nav-links{font-size:13px;gap:30px}
.portfolio-home .language{font-size:12px;padding-left:24px}
.portfolio-intro{padding:76px 0 78px;display:grid;grid-template-columns:1fr 370px;gap:52px;align-items:end}
.portfolio-kicker{margin:0 0 18px;font-size:12px;letter-spacing:.04em;color:var(--muted)}
.portfolio-intro h1{font-size:clamp(38px,4.7vw,62px);line-height:1.22;letter-spacing:-.045em;font-weight:600;margin:0}
.portfolio-intro h1 span{color:#8c917d}
.portfolio-intro-copy p{font-size:15px;line-height:1.9;margin:0;color:#62665e;max-width:370px;text-wrap:pretty}
.portfolio-intro-copy a{display:inline-flex;align-items:center;gap:12px;margin-top:18px;font-size:12px;text-decoration:none}
.portfolio-intro-copy a:hover{text-decoration:underline}
.portfolio-section-heading{padding:23px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px}
.portfolio-section-heading h2{display:flex;align-items:baseline;gap:16px;font-size:15px;letter-spacing:0;font-weight:550;margin:0}
.portfolio-section-heading h2 span{font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:400}
.portfolio-section-heading>span{color:var(--muted);font-size:10px;letter-spacing:.11em}
.portfolio-home .work{display:block;min-height:0;margin:0;border:0;border-radius:0;background:none;overflow:visible}
.portfolio-home .work-link{color:inherit;text-decoration:none}
.portfolio-home .work-link:focus-visible{outline-offset:8px;border-radius:10px}
.project-visual{padding:36px;background:#e9e8e1;border:1px solid #e4e3dc;border-radius:12px;overflow:hidden;transition:background .2s ease}
.project-window{display:block;width:100%;height:auto;border:1px solid #d7d7d0;border-radius:7px;box-shadow:0 12px 28px #20271e12;transition:transform .25s ease,box-shadow .25s ease}
.portfolio-home .work-link:hover .project-visual{background:#e3e3d8}
.portfolio-home .work-link:hover .project-window{transform:translateY(-3px);box-shadow:0 17px 35px #20271e1c}
.project-details{display:grid;grid-template-columns:1fr 1.05fr 44px;gap:30px;align-items:start;padding:25px 0 0}
.project-name{display:flex;align-items:center;gap:13px}
.project-name img{width:35px;height:35px;border-radius:9px;flex-shrink:0}
.portfolio-home .project-name h3{font-size:24px;font-weight:560;margin:0;letter-spacing:-.025em;line-height:1.35}
.project-name small{display:block;margin-top:5px;font-size:11px;color:var(--muted)}
.portfolio-home .project-description p{font-size:14px;line-height:1.85;max-width:430px;color:#62665e;margin:0}
.project-description .project-url{display:inline-block;font-size:11px;margin-top:11px;color:var(--muted);border-bottom:1px solid transparent;padding-bottom:2px}
.portfolio-home .work-link:hover .project-url{border-color:var(--muted)}
.project-arrow{font-size:29px;line-height:1.2;color:#565e50;font-weight:300;text-align:right}
.portfolio-about{margin-top:83px;padding:30px 0 58px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.05fr;gap:70px}
.portfolio-about h2{font-size:15px;letter-spacing:0;font-weight:550;margin:0}
.portfolio-about h2 span{display:inline-block;font-size:10px;color:var(--muted);font-weight:400;margin-right:16px}
.portfolio-about p{font-size:14px;line-height:1.95;margin:0;color:#62665e;text-wrap:pretty}
.portfolio-home .site-footer{padding:15px 0 25px;border:0}
.portfolio-home .site-footer>.shell{padding-top:17px;border-top:1px solid var(--line)}
.portfolio-home .footer-row{font-size:11px;color:var(--muted)}
.portfolio-home .footer-note{display:none}
@media(max-width:850px){.portfolio-intro{grid-template-columns:1fr 310px;gap:32px;padding:58px 0 62px}.portfolio-intro h1{font-size:43px}.project-visual{padding:24px}.project-details{grid-template-columns:1fr 1.1fr 30px;gap:22px}.portfolio-about{gap:40px}}
@media(max-width:600px){.portfolio-home .shell{width:calc(100% - 40px)}.portfolio-home .nav-wrap{height:78px;gap:16px}.portfolio-home .wordmark{font-size:23px}.portfolio-home .wordmark span{font-size:14px}.portfolio-home .nav-links{gap:20px;font-size:12px}.portfolio-home .nav-links .nav-about{display:inline}.portfolio-home .language{padding-left:16px;font-size:11px}.portfolio-intro{display:block;padding:48px 0 43px}.portfolio-kicker{font-size:11px;margin-bottom:18px}.portfolio-intro h1{font-size:38px}.portfolio-intro-copy{margin-top:26px}.portfolio-intro-copy p{font-size:14px;max-width:320px}.portfolio-intro-copy a{margin-top:13px}.portfolio-section-heading{padding:19px 0}.portfolio-section-heading h2{font-size:14px;gap:13px}.portfolio-section-heading>span{font-size:9px}.project-visual{padding:13px;border-radius:9px}.project-window{border-radius:4px;box-shadow:0 5px 12px #20271e12}.project-details{grid-template-columns:1fr 30px;gap:18px;padding-top:20px}.project-name{grid-column:1;gap:11px}.portfolio-home .project-name h3{font-size:23px}.project-name small{font-size:10px}.project-description{grid-column:1;grid-row:2}.portfolio-home .project-description p{font-size:13px;max-width:310px}.project-arrow{grid-column:2;grid-row:1;font-size:27px}.project-description .project-url{margin-top:8px}.portfolio-about{display:block;margin-top:48px;padding:22px 0 35px}.portfolio-about h2{font-size:14px;margin-bottom:19px}.portfolio-about h2 span{margin-right:13px}.portfolio-about p{font-size:13px}.portfolio-home .site-footer{padding:0 0 20px}.portfolio-home .footer-row{gap:9px 20px}.portfolio-home .footer-links{gap:20px}}
@media(prefers-reduced-motion:reduce){.project-window,.project-visual{transition:none!important}.portfolio-home .work-link:hover .project-window{transform:none}}
