/* The personal index: warm paper, clear destinations, and an editorial scale. */
.portfolio-page { --ink:#24332c; --muted:#586259; --red:#944b39; --stone:#d0d1c6; background:#f4f1ea; }
.portfolio { padding-bottom:0; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.editorial-container { width:min(1240px,calc(100% - 80px)); margin-inline:auto; }
.eyebrow { display:flex; align-items:center; gap:13px; color:var(--muted); font:400 .7rem/1.5 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.eyebrow .dot { width:6px; height:6px; border-radius:50%; background:var(--red); flex-shrink:0; }
.editorial-hero { display:grid; grid-template-columns:minmax(0,1fr) 310px; column-gap:110px; align-items:start; padding-top:54px; padding-bottom:55px; }
.hero-copy { padding-top:5px; }
.editorial-hero h1 { margin:30px 0 25px; font:400 clamp(4.6rem,7.4vw,7rem)/.94 var(--serif); letter-spacing:-.065em; }
.editorial-hero h1 span { display:block; }
.editorial-hero h1 .accent-line { color:var(--red); font-style:italic; }
.hero-description { max-width:440px; margin-top:30px; color:var(--muted); font-size:1rem; line-height:1.8; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:26px; flex-wrap:wrap; }
.editorial-button { min-height:48px; display:inline-flex; justify-content:space-between; align-items:center; gap:35px; padding:0 20px; background:var(--ink); color:var(--paper); font:500 .72rem var(--mono); letter-spacing:.06em; text-transform:uppercase; transition:background .2s; }
.editorial-button:hover { background:var(--red); color:var(--paper); }
.inline-link { display:inline-flex; align-items:center; justify-content:space-between; gap:20px; min-height:44px; border-bottom:1px solid currentColor; font-size:.85rem; font-weight:500; }
.arrow { display:inline-block; font-family:var(--sans); font-weight:400; transition:transform .25s ease; }
a:hover .arrow { transform:translate(3px,-3px); }
.down-arrow { font-size:1rem; }
a:hover .down-arrow { transform:translateY(3px); }
.portrait-note { margin:0; padding-top:2px; }
.portrait-frame { position:relative; padding:11px; border:1px solid var(--stone); }
.portrait-frame::after { content:""; position:absolute; width:37px; height:37px; right:-1px; bottom:-1px; border-right:2px solid var(--red); border-bottom:2px solid var(--red); }
.portrait-frame img { display:block; width:100%; aspect-ratio:4/5; height:auto; object-fit:cover; filter:grayscale(1); }
.portrait-note figcaption { display:grid; grid-template-columns:1fr auto; gap:10px; margin-top:18px; }
.portrait-name { font:500 1.65rem/1.05 var(--serif); letter-spacing:-.035em; }
.portrait-role { display:block; color:var(--muted); font-size:.75rem; line-height:1.65; margin-top:7px; }
.portrait-license { display:block; color:var(--ink); font:400 .68rem/1.8 var(--mono); }
.portrait-research { display:block; margin-top:7px; }
.hero-copy > h1:first-child { margin-top:0; }
.portrait-location { font:400 .57rem/1.7 var(--mono); text-align:right; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); padding-top:3px; }
.catalog-section { padding-top:82px; padding-bottom:76px; scroll-margin-top:10px; }
.editorial-hero + .catalog-section { border-top:1px solid var(--ink); padding-top:42px; }
.catalog-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:50px; margin-bottom:32px; }
.catalog-heading h2,.catalog-heading h1 { margin:19px 0 0; font:400 clamp(2.7rem,4.7vw,4.4rem)/.98 var(--serif); letter-spacing:-.055em; }
.catalog-heading h2 em,.catalog-heading h1 em { font-weight:400; color:var(--red); }
.catalog-heading > p { max-width:290px; margin:0 0 4px; color:var(--muted); font-size:.96rem; line-height:1.75; }
.catalog-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:15px 24px; padding:17px 0; border-top:1px solid var(--stone); }
.catalog-filters { display:flex; flex-wrap:wrap; gap:6px; }
.catalog-filters button { appearance:none; cursor:pointer; background:transparent; color:var(--muted); padding:0 14px; min-height:42px; font:500 .8rem var(--sans); border:1px solid transparent; border-radius:0; transition:color .2s,background .2s; }
.catalog-filters button span { margin-left:6px; font:.53rem var(--mono); opacity:.7; }
.catalog-filters button:hover { color:var(--ink); background:#e6e5dc; }
.catalog-filters button[aria-pressed="true"] { color:var(--paper); background:var(--ink); }
.catalog-status { color:var(--muted); font:.68rem/1.6 var(--mono); letter-spacing:.04em; }
.project-list { border-top:1px solid var(--ink); }
.project-row { display:grid; grid-template-columns:24px 272px minmax(0,1fr) 110px; gap:28px; align-items:center; padding:29px 0; border-bottom:1px solid var(--stone); transition:background .25s; }
.project-row:hover { color:var(--ink); }
.project-number { align-self:start; padding-top:4px; color:var(--muted); font:.61rem var(--mono); }
.project-art { position:relative; height:180px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.project-art::after { content:""; position:absolute; inset:0; border:1px solid rgba(36,51,44,.08); pointer-events:none; }
.project-art > .art-inner { transition:transform .3s ease; }
.project-row:hover .art-inner { transform:scale(1.025); }
.art-mortgage { background:#e8e0cc; }
.art-mortgage img { width:150px; height:100px; object-fit:contain; mix-blend-mode:multiply; }
.art-build { background:#1e2924; }
.art-build .art-inner { position:relative; display:block; width:auto; height:74%; max-width:76%; object-fit:contain; }
.art-brief { background:#e9ded0; color:#884831; }
.art-brief .art-inner { width:158px; padding:10px 0 13px; border-top:2px solid; border-bottom:1px solid; text-align:center; }
.art-brief small { font:.43rem var(--mono); letter-spacing:.12em; }
.art-brief strong { display:block; font:500 3.15rem/1 var(--serif); letter-spacing:-.075em; padding-top:10px; }
.art-astrava { background:#102825; color:#f4f1ea; }
.art-astrava img { position:absolute; width:100%; height:100%; object-fit:cover; opacity:.55; }
.art-astrava .art-inner { position:relative; font:400 1.8rem/1 var(--serif); letter-spacing:-.04em; }
.art-mrpi { color:#eee8d7; background:#3b4d43; }
.art-mrpi::before,.art-mrpi::after { content:""; position:absolute; border:1px solid #849583; border-radius:50%; width:200px; height:200px; top:43px; left:50%; transform:translateX(-50%); }
.art-mrpi::after { width:260px; height:260px; top:14px; }
.art-mrpi .art-inner { position:relative; z-index:1; text-align:center; padding-bottom:7px; }
.art-mrpi strong { display:block; font:400 2.65rem/1 var(--serif); letter-spacing:.035em; }
.art-mrpi small { display:block; font:.47rem var(--mono); text-transform:uppercase; margin-top:12px; letter-spacing:.14em; }
.project-category { color:var(--red); font:.68rem var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.project-copy h3,.project-copy h2 { margin:11px 0 10px; font:500 clamp(1.7rem,2.5vw,2.35rem)/1.03 var(--serif); letter-spacing:-.045em; }
.project-copy > p:not(.project-category) { max-width:470px; color:var(--muted); font-size:1rem; line-height:1.7; }
.project-skills { display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:14px; color:var(--muted); font:.66rem var(--mono); }
.project-skills span { border-bottom:1px solid var(--stone); padding-bottom:3px; }
.project-destination { display:flex; flex-direction:column; align-items:flex-end; gap:17px; color:var(--ink); }
.project-destination .arrow { display:grid; place-items:center; width:40px; height:40px; border:1px solid #c1c6bc; border-radius:50%; font-size:1.05rem; transition:transform .25s,background .25s,color .25s; }
.project-destination svg.arrow { padding:9px; }
.catalog-footnote svg.arrow { width:13px; height:13px; margin-right:3px; }
.project-row:hover .project-destination .arrow { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.project-destination small { font:500 .67rem var(--mono); text-align:right; line-height:1.5; }
.catalog-footnote { margin-top:18px; color:var(--muted); font:.75rem/1.75 var(--sans); }
.profile-section { background:#eae7de; border-top:1px solid var(--stone); border-bottom:1px solid var(--stone); }
.profile-content { display:grid; grid-template-columns:1fr 1fr; gap:130px; padding-block:62px; }
.profile-content h2 { margin:21px 0 0; max-width:520px; font:400 clamp(2.25rem,3.8vw,3.45rem)/1.07 var(--serif); letter-spacing:-.04em; }
.profile-body { padding-top:8px; }
.profile-body p { color:var(--muted); font-size:1rem; line-height:1.85; }
.profile-body p+p { margin-top:14px; }
.profile-body .inline-link { margin-top:16px; }
.contact-band { background:var(--ink); color:var(--paper); }
.contact-band-inner { display:grid; grid-template-columns:1fr auto; align-items:center; gap:45px; padding-block:58px; }
.contact-band h2 { margin-top:15px; font:400 clamp(2.8rem,4.8vw,4.6rem)/1.03 var(--serif); letter-spacing:-.045em; }
.contact-band .eyebrow,.contact-band p:not(.eyebrow) { color:#d5dbd2; }
.contact-band p:not(.eyebrow) { margin-top:17px; font-size:1rem; line-height:1.75; }
.contact-band .editorial-button { min-width:195px; background:var(--paper); color:var(--ink); }
.contact-band .editorial-button:hover { background:#ded9cc; }
.contact-band .program-link { margin-top:17px; color:#e5e7dd; font-size:.85rem; }
.contact-band :focus-visible { outline-color:var(--paper); }
.portfolio-footer { border-top:1px solid var(--stone); margin:0; padding:28px 0 26px; }
.footer-top { display:flex; justify-content:space-between; gap:30px; margin-bottom:28px; }
.footer-signature { font:500 1.5rem var(--serif); letter-spacing:-.055em; }
.footer-top nav { gap:23px; flex-wrap:wrap; }
.footer-top nav a { display:flex; align-items:center; min-height:44px; font:400 .75rem var(--sans); text-transform:none; letter-spacing:0; }
.footer-bottom { display:grid; grid-template-columns:1fr 1.3fr; gap:60px; color:var(--muted); }
.footer-bottom .footer-location { font:.65rem/1.8 var(--mono); text-transform:uppercase; letter-spacing:.05em; }
.footer-bottom p { font:.76rem/1.8 var(--sans); }
.footer-bottom p+p { margin-top:10px; }
.footer-bottom a { text-decoration:underline; text-underline-offset:3px; }
.work-page-intro { padding-top:66px; }
.work-page-intro .catalog-heading { margin-bottom:42px; }
.work-page-intro .catalog-heading h1 { font-size:clamp(3.2rem,6vw,5.8rem); }
.work-page-intro .catalog-heading > p { max-width:350px; font-size:.95rem; }
.will-reveal { opacity:0; transform:translateY(8px); transition:opacity .24s ease,transform .24s ease; }
.will-reveal.is-visible { opacity:1; transform:translateY(0); }
@media(min-width:1600px) { .editorial-hero { padding-top:70px; padding-bottom:72px; } }
@media(max-width:1100px) {
  .editorial-hero { grid-template-columns:minmax(0,1fr) 275px; gap:60px; }
  .editorial-hero h1 { font-size:clamp(4.3rem,8vw,6.5rem); }
  .project-row { grid-template-columns:20px 220px minmax(0,1fr) 72px; gap:24px; }
  .project-art { height:154px; }
  .profile-content { gap:65px; }
}
@media(max-width:850px) {
  .editorial-container { width:calc(100% - 48px); }
  .editorial-hero { grid-template-columns:minmax(0,1fr) 240px; gap:35px; }
  .editorial-hero h1 { font-size:clamp(4rem,8.3vw,5.5rem); }
  .portrait-note { padding-top:31px; }
  .portrait-location { display:none; }
  .project-row { grid-template-columns:18px 170px minmax(0,1fr) 40px; gap:19px; }
  .project-destination small { display:none; }
  .project-copy h3,.project-copy h2 { font-size:1.85rem; }
  .project-art { height:124px; }
  .art-astrava .art-inner { font-size:1.45rem; }
  .art-brief .art-inner { width:116px; }
  .art-brief small { font-size:.35rem; }
  .profile-content { gap:45px; }
}
@media(max-width:620px) {
  .editorial-container { width:calc(100% - 40px); }
  .editorial-hero { display:block; padding:35px 0 31px; }
  .eyebrow { font-size:.65rem; letter-spacing:.09em; }
  .editorial-hero h1 { font-size:clamp(3.7rem,15.5vw,5.4rem); margin:25px 0 20px; }
  .hero-description { max-width:380px; font-size:.98rem; margin-top:24px; }
  .hero-actions { gap:25px; margin-top:21px; }
  .editorial-button { padding-inline:16px; min-height:48px; font-size:.7rem; gap:24px; }
  .inline-link { font-size:.85rem; }
  .portrait-note { display:flex; gap:18px; align-items:center; padding-top:32px; }
  .portrait-frame { width:76px; padding:4px; flex-shrink:0; }
  .portrait-frame img { aspect-ratio:1; object-position:center 20%; }
  .portrait-frame::after { width:17px; height:17px; }
  .portrait-note figcaption { display:block; margin:0; }
  .portrait-name { font-size:1.35rem; }
  .portrait-role { font-size:.7rem; margin-top:5px; }
  .portrait-location { display:none; }
  .catalog-section { padding-top:49px; padding-bottom:48px; }
  .editorial-hero + .catalog-section { padding-top:30px; }
  .catalog-heading { display:block; margin-bottom:22px; }
  .catalog-heading h2 { font-size:2.65rem; margin-top:15px; }
  .catalog-heading > p { max-width:330px; margin-top:19px; font-size:.95rem; }
  .catalog-toolbar { gap:12px; padding-block:14px; }
  .catalog-filters { gap:3px; width:100%; }
  .catalog-filters button { flex:1; font-size:.65rem; padding-inline:8px; min-height:44px; }
  .catalog-filters button span { display:none; }
  .catalog-status { font-size:.66rem; }
  .project-row { position:relative; grid-template-columns:86px minmax(0,1fr) 25px; gap:14px; padding-block:25px; align-items:start; }
  .project-number { display:none; }
  .project-art { height:90px; margin-top:2px; }
  .project-art img { max-width:100%; }
  .art-mortgage img { width:75px; height:50px; }
  .art-brief .art-inner { width:66px; padding:7px 0; }
  .art-brief small { font-size:.3rem; letter-spacing:0; }
  .art-brief strong { font-size:1.75rem; padding-top:5px; }
  .art-astrava .art-inner { font-size:.85rem; letter-spacing:-.07em; }
  .art-mrpi strong { font-size:1.4rem; }
  .art-mrpi small { font-size:.31rem; margin-top:7px; letter-spacing:.07em; }
  .art-mrpi::before { width:110px; height:110px; top:42px; }
  .art-mrpi::after { width:145px; height:145px; top:24px; }
  .project-category { font-size:.47rem; line-height:1.5; letter-spacing:.035em; }
  .project-copy h3,.project-copy h2 { font-size:1.6rem; margin-top:7px; margin-bottom:10px; }
  .project-copy > p:not(.project-category) { font-size:.79rem; line-height:1.65; }
  .project-skills { font-size:.46rem; gap:5px 10px; margin-top:10px; }
  .project-destination { padding-top:29px; }
  .project-destination .arrow { width:25px; height:25px; border:0; font-size:1.1rem; }
  .catalog-footnote { font-size:.54rem; }
  .profile-content { grid-template-columns:1fr; gap:23px; padding-block:42px; }
  .profile-content h2 { font-size:2.4rem; margin-top:15px; }
  .profile-body { padding:0; }
  .profile-body p { font-size:.95rem; }
  .contact-band-inner { grid-template-columns:1fr; gap:28px; padding-block:42px; }
  .contact-band h2 { font-size:3.3rem; }
  .contact-band .editorial-button { justify-self:start; }
  .footer-top { gap:20px; flex-direction:column; margin-bottom:18px; }
  .footer-top nav { gap:22px; }
  .footer-bottom { grid-template-columns:1fr; gap:16px; }
  .work-page-intro { padding-top:40px; }
  .work-page-intro .catalog-heading h1 { font-size:3.1rem; }
  .work-page-intro .catalog-heading > p { font-size:.83rem; }
}
@media(max-width:360px) {
  .editorial-hero h1 { font-size:3.5rem; }
  .project-row { grid-template-columns:65px minmax(0,1fr) 20px; gap:11px; }
  .project-art { height:74px; }
  .project-copy h3,.project-copy h2 { font-size:1.45rem; }
  .hero-actions { gap:18px; }
}
@media(prefers-reduced-motion:reduce) {
  .will-reveal { opacity:1; transform:none; }
  a:hover .arrow,.project-row:hover .art-inner { transform:none; }
}
/* On phones the description spans the card, keeping the reading column generous. */
@media(max-width:620px) {
  .catalog-filters button { font-size:.72rem; min-height:46px; }
  .project-row { grid-template-columns:78px minmax(0,1fr) 32px; gap:6px 14px; padding-block:26px; }
  .project-copy { display:contents; }
  .project-art { grid-column:1; grid-row:1 / 3; width:78px; height:82px; align-self:center; margin:0; }
  .project-category { grid-column:2; grid-row:1; align-self:end; padding-bottom:3px; font-size:.52rem; line-height:1.6; }
  .project-copy h3,.project-copy h2 { grid-column:2; grid-row:2; align-self:start; margin:0; font-size:1.55rem; line-height:1.08; }
  .project-copy > p:not(.project-category) { grid-column:1 / -1; grid-row:3; max-width:none; margin-top:10px; font-size:1rem; line-height:1.7; }
  .project-skills { grid-column:1 / -1; grid-row:4; margin-top:8px; font-size:.57rem; gap:8px 17px; }
  .project-destination { grid-column:3; grid-row:1 / 3; align-self:center; padding:0; }
  .project-destination svg.arrow { width:32px; height:32px; padding:6px; border:1px solid #c1c6bc; }
  .catalog-footnote { font:400 .65rem/1.8 var(--sans); }
}
@media(max-width:360px) {
  .project-row { grid-template-columns:62px minmax(0,1fr) 28px; column-gap:11px; }
  .project-art { width:62px; height:74px; }
  .project-copy h3,.project-copy h2 { font-size:1.4rem; }
  .project-destination svg.arrow { width:28px; height:28px; padding:5px; }
}
@media(hover:none) {
  a:hover .arrow,.project-row:hover .art-inner { transform:none; }
}

/* Actual project previews, framed with each project's identity. */
.portfolio-page .site-header nav a { font-size:.72rem; }
.project-preview { display:block; background:#101719; }
.project-preview .preview-image { width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform .3s ease; }
.preview-caption { position:absolute; inset:auto 0 0; display:flex; align-items:center; gap:9px; padding:9px 11px; background:#1e2924; color:#f4f1ea; font:500 .86rem/1.2 var(--serif); }
.preview-caption img { width:17px; height:23px; object-fit:contain; flex-shrink:0; }
.preview-caption small { margin-left:auto; font:400 .5rem/1.4 var(--mono); text-align:right; }
.preview-mrpi .preview-image { object-fit:contain; object-position:center 15%; height:calc(100% - 32px); }
.preview-brief { background:#fff; }
.preview-brief .preview-image { object-fit:contain; height:calc(100% - 32px); }
.preview-brief .preview-caption { background:#ede8dc; color:var(--ink); }
.preview-astrava { background:#0c0e10; }
.preview-astrava .preview-image { object-fit:contain; height:calc(100% - 32px); }
@media(hover:hover) {
  .project-row:hover .preview-image { transform:scale(1.025); }
}
@media(max-width:620px) {
  .project-row { grid-template-columns:minmax(0,1fr) 36px; gap:8px 18px; padding-block:25px; }
  .project-art { grid-column:1 / -1; grid-row:1; width:100%; height:170px; margin-bottom:12px; }
  .project-art.art-mortgage img { width:175px; height:110px; }
  .project-art.art-astrava .art-inner { font-size:2rem; letter-spacing:-.04em; }
  .project-category { grid-column:1; grid-row:2; font-size:.66rem; padding:0; }
  .project-copy h3,.project-copy h2 { grid-column:1; grid-row:3; font-size:1.85rem; }
  .project-copy > p:not(.project-category) { grid-row:4; font-size:.98rem; margin-top:4px; }
  .project-skills { grid-row:5; font-size:.66rem; }
  .project-destination { grid-column:2; grid-row:2 / 4; }
  .project-destination svg.arrow { width:36px; height:36px; padding:8px; }
  .preview-caption { padding:10px 12px; font-size:1rem; }
  .preview-caption small { font-size:.57rem; }
  .catalog-footnote { font-size:.75rem; }
}
@media(prefers-reduced-motion:reduce) {
  .project-row:hover .preview-image { transform:none; }
}
