/* Concept 01 composition: one wide image beneath selectable HTML text. */
.gt3-page{--project-hero-height:clamp(560px,47vw,820px)}
.gt3-page .project-hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:var(--project-hero-height);padding:40px 0;overflow:hidden;background:var(--paper)}
.gt3-page .project-hero-inner{position:relative;z-index:2;pointer-events:none}
.gt3-page .project-hero-copy{width:40%;max-width:580px;padding:0;pointer-events:auto}
.gt3-page .project-hero .eyebrow{font-size:12px;letter-spacing:.24em;margin-bottom:28px}
.gt3-page .project-hero h1{font-size:clamp(3.7rem,5.8vw,6.9rem);line-height:.98;letter-spacing:-.045em;margin:0 0 28px}
.gt3-page .project-hero h1 em{color:var(--gold)}
.gt3-page .project-hero .intro-copy{max-width:490px;padding:0;margin:0}
.gt3-page .project-hero .intro-copy p{font-size:clamp(1rem,1.2vw,1.25rem);line-height:1.65;margin-bottom:27px}
.gt3-page .project-hero .button{min-height:56px;padding:17px 25px;gap:26px}
.gt3-page .hero-discover{display:flex;width:fit-content;margin-top:20px;font-size:14px}
.gt3-page .project-hero-visual{position:absolute;z-index:1;inset:0;width:100%;height:100%;max-width:none;margin:0;pointer-events:none}
.gt3-page .project-hero-visual .hero-figure,.gt3-page .project-hero-visual .photo-open,.gt3-page .project-hero-visual picture{display:block;position:relative;width:100%;height:100%;margin:0;border:0;border-radius:0}
.gt3-page .project-hero-visual .photo-open{pointer-events:auto}
.gt3-page .project-hero-visual .hero-figure img{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;object-position:right bottom;filter:none}
.gt3-page .project-hero-visual .photo-open::before,.gt3-page .project-hero-visual .photo-open::after{content:none;background:none;mask-image:none;-webkit-mask-image:none}
.gt3-page .project-hero-visual figcaption{display:none}
.gt3-page .cta-explanation{font-size:14px;line-height:1.65;margin:16px 0 0;max-width:440px}
.gt3-page .material-photo img{width:100%;max-height:610px;object-fit:cover;object-position:center 57%}
.gt3-page .portrait-gallery{row-gap:42px}
.gt3-page .project-invite{padding:65px 0;border-top:1px solid var(--line)}
.gt3-page .project-invite>.shell{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}
.gt3-page .project-invite h2{margin-bottom:16px}
.gt3-page .project-invite>.shell>div:last-child{justify-self:end}
.gt3-page .project-invite p:last-child{margin-bottom:0}
.gt3-page .treatment{row-gap:0}
.gt3-page .treatment-heading{grid-column:1;grid-row:1}
.gt3-page .treatment-copy{grid-column:1;grid-row:2}
.gt3-page .treatment .project-specs{grid-column:2;grid-row:2;align-self:start;margin:0;padding:5px 0 0;border-top:0}
@media(max-width:1100px) and (min-width:761px){
.gt3-page{--project-hero-height:clamp(510px,49vw,600px)}
.gt3-page .project-hero-copy{width:40%}
.gt3-page .project-hero h1{font-size:clamp(2.8rem,5.3vw,4rem)}
.gt3-page .project-hero .button{font-size:14px;padding:14px 17px;gap:12px}
.gt3-page .project-hero .eyebrow{font-size:11px}
.gt3-page .project-hero-visual .hero-figure img{object-fit:contain;object-position:right bottom}
}
@media(max-width:760px){
.gt3-page .project-hero{display:flex;flex-direction:column;min-height:0;padding:30px 0 0;gap:28px}
.gt3-page .project-hero-copy{width:100%;max-width:none}
.gt3-page .project-hero h1{font-size:clamp(3.2rem,11vw,4.6rem)}
.gt3-page .project-hero-visual{position:relative;inset:auto;width:100%;height:auto;margin:0}
.gt3-page .project-hero-visual .photo-open{height:auto;aspect-ratio:1.45}
.gt3-page .project-hero-visual .hero-figure img{object-fit:cover;object-position:center 68%}
.gt3-page .material-photo img{max-height:none;height:auto;object-fit:contain}
.gt3-page .project-invite{padding:50px 0}
.gt3-page .project-invite>.shell{grid-template-columns:1fr;gap:24px}
.gt3-page .project-invite>.shell>div:last-child{justify-self:start}
.gt3-page .treatment-heading,.gt3-page .treatment-copy,.gt3-page .treatment .project-specs{grid-column:1;grid-row:auto}
.gt3-page .treatment .project-specs{margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}
}

