.portfolio-page{--portfolio-gutter:15px;background:var(--surface-page);color:var(--text-body);font-family:var(--font-body)}
.portfolio-page *{border-radius:0}
.portfolio-page picture{display:block}
.portfolio-media>picture,.project-card-media>picture,.culture-visual>picture,.place-card-visual picture,.place-photo>picture{width:100%;height:100%}
.portfolio-inner{width:100%;padding-inline:var(--portfolio-gutter)}
.portfolio-section{padding-block:80px}
.portfolio-section+.portfolio-section{border-top:var(--border-subtle)}

.portfolio-label{display:flex;align-items:center;gap:10px;margin-bottom:32px;font:400 12px/1.5 var(--font-mono);letter-spacing:.05em;text-transform:uppercase}
.section-glyph{position:relative;display:inline-block;flex:0 0 10px;width:10px;height:16px}
.section-glyph i{position:absolute;width:6px;height:6px;background:var(--tpz-ink)}
.section-glyph i:nth-child(1){left:0;top:0}
.section-glyph i:nth-child(2){right:0;top:5px}
.section-glyph i:nth-child(3){left:0;bottom:0}

.portfolio-page h1,.portfolio-page h2,.portfolio-page h3,.portfolio-page strong{font-family:var(--font-body);font-weight:500}
html[lang="en"] .portfolio-page h1,html[lang="en"] .portfolio-page h2,html[lang="en"] .portfolio-page h3,html[lang="en"] .portfolio-page strong,.portfolio-page [lang="en"]{font-family:var(--font-editorial);font-weight:400}
.home-intro h1,.section-heading h2,.project-card h3,.services-grid h3,.place-feature h2,.page-hero h1,.places-hero h1,.lobby-row h2,.project-title h1,.next-project strong,.about-rows h2,.statement-rows h3,.about-contact h2{font-family:var(--font-editorial);font-weight:400;text-transform:uppercase}
.portfolio-page h1,.portfolio-page h2,.portfolio-page h3{text-transform:none}
.portfolio-page h2.portfolio-label{font:400 12px/1.5 var(--font-mono);letter-spacing:.05em;text-transform:uppercase}
.portfolio-page h1{font-size:clamp(40px,4.2vw,60px);line-height:1.06;letter-spacing:-.01em}
.portfolio-page h2{font-size:clamp(28px,3vw,40px);line-height:1.1;letter-spacing:-.01em}
.portfolio-page h3{font-size:20px;line-height:1.22;letter-spacing:0}
.portfolio-page p{font-family:var(--font-body);font-size:15px;line-height:1.7;text-wrap:pretty}
.portfolio-mono{font:400 12px/1.5 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.portfolio-lead{font-size:18px;line-height:1.7}

.portfolio-button,.filter-bar button{display:inline-flex;align-items:center;justify-content:center;min-height:45px;padding:10px 16px;border:var(--border-primary);border-radius:0;background:var(--surface-page);color:var(--text-body);font:400 14px/1 var(--font-body);letter-spacing:.02em;transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease;white-space:nowrap}
html[lang="en"] .portfolio-button,html[lang="en"] .filter-bar button,.portfolio-page .portfolio-button[lang="en"]{font-family:var(--font-editorial);letter-spacing:.04em}
.portfolio-button:hover,.filter-bar button:hover{background:var(--surface-inverse);color:var(--text-on-inverse);border-color:var(--line-primary)}
.portfolio-button.is-dashed{border-style:solid;color:var(--text-body)}
.plain-link{display:inline-flex;align-items:center;gap:6px;font:400 12px/1.4 var(--font-mono);letter-spacing:.04em;text-underline-offset:3px;transition:text-decoration-color 150ms ease}
.plain-link b{font:inherit;transition:transform 150ms ease}
.plain-link:hover{text-decoration:underline}
.plain-link:hover b{transform:translateX(2px)}
.portfolio-chips{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}
.portfolio-chip{display:inline-flex;align-items:center;min-height:26px;padding:4px 10px;border:var(--border-primary);border-radius:0;background:var(--surface-inverse);color:var(--text-on-inverse);font:400 12px/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase}
.portfolio-chip.is-outline,.portfolio-chip.is-dashed{border:var(--border-primary);border-style:solid;background:var(--surface-page);color:var(--text-body)}

.portfolio-media{margin:0;overflow:hidden;background:var(--surface-sunken)}
.portfolio-media img,.project-card-media img,.culture-visual img,.place-card-visual img,.place-feature-card img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}
.project-card:hover .project-card-media img,.culture-card:hover .culture-visual img,.services-grid article:hover .portfolio-media img,.place-index-card:hover .place-card-visual img,.place-feature-card:hover .place-photo img{transform:scale(1.025)}
.project-card:hover h3,.culture-card:hover h3,.services-grid article:hover h3,.place-index-card:hover h2,.place-feature-card:hover h2{text-decoration:underline;text-underline-offset:4px}
.hd-cta .btn{display:inline-flex}

