/* Additive refinement: retained typography, images and existing motion. */
.ux-filter-bar{display:grid;grid-template-columns:minmax(160px,1fr) minmax(160px,1fr) minmax(200px,1.25fr) auto;gap:14px;align-items:end;margin-bottom:20px}
.ux-filter-bar>label{min-width:0;display:block}.ux-filter-label{display:block;font-size:11px;letter-spacing:.07em;margin-bottom:7px;color:var(--teal)}
.ux-filter-bar input,.ux-filter-bar select{width:100%;min-width:0;max-width:none;min-height:48px;margin:0;padding:11px 17px;font-size:13px;border:1px solid #a7aaa0;border-radius:28px;background:transparent;color:var(--ink)}
.ux-filter-bar input::placeholder{color:#686e66}.ux-filter-bar button.pill{min-height:48px;font-size:12px;padding:11px 22px;color:var(--teal);border-color:#a7aaa0}
.ux-filter-bar:not(:has(select[name=client])){grid-template-columns:1fr 1.5fr auto}
.ux-results{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:0 0 32px;min-height:44px;padding-bottom:19px;border-bottom:1px solid var(--line)}
.ux-results>p{font-size:12px;color:#4e625b;flex-shrink:0}.ux-results strong{font-weight:600;color:var(--ink)}
.ux-filter-chips{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.ux-chip{display:inline-flex;gap:10px;align-items:center;min-height:44px;padding:9px 14px;border:1px solid #b7bbad;border-radius:24px;font-size:11px;max-width:100%;overflow-wrap:anywhere}.ux-chip svg{width:14px;height:14px;flex:none}.ux-clear{font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:10px;min-height:44px}
.project-grid .project-card{min-width:0;align-self:start}.project-grid .project-card .image-plane{aspect-ratio:4/3;height:auto;min-height:0}.project-grid .project-card.web-card img{object-position:top center}.project-grid .card-meta{align-items:flex-start}.project-grid .card-meta>div{min-width:0}.project-grid .project-card h3{line-height:1.08;overflow-wrap:anywhere}.project-grid .project-card small{font-size:10px;line-height:1.65;letter-spacing:.09em;color:#506159}.project-grid .project-card .circle{width:44px;height:44px;margin-top:2px}
.ux-back-link{display:inline-flex;align-items:center;gap:9px;min-height:44px;font-size:12px;padding:8px 0;margin-top:22px;color:var(--teal)}.ux-back-link svg{width:17px;height:17px}
.project-section-nav{margin:26px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0}.project-section-nav summary{cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;font-size:12px;list-style:none}.project-section-nav summary::-webkit-details-marker{display:none}.project-section-nav summary:after{content:'+';font-size:20px}.project-section-nav[open] summary:after{content:'−'}.project-section-nav nav{display:flex;flex-wrap:wrap;gap:8px 18px;padding-bottom:8px}.project-section-nav nav a{font-size:12px;min-height:44px;display:inline-flex;align-items:center;line-height:1.5;padding:8px 2px;max-width:100%}.project-section-nav a[aria-current=true]{color:var(--teal);text-decoration:underline;text-underline-offset:5px}.ux-section-target{scroll-margin-top:32px}.ux-related{padding-top:55px;border-top:1px solid var(--line);margin-top:25px}.ux-related .section-title{margin-top:0}.ux-related h2{font-size:clamp(38px,4vw,58px)}
main :is(input,select,summary):focus-visible{outline:2px solid var(--teal);outline-offset:3px}main .ux-chip:focus-visible,main .project-section-nav a:focus-visible{outline-color:var(--teal)}
@media(min-width:901px){.project-section-nav summary{font-size:10px;letter-spacing:.1em;text-transform:uppercase;min-height:44px;margin-bottom:8px}}
@media(max-width:1000px){.ux-filter-bar{grid-template-columns:1fr 1fr}.ux-filter-bar .ux-search{grid-column:1}.ux-results{align-items:flex-start;flex-wrap:wrap}.ux-filter-chips{justify-content:flex-start}.project-grid{gap:42px 24px}}
@media(max-width:680px){.ux-filter-bar{gap:12px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ux-filter-bar .ux-search{grid-column:1/-1}.ux-filter-bar button.pill{grid-column:1/-1;min-height:48px}.ux-filter-bar input,.ux-filter-bar select{font-size:16px;padding:11px 13px}.ux-filter-bar label{flex:none}.ux-results{gap:7px;margin-bottom:28px}.ux-results>p{width:100%}.project-grid{row-gap:48px}.project-grid .project-card .image-plane{height:auto;aspect-ratio:4/3}.project-grid .project-card h3{font-size:clamp(27px,7.2vw,34px)}.project-grid .project-card .card-meta{padding-top:17px;gap:15px}.project-grid .project-card small{font-size:10px;letter-spacing:.06em;margin-top:10px}.film-grid{row-gap:46px}.film-grid .film-card h3{line-height:1.1;overflow-wrap:anywhere}.film-grid .video-actions .pill{min-height:44px}.film-grid .video-actions .video-project-link{min-height:44px}.project-section-nav{padding:5px 0}.project-section-nav nav{display:grid;gap:0;padding:0 0 10px}.project-section-nav nav a{border-top:1px solid var(--line)}.ux-related{padding-top:35px}.ux-back-link{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.pill,.project-card img,.project-card .image-plane{transition:none!important}.project-card:hover .image-plane,.project-card:hover img,.pill:hover{transform:none!important}}
@media(max-width:680px){.ux-filter-bar:not(:has(select[name=client])){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

/* About / Experience: decorative rail stays inside the existing page gutter. */
.work-timeline-list{position:relative;--work-rail-x:-28px}
.work-timeline-entry{position:relative;transform:none!important;opacity:1!important}
.work-timeline-rail{position:absolute;left:var(--work-rail-x);width:2px;background:#b9c1b354;border-radius:2px;pointer-events:none;--work-progress:0}
.work-timeline-fill{position:absolute;inset:0;background:linear-gradient(180deg,var(--teal),var(--gold));transform:scaleY(var(--work-progress));transform-origin:top;border-radius:2px;will-change:transform}
.work-timeline-tip{position:absolute;top:calc(var(--work-progress)*100%);left:1px;width:5px;height:5px;background:var(--gold);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 3px var(--cream,#f7f4eb)}
.work-timeline-node{position:absolute;left:calc(var(--work-rail-x) - 4px);top:var(--work-node-y,40px);width:10px;height:10px;border:1.5px solid #a4b19e;border-radius:50%;background:var(--cream,#f7f4eb);transform:translateY(-50%) scale(.9);transition:background-color .25s ease,border-color .25s ease,transform .35s ease,box-shadow .35s ease;pointer-events:none}
.work-timeline-live .work-timeline-entry .career-detail{transform:translateY(5px);transition:transform .65s cubic-bezier(.2,.65,.3,1)}
.work-timeline-live .work-timeline-seen .career-detail{transform:none}
.work-timeline .work-timeline-entry .dates{transition:color .25s ease}
.work-timeline-complete .work-timeline-node{background:var(--gold);border-color:var(--gold);transform:translateY(-50%) scale(1)}
.work-timeline-active .work-timeline-node{background:var(--teal);border-color:var(--gold);transform:translateY(-50%) scale(1.15);box-shadow:0 0 0 3px var(--cream,#f7f4eb),0 0 0 4px #a8783026}
.work-timeline-active .dates{color:var(--teal)}
@media(min-width:681px) and (max-width:1100px){.work-timeline-list{--work-rail-x:-24px}}
@media(max-width:680px){.work-timeline-list{--work-rail-x:-12px}.work-timeline-rail{width:1.5px}.work-timeline-node{width:9px;height:9px;left:calc(var(--work-rail-x) - 3.5px)}.work-timeline-tip{width:4px;height:4px}.work-timeline-active .work-timeline-node{box-shadow:0 0 0 2px var(--cream,#f7f4eb),0 0 0 3px #a8783026}}
@media(prefers-reduced-motion:reduce){.work-timeline .career-detail,.work-timeline-node,.work-timeline .dates{transition:none!important}.work-timeline .career-detail{transform:none!important}.work-timeline-tip{display:none}.work-timeline-fill{will-change:auto}}

/* Phase 1: MOSAB readability and collection hierarchy. No image, motion or CMS changes. */
:root {
  --ux-copy: 1rem;
  --ux-utility: .8125rem;
  --ux-accent-text: #80591f;
  --ux-muted-copy: #58645f;
}
.hero-layered .hero-content p,
.about-layered .about-copy p {font-size:var(--ux-copy);line-height:1.65}
.hero .eyebrow,
.eyebrow {font-size:.75rem;letter-spacing:.13em;line-height:1.6}
.hero .eyebrow {max-width:none}
.section-title>p,
.feature-copy p {font-size:var(--ux-copy);line-height:1.65}
.feature-copy .meta-line {font-size:.75rem;line-height:1.7;letter-spacing:.05em;text-transform:none;color:var(--ux-muted-copy)}
.small-project p {font-size:var(--ux-utility);line-height:1.55}
.project-grid .project-card small {font-size:.75rem;line-height:1.6;letter-spacing:.035em}
.hero .pill,
.feature-copy .pill {font-size:var(--ux-utility);min-height:44px}
.page-heading {padding:36px 0 28px}
.page-heading .eyebrow {margin-bottom:16px}
.page-heading .heading-grid {align-items:end;gap:32px}
.page-heading h1 {font-size:clamp(3.5rem,6.4vw,5.5rem);line-height:.98;max-width:15ch;overflow-wrap:normal}
.page-heading p {font-size:var(--ux-copy);line-height:1.6;max-width:24em}
.collection-main>nav.work-tabs[aria-label="Work collections"] {margin-bottom:24px}
.collection-main .work-tabs a {font-size:var(--ux-utility)}
.ux-filter-label {font-size:.75rem;letter-spacing:.04em}
.ux-filter-bar button.pill {font-size:var(--ux-utility)}
.ux-results>p,.ux-clear {font-size:var(--ux-utility)}
.ux-chip {font-size:.75rem}
.site-header nav a[aria-current],
.navigation-dialog .nav-list a[aria-current] {text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.35em;text-decoration-color:var(--ux-accent-text)}
.site-header nav a[aria-current]:after {content:'';position:absolute;left:0;bottom:4px;width:24px;height:2px;background:var(--gold)}
.site-header nav a[aria-current] {text-decoration:none}
.ux-filter-toggle {display:none}
.ux-filter-bar.ux-filter-enhanced {grid-template-columns:minmax(160px,1fr) minmax(160px,1fr) minmax(200px,1.25fr) auto}
.ux-filter-fields {display:contents}
.ux-filter-fields>label {display:block;min-width:0}
@media(min-width:1001px){
  .page-heading .heading-grid {align-items:center}
  .page-heading h1 {min-width:0;max-width:17ch}
  .page-heading h1 br {display:none}
  .page-heading h1 .gold:before {content:' '}
  .page-heading p {flex:0 0 34%}
}
@media(max-width:1000px){
  .ux-filter-bar.ux-filter-enhanced {grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media(max-width:680px){
  /* Normal height is retained; larger text can grow the scene instead of being clipped. */
  .hero-layered {height:auto;min-height:1020px}
  .hero-layered .hero-content {padding-bottom:360px}
  .page-heading {padding:24px 0 20px}
  .page-heading .heading-grid {display:block}
  .page-heading h1 {font-size:clamp(2.75rem,12vw,3.5rem);line-height:1;max-width:none;overflow-wrap:anywhere}
  .page-heading .eyebrow {font-size:.75rem;margin-bottom:14px}
  .page-heading p {font-size:1rem;line-height:1.6;margin-top:14px;max-width:34em}
  .collection-main>nav.work-tabs[aria-label="Work collections"] {margin-bottom:16px;gap:22px;padding-bottom:10px}
  .collection-main>nav.work-tabs[aria-label="Work collections"] a.active:after {bottom:-9px}
  .collection-main .work-tabs a {font-size:.8125rem}
  .collection-main nav.work-tabs {scroll-padding-inline:12px}
  .collection-main nav.work-tabs[data-scroll-start=true][data-scroll-end=false] {-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 22px),transparent)}
  .collection-main nav.work-tabs[data-scroll-start=false][data-scroll-end=false] {-webkit-mask-image:linear-gradient(to right,transparent,#000 18px,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(to right,transparent,#000 18px,#000 calc(100% - 22px),transparent)}
  .collection-main nav.work-tabs[data-scroll-start=false][data-scroll-end=true] {-webkit-mask-image:linear-gradient(to right,transparent,#000 18px);mask-image:linear-gradient(to right,transparent,#000 18px)}
  .hero .eyebrow {font-size:.75rem;letter-spacing:.09em;gap:9px}
  .hero .pill {font-size:.8125rem;gap:10px;padding-inline:16px}
  .feature-copy p,.section-title>p {max-width:36em}
  .feature-copy .meta-line {font-size:.75rem}
  .small-project p {font-size:.8125rem}
  .ux-filter-bar.ux-filter-enhanced {grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;margin-bottom:12px}
  .ux-filter-bar.ux-filter-enhanced .ux-search {grid-column:1;grid-row:1}
  .ux-filter-bar.ux-filter-enhanced button[type=submit] {grid-column:2;grid-row:1;min-height:48px;padding:11px 17px}
  .ux-filter-bar .ux-filter-toggle {display:flex;grid-column:1/-1;grid-row:2;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:10px 2px;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;color:var(--ink);font:500 .8125rem var(--sans);cursor:pointer;text-align:left}
  .ux-filter-toggle svg {width:18px;height:18px;flex:none;transition:transform .18s ease}
  .ux-filter-toggle[aria-expanded=true] svg {transform:rotate(180deg)}
  .ux-filter-fields {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-column:1/-1;grid-row:3;gap:12px}
  .ux-filter-fields[hidden] {display:none}
  .ux-filter-bar .ux-filter-fields label {margin:0}
  .ux-filter-bar input,.ux-filter-bar select {font-size:1rem}
  .ux-results {padding-bottom:16px;margin-bottom:20px}
  .ux-results>p {font-size:.8125rem}
  .project-grid .project-card small {font-size:.75rem;letter-spacing:.03em}
}
@media(max-width:360px){
  .hero .actions {flex-wrap:wrap}
  .hero .pill {padding-inline:13px;font-size:.8125rem}
  .ux-filter-bar.ux-filter-enhanced button[type=submit] {padding-inline:13px}
}
@media(prefers-reduced-motion:reduce){.ux-filter-toggle svg{transition:none}}
