/* v0.104: two paths through one personal site. Reuse the existing green palette. */
.home-paths{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:25px 0 0}
.home-intro .home-paths>a,.home-intro .home-paths>a:last-child{padding:15px 0;border:0;border-block:1px solid var(--line);border-radius:0;min-width:0;background:none}
.home-paths strong{display:flex;justify-content:space-between;gap:8px;font-size:16px;font-weight:650;color:var(--ink)}
.home-paths a>span{display:block;margin-top:7px;font-size:12px;line-height:1.7;color:var(--muted)}
.home-paths a:hover strong{color:var(--accent)}
.home-paths a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.home-profile .profile-links{margin-top:18px}
.home-capabilities .practice-links .project-role{font-size:13px;line-height:1.85;margin-top:7px}
.home-capabilities .practice-links .practice-title{font-size:18px;line-height:1.6}
.home-capabilities .practice-links .project-purpose{font-size:12px;line-height:1.8}
.home-capabilities .practice-links .project-proof{display:block;font-size:12px;line-height:1.7;color:var(--accent);margin-top:7px}
.home-capabilities .practice-links>a{padding:12px 0}
.home-capabilities .career-summary-result{font-size:12px;line-height:1.85}
.home-profile .portrait-layer{display:none}
.notebook-filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}
.notebook-filters button{background:transparent;border:1px solid var(--line);padding:9px 16px;font-size:13px;border-radius:3px;color:var(--ink)}
.notebook-filters button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:white}
.notebook-filters button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
#works .section-heading{margin-bottom:20px}
#works nav.aigc-section-nav{margin-bottom:22px}
#works .works-expertise{margin:36px 0 0;padding:24px 0;border-top:1px solid var(--line)}
@media(min-width:761px){
 .home-profile{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:7%;padding:30px 6%;align-items:center;overflow:visible}
 .home-profile .home-intro{width:100%;max-width:none}
 .home-profile .home-capabilities{position:relative;inset:auto;width:100%;padding-top:0}
 .home-profile h1{font-size:clamp(76px,8vw,112px)}
 .home-profile .home-bio{margin-top:20px}
 .home-profile .personal-bio p{font-size:14px;line-height:1.9}
}
@media(max-width:760px){
 .home-paths{gap:16px;margin-top:22px}
 .home-paths strong{font-size:15px}
 .home-paths a>span{font-size:12px}
 .home-capabilities .practice-links .practice-title{font-size:17px}
 .home-capabilities .practice-links>a{padding:18px 0}
 .home-profile .home-capabilities{width:100%;position:relative;inset:auto}
 #works nav.aigc-section-nav>a{padding:13px 14px!important}
}