.home-intro{padding-top:96px;padding-bottom:96px}
.intro-grid,.inquiry-grid,.place-info{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px}
.intro-grid>div,.inquiry-grid>*,.place-info>*{grid-column:1/-1}
.intro-grid h1{font-size:clamp(34px,7.6vw,48px);line-height:1.08}
.intro-ko{margin-top:28px;font-size:18px!important}
.intro-grid>div:last-child{padding-top:4px}
.intro-grid .portfolio-lead{font-size:16px;margin-bottom:18px}
.portfolio-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.intro-grid .portfolio-actions .portfolio-button{margin-top:0}
.project-inquiry{background:var(--surface-sunken)}
.inquiry-grid h2{max-width:680px}
.inquiry-grid .portfolio-lead{margin-bottom:28px}

.image-reel{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;background:var(--surface-sunken)}
.image-reel::-webkit-scrollbar{display:none}
.reel-track{display:flex;gap:1px;width:max-content;height:240px;background:var(--tpz-ink)}
.reel-track picture{flex:0 0 auto;height:240px}
.reel-track img{width:auto;height:240px;object-fit:cover}

.section-heading{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px;align-items:end;margin-bottom:32px;padding-bottom:18px;border-bottom:var(--border-primary)}
.section-heading h2{grid-column:1/5}
.section-heading .portfolio-button{grid-column:5/-1;justify-self:end}
.featured-grid,.projects-grid,.culture-grid,.services-grid,.places-index-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px 15px}
.project-card{min-width:0;padding-bottom:32px;border-bottom:var(--border-subtle)}
.project-card-media{display:block;overflow:hidden;aspect-ratio:16/10;background:var(--surface-sunken)}
.project-card-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-top:18px}
.project-card-head .portfolio-mono{white-space:nowrap}
.project-card .plain-link{display:inline-block;margin-top:12px}

.services-frame{padding-bottom:80px}
.services-grid.is-two{grid-template-columns:minmax(0,1fr)}
.services-grid article{min-width:0;padding:0 15px 20px;border:var(--border-primary)}
.services-grid .portfolio-media{margin-inline:-15px;margin-bottom:24px;aspect-ratio:3/2;border-bottom:var(--border-primary)}
.services-grid h3{margin-bottom:8px}
.services-grid p{margin-bottom:20px;color:var(--text-muted)}

.place-feature{border-top:var(--border-primary)}
.place-feature+.culture-preview{border-top:var(--border-subtle)}
.place-feature-card{display:block}
.place-photo{height:310px;overflow:hidden}
.place-photo img{width:100%;height:100%;object-fit:cover}
.place-info{padding-block:48px 80px}
.place-info .portfolio-label{margin:0}
.place-info h2{margin-bottom:20px}
.place-info .portfolio-button{margin-top:20px}

.culture-visual{overflow:hidden;aspect-ratio:4/5;background:var(--surface-sunken)}
.culture-card{min-width:0}
.culture-card.is-typographic{display:flex;min-height:100%;flex-direction:column;padding:18px;border:var(--border-primary);background:var(--surface-sunken)}
.culture-card.is-typographic .culture-meta{padding-top:0}
.culture-card.is-typographic h3{margin-top:24px;font-size:clamp(22px,2.1vw,30px);line-height:1.12}
.culture-card.is-typographic .portfolio-button{align-self:flex-start;margin-top:auto}
.culture-meta{display:flex;justify-content:space-between;padding-block:10px;border-bottom:var(--border-subtle)}
.culture-card h3{margin-top:14px}
.culture-card .portfolio-button{margin-top:18px}
.culture-status-label{display:block;margin-top:18px;font:400 12px/1.4 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint)}

.page-hero,.places-hero{padding-top:92px}
.index-title{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px;align-items:end;margin-bottom:48px}
.index-title h1{grid-column:1/6}
.index-title p{grid-column:6;text-align:right;white-space:nowrap}
.project-index-copy{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px;align-items:end;margin-bottom:40px}
.project-index-copy .portfolio-lead{grid-column:1/6;max-width:760px;margin:0}
.project-index-copy .portfolio-button{grid-column:1/-1;justify-self:start}
.filter-bar{display:flex;flex-wrap:wrap;gap:6px}
.filter-bar button{min-height:26px;padding:5px 10px;gap:5px;font:400 12px/1 var(--font-mono);letter-spacing:.04em}
.filter-bar button[aria-pressed="true"]{border-color:var(--line-primary);background:var(--surface-inverse);color:var(--text-on-inverse)}
.project-index .portfolio-label,.culture-upcoming .portfolio-label,.culture-archive .portfolio-label{padding-bottom:18px;border-bottom:var(--border-primary)}
.lobby-row{display:grid;grid-template-columns:minmax(0,1fr);gap:15px;margin-top:64px;padding-block:1px;border-block:var(--border-primary)}
.lobby-row>picture{width:100%;min-width:0;height:280px}
.lobby-row>picture img{width:100%;height:100%;object-fit:cover}
.lobby-row>div{padding-block:24px}
.archive-count{display:block;width:100%;margin-top:48px;padding:18px 0 0;border:0;border-top:var(--border-primary);background:var(--surface-page);color:var(--text-body);text-align:left;cursor:pointer}
.archive-count[hidden]{display:none}
.is-filtered-out{display:none!important}

