:root{--ink:#080a0b;--panel:#121719;--line:#2b3337;--muted:#9fa7aa;--green:#8bc53f;--green2:#a8d85d}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:#fff;font:16px/1.6 'DM Sans',sans-serif}
.skip{position:absolute;left:-999px}
.skip:focus{left:1rem;top:1rem;background:#fff;color:#000;padding:.7rem;z-index:20}
.gallery-nav{height:84px;background:#fff;border-bottom:3px solid var(--green);display:flex;align-items:center;padding:0 max(24px,calc((100% - 1400px)/2));gap:28px;position:sticky;top:0;z-index:10}
.gallery-brand img{display:block;width:205px;height:60px;object-fit:contain;mix-blend-mode:multiply}
.back,.call{color:#202527;text-decoration:none;font-weight:700}
.back{margin-left:auto}
.call{color:#5d892b}
.gallery-hero{max-width:1400px;margin:auto;padding:95px 28px 55px}
.eyebrow{text-transform:uppercase;letter-spacing:.2em;color:#c8cdcf;font-size:.76rem;font-weight:700}
.eyebrow span{display:inline-block;width:28px;height:2px;background:var(--green);vertical-align:middle;margin-right:10px}
.gallery-hero h1{font:800 clamp(3.4rem,8vw,7.6rem)/.9 'Manrope';letter-spacing:-.065em;margin:24px 0 30px}
.gallery-hero h1 em{font-style:normal;color:var(--green2)}
.gallery-hero>p:not(.eyebrow){color:#aeb5b8;max-width:700px;font-size:1.12rem}
.filters{display:flex;flex-wrap:wrap;gap:9px;margin-top:42px}
.filters button{font:700 .86rem 'DM Sans';color:#d9ddde;background:#14191b;border:1px solid #354044;padding:11px 18px;cursor:pointer}
.filters button:hover,.filters button.active{background:var(--green);border-color:var(--green);color:#111}
.gallery-wall{max-width:1400px;margin:auto;padding:20px 28px 120px;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:270px;gap:14px}
.tile{position:relative;display:block;border:0;padding:0;margin:0;background:var(--panel);color:#fff;overflow:hidden;text-align:left;cursor:zoom-in;box-shadow:0 20px 45px rgba(0,0,0,.26)}
.tile.wide{grid-column:span 2}
.tile.tall{grid-row:span 2}
.tile img,.tile video{width:100%;height:100%;display:block;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .4s}
.tile:hover img{transform:scale(1.045);filter:brightness(1.08)}
.tile>span{position:absolute;left:0;right:0;bottom:0;padding:55px 19px 17px;background:linear-gradient(transparent,rgba(3,5,6,.94));font:700 1rem 'Manrope';pointer-events:none}
.tile small{display:block;color:#aeb5b7;font:500 .8rem 'DM Sans';margin-top:2px}
.video-tile{cursor:default}
.video-tile video{background:#050606}
.tile[hidden]{display:none}
.gallery-cta{background:linear-gradient(135deg,#76ad31,#a8d85d);color:#111;text-align:center;padding:90px 24px}
.gallery-cta p{font-weight:700}
.gallery-cta h2{font:800 clamp(2.5rem,5vw,5rem)/1 'Manrope';letter-spacing:-.05em;margin:10px 0 30px}
.gallery-cta div{display:flex;justify-content:center;gap:10px}
.gallery-cta a{padding:14px 21px;background:#0b0e0f;color:#fff;text-decoration:none;font-weight:700}
.gallery-cta a+a{background:transparent;color:#111;border:1px solid #111}
.lightbox{width:100vw;height:100vh;max-width:none;max-height:none;border:0;padding:0;background:rgba(2,3,4,.96);color:#fff}
.lightbox[open]{display:grid;grid-template-columns:80px 1fr 80px;align-items:center}
.lightbox::backdrop{background:#020304}
.lightbox figure{margin:0;display:grid;justify-items:center;gap:15px}
.lightbox img{max-width:min(1200px,82vw);max-height:82vh;object-fit:contain;box-shadow:0 30px 90px #000}
.lightbox figcaption{color:#c9cecf}
.lightbox button{background:transparent;color:#fff;border:0;font-size:2rem;cursor:pointer}
.lightbox .close{position:absolute;right:24px;top:15px;font-size:2.7rem}
.lightbox .previous,.lightbox .next{height:100%}
footer{max-width:1400px;margin:auto;padding:35px 28px;display:flex;gap:30px;justify-content:space-between;color:#7f888c;border-top:1px solid var(--line);font-size:.86rem}
footer a{color:#a8d85d}

@media(max-width:950px){.gallery-wall{grid-template-columns:repeat(2,1fr)}
.gallery-nav{padding:0 20px}
.call{display:none}
}

@media(max-width:600px){.gallery-brand img{width:165px}
.back{font-size:.85rem}
.gallery-hero{padding:65px 20px 40px}
.gallery-hero h1{font-size:3.4rem}
.gallery-wall{padding:10px 12px 80px;grid-template-columns:1fr;grid-auto-rows:280px}
.tile.wide{grid-column:span 1}
.tile.tall{grid-row:span 1}
.gallery-cta div{flex-direction:column}
.lightbox[open]{grid-template-columns:46px 1fr 46px}
.lightbox img{max-width:78vw}
.lightbox figcaption{text-align:center;font-size:.85rem}
footer{flex-direction:column}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.tile img{transition:none}
}

.portrait-video video{object-fit:contain;background:radial-gradient(circle at 50% 30%,#1c2527,#050606 70%)}
/* Integrated Eclipse Solar and Roof identity */
.gallery-nav{background:linear-gradient(90deg,#000,#0d1112);border-bottom:1px solid rgba(168,216,93,.45);box-shadow:0 12px 35px rgba(0,0,0,.24)}
.gallery-brand{display:block;width:220px;height:68px;overflow:hidden;flex:0 0 auto}.gallery-brand img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 51%;mix-blend-mode:normal;filter:contrast(1.07) saturate(1.08)}
.back,.call{color:#e8ebe9}.call{color:var(--green2)}
@media(max-width:600px){body{overflow-x:hidden}.gallery-nav{height:72px;padding-left:14px;padding-right:14px;gap:12px}.gallery-brand{width:164px;height:64px}.gallery-brand img{width:100%;object-position:center 46%}}