.page-hero {
    background: var(--G);
    padding: calc(var(--header-h) + 1rem) 3rem 1.5rem;
    position: relative;
    overflow: hidden;
}
/* Soft circle glow — blue on blue, subtle */
.page-hero::before {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 55% 90% at 100% 0%,
            rgba(59,130,246,.28) 0%, transparent 55%),
        radial-gradient(ellipse 35% 50% at 0% 100%,
            rgba(255,255,255,.04) 0%, transparent 50%);
}

.page-hero::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 320' preserveAspectRatio='xMidYMax slice'%3E%3C!-- Ground --%3E%3Crect x='0' y='240' width='1200' height='80' fill='rgba(15%2C31%2C92%2C0.45)'/%3E%3C!-- Hills --%3E%3Cellipse cx='250' cy='240' rx='320' ry='55' fill='rgba(18%2C40%2C105%2C0.5)'/%3E%3Cellipse cx='900' cy='240' rx='380' ry='50' fill='rgba(18%2C40%2C105%2C0.45)'/%3E%3C!-- Wind Turbine 1 --%3E%3Crect x='98' y='100' width='5' height='142' fill='rgba(255%2C255%2C255%2C0.22)'/%3E%3Ccircle cx='100' cy='98' r='5' fill='rgba(255%2C255%2C255%2C0.22)'/%3E%3Cpath d='M100 92 Q82 55 70 30 Q88 62 100 92Z' fill='rgba(255%2C255%2C255%2C0.22)'/%3E%3Cpath d='M100 92 Q128 80 148 72 Q122 84 100 92Z' fill='rgba(255%2C255%2C255%2C0.22)'/%3E%3Cpath d='M100 92 Q106 64 104 40 Q102 66 100 92Z' fill='rgba(255%2C255%2C255%2C0.22)'/%3E%3C!-- Wind Turbine 2 --%3E%3Crect x='198' y='118' width='4' height='124' fill='rgba(255%2C255%2C255%2C0.18)'/%3E%3Ccircle cx='200' cy='116' r='4' fill='rgba(255%2C255%2C255%2C0.18)'/%3E%3Cpath d='M200 111 Q185 78 175 58 Q190 82 200 111Z' fill='rgba(255%2C255%2C255%2C0.18)'/%3E%3Cpath d='M200 111 Q222 102 238 96 Q218 106 200 111Z' fill='rgba(255%2C255%2C255%2C0.18)'/%3E%3Cpath d='M200 111 Q205 88 203 70 Q201 90 200 111Z' fill='rgba(255%2C255%2C255%2C0.18)'/%3E%3C!-- Wind Turbine 3 --%3E%3Crect x='298' y='108' width='4' height='134' fill='rgba(255%2C255%2C255%2C0.16)'/%3E%3Ccircle cx='300' cy='106' r='4' fill='rgba(255%2C255%2C255%2C0.16)'/%3E%3Cpath d='M300 101 Q285 68 275 48 Q290 72 300 101Z' fill='rgba(255%2C255%2C255%2C0.16)'/%3E%3Cpath d='M300 101 Q322 92 338 86 Q318 96 300 101Z' fill='rgba(255%2C255%2C255%2C0.16)'/%3E%3Cpath d='M300 101 Q305 78 303 60 Q301 80 300 101Z' fill='rgba(255%2C255%2C255%2C0.16)'/%3E%3C!-- Solar Farm --%3E%3Cg opacity='0.28'%3E%3Crect x='370' y='200' width='28' height='20' rx='2' fill='none' stroke='white' stroke-width='1.2'/%3E%3Cline x1='379' y1='200' x2='379' y2='220' stroke='white' stroke-width='0.8'/%3E%3Cline x1='389' y1='200' x2='389' y2='220' stroke='white' stroke-width='0.8'/%3E%3Cline x1='370' y1='207' x2='398' y2='207' stroke='white' stroke-width='0.8'/%3E%3Cline x1='370' y1='214' x2='398' y2='214' stroke='white' stroke-width='0.8'/%3E%3Crect x='404' y='200' width='28' height='20' rx='2' fill='none' stroke='white' stroke-width='1.2'/%3E%3Cline x1='413' y1='200' x2='413' y2='220' stroke='white' stroke-width='0.8'/%3E%3Cline x1='423' y1='200' x2='423' y2='220' stroke='white' stroke-width='0.8'/%3E%3Cline x1='404' y1='207' x2='432' y2='207' stroke='white' stroke-width='0.8'/%3E%3Cline x1='404' y1='214' x2='432' y2='214' stroke='white' stroke-width='0.8'/%3E%3Crect x='438' y='200' width='28' height='20' rx='2' fill='none' stroke='white' stroke-width='1.2'/%3E%3Cline x1='447' y1='200' x2='447' y2='220' stroke='white' stroke-width='0.8'/%3E%3Cline x1='457' y1='200' x2='457' y2='220' stroke='white' stroke-width='0.8'/%3E%3Cline x1='438' y1='207' x2='466' y2='207' stroke='white' stroke-width='0.8'/%3E%3Cline x1='438' y1='214' x2='466' y2='214' stroke='white' stroke-width='0.8'/%3E%3C/g%3E%3C!-- Hydro Dam --%3E%3Crect x='520' y='170' width='80' height='70' rx='2' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.28)' stroke-width='1.2'/%3E%3Crect x='548' y='170' width='24' height='42' rx='1' fill='rgba(255%2C255%2C255%2C0.08)' stroke='rgba(255%2C255%2C255%2C0.22)' stroke-width='1'/%3E%3Cpath d='M520 218 Q535 208 560 218 Q585 228 600 218' fill='none' stroke='rgba(255%2C255%2C255%2C0.3)' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M520 230 Q535 220 560 230 Q585 240 600 230' fill='none' stroke='rgba(255%2C255%2C255%2C0.18)' stroke-width='0.9' stroke-linecap='round'/%3E%3C!-- Green H2 Tank --%3E%3Crect x='640' y='196' width='46' height='38' rx='10' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.28)' stroke-width='1.2'/%3E%3Crect x='686' y='208' width='10' height='14' rx='2' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.22)' stroke-width='1'/%3E%3Ctext x='663' y='220' text-anchor='middle' fill='rgba(255%2C255%2C255%2C0.55)' font-size='13' font-weight='700' font-family='Poppins%2Csans-serif'%3EH%E2%82%82%3C%2Ftext%3E%3C!-- Biomass Plant --%3E%3Crect x='755' y='195' width='40' height='45' rx='2' fill='rgba(255%2C255%2C255%2C0.05)' stroke='rgba(255%2C255%2C255%2C0.22)' stroke-width='1'/%3E%3Cpath d='M775 195 Q762 178 766 162 Q771 170 775 166 Q774 156 779 150 Q781 160 779 166 Q783 161 784 155 Q786 164 783 172 Q780 180 775 195Z' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.3)' stroke-width='1.1'/%3E%3C!-- Waste to Energy Stack --%3E%3Crect x='850' y='185' width='36' height='55' rx='2' fill='rgba(255%2C255%2C255%2C0.05)' stroke='rgba(255%2C255%2C255%2C0.22)' stroke-width='1'/%3E%3Crect x='860' y='160' width='16' height='30' rx='2' fill='rgba(255%2C255%2C255%2C0.05)' stroke='rgba(255%2C255%2C255%2C0.2)' stroke-width='1'/%3E%3Cpath d='M868 160 Q862 150 864 142 Q867 148 868 144 Q869 138 872 134 Q873 142 871 147 Q874 143 875 138 Q876 145 874 152 Q872 157 868 160Z' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.3)' stroke-width='1'/%3E%3C!-- EV on road --%3E%3Crect x='950' y='220' width='1200' height='3' fill='rgba(255%2C255%2C255%2C0.08)'/%3E%3Crect x='960' y='206' width='64' height='24' rx='6' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.28)' stroke-width='1.1'/%3E%3Crect x='972' y='197' width='28' height='12' rx='3' fill='rgba(255%2C255%2C255%2C0.05)' stroke='rgba(255%2C255%2C255%2C0.2)' stroke-width='1'/%3E%3Ccircle cx='976' cy='230' r='7' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.3)' stroke-width='1.1'/%3E%3Ccircle cx='1008' cy='230' r='7' fill='rgba(255%2C255%2C255%2C0.06)' stroke='rgba(255%2C255%2C255%2C0.3)' stroke-width='1.1'/%3E%3Cpath d='M982 212 L987 218 L984 218 L990 224' fill='none' stroke='rgba(255%2C255%2C255%2C0.35)' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C!-- Stars --%3E%3Ccircle cx='480' cy='40' r='1.5' fill='rgba(255%2C255%2C255%2C0.25)'/%3E%3Ccircle cx='700' cy='25' r='1' fill='rgba(255%2C255%2C255%2C0.2)'/%3E%3Ccircle cx='820' cy='50' r='1.5' fill='rgba(255%2C255%2C255%2C0.2)'/%3E%3Ccircle cx='1050' cy='35' r='1' fill='rgba(255%2C255%2C255%2C0.18)'/%3E%3Ccircle cx='1130' cy='60' r='1.5' fill='rgba(255%2C255%2C255%2C0.15)'/%3E%3C/svg%3E") center calc(100% + 120px) / cover no-repeat;
    pointer-events: none;
}

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

