/* A short first read, with the implementation detail still one click away. */
.portfolio-intro h1{font-size:clamp(32px,3.7vw,48px);max-width:20ch;line-height:1.14}
.portfolio-intro .subtitle{max-width:64ch;line-height:1.7}
.intro-contact{color:var(--action);font-size:16px;font-weight:600;padding:10px 0}
.project-proof{border-left:2px solid #876640;padding-left:14px;font-size:14px!important;line-height:1.65!important;color:#cbc6be!important;margin:20px 0 0}
.project-brief{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:32px 0 8px;padding:24px 0;border-block:1px solid var(--line)}
.project-brief dt{font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--action);margin:0 0 8px}
.project-brief dd{font-size:15px;line-height:1.65;color:#d0ccc6;margin:0;overflow-wrap:anywhere}
.on-page{flex-wrap:wrap}
.narrative .story-lead{font-size:19px;line-height:1.75;color:var(--ink)}
.narrative h3{margin-top:30px;margin-bottom:12px;font-size:20px}
.narrative h3+p{margin-top:0}
.public-preview-note{padding:10px 24px;background:#292723;color:#e0d6c8;font:14px/1.6 "Segoe UI",Arial,sans-serif;border-bottom:1px solid #494139}
@media(max-width:1000px){.project-brief{grid-template-columns:1fr;gap:18px}}
@media(max-width:720px){.portfolio-page aside{display:none}.portfolio-intro{padding-bottom:12px}.intro-facts{margin-top:28px}.public-preview-note{padding:10px 20px;font-size:13px}.project-brief{margin-top:24px}.intro-actions{gap:12px}.intro-actions>a{font-size:14px}.project-proof{font-size:14px!important}}