:root{--ink:#090b0c;--panel:#13181a;--line:#2b3337;--cream:#f4f5f1;--muted:#aab1b4;--green:#8bc53f;--green2:#a9d85e}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:#fff;font:16px/1.72 'DM Sans',sans-serif}
.top{background:#fff;border-bottom:3px solid var(--green)}
.nav{max-width:1180px;height:82px;margin:auto;padding:0 24px;display:flex;align-items:center;gap:28px}
.brand img{display:block;width:205px;height:62px;object-fit:contain}
.nav nav{margin-left:auto;display:flex;gap:24px}
.nav a{color:#222729;text-decoration:none;font-weight:700}
.nav .phone{color:#5f8d2a;border-left:1px solid #d6dbd3;padding-left:24px}
.hub-hero{padding:105px 24px 90px;background:radial-gradient(circle at 78% 20%,rgba(139,197,63,.17),transparent 28%),linear-gradient(135deg,#111719,#080a0b)}
.hero-inner,.wrap{max-width:1132px;margin:auto}
.eyebrow{text-transform:uppercase;color:var(--green2);font-size:.74rem;font-weight:800;letter-spacing:.18em}
.hub-hero h1,.article-hero h1{font:800 clamp(3rem,6.5vw,6rem)/1 'Manrope';letter-spacing:-.055em;margin:18px 0 25px;max-width:960px}
.hub-hero .lead{max-width:700px;color:#c3c9cb;font-size:1.14rem}
.featured{max-width:1132px;margin:75px auto 0;padding:0 24px}
.feature-card{display:grid;grid-template-columns:1.1fr .9fr;background:var(--cream);color:#171a1b;text-decoration:none}
.feature-card img{width:100%;height:100%;min-height:430px;object-fit:cover}
.feature-copy{padding:55px}
.tag{display:inline-block;color:#5d8829;font-weight:800;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.feature-copy h2{font:800 clamp(2rem,4vw,3.6rem)/1.06 'Manrope';letter-spacing:-.045em;margin:18px 0}
.feature-copy p{color:#5c6365}
.read{display:inline-block;margin-top:28px;color:#42671d;font-weight:800}
.posts{max-width:1132px;margin:auto;padding:90px 24px 115px}
.posts-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:35px}
.posts h2{font:800 clamp(2rem,4vw,3.5rem)/1.08 'Manrope';margin:0}
.posts-head p{color:var(--muted);max-width:480px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.post-card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);color:#fff;text-decoration:none;min-height:100%}
.post-card img{width:100%;height:220px;object-fit:cover}
.post-card div{padding:25px;display:flex;flex:1;flex-direction:column}
.post-card h3{font:700 1.32rem/1.25 'Manrope';margin:12px 0}
.post-card p{color:#959da0}
.post-card .read{color:var(--green2);margin-top:auto}
.article-hero{min-height:570px;display:flex;align-items:end;background-position:center;background-size:cover;position:relative}
.article-hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,9,.98),rgba(5,8,9,.68)),linear-gradient(0deg,#090b0c 0,transparent 55%)}
.article-hero .hero-inner{position:relative;z-index:1;width:100%;padding:100px 24px 70px}
.article-hero h1{max-width:1050px;font-size:clamp(2.8rem,5.5vw,5.3rem)}
.meta{color:#b5bcbe}
.article{max-width:820px;margin:auto;padding:75px 24px 95px}
.article .lede{font-size:1.3rem;color:#d7dbdc}
.article h2{font:800 clamp(1.75rem,3vw,2.5rem)/1.15 'Manrope';letter-spacing:-.035em;margin:55px 0 15px}
.article h3{font:700 1.3rem 'Manrope';margin-top:34px}
.article p,.article li{color:#b3b9bc}
.article li{margin-bottom:9px}
.callout{border-left:4px solid var(--green);background:#151b1d;padding:25px 28px;margin:35px 0}
.callout strong{display:block;color:#fff;font-size:1.12rem}
.article img{width:100%;height:auto;margin:35px 0 8px}
.article figcaption{color:#7f878a;font-size:.82rem}
.article-cta{background:linear-gradient(135deg,#76ad31,var(--green2));color:#111;padding:65px 24px}
.article-cta>div{max-width:1000px;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:35px}
.article-cta h2{font:800 clamp(2rem,4vw,3.4rem)/1.08 'Manrope';margin:0}
.btn{display:inline-block;background:#0c0f10;color:#fff;text-decoration:none;font-weight:800;padding:15px 22px;white-space:nowrap}
.more{max-width:1132px;margin:auto;padding:80px 24px}
.more h2{font:800 2.2rem 'Manrope'}
.footer{border-top:1px solid var(--line);max-width:1132px;margin:auto;padding:30px 24px;color:#7f878a;display:flex;justify-content:space-between}
.footer a{color:var(--green2)}
@media(max-width:820px){.nav nav{display:none}
.nav .phone{margin-left:auto}
.feature-card{grid-template-columns:1fr}
.feature-card img{min-height:280px}
.grid{grid-template-columns:1fr}
.posts-head,.article-cta>div{display:block}
.article-cta .btn{margin-top:25px}
.footer{display:block}
}
@media(max-width:520px){.brand img{width:155px}
.nav .phone{font-size:.78rem;padding-left:10px}
.feature-copy{padding:30px}
.hub-hero{padding-top:75px}
.article-hero{min-height:520px}
}
/* Integrated Eclipse Solar and Roof identity */
.top{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)}
.brand{display:block;width:220px;height:68px;overflow:hidden;flex:0 0 auto}.brand img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 51%;filter:contrast(1.07) saturate(1.08)}
.nav a{color:#e8ebe9}.nav a:hover{color:var(--green2)}.nav .phone{color:var(--green2);border-left-color:#303735}
.hub-hero{position:relative;overflow:hidden}.hub-hero:after{content:'';position:absolute;right:7vw;top:115px;width:250px;height:250px;border:1px solid rgba(168,216,93,.18);border-radius:50%;box-shadow:0 0 60px rgba(139,197,63,.06)}
@media(max-width:820px){body{overflow-x:hidden}.nav{height:72px;padding-left:14px;padding-right:14px;gap:12px}.brand{width:174px;height:66px}.brand img{width:100%;object-position:center 46%}}
@media(max-width:520px){.brand{width:164px;height:64px}.brand img{width:100%;object-position:center 46%}}