.places-hero h1{font-size:clamp(40px,4.2vw,60px)}
.places-hero .portfolio-lead{max-width:760px}
.places-index{padding-top:0}
.places-index-rule{border-bottom:var(--border-primary)}
.places-index-heading{display:flex;align-items:center;justify-content:space-between;padding-block:18px}
.places-index-heading h2{font:400 12px/1.5 var(--font-mono);letter-spacing:.04em}
.places-index-grid{padding-top:40px}
.place-index-card{min-width:0;height:100%;padding-bottom:0;border-bottom:var(--border-subtle)}
.place-card-link{display:block;height:100%;padding-bottom:40px}
.place-card-visual,.place-placeholder-visual{height:300px;overflow:hidden;background:var(--surface-sunken)}
.place-card-visual .media{height:100%;margin:0;aspect-ratio:auto}
.place-placeholder-visual{border:var(--border-primary)}
.place-index-card .status{margin-top:18px}
.place-index-card h2{margin-top:16px}
.place-index-card .rows{margin-top:22px}
.place-index-card>p,.place-card-link>p:not(.status){margin-top:20px}
.place-index-card .plain-link{margin-top:20px}
.places-contact h2{margin-bottom:20px}
.places-contact .portfolio-lead{max-width:720px;margin-bottom:28px}
.places-contact .portfolio-button{width:100%}

.project-crumb{padding-block:28px;border-bottom:var(--border-subtle);font:400 12px/1 var(--font-mono);letter-spacing:.04em}
.project-hero{display:block;height:360px}
.project-hero img,.project-band>picture img{width:100%;height:100%;object-fit:cover}
.project-title h1{font-size:clamp(34px,4vw,52px)}
.project-meta{margin:0;border-block:var(--border-primary)}
.project-meta>.portfolio-inner{display:grid;grid-template-columns:minmax(0,1fr)}
.project-meta dl>div{padding:18px 0;border-bottom:var(--border-subtle)}
.project-meta dl>div:last-child{border-bottom:0}
.project-meta dt{font:400 12px/1 var(--font-mono);letter-spacing:.04em}
.project-meta dd{margin:12px 0 0;font-size:14px}
.project-meta dd a{text-decoration:underline;text-underline-offset:.15em}
.project-copy{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px}
.project-copy span{display:none}
.project-copy p{grid-column:1/-1;max-width:720px;font-size:18px}
.project-band{height:auto;margin:0}
.project-band>picture{height:360px}
.project-band figcaption,.about-band figcaption{display:flex;justify-content:space-between;padding-block:12px;border-bottom:var(--border-subtle);font:400 12px/1 var(--font-mono);letter-spacing:.04em}
.gallery-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--tpz-ink)}
.gallery-grid .portfolio-media{aspect-ratio:4/3}
.next-project{display:block;border-top:var(--border-primary)}
.next-project>span{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding-block:28px}
.next-project small{grid-column:1/-1;font:400 12px/1 var(--font-mono);letter-spacing:.04em}
.next-project strong{font-size:20px}
.next-project b{font-size:30px;text-align:right}

.about-hero h1{max-width:900px;font-family:var(--font-body);font-size:clamp(30px,3.7vw,48px);font-weight:500;line-height:1.3;text-transform:none}
.about-hero .portfolio-lead{max-width:760px;margin-top:48px}
.about-band{margin:0}
.about-band>picture{width:100%;height:360px}
.about-band>picture img{width:100%;height:100%;object-fit:cover}
.about-rows h2{margin-bottom:44px}
.statement-rows>div{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px;padding-block:25px;border-top:var(--border-subtle)}
.statement-rows>div:last-child{border-bottom:var(--border-subtle)}
.statement-rows h3,.statement-rows p{grid-column:1/-1}
.statement-rows h3{font-size:20px}
.statement-rows p{font-size:14px}
.portfolio-timeline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 15px;border-top:var(--border-primary)}
.portfolio-timeline>div{position:relative;min-height:130px;padding:28px 10px 0 0}
.portfolio-timeline i{position:absolute;top:-4px;left:0;width:7px;height:7px;background:var(--tpz-ink)}
.portfolio-timeline span,.portfolio-timeline strong{display:block}
.portfolio-timeline strong{margin-top:14px;font-size:14px}
.about-contact h2{margin-bottom:32px}

