.service-portfolio{margin-top:70px;margin-bottom:75px}.service-portfolio .section-heading{align-items:end;gap:24px}.service-portfolio .section-heading h2{font-size:clamp(28px,3vw,43px);line-height:1.12}.service-portfolio .section-heading p:not(.eyebrow){font-size:14px;color:#72726c;line-height:1.7;margin-top:16px}.service-portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}.service-project-card{display:block;color:inherit;text-decoration:none;min-width:0}.service-project-photo{height:260px;overflow:hidden;background:#f1f0ed;position:relative}.service-project-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s}.service-project-photo>span{position:absolute;bottom:14px;right:14px;background:#fff;width:34px;height:34px;border-radius:50%;display:grid;place-items:center}.service-project-card:hover img{transform:scale(1.025)}.service-project-meta{display:flex;gap:12px;justify-content:space-between;font-size:11px;color:#74746e;margin:17px 0 9px;line-height:1.5}.service-project-card h3{font-size:21px;font-weight:400;line-height:1.3;letter-spacing:-.025em}.service-project-card:focus-visible{outline:2px solid #324b42;outline-offset:6px}.service-project-inquiry{background:#f3f3ef;padding:35px;display:flex;flex-direction:column;justify-content:center;grid-column:span 2}.service-portfolio-grid:has(>a:nth-child(2)) .service-project-inquiry{grid-column:auto}.service-project-inquiry h3{font-size:29px;font-weight:400;letter-spacing:-.03em}.service-project-inquiry p{font-size:14px;line-height:1.8;color:#73736b;max-width:420px;margin:16px 0 24px}.service-project-inquiry a{align-self:start}.service-film-section{padding-top:30px;padding-bottom:35px}.service-film-frame video{object-fit:contain;background:#ecece8}.shower-film-grid video{height:360px!important;max-height:360px;object-fit:contain;background:#eaeae6}.shower-film-section{padding-top:50px!important;padding-bottom:50px!important}.service-detail-hero figure,.service-hero figure{max-height:520px;overflow:hidden}.service-detail-hero figure img,.service-hero figure img{max-height:520px;object-fit:cover}
@media(max-width:900px){.service-project-photo{height:220px}.service-portfolio-grid{gap:18px}.service-project-meta{display:block}.service-project-meta span{display:block}.service-project-card h3{font-size:19px}.service-project-inquiry{padding:24px}}
@media(max-width:650px){.service-portfolio{margin-top:45px;margin-bottom:45px}.service-portfolio .section-heading{align-items:start;gap:20px}.service-portfolio-grid{grid-template-columns:1fr;gap:30px}.service-project-photo{height:230px}.service-project-meta{display:flex}.service-project-inquiry{grid-column:auto;padding:26px}.service-detail-hero figure,.service-hero figure{max-height:340px}.shower-film-grid video{height:320px!important}}

/* Leave room for the header, breadcrumb and hero spacing on laptop screens. */
.service-detail-hero{--service-media-height:clamp(280px,calc(100svh - 245px),580px);padding:20px 0 28px}
.service-detail-hero>figure{height:var(--service-media-height);max-height:500px}
.service-hero-media{--film-controls-height:0px;min-width:0;width:100%;max-width:390px;justify-self:center;background:#f4f3f1;padding:16px}
.service-hero-media.has-film-choices{--film-controls-height:52px}
.service-detail-hero figure.service-hero-film{height:auto;max-height:none;overflow:visible;margin:0}
.service-hero-player{height:calc(var(--service-media-height) - 32px - var(--film-controls-height));display:flex;justify-content:center}
.service-hero-player video{display:block;width:auto;max-width:100%;height:100%;object-fit:contain;background:#ecece8}
.service-film-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:min(100%,280px);margin:10px auto 0}
.service-film-choices button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;height:42px;padding:5px 10px;background:transparent;border:1px solid #d8d7d2;color:#666;cursor:pointer}
.service-film-choices button[aria-pressed=true]{border-color:#171717;background:#fff;color:#111}
.service-film-choices button:hover{border-color:#171717;color:#111}
.service-film-choices button:focus-visible{outline:2px solid #111;outline-offset:3px}
.service-film-choices img{width:20px;height:30px;object-fit:cover}
.service-film-arrow{width:18px;height:18px;flex:none}
@media(min-width:961px) and (max-height:740px){
 .service-detail-hero h1{font-size:clamp(36px,3.6vw,50px);margin:14px 0}
 .service-detail-hero .page-lead{font-size:14px;line-height:1.7}
 .service-detail-hero .hero-buttons{margin-top:24px}
}
@media(min-width:641px){.service-hero{padding-top:20px;padding-bottom:28px}.service-hero figure{height:clamp(280px,calc(100svh - 245px),500px)}}
@media(max-width:640px){
 .service-detail-hero{padding:24px 0 32px}
 .service-hero-media{max-width:340px;margin:26px auto 0;padding:14px}
 .service-hero-player{height:auto;max-width:260px;margin:0 auto}
 .service-hero-player video{width:100%;height:auto}
}