/* Real project photography uses the existing green, paper and gold palette. */
.client-photo { margin:0; overflow:hidden; background:#e6e7de; }
.client-photo img { width:100%; height:100%; object-fit:cover; }
.client-photo figcaption { padding:12px 16px; font-size:11px; color:var(--green); background:#eeeee4; }
.about-feature>.client-photo { align-self:start; }
.about-feature>.client-photo img { height:auto; aspect-ratio:4/3; object-fit:contain; }
#structure .service-gallery img { object-position:center 65%; }
#finishes .service-gallery .client-photo img { aspect-ratio:4/3; object-position:center 70%; }
.project-opening { display:grid; grid-template-columns:.8fr 1.2fr; gap:64px; align-items:center; padding-block:70px; }
.project-opening h1 { font-size:clamp(46px,5.4vw,78px); }
.project-opening>div>p:not(.eyebrow) { margin-top:28px; max-width:42ch; }
.project-opening .button { margin-top:28px; }
.project-opening-note { margin-top:40px; padding-top:22px; border-top:1px solid var(--line); }
.project-opening-note>span { font-size:10px; letter-spacing:.14em; font-weight:600; }
.project-opening-note p { font-size:13px; margin-top:8px; max-width:40ch; }
.project-cover { min-width:0; background:#e8e8df; }
.project-cover img { width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; }
.project-cover figcaption { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding:18px 22px; background:var(--green); color:var(--paper); font-size:12px; }
.gallery-intro { max-width:36ch; }
.project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:42px 24px; }
.project-card { min-width:0; }
.project-photo-button { display:block; width:100%; padding:0; position:relative; background:#e8e8df; overflow:hidden; color:#fff; }
.project-photo-button img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; transition:transform .5s ease; }
.project-photo-button[data-project-photo="masonry-front"] img,.project-photo-button[data-project-photo="exterior-scaffold"] img { object-position:center 65%; }
.project-photo-button[data-project-photo^="interior"] img { object-position:center 70%; }
.photo-expand { position:absolute; right:14px; bottom:14px; display:grid; place-items:center; width:44px; height:44px; background:var(--green); font-size:22px; }
.project-caption { display:flex; align-items:flex-start; gap:16px; padding-top:20px; }
.project-number { font-size:12px; color:#806634; padding-top:3px; }
.project-caption .eyebrow { margin-bottom:8px; font-size:10px; }
.project-caption .eyebrow:before { display:none; }
.project-caption h3 { font-family:var(--serif); font-size:28px; }
.project-preview { display:grid; grid-template-columns:.8fr 1.2fr; gap:64px; align-items:center; }
.project-preview>div>p:not(.eyebrow) { margin-top:24px; }
.project-preview .text-link { margin-top:18px; }
.project-preview-pair { display:grid; grid-template-columns:1fr 1fr; gap:18px; min-width:0; }
.project-preview-pair .client-photo img { height:auto; aspect-ratio:3/4; object-fit:cover; }
.project-preview-pair .client-photo:last-child { margin-top:48px; }
.elevation-study { background:#e9ecdf; }
.elevation-comparison { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.elevation-comparison figure { min-width:0; background:var(--paper); }
.elevation-comparison img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; object-position:center 66%; }
.elevation-comparison figcaption { padding:16px 20px; font-size:13px; color:var(--green); }
.concept-disclaimer { max-width:80ch; margin-top:24px; font-size:13px; }
.elevation-study .text-link { margin-top:12px; }
.project-lightbox { padding:0; border:0; width:min(1100px,calc(100% - 32px)); max-height:calc(100dvh - 32px); color:var(--ink); background:var(--paper); overflow:auto; }
.project-lightbox::backdrop { background:rgba(10,25,21,.9); }
.project-lightbox-bar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 20px; }
.project-lightbox-bar h2 { font-family:var(--sans); font-size:18px; line-height:1.5; letter-spacing:0; }
.photo-close,.project-lightbox-controls button { flex-shrink:0; width:48px; height:48px; background:var(--green); color:#fff; font-size:24px; }
.lightbox-image { width:100%; height:min(68dvh,760px); object-fit:contain; background:#18251f; }
.project-lightbox-controls { padding:12px 20px; display:flex; justify-content:center; align-items:center; gap:24px; }
:root:has(.project-lightbox[open]) { overflow:hidden; }
html[lang="ta"] .project-opening h1 { font-size:clamp(30px,3.5vw,52px); line-height:1.55; }
html[lang="ta"] .project-caption h3 { font-family:var(--sans); font-size:19px; line-height:1.7; }
html[lang="ta"] .project-lightbox-bar h2 { font-size:16px; line-height:1.65; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .project-photo-button:hover img { transform:scale(1.035); } }
@media(max-width:1100px) { .project-opening,.project-preview { gap:32px; } .project-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:900px) { .project-opening { grid-template-columns:1fr; } .project-opening>div>p:not(.eyebrow) { max-width:62ch; } .project-opening-note { display:none; } .project-preview { grid-template-columns:1fr; } }
@media(max-width:700px) {
  .project-opening { padding-block:42px; gap:28px; }
  .project-opening h1 { font-size:clamp(43px,11vw,66px); }
  .project-grid,.elevation-comparison { grid-template-columns:1fr; gap:32px; }
  .project-caption h3 { font-size:27px; }
  .project-caption { padding-top:16px; }
  .project-preview-pair { gap:12px; }
  .client-photo figcaption { padding:10px; font-size:10px; }
  .project-cover figcaption { padding:14px; }
  .project-lightbox { width:calc(100% - 20px); max-height:calc(100dvh - 20px); }
  .project-lightbox-bar { padding:10px 12px; }
  .project-lightbox-bar h2 { font-size:15px; }
  .lightbox-image { height:58dvh; }
  html[lang="ta"] .project-opening h1 { font-size:clamp(29px,7vw,40px); }
}
