.portfolio-page{padding-bottom:70px}.portfolio-heading{max-width:900px;padding:44px 0 30px}.portfolio-heading h1{font-size:clamp(42px,6vw,78px);line-height:.98;margin:18px 0}.portfolio-heading p{font-size:19px;line-height:1.55;max-width:760px;margin:0 0 24px;color:#496157}.portfolio-filters{display:flex;gap:9px;flex-wrap:wrap;margin:4px 0 26px}.portfolio-filters button{border:1px solid #c9ded3;background:#fff;color:#173d31;border-radius:999px;padding:10px 15px;font:inherit;font-weight:700;cursor:pointer}.portfolio-filters button:hover,.portfolio-filters button:focus-visible,.portfolio-filters button.active{background:#167a58;color:#fff;border-color:#167a58}.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.portfolio-card{position:relative;border:0;border-radius:22px;overflow:hidden;background:#0c3328;padding:0;min-height:280px;cursor:zoom-in;text-align:left;box-shadow:0 12px 34px rgba(18,64,49,.12)}.portfolio-card[hidden]{display:none}.portfolio-card picture,.portfolio-card img{display:block;width:100%;height:100%;position:absolute;inset:0}.portfolio-card img{object-fit:cover;transition:transform .3s ease}.portfolio-card:hover img{transform:scale(1.025)}.portfolio-card>span{position:absolute;inset:auto 0 0;padding:48px 18px 17px;color:#fff;background:linear-gradient(transparent,rgba(5,27,21,.86))}.portfolio-card b,.portfolio-card small{display:block}.portfolio-card b{font-size:17px}.portfolio-card small{margin-top:5px;opacity:.82}.portfolio-cta{margin-top:38px;border-radius:25px;background:#edf7f1;padding:30px;display:flex;justify-content:space-between;align-items:center;gap:30px}.portfolio-cta h2{margin:8px 0}.portfolio-cta p{margin:0;color:#496157}.portfolio-lightbox{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;border:0;padding:50px 80px;background:rgba(4,20,15,.94);color:#fff}.portfolio-lightbox[open]{display:grid;grid-template-columns:54px 1fr 54px;place-items:center}.portfolio-lightbox::backdrop{background:rgba(4,20,15,.94)}.portfolio-lightbox figure{margin:0;max-width:min(1100px,78vw)}.portfolio-lightbox img{display:block;max-width:100%;max-height:78vh;margin:auto;border-radius:12px}.portfolio-lightbox figcaption{text-align:center;margin-top:13px;font-weight:700}.portfolio-lightbox button{border:0;background:rgba(255,255,255,.14);color:#fff;border-radius:50%;width:48px;height:48px;font-size:25px;cursor:pointer}.portfolio-lightbox .lightbox-close{position:absolute;top:18px;right:20px}.portfolio-lightbox button:focus-visible{outline:3px solid #6be0ad;outline-offset:3px}.portfolio-hero{align-items:stretch}.portfolio-hero-media{display:block;overflow:hidden;border-radius:22px;min-height:330px}.portfolio-hero-media img{width:100%;height:100%;object-fit:cover;display:block}.construction-card-media{display:block;height:180px;margin:-24px -24px 20px;overflow:hidden}.construction-card-media img{width:100%;height:100%;object-fit:cover;display:block}.service-detail-media{display:block;overflow:hidden;border-radius:22px;min-height:350px}.service-detail-media img{display:block;width:100%;height:100%;object-fit:cover}.service-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.service-gallery picture{display:block;height:260px;border-radius:18px;overflow:hidden}.service-gallery img{width:100%;height:100%;object-fit:cover;display:block}@media(max-width:900px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}.service-gallery{grid-template-columns:1fr 1fr}.portfolio-lightbox{padding:55px 14px}.portfolio-lightbox[open]{grid-template-columns:44px 1fr 44px}.portfolio-lightbox figure{max-width:calc(100vw - 116px)}.portfolio-hero-media{min-height:260px}}@media(max-width:580px){.portfolio-grid,.service-gallery{grid-template-columns:1fr}.portfolio-card{min-height:310px}.service-gallery picture{height:240px}.portfolio-heading{padding-top:28px}.portfolio-cta{align-items:flex-start;flex-direction:column}.portfolio-lightbox[open]{grid-template-columns:1fr}.portfolio-lightbox .lightbox-prev,.portfolio-lightbox .lightbox-next{position:absolute;bottom:18px}.portfolio-lightbox .lightbox-prev{left:20px}.portfolio-lightbox .lightbox-next{right:20px}.portfolio-lightbox figure{max-width:100%}}