/* v0.106: personal keywords, with the existing green editorial language. */
.personal-keywords{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:18px 0 0}
.personal-keywords li{padding:5px 10px;background:#e5eddd;color:var(--ink);font-size:12px;font-weight:600;line-height:1.5;letter-spacing:.02em}
.personal-keywords li:first-child{background:var(--accent);color:#fff}
.about-copy .keyword-principles{gap:19px}
.keyword-principles section{display:grid;grid-template-columns:116px minmax(0,1fr);gap:0 16px;align-items:start}
.keyword-principles h3{margin:0;font-size:14px;line-height:1.9}
.keyword-principles h3 span{padding:3px 7px;background:#e5eddd;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.keyword-principles .text-link{grid-column:2;font-size:12px;justify-self:start;margin-top:8px}
@media(max-width:760px){
 .personal-keywords{gap:7px;margin-top:16px}
 .personal-keywords li{font-size:12px;padding:5px 8px}
 .keyword-principles section{grid-template-columns:100px minmax(0,1fr);gap:0 10px}
}

/* v0.107: explain product names at the project entry. */
.project-info h3 .project-name-explanation{font-size:.57em;font-weight:500;line-height:1.7;letter-spacing:0;color:var(--ink)}
.project-info h3.explained-project-name{display:block;position:relative;padding-right:28px}
.project-info h3.explained-project-name>span{position:absolute;right:0;top:0}

/* v0.108: consistent title highlighting across project cards. */
.project-info h3.highlighted-project-name{display:flex;align-items:center;gap:14px;margin:10px 0 12px}
.project-title-highlight{display:block;min-width:0;width:fit-content;background:#e5eddd;color:var(--ink);padding:5px 10px;border-radius:4px;font:inherit;line-height:1.55}
.highlighted-project-name>span{flex:none}

/* v0.109: work projects lead; personal experiments have their own space. */
#projects .project-group-heading{display:flex;justify-content:space-between;align-items:baseline;gap:18px;margin:0 0 20px;padding-bottom:14px;border-bottom:1px solid var(--line)}
#projects .project-group-heading h3{font-size:22px;font-weight:600;line-height:1.6}
#projects .project-group-heading h3 small{font-size:14px;font-weight:400;color:var(--muted)}
#projects .project-group-heading p{font-size:13px;line-height:1.8;color:var(--muted)}
#projects .personal-project-group{margin-top:52px}
#projects .personal-project-group .project-group-heading p{margin-top:6px}
#projects .personal-project-card{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;width:100%;text-align:left}
#projects .personal-project-card .project-visual{height:230px;margin:0}
#projects .personal-project-card .project-info{padding:24px 30px}
#projects .personal-project-card .card-footer{margin-top:20px}
@media(min-width:761px){
 #projects .work-project-grid>[data-detail="yogurt"]{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:center}
 #projects .work-project-grid>[data-detail="yogurt"] .project-visual{height:260px}
}
@media(max-width:760px){
 #projects .project-group-heading{align-items:start;flex-direction:column;gap:5px}
 #projects .project-group-heading h3{font-size:20px}
 #projects .personal-project-group{margin-top:36px}
 #projects .personal-project-card{grid-template-columns:1fr}
 #projects .personal-project-card .project-visual{height:190px}
 #projects .personal-project-card .project-info{padding:20px}
}
@media(max-width:760px){#projects .project-name-explanation{display:block}}

/* v0.110: equal visual weight for the two product covers. */
#projects .notv-visual,#projects .studio-visual{background:var(--lilac);color:var(--ink)}
#projects .notv-visual .mini-flow{color:#fff}

/* v0.111: explain the problem, contribution and input/process/output. */
.project-info .project-contribution{font-size:13px;line-height:1.85;margin-top:12px;color:var(--muted)}
.project-contribution b{color:var(--accent);margin-right:7px;font-weight:600}
.project-info h3 .project-name-explanation{display:block;font-size:15px}
.case-walkthrough,.product-version-context{margin:28px 0;padding-top:24px;border-top:1px solid var(--line)}
.case-walkthrough>h3,.product-version-context>h3{font-size:20px;margin-bottom:10px}
.case-walkthrough ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;list-style:none;padding:0;margin:18px 0 0}
.case-walkthrough li{background:var(--lilac);padding:18px;border-radius:8px}
.case-walkthrough h4{font-size:15px;line-height:1.7;margin:0 0 10px}
.case-walkthrough li p{font-size:13px;line-height:1.85}
.case-walkthrough .walkthrough-role{border-top:1px solid var(--line);padding-top:12px;margin-top:14px}
.walkthrough-role strong{display:block;color:var(--accent);margin-bottom:4px}
.product-version-context>p{font-size:14px;line-height:1.9;color:var(--muted)}
.product-version-context figure{margin:16px 0 0}
.product-version-context img{display:block;width:100%;border:1px solid var(--line);border-radius:8px}
.product-version-context figcaption{font-size:12px;color:var(--muted);margin-top:8px}
@media(max-width:760px){.case-walkthrough ol{grid-template-columns:1fr}.project-info h3 .project-name-explanation{font-size:13px}}
