/* Energy Deregulator — bold identity, September 2026 */
:root{--ink:#071b2c;--green:#bcf451;--muted:#4e6171;--pale:#f1f4f5;--line:#d5dee4}
body{font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:1240px;padding-inline:36px}
.top{background:var(--green);color:var(--ink);font-weight:700;font-size:13px;padding:7px 0}
header{background:var(--ink);color:white;border-bottom:1px solid #314151}
nav{padding:21px 0;gap:28px}
.brand{display:flex;gap:12px;align-items:center;letter-spacing:0}
.brand:hover{text-decoration:none}
.brand img{width:60px;height:60px;object-fit:contain;background:white;border-radius:4px;flex:none}
.wordmark{font-weight:900;font-size:23px;letter-spacing:1px;line-height:.98}
.wordmark>span{display:block;font-size:18px;letter-spacing:1.2px;margin-top:5px}
.brand small{color:#afbfca;font-size:12px;letter-spacing:.5px;line-height:1.4;margin-top:8px}
.links{font-weight:700;gap:29px}
.links .button{border-color:var(--green);background:var(--green);color:var(--ink);border-radius:3px}
.button{padding:16px 23px;border-radius:3px;transition:background .18s,transform .18s}
.button:hover{transform:translateY(-2px)}
.button.lime:hover,.links .button:hover{background:#d5ff91}
.hero-shell{background:var(--ink);color:white;position:relative;overflow:hidden}
.hero-shell::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.9%,#ffffff06 50%,transparent 50.1%);background-size:140px 100%;pointer-events:none}
.hero{position:relative;grid-template-columns:1.25fr .85fr;gap:64px;padding:68px 0 65px;align-items:center}
.hero .eyebrow{color:var(--green);font-size:12px;letter-spacing:2px;display:flex;gap:12px;align-items:center;margin-bottom:28px}
.eyebrow-rule{display:inline-block;width:29px;height:3px;background:var(--green);flex:none}
.hero h1{font-size:clamp(56px,6.7vw,88px);font-weight:900;line-height:1;letter-spacing:-4.5px;margin:0 0 30px}
.hero h1>span{color:var(--green)}
.hero .intro{font-size:18px;line-height:1.65;color:#c3ced8;max-width:530px}
.hero .actions{margin:29px 0 34px;gap:24px}
.hero .actions>a:not(.button){color:#ecf3f7;font-size:15px;font-weight:700}
.tagrow{border-color:#425363;color:#b5c8d5;font-size:13px;gap:12px 24px;padding-top:21px}
.quote-card{background:white;color:var(--ink);padding:30px;border:0;border-top:5px solid var(--green);border-radius:3px;box-shadow:10px 10px 0 #bcf45117}
.quote-card .form-kicker{font-size:12px;font-weight:800;letter-spacing:2px;color:#52666d;margin:0 0 12px}
.quote-card h2{font-size:32px;letter-spacing:-1.1px;margin-bottom:14px}
.quote-card p{line-height:1.5}
.quote-card .field{margin-bottom:14px}
.quote-card label{font-size:14px;margin-bottom:5px}
.quote-card input,.quote-card select{min-height:45px;padding:10px 11px;background:#f7f9fa;border:1px solid #b6c4cd;border-radius:3px;font-size:15px}
.quote-card input:focus,.quote-card select:focus{outline:2px solid #528524;outline-offset:2px}
.quote-card .button{font-size:15px;background:var(--ink);padding:14px}
.quote-card .micro{font-size:12px;margin-bottom:0}
.quote-card .form-status:empty{display:none}
.section{padding:82px 0}
.eyebrow{color:#3e5b24;font-size:12px;letter-spacing:2px}
h2{font-weight:800;line-height:1.06;letter-spacing:-1.8px;font-size:clamp(33px,3.4vw,46px)}
.headingrow{margin-bottom:37px}
.headingrow p{font-size:16px}
#markets{background:var(--green)}
#markets .eyebrow{color:#344b24}
#markets .headingrow p,#markets .micro{color:#2b422e}
.states{gap:0;border:1px solid #88b337}
.state{background:transparent;border:0;border-right:1px solid #88b337;border-radius:0;padding:25px 22px;gap:10px;min-height:166px;transition:background .18s,color .18s}
.state:last-child{border-right:0}
.state b{font-size:55px;font-weight:900;letter-spacing:-2px}
.state span{font-size:16px;font-weight:700}
.state em{font-size:12px;color:#344b24}
.state:hover{background:var(--ink);color:white}
.state:hover em{color:var(--green)}
.cards{gap:32px}
.card{border-top:3px solid var(--ink);padding-top:23px}
.number{font-size:12px;font-weight:700;letter-spacing:1px;margin-bottom:25px;color:#526978}
.card h3{font-size:27px;max-width:300px}
.card a{font-weight:700;font-size:15px}
.feature{border-radius:0;padding:55px;gap:60px;border-left:7px solid var(--green)}
.feature h2{font-size:42px}
.worksheet{border-radius:0;background:#102b40;border-color:#426074}
.worksheet div{border-color:#426074}
#how .cards{margin-top:45px}
#how .number{font-size:40px;line-height:1;font-weight:900;color:#435e70;letter-spacing:-2px;margin-bottom:20px}
#faq{background:#eaf0f3}
details{padding:24px 0;border-color:#c6d2db}
summary{font-size:18px}
footer{padding:55px 0;background:#051521;border-top:5px solid var(--green)}
.footer-brand{display:flex;align-items:center;gap:13px;text-decoration:none;margin:0 0 24px}
.footer-brand img{background:white;object-fit:contain;border-radius:3px}
.footer-brand strong{font-size:19px;line-height:1.1;letter-spacing:1px}
.article{padding-top:55px;max-width:860px}
.article h1{font-size:clamp(37px,4.5vw,58px);letter-spacing:-2.3px;line-height:1.04}
.article h2{font-size:30px;letter-spacing:-.8px;line-height:1.15}
.article .eyebrow{border-left:5px solid #7bac2a;padding-left:12px}
.source{border-left:4px solid #7bac2a}
.result{border-radius:0;border-top:4px solid var(--green)}
@media(min-width:851px) and (max-width:1100px){.hero{gap:35px;grid-template-columns:1.1fr .9fr}.hero h1{font-size:68px}.links{gap:18px}.wordmark{font-size:20px}.wordmark>span{font-size:16px}.brand img{width:52px;height:52px}.brand small{display:none}}
@media(max-width:850px){.hero{grid-template-columns:1fr;gap:40px;padding:50px 0}.hero h1{font-size:76px;letter-spacing:-3.7px}.hero .intro{max-width:650px}.quote-card{max-width:650px;width:100%}.links{gap:20px}.brand small{display:none}.brand img{width:50px;height:50px}.states{grid-template-columns:repeat(3,1fr)}.state{border-bottom:1px solid #88b337}.state:nth-child(3){border-right:0}.section{padding:60px 0}.feature{grid-template-columns:1fr;gap:30px;padding:35px}.headingrow h2{margin-bottom:15px}}
@media(max-width:560px){.wrap{padding-inline:22px}.top{font-size:12px}.top .wrap span{max-width:200px}nav{padding:20px 0 18px;gap:20px}.brand{gap:11px}.brand img{width:49px;height:49px}.wordmark{font-size:24px}.wordmark>span{font-size:18px}.links{width:100%;gap:27px;font-size:14px}.hero{padding:40px 0 45px;gap:34px}.hero .eyebrow{font-size:12px;letter-spacing:1px;gap:10px}.hero h1{font-size:clamp(48px,12.3vw,67px);letter-spacing:-2.6px;margin-bottom:25px}.hero .intro{font-size:17px}.hero .actions{gap:19px}.hero .button{font-size:14px;padding:15px 18px}.tagrow{font-size:12px;gap:10px 14px}.quote-card{padding:24px;box-shadow:5px 6px 0 #bcf45117}.quote-card h2{font-size:29px}.states{grid-template-columns:1fr 1fr}.state{padding:20px 16px;min-height:154px}.state:nth-child(3){border-right:1px solid #88b337}.state:nth-child(2n){border-right:0}.state b{font-size:48px}.state em{font-size:12px}.section{padding:47px 0}.feature{padding:27px;border-left-width:4px}.feature h2{font-size:32px}.article{padding-inline:23px}.article h1{font-size:39px;letter-spacing:-1.7px}.article h2{font-size:27px}footer .wrap{gap:25px}.footer-brand{gap:12px}}
@media(prefers-reduced-motion:reduce){.button,.state{transition:none}.button:hover{transform:none}}
@media print{.article{max-width:none}.result{background:white;color:black}.result strong{color:black}}
