
.how-hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:35px;align-items:center;padding-block:45px 30px}.how-hero h1{font-size:clamp(38px,4.2vw,60px);font-weight:400;line-height:1.12;letter-spacing:-.03em;max-width:12ch;margin-bottom:24px}.how-lead{font-size:18px;line-height:1.6;max-width:39ch;margin-bottom:27px}.how-art{width:100%;aspect-ratio:1.5;background-image:url(signal-journey.png);background-size:200% 400%;background-position:var(--art-x) var(--art-y);background-repeat:no-repeat;border-radius:12px;overflow:hidden}.hero-art{align-self:center}.how-paths{display:grid;grid-template-columns:1fr 1fr;background:var(--soft);border-radius:18px;padding:23px 26px;gap:26px}.how-paths>a{display:flex;align-items:center;justify-content:space-between;gap:20px;text-decoration:none;font-size:18px;font-weight:500;min-height:55px;padding:0 12px}.how-paths>a+ a{border-left:1px solid #aaa;padding-left:35px}.how-paths strong{display:block;font-weight:500}.how-paths small{display:block;font-size:13px;font-weight:400;margin-top:4px}.path-arrow{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--yellow);flex-shrink:0;font-size:22px;font-weight:400}.journey{padding-top:48px;scroll-margin-top:30px}.journey h2{font-size:clamp(30px,3.2vw,45px);font-weight:400;margin-bottom:30px}.journey-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;position:sticky;top:0;background:#fffffff7;z-index:3;padding-block:15px 13px;backdrop-filter:blur(8px)}.journey-nav a{border-bottom:1px solid var(--line);text-align:center;text-decoration:none;font-size:13px;padding:7px 3px 12px;position:relative}.journey-nav a[aria-current=step]:after{content:'';position:absolute;height:4px;background:var(--yellow);bottom:-1px;left:12%;right:12%}.journey-nav span{font-size:12px}.how-timeline{position:relative;padding-top:24px}.how-timeline:before{content:'';position:absolute;left:50%;top:55px;bottom:30px;width:1px;background:var(--yellow);transform:translateX(-50%)}.how-step{display:grid;grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);gap:18px;align-items:center;position:relative;padding-block:20px;scroll-margin-top:85px}.step-art{grid-column:1;grid-row:1;min-width:0}.step-marker{grid-column:2;grid-row:1;justify-self:center;width:34px;height:34px;border-radius:50%;background:var(--yellow);display:flex;justify-content:center;align-items:center;font-size:16px;z-index:1}.step-copy{grid-column:3;grid-row:1;padding:15px 18px}.how-step:nth-child(even) .step-art{grid-column:3}.how-step:nth-child(even) .step-copy{grid-column:1}.step-copy h3{font-size:clamp(23px,2.25vw,32px);font-weight:450;line-height:1.2;letter-spacing:-.025em;margin-bottom:13px}.step-summary{font-size:17px;line-height:1.5;margin-bottom:15px}.step-detail{font-size:14px;line-height:1.6;color:#555;margin-bottom:0;max-width:53ch}.process-note{text-align:center;font-size:12px;font-style:italic;color:#555;padding:20px 0;margin:0 0 24px}.existing-solar{display:grid;grid-template-columns:auto 1fr 1fr 1fr;align-items:center;border:1px solid #bbb;border-radius:9px;padding:20px 23px;gap:20px;scroll-margin-top:100px}.existing-solar h2{font-size:16px;font-weight:500;letter-spacing:0;margin:0;white-space:nowrap}.existing-solar a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-left:20px;border-left:1px solid #bbb;font-size:12px;text-decoration:none}.existing-solar a span{font-size:21px;line-height:1}.how-faq{padding-top:30px}.how-faq .faq{padding:16px 0;border-bottom:1px solid var(--line)}.how-faq .faq:first-child{border-top:1px solid var(--line)}.how-close{text-align:center;padding-block:38px 42px}.how-close h2{font-size:clamp(29px,2.8vw,39px);font-weight:400;margin-bottom:22px}.how-page .footer{margin-bottom:0}@media(hover:hover){.how-paths>a:hover,.existing-solar a:hover{text-decoration:underline;text-underline-offset:5px}.journey-nav a:hover{background:#f8f8f4}}@media(max-width:1050px){.how-hero{gap:20px}.how-hero h1{font-size:45px}.how-lead{font-size:16px}.how-paths{padding:20px;gap:20px}.how-paths>a{font-size:16px;padding:0}.how-paths>a+a{padding-left:23px}.how-step{gap:10px;grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr)}.step-copy{padding:10px}.step-summary{font-size:16px}.step-detail{font-size:13px}.existing-solar{grid-template-columns:1fr 1fr 1fr;gap:15px;padding:20px}.existing-solar h2{grid-column:1/-1}.existing-solar a{padding-left:15px}.existing-solar a:nth-child(2){border-left:0;padding-left:0}}@media(max-width:750px){.how-hero{grid-template-columns:1fr;padding-top:30px;gap:22px}.how-hero h1{font-size:clamp(37px,7vw,52px);max-width:18ch}.how-lead{max-width:58ch;font-size:17px}.hero-art{max-width:620px;margin-inline:auto}.how-paths{grid-template-columns:1fr;padding:20px;gap:17px}.how-paths>a{font-size:17px}.how-paths>a+a{border-left:0;border-top:1px solid #bbb;padding:18px 0 0}.journey{padding-top:35px}.journey h2{font-size:34px;margin-bottom:15px}.journey-nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px 15px;padding-block:10px}.journey-nav a{font-size:12px;padding-bottom:8px}.how-timeline:before{left:16px;top:50px;bottom:35px;transform:none}.how-step{grid-template-columns:34px minmax(0,1fr);gap:15px;padding-block:20px;scroll-margin-top:140px;align-items:start}.step-marker{grid-column:1;grid-row:1;align-self:start;margin-top:18px;width:32px;height:32px}.step-art,.how-step:nth-child(even) .step-art{grid-column:2;grid-row:1}.step-copy,.how-step:nth-child(even) .step-copy{grid-column:2;grid-row:2;padding:0}.step-copy h3{font-size:28px}.step-summary{font-size:17px}.step-detail{font-size:14px}.process-note{text-align:left;padding-left:49px;margin-bottom:15px}.existing-solar{grid-template-columns:1fr;gap:0;padding:20px;scroll-margin-top:140px}.existing-solar h2{margin-bottom:9px;font-size:18px}.existing-solar a,.existing-solar a:nth-child(2){border-left:0;border-top:1px solid var(--line);padding:14px 0;font-size:14px}.existing-solar a:last-child{padding-bottom:0}.how-close{padding-block:30px 35px}}@media(max-width:380px){.how-hero h1{font-size:35px}.journey h2{font-size:30px}.how-step{gap:10px;grid-template-columns:30px minmax(0,1fr)}.step-marker{width:28px;height:28px;font-size:14px}.how-timeline:before{left:14px}.step-copy h3{font-size:25px}.process-note{padding-left:40px}}

.how-art{display:block;background:none;object-fit:contain;height:auto}.how-hero h1{max-width:14ch}.load-example{display:grid;grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr);gap:30px;align-items:center;background:#f8f8f5;border:1px solid #eee;border-radius:17px;padding:25px 30px;margin-top:20px}.load-example h2{font-size:clamp(27px,2.7vw,39px);font-weight:400;margin-bottom:20px}.load-example h2:after{content:'';display:block;width:45px;height:3px;background:var(--yellow);margin-top:18px}.load-example>div>p{font-size:13px;font-style:italic;margin:0}.load-example figure{margin:0;min-width:0}.load-example img{width:100%;height:auto}.load-example figcaption{font-size:11px;color:#555;line-height:1.5;margin-top:8px}.step-detail a{text-underline-offset:4px}@media(max-width:750px){.load-example{grid-template-columns:1fr;gap:20px;padding:23px}.load-example h2 br{display:none}.load-example h2{margin-bottom:10px;font-size:30px}.load-example h2:after{margin-top:13px}}

.how-hero h1{max-width:16ch}.how-art{aspect-ratio:auto}.journey-nav{grid-template-columns:repeat(5,minmax(0,1fr))}.signal-example,.site-example{padding-block:45px 15px}.signal-example h2,.site-example h2{font-size:clamp(30px,3.5vw,46px);font-weight:400;letter-spacing:-.025em}.signal-example>p,.site-example p{line-height:1.7}.signal-controls{display:flex;flex-wrap:wrap;gap:10px;margin:25px 0}.signal-controls[hidden],.signal-panel[hidden]{display:none}.signal-controls button{font:inherit;font-size:15px;cursor:pointer;border:1px solid #999;border-radius:28px;background:white;color:var(--ink);padding:13px 21px;min-height:46px}.signal-controls button[aria-pressed=true]{background:var(--yellow);border-color:#746b00}.signal-controls button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}.signal-panels{background:var(--soft);border:1px solid var(--line);border-radius:17px;padding:28px}.signal-panel figure{margin:0}.signal-panel svg{display:block;width:100%;height:auto}.signal-panel h3{font-size:27px;font-weight:400;margin:20px 0 12px}.signal-panel>p{line-height:1.7;margin:0;max-width:80ch}.example-note{font-size:12px;color:#555;line-height:1.6;margin-top:17px}.site-roles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-top:30px}.site-roles article{border-top:3px solid var(--yellow);padding-top:20px}.site-roles h3{font-size:25px;font-weight:400;line-height:1.3}.site-roles p{font-size:16px}.site-roles a{font-size:14px}.how-faq{padding-top:40px}@media(max-width:750px){.site-roles{grid-template-columns:1fr}.signal-panels{padding:16px}.signal-controls button{flex:1 1 45%}.journey-nav{grid-template-columns:repeat(5,minmax(100px,1fr));overflow-x:auto}.signal-panel h3{font-size:25px}}

.signal-panel figure,.site-diagram{overflow-x:auto}.signal-panel figure svg,.site-diagram svg{min-width:600px}.site-diagram{margin:25px 0 0;border:1px solid var(--line);border-radius:16px;padding:18px;background:var(--soft)}.site-diagram svg{display:block;width:100%;height:auto}