.hero-inner { position: relative; z-index: 1; max-width: 740px; }

.hero-label {
    display: inline-flex; align-items: center; gap: .55rem;
    font-size: .65rem; font-weight: 700; letter-spacing: 3.5px;
    text-transform: uppercase; color: rgba(255,255,255,.5);
    margin-bottom: .65rem;
}
.hero-label-dot {
    width: 5px; height: 5px; border-radius: 50%;
    background: var(--light); flex-shrink: 0;
}

.page-hero h1 {
    font-size: clamp(1.8rem, 3.4vw, 2.6rem);
    font-weight: 800; margin: 0 0 .35rem;
    line-height: 1.12; color: var(--white);
    letter-spacing: -.025em;
    animation: fadeUp .5s ease both;
}
.page-hero h1 em {
    font-style: normal;
    background: linear-gradient(105deg, var(--white) 40%, var(--light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-sub {
    font-size: .88rem; color: rgba(255,255,255,.78);
    margin: 0 0 1.6rem; letter-spacing: .15px;
    animation: fadeUp .5s .12s ease both;
}

.bc-list {
    font-size: .74rem;
    color: rgba(255,255,255,.78);
    display: inline-flex;
    align-items: center; gap: .4rem;
    flex-wrap: wrap; list-style: none; padding: 4px 14px;
    margin: 0 0 1.6rem;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 20px;
    width: fit-content;
    animation: fadeUp .5s .22s ease both;
}
.bc-list li { display: inline-flex; align-items: center; gap: .4rem; }
.bc-list a {
    color: rgba(255,255,255,.88);
    text-decoration: none;
    display: inline-flex; align-items: center; gap: .28rem;
    transition: color .2s;
}
.bc-list a:hover { color: var(--white); text-decoration: underline; }
.bc-list .sep    { font-size: .55rem; opacity: .7; }
.bc-list [aria-current="page"] { color: var(--white); font-weight: 700; }

.hero-pills { display: flex; flex-wrap: wrap; gap: .55rem; }
.pill {
    display: inline-flex; align-items: center; gap: .4rem;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.14);
    color: rgba(255,255,255,.86);
    border-radius: 30px; padding: .32rem .95rem;
    font-size: .71rem; font-weight: 600;
    backdrop-filter: blur(6px);
    letter-spacing: .2px;
}
.pill i { color: var(--light); font-size: .7rem; }

@media (prefers-reduced-motion: reduce) {
    .page-hero h1, .hero-sub, .bc-list { animation: none; }
}
@media (max-width: 992px) {
    .page-hero { padding: calc(var(--header-h) + 0.3rem) 1.5rem 0.75rem; }
}
@media (max-width: 576px) {
    .page-hero { padding: calc(var(--header-h) + 0.2rem) 1.25rem 0.6rem; }
}


/*moving the hero card little down*/
.page-hero {
    margin-top: 51px;
}

@media (max-width: 991.98px) {
    .page-hero {
        margin-top: 70px;
    }
}