/* Portfolio shares the site's Inter typography, indigo palette and shell. */
.work-hero { padding:80px 0 76px; background:var(--paper); border-bottom:1px solid var(--line); }
.work-hero-grid { display:grid; grid-template-columns:1.6fr 1fr; align-items:center; gap:90px; }
.work-hero .eyebrow { color:var(--brand); margin-bottom:26px; }
.work-hero h1 { font-size:clamp(48px,5.3vw,76px); line-height:1.03; letter-spacing:-.055em; font-weight:600; margin:0; }
.work-hero h1 em { color:var(--brand); font-style:normal; }
.work-hero-description { max-width:560px; margin:25px 0 28px; font-size:17px; line-height:1.8; color:var(--muted); }
.work-text-link { display:inline-flex; align-items:center; gap:28px; font-size:13px; font-weight:600; color:var(--brand); padding:10px 0; border-bottom:1px solid currentColor; }
.work-text-link:hover { color:#414499; }
.work-hero-aside { border-left:1px solid #cdd0e2; padding:10px 0 10px 42px; }
.work-hero-number { display:flex; align-items:center; gap:24px; font-size:100px; font-weight:500; line-height:1; letter-spacing:-.08em; color:var(--brand); }
.work-hero-number>span { font-size:10px; letter-spacing:.15em; font-weight:600; }
.work-hero-aside>div { border-top:1px solid #cdd0e2; padding-top:24px; margin-top:30px; }
.work-hero-aside p { font-size:13px; font-weight:600; line-height:1.7; }
.work-hero-aside .work-hero-disciplines { margin-top:16px; color:var(--muted); font-weight:400; line-height:1.9; }
.work-directory { padding:65px 0 90px; background:#fff; }
.work-directory-heading { display:flex; justify-content:space-between; align-items:end; gap:28px; margin-bottom:32px; }
.work-directory h2 { margin-top:12px; font-size:34px; font-weight:600; line-height:1.2; letter-spacing:-.04em; }
.work-directory-note { font-size:13px; color:var(--muted); padding-bottom:4px; }
.work-filters { display:flex; flex-wrap:wrap; gap:9px; padding-bottom:26px; border-bottom:1px solid var(--line); }
.work-filter { display:inline-flex; align-items:center; min-height:44px; padding:11px 16px; border:1px solid var(--line); border-radius:5px; color:#51596e; background:#fff; font-size:12px; font-weight:500; line-height:1.5; }
.work-filter:hover { background:#f2f3fb; border-color:#bfc3e2; color:var(--brand); }
.work-filter.is-active { background:var(--brand); border-color:var(--brand); color:#fff; }
.work-results-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px 0; color:var(--muted); font-size:11px; line-height:1.6; }
.work-results-heading>p:first-child { color:var(--ink); font-weight:500; }
.work-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.work-card { display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#fff; transition:box-shadow .2s,border-color .2s; }
.work-card:hover,.work-card:focus-within { border-color:#b8bcd8; box-shadow:0 10px 30px #171c3910; }
.work-card-image { aspect-ratio:3/2; overflow:hidden; position:relative; background:#e8eaf2; }
.work-card-image>img { width:100%; height:100%; object-fit:cover; object-position:center; }
.work-image-label { position:absolute; left:12px; bottom:12px; padding:5px 9px; border-radius:3px; background:#111a2ee8; color:#fff; font-size:9px; line-height:1.5; letter-spacing:.03em; }
.work-card-content { padding:22px; flex:1; display:flex; flex-direction:column; align-items:stretch; }
.work-card-meta { display:flex; align-items:start; justify-content:space-between; gap:12px; color:#5d6581; font-size:10px; line-height:1.6; }
.work-card-meta>p { letter-spacing:.04em; font-weight:600; }
.work-card-meta>span { white-space:nowrap; }
.work-card h3 { margin:13px 0 12px; font-size:20px; font-weight:600; line-height:1.4; letter-spacing:-.025em; overflow-wrap:anywhere; }
.work-card h3 a:hover { color:var(--brand); }
.work-organization { font-size:12px; line-height:1.7; color:var(--muted); margin-bottom:20px; }
.work-details-link { display:flex; justify-content:space-between; align-items:center; min-height:42px; padding:13px 0 0; margin-top:auto; border-top:1px solid var(--line); font-size:12px; font-weight:600; color:var(--brand); }
.work-details-link:hover { color:#414499; }
.work-home-note { color:var(--muted); font-size:12px; line-height:1.7; margin:-14px 0 24px; }
.work-home-section .section-heading>a { margin-bottom:4px; flex-shrink:0; }
.work-detail-header { padding:28px 0 50px; background:var(--paper); border-bottom:1px solid var(--line); }
.work-breadcrumbs { display:flex; align-items:baseline; flex-wrap:wrap; gap:10px; color:#626a7d; font-size:11px; line-height:1.7; padding:0 0 44px; }
.work-breadcrumbs a:hover { color:var(--brand); text-decoration:underline; }
.work-breadcrumbs>[aria-current] { overflow-wrap:anywhere; }
.work-detail-header h1 { max-width:1000px; margin:18px 0 34px; font-size:clamp(34px,4.2vw,58px); line-height:1.12; letter-spacing:-.04em; font-weight:600; overflow-wrap:anywhere; }
.work-facts { display:grid; grid-template-columns:2fr 1.4fr .8fr; gap:30px; border-top:1px solid #d9dce7; padding:25px 0 8px; max-width:1000px; }
.work-facts dt { font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:#667085; margin-bottom:10px; }
.work-facts dd { font-size:14px; line-height:1.7; font-weight:500; }
.work-detail-header .work-text-link { margin-top:18px; }
.work-detail-body { padding-top:42px; padding-bottom:68px; }
.work-detail-visual { margin:0; }
.work-detail-visual>img { width:100%; height:auto; aspect-ratio:2/1; object-fit:cover; border-radius:8px; background:#e8eaf2; }
.work-detail-visual figcaption,.work-gallery figcaption { font-size:11px; line-height:1.7; color:#5f677a; margin-top:12px; }
.work-detail-sections { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; padding:56px 0 8px; }
.work-detail-sections h2,.work-gallery h2 { font-size:30px; line-height:1.3; font-weight:600; letter-spacing:-.03em; margin:10px 0 20px; }
.work-detail-sections p:not(.eyebrow),.work-detail-sections li { color:#5f677a; font-size:15px; line-height:1.9; }
.work-detail-sections ul { list-style:disc; padding-left:20px; }
.work-source-link { display:inline-block; margin-top:18px; color:var(--brand); text-decoration:underline; text-underline-offset:4px; font-size:12px; line-height:1.7; }
.work-detail-return { display:flex; justify-content:space-between; flex-wrap:wrap; gap:20px; padding-top:32px; margin-top:40px; border-top:1px solid var(--line); }
.work-gallery { margin-top:48px; }
.work-gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; align-items:start; }
.work-device-screen { padding:10px; border:1px solid #bbc0d2; border-radius:12px; background:#202537; box-shadow:0 10px 30px #171c3912; }
.work-device-screen img { width:100%; height:auto; border-radius:4px; }
.work-device--desktop .work-device-screen { border-bottom-width:20px; }
.work-device--tablet { max-width:620px; }
.work-device--tablet .work-device-screen { padding:15px; border-radius:20px; }
.work-device--phone { max-width:300px; margin-inline:auto; }
.work-device--phone .work-device-screen { padding:22px 9px; border-radius:30px; }
.work-device--phone .work-device-screen img { border-radius:18px; }
.work-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:1024px) {
 .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
 .work-hero-grid { gap:40px; grid-template-columns:1.5fr 1fr; }
 .work-hero-aside { padding-left:28px; }
 .work-hero-number { font-size:80px; }
 .work-card-content { padding:20px; }
 .work-facts { grid-template-columns:1.5fr 1fr .7fr; gap:24px; }
}
@media(max-width:620px) {
 .work-hero { padding:46px 0; }
 .work-hero-grid { grid-template-columns:1fr; gap:34px; }
 .work-hero h1 { font-size:54px; }
 .work-hero .eyebrow { font-size:9px; margin-bottom:22px; }
 .work-hero-description { font-size:15px; line-height:1.8; }
 .work-hero-aside { display:flex; gap:28px; align-items:center; border-left:0; padding:24px 0 0; border-top:1px solid #cdd0e2; }
 .work-hero-number { font-size:64px; gap:12px; flex-wrap:wrap; max-width:100px; }
 .work-hero-number>span { font-size:8px; }
 .work-hero-aside>div { border-top:0; padding:0; margin:0; }
 .work-hero-aside .work-hero-disciplines { font-size:11px; margin-top:8px; }
 .work-hero-aside p { font-size:11px; }
 .work-directory { padding:42px 0 54px; }
 .work-directory-heading { display:block; margin-bottom:26px; }
 .work-directory h2 { font-size:28px; }
 .work-directory-note { margin-top:14px; }
 .work-filters { gap:8px; padding-bottom:22px; }
 .work-filter { padding:10px 12px; font-size:11px; }
 .work-results-heading { align-items:start; flex-direction:column; gap:8px; }
 .work-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
 .work-card h3 { font-size:21px; }
 .work-home-section .section-heading { align-items:start; }
 .work-home-section .section-heading>a { align-self:start; }
 .work-home-note { margin:0 0 24px; }
 .work-detail-header { padding:24px 0 36px; }
 .work-breadcrumbs { padding-bottom:28px; font-size:10px; }
 .work-detail-header h1 { font-size:35px; margin-bottom:26px; }
 .work-facts { grid-template-columns:1fr; gap:22px; padding-top:24px; }
 .work-facts dt { margin-bottom:6px; }
 .work-detail-body { padding-top:26px; padding-bottom:42px; }
 .work-detail-visual>img { aspect-ratio:3/2; }
 .work-detail-sections,.work-gallery-grid { grid-template-columns:1fr; gap:30px; }
 .work-detail-sections { padding-top:36px; }
 .work-detail-return { margin-top:28px; }
}
@media(prefers-reduced-motion:reduce) { .work-card { transition:none; } }

.mobile-links a.active { color:var(--brand); font-weight:600; }
