.energy-story{padding:76px 0 78px;--story-rule:#24463529;--story-muted:#566a5e}
.energy-story .section-meta{margin-bottom:32px}
.energy-story-intro{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}
.energy-story-intro h2{font-size:clamp(34px,3.5vw,52px);line-height:1.4;letter-spacing:-.05em;margin:0;text-wrap:balance}
.energy-story-intro h2 span{color:#436b37}
.energy-story-intro>div{max-width:470px;justify-self:end}
.energy-story-lead{font-size:20px;line-height:1.6;margin-bottom:12px;letter-spacing:-.025em}
.energy-story-intro>div>p:last-child{font-size:13px;line-height:1.9;color:var(--story-muted);margin:0}
.energy-story-elements{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-block:1px solid var(--story-rule);margin-top:30px;padding:17px 0}
.energy-story-element{display:grid;grid-template-columns:34px auto;column-gap:13px;row-gap:3px;padding:0 23px;border-inline-end:1px solid var(--story-rule);align-items:center}
.energy-story-element:first-child{padding-left:0}
.energy-story-element:last-child{border:0;padding-right:0}
.energy-story-element svg{width:32px;height:30px;grid-row:span 2;fill:none;stroke:#4e7759;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.energy-element-word{font-size:22px;line-height:1.15;letter-spacing:-.04em}
.energy-element-label{font-size:10px;line-height:1.5;letter-spacing:.04em;color:var(--story-muted)}
html[lang=zh-CN] .hero h1{font-size:clamp(58px,5.6vw,90px);line-height:1.25}
html[lang=en] .hero h1{font-size:clamp(48px,4.75vw,76px);line-height:1.2;letter-spacing:-.055em}
html[lang=en] .energy-element-word{font:10px/1.3 var(--mono);letter-spacing:.05em}
html[lang=en] .energy-element-label{font-size:11px;letter-spacing:0}
html[lang=en] .energy-story-intro h2{line-height:1.2;letter-spacing:-.055em}
@media(min-width:1600px){
 html[lang=zh-CN] .hero h1{font-size:98px}
 html[lang=en] .hero h1{font-size:84px}
}
@media(max-width:1100px){
 .energy-story{padding:62px 0}
 .energy-story-intro{gap:42px}
 .energy-story-intro h2{font-size:38px}
 .energy-story-lead{font-size:18px}
 .energy-story-element{padding-inline:12px;column-gap:8px;grid-template-columns:30px auto}
 .energy-story-element svg{width:28px}
 html[lang=en] .energy-element-word{font-size:8px}
 html[lang=en] .energy-element-label{font-size:10px}
}
@media(max-width:760px){
 .hero-background{mask-image:linear-gradient(180deg,transparent,#000 130px)}
 .energy-story{padding:54px 0 60px}
 .energy-story .section-meta{margin-bottom:24px}
 .energy-story-intro{grid-template-columns:1fr;gap:20px}
 .energy-story-intro h2{font-size:34px;line-height:1.4}
 .energy-story-intro>div{max-width:560px;justify-self:start}
 .energy-story-lead{font-size:17px;margin-bottom:9px}
 .energy-story-intro>div>p:last-child{font-size:12px}
 .energy-story-elements{margin-top:24px;padding-block:15px}
 .energy-story-element{grid-template-columns:1fr;justify-items:center;padding:0 5px;gap:7px}
 .energy-story-element:first-child{padding-left:0}
 .energy-story-element:last-child{padding-right:0}
 .energy-story-element svg{grid-row:auto;width:25px;height:25px}
 .energy-element-word{font-size:21px}
 .energy-element-label{font-size:8px;letter-spacing:0;text-align:center}
 html[lang=zh-CN] .hero h1{font-size:clamp(35px,8.9vw,60px);line-height:1.32}
 html[lang=en] .hero h1{font-size:clamp(27px,7.8vw,54px);line-height:1.24}
 html[lang=en] .energy-element-word{font-size:clamp(6px,1.65vw,9px);letter-spacing:0}
 html[lang=en] .energy-element-label{font-size:8px;line-height:1.45;max-width:65px}
}