/* Completed-work pages: scoped so quotation and material flows keep their layout. */
.portfolio-hero{padding-top:clamp(128px,12vw,172px);padding-bottom:clamp(36px,6vw,76px)}
.portfolio-hero__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,68px);align-items:center}
.portfolio-hero__copy{min-width:0}
.portfolio-hero h1{font-size:clamp(2.6rem,5.4vw,4.8rem);line-height:1.06;max-width:12ch;margin-top:22px}
.portfolio-hero .lede{max-width:43ch;margin-top:24px}
.portfolio-hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.portfolio-hero__actions .btn--outline{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.portfolio-hero__actions .btn--outline:hover{background:var(--paper);border-color:var(--brass)}
.portfolio-hero__photo{margin:0;min-width:0}
.portfolio-hero__photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 58%;border-radius:var(--r)}
.portfolio-hero__photo figcaption{margin-top:12px;font-size:.8rem;color:var(--stone);line-height:1.5}
.portfolio-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.portfolio-section-head h2{margin-top:14px}
.portfolio-section-head p{max-width:43ch;color:var(--stone);font-size:.94rem}
.portfolio-collection,.portfolio-story,.portfolio-films{scroll-margin-top:120px}
.portfolio-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.portfolio-collection .portfolio-filters{position:sticky;top:70px;z-index:10;background:var(--bone);padding:12px 0;border-bottom:1px solid var(--line)}
.portfolio-filters button{border:1px solid var(--line-strong);background:transparent;border-radius:100px;padding:11px 20px;color:var(--ink);font-size:.86rem;min-height:46px;transition:background .18s,color .18s,border-color .18s}
.portfolio-filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.portfolio-filters button:hover{border-color:var(--brass)}
.portfolio-filters button:focus-visible,.portfolio-story>summary:focus-visible,.portfolio-grid a:focus-visible{outline:2px solid var(--brass-deep);outline-offset:5px}
.portfolio-results{color:var(--stone);font-size:.84rem;margin-bottom:28px;min-height:1.6em}
.gallery.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,36px)}
.gallery.portfolio-grid figure{grid-column:auto;grid-row:auto;height:auto;background:var(--paper);border:1px solid var(--line);overflow:hidden;min-width:0;box-shadow:none;transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.gallery.portfolio-grid figure:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.gallery.portfolio-grid figure>a{display:block;height:100%}
.gallery.portfolio-grid img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 54%;transition:transform .6s var(--ease)}
.gallery.portfolio-grid figure:hover img{transform:scale(1.025)}
.gallery.portfolio-grid figcaption{position:static;opacity:1;transform:none;inset:auto;padding:22px;background:var(--paper);color:var(--ink);line-height:1.5}
.gallery.portfolio-grid figcaption b{font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.15;margin:8px 0 10px}
.gallery.portfolio-grid figcaption .loc{font-size:.82rem;letter-spacing:0;text-transform:none;color:var(--stone)}
.portfolio-kind{font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:var(--brass-deep)}
.gallery.portfolio-grid figcaption .view{font-size:.76rem;color:var(--brass-deep);margin-top:15px}
.portfolio-grid .lb-zoom{top:12px;right:12px;bottom:auto;opacity:1;background:rgba(251,248,242,.94);color:var(--ink);width:42px;height:42px;border:1px solid var(--line)}
.portfolio-stories{background:var(--paper);border-block:1px solid var(--line)}
.portfolio-story{border-top:1px solid var(--line);padding:0;min-width:0}
.portfolio-story:last-child{border-bottom:1px solid var(--line)}
.portfolio-story>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;font-family:var(--f-serif);font-size:clamp(1.25rem,2.4vw,1.75rem);line-height:1.25}
.portfolio-story>summary::-webkit-details-marker{display:none}
.portfolio-story>summary::after{content:"+";font-family:var(--f-sans);font-size:1.4rem;font-weight:400;color:var(--brass-deep);flex:none}
.portfolio-story[open]>summary::after{content:"−"}
.portfolio-story .inst{border:0;padding:0 0 32px;align-items:start}
.portfolio-story .inst:nth-of-type(even) .inst__media{order:0}
.portfolio-story .inst__text h3{margin-top:0}
.portfolio-story .inst__media>img{aspect-ratio:4/3;object-fit:cover;object-position:50% 52%}
.portfolio-story .inst__thumbs img{aspect-ratio:4/3}
.portfolio-story#curved-kitchen .inst__thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}
.portfolio-film-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,4vw,48px)}
.portfolio-film{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:22px;align-items:center;min-width:0;margin:0;padding:clamp(16px,2vw,24px);background:var(--paper);border:1px solid var(--line)}
.portfolio-film video{display:block;justify-self:center;width:auto;max-width:100%;height:auto;max-height:420px;object-fit:contain;background:var(--ink);border-radius:var(--r)}
.portfolio-film h3{font-size:clamp(1.35rem,2.1vw,1.75rem);line-height:1.15;margin:10px 0 14px}
.portfolio-film p{font-size:.87rem;line-height:1.65;color:var(--stone);margin-bottom:16px}
.portfolio-film .arrowlink{font-size:.84rem}
.portfolio-film .portfolio-film-note{display:block;font-size:.72rem;color:var(--stone);margin-top:14px}
.studio-page .split__media{aspect-ratio:4/5;max-height:640px}
.studio-page .split__media>img{width:100%;height:100%;object-fit:cover;object-position:50% 56%}
.studio-page .feature-grid figure img{width:100%;height:auto;aspect-ratio:5/4;object-fit:cover}
.portfolio-case .case-main>img,.portfolio-case .case-grid .ph>img{width:100%;height:100%;object-fit:cover}
.portfolio-case .case-main>img{object-position:50% 55%}
.portfolio-case .case-grid .ph>img{object-position:50% 55%}
.portfolio-home #work .gallery figcaption{opacity:1;transform:none;background:linear-gradient(180deg,transparent,rgba(18,17,14,.82));padding:58px 20px 22px}
.portfolio-home #work .gallery figure:focus-within{outline:2px solid var(--brass-deep);outline-offset:4px}
.portfolio-home #work .gallery figure:focus-within .lb-zoom{opacity:1}
@media(max-width:1050px){.portfolio-film{gap:16px;padding:18px}.gallery.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){.portfolio-hero__grid{grid-template-columns:minmax(0,1fr);gap:30px}.portfolio-hero h1{max-width:18ch}.portfolio-hero .lede{max-width:52ch}.portfolio-hero__photo img{aspect-ratio:3/2}.portfolio-film-grid{grid-template-columns:minmax(0,1fr)}.portfolio-film{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px;align-items:center}.portfolio-film video{max-height:340px}.studio-page .split__media{aspect-ratio:4/3;max-height:none}.portfolio-case .case-main{aspect-ratio:4/3}}
@media(max-width:560px){.portfolio-hero{padding-top:126px}.portfolio-hero h1{font-size:clamp(2.4rem,10vw,3.25rem);max-width:13ch}.portfolio-hero__actions .btn{flex:1;min-width:0;padding-inline:16px}.gallery.portfolio-grid{grid-template-columns:minmax(0,1fr);gap:24px}.gallery.portfolio-grid figcaption{padding:20px}.gallery.portfolio-grid figcaption b{font-size:1.6rem}.portfolio-filters{gap:8px}.portfolio-filters button{padding:10px 15px;font-size:.82rem}.portfolio-film{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:16px;padding:16px}.portfolio-film video{max-height:330px}.portfolio-film h3{font-size:1.3rem}.portfolio-film p{font-size:.8rem}.portfolio-film .arrowlink{font-size:.8rem}.portfolio-story>summary{font-size:1.35rem;padding-block:22px}.portfolio-story .inst__thumbs{gap:7px}.portfolio-collection,.portfolio-story,.portfolio-films{scroll-margin-top:104px}}
@media(max-width:360px){.portfolio-film{grid-template-columns:minmax(0,1fr)}.portfolio-film video{max-height:350px}.portfolio-film figcaption{padding:4px}.portfolio-hero__actions{gap:10px}.portfolio-hero__actions .btn{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.portfolio-grid img,.gallery.portfolio-grid figure,.portfolio-filters button{transition:none}.gallery.portfolio-grid figure:hover{transform:none}.gallery.portfolio-grid figure:hover img{transform:none}}