@media (min-width:800px){
  .portfolio-page{--portfolio-gutter:45px}
  .portfolio-section{padding-block:clamp(96px,8vw,120px)}
  .portfolio-label{margin-bottom:40px}
  .home-intro{padding-top:120px;padding-bottom:104px}
  .intro-grid,.inquiry-grid,.place-info,.section-heading,.index-title,.project-index-copy,.project-copy{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:30px}
  .intro-grid>div:first-child,.inquiry-grid>h2{grid-column:1/span 7}
  .intro-grid>div:last-child,.inquiry-grid>div{grid-column:8/-1}
  .intro-grid h1{font-size:clamp(48px,4.2vw,60px)}
  .reel-track,.reel-track picture,.reel-track img{height:340px}
  .section-heading h2{grid-column:1/span 8}
  .section-heading .portfolio-button{grid-column:11/-1}
  .featured-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 30px}
  .projects-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 30px}
  .services-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px}
  .services-grid.is-two{grid-template-columns:repeat(2,minmax(0,1fr))}
  .services-frame{padding-bottom:clamp(96px,8vw,120px)}
  .culture-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 30px}
  .place-photo{height:470px}
  .place-info{padding-block:48px 104px}
  .place-info>.portfolio-label{grid-column:1/span 2}
  .place-info>div{grid-column:3/span 7}
  .index-title h1{grid-column:1/span 8}
  .index-title p{grid-column:11/-1}
  .project-index-copy .portfolio-lead{grid-column:1/span 8}
  .project-index-copy .portfolio-button{grid-column:11/-1;justify-self:end}
  .lobby-row{grid-template-columns:repeat(12,minmax(0,1fr));gap:30px}
  .lobby-row>picture{grid-column:1/span 5;height:280px}
  .lobby-row>div{grid-column:6/-1;padding-block:36px}
  .places-index-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 30px}
  .place-card-visual,.place-placeholder-visual{height:420px}
  .places-contact .portfolio-button{width:auto}
  .project-hero{height:520px}
  .project-meta>.portfolio-inner{grid-template-columns:repeat(4,minmax(0,1fr))}
  .project-meta dl>div{padding:24px;border-right:var(--border-subtle);border-bottom:0}
  .project-meta dl>div:first-child{padding-left:0}
  .project-meta dl>div:last-child{border-right:0}
  .project-copy span{display:block;grid-column:1/span 2}
  .project-copy p{grid-column:3/span 7}
  .project-band>picture,.about-band>picture{height:620px}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .next-project>span{grid-template-columns:2fr 9fr 1fr;min-height:170px;padding-block:0}
  .next-project small{grid-column:auto}
  .next-project strong,.next-project b{font-size:30px}
  .statement-rows>div{grid-template-columns:repeat(12,minmax(0,1fr));gap:30px}
  .statement-rows h3{grid-column:1/span 7;font-size:25px}
  .statement-rows p{grid-column:8/-1}
  .portfolio-timeline{grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
}

@media (max-width:799px){
  .index-title{grid-template-columns:minmax(0,1fr) max-content}
  .index-title h1{grid-column:1;overflow-wrap:normal;word-break:normal}
  .index-title p{grid-column:2}
}

@media (max-width:620px){
  .portfolio-actions{display:grid;grid-template-columns:1fr}
  .portfolio-actions .portfolio-button,.inquiry-grid .portfolio-button{width:100%}
  .places-hero h1{font-size:clamp(34px,9vw,40px)}
  .section-heading{align-items:start}
  .section-heading .portfolio-button{align-self:start}
  .project-crumb a,.project-meta dd a{position:relative}
  .project-crumb a::before,.project-meta dd a::before{content:"";position:absolute;inset:-15px 0}
  .services-grid a.plain-link{min-height:44px;margin-block:-14px;padding-block:14px}
  .lobby-row>picture{height:220px}
  .place-card-visual,.place-placeholder-visual{height:300px}
  .culture-upcoming .culture-card.is-typographic{min-height:280px;padding:24px}
  .culture-upcoming .culture-card.is-typographic h3{order:-1;margin:0 0 auto}
}

@media (prefers-reduced-motion:reduce){
  .portfolio-page *{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .project-card:hover .project-card-media img,.culture-card:hover .culture-visual img,.services-grid article:hover .portfolio-media img,.place-index-card:hover .place-card-visual img,.place-feature-card:hover .place-photo img{transform:none}
}