/* Keep the treatment heading in the first desktop viewport. */
@media(min-width:761px){
 .gt3-page{--project-hero-height:clamp(460px,calc(100svh - 340px),680px)}
 .gt3-page .project-hero{padding:18px 0}
 .gt3-page .project-hero h1{font-size:clamp(3.1rem,min(5.5vw,7svh),6rem);margin-bottom:20px}
 .gt3-page .project-hero .eyebrow{margin-bottom:20px}
 .gt3-page .project-hero .intro-copy p{margin-bottom:20px}
 .gt3-page .project-hero .button{min-height:50px;padding:14px 24px}
 .gt3-page .hero-discover{margin-top:16px}
 .gt3-page .project-hero-visual .hero-figure img{object-position:right 82%}
 .gt3-page .treatment{padding-top:40px}
}

/* Gold rule matches the full width of the project detail rows. */
.gt3-page .treatment .project-specs{position:relative}
.gt3-page .treatment .project-specs::before{content:'';position:absolute;top:-16px;left:0;right:0;border-top:1px solid var(--gold);pointer-events:none}
@media(max-width:760px){.gt3-page .treatment .project-specs{border-top-color:var(--gold)}.gt3-page .treatment .project-specs::before{content:none}}

.gt3-page .overview-action{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:16px}
.gt3-page .overview-action .button:first-child{justify-self:end}
.gt3-page .overview-action .button:last-child{justify-self:start}
@media(max-width:600px){.gt3-page .overview-action{grid-template-columns:minmax(0,1fr);gap:12px}.gt3-page .overview-action .button{width:100%;justify-content:space-between}}

/* Quiet return link above the hero copy, aligned with its left edge. */
.gt3-page .hero-all-projects{display:inline-flex;align-items:center;gap:14px;min-height:44px;margin:0 0 12px;padding:0;color:#8c8271;font-size:16px;font-weight:400;text-decoration:none}
.gt3-page .hero-all-projects .arrow{width:22px;height:22px;transform:rotate(180deg)}
.gt3-page .hero-all-projects:hover{color:var(--gold)}
.gt3-page .hero-all-projects:focus-visible{outline:2px solid var(--gold);outline-offset:5px}

/* Match the wide, soft left-to-right transition of the established hero artwork.
   Mask the actual image, not its larger container: portrait and landscape photos
   then both blend from their visible left edge without a hard rectangular seam. */
.gt3-page.original-project .project-hero-visual{left:32%;width:68%;right:0}
.gt3-page.original-project .project-hero-visual .photo-open{display:flex;justify-content:flex-end;align-items:center;mask-image:none;-webkit-mask-image:none}
.gt3-page.original-project .project-hero-visual .hero-figure img{position:relative;inset:auto;width:auto;height:100%;max-width:100%;object-fit:contain;object-position:right center;mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.03) 4%,rgba(0,0,0,.15) 9%,rgba(0,0,0,.4) 15%,rgba(0,0,0,.7) 21%,rgba(0,0,0,.92) 28%,#000 35%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.03) 4%,rgba(0,0,0,.15) 9%,rgba(0,0,0,.4) 15%,rgba(0,0,0,.7) 21%,rgba(0,0,0,.92) 28%,#000 35%)}
.gt3-page.original-project .material-photo img{object-fit:contain}
@media(max-width:760px){
 .gt3-page.original-project .project-hero-visual{left:auto;right:auto;width:100%}
 .gt3-page.original-project .project-hero-visual .photo-open{aspect-ratio:auto;mask-image:none;-webkit-mask-image:none}
 .gt3-page.original-project .project-hero-visual .hero-figure img{position:static;width:100%;height:auto;object-fit:contain;mask-image:none;-webkit-mask-image:none}
}

.gt3-page .recommendations-complete{display:block}.gt3-page .recommendations-note{max-width:650px;margin:0 auto;text-align:center;color:var(--muted);line-height:1.7}
