/* Focused refinement of Craig's approved Power Night theme. */
main { padding-top:var(--header); }
.header { justify-content:space-between; }
.header-actions { margin-left:auto; }
.header .menu-toggle { display:flex; width:46px; height:46px; }
.mobile-nav { left:auto; right:24px; width:min(390px,calc(100vw - 32px)); max-height:calc(100dvh - var(--header) - 16px); overflow:auto; padding:22px; border:1px solid #0b5cff4d; border-radius:0 0 18px 18px; background:#1b1b1b; box-shadow:0 24px 60px #0009; }
.mobile-nav:not([hidden]) { display:block; }
.mobile-nav a,.mobile-nav button { width:100%; font-size:14px; padding:11px 4px; min-height:44px; color:var(--paper); border-bottom:1px solid #ffffff12; }
.mobile-nav a { display:flex; justify-content:space-between; align-items:center; }
.mobile-nav a[aria-current] { color:var(--signal); }
.menu-label { font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--signal); padding:10px 4px; }
.menu-destinations { display:grid; grid-template-columns:1fr 1fr; gap:0 20px; margin-bottom:10px; }
.menu-destinations a span { color:var(--signal); }
.hero { height:auto; min-height:min(760px,calc(100svh - var(--header))); max-height:none; padding:64px 0 110px; align-items:start; }
.hero-content { align-self:start; }
.hero h1 { font-size:clamp(70px,8.5vw,124px); }
.hero-description { max-width:590px; }
.hero .eyebrow { margin-bottom:20px; }
.hero .hero-note { max-width:500px; margin-inline:auto; text-align:center; }
.product-grid { grid-template-columns:1.05fr 1fr; gap:60px; align-items:center; }
.products { padding-block:86px 72px; }
.product-copy h2 { font-size:clamp(44px,4.8vw,70px); }
.product-copy .lead { font-size:17px; line-height:1.65; margin-top:24px; }
.product-benefits { margin-top:28px; border-top:1px solid var(--signal-line); }
.product-benefit { display:grid; grid-template-columns:26px 1fr; gap:12px; padding:17px 0; border-bottom:1px solid #ffffff1a; }
.benefit-index { font-size:11px; color:var(--signal); padding-top:4px; letter-spacing:.05em; }
.product-benefit h3 { font-family:Geist,sans-serif; font-size:17px; font-weight:600; line-height:1.35; letter-spacing:-.02em; color:var(--paper); }
.product-benefit p { color:var(--muted); font-size:13px; line-height:1.6; margin-top:7px; }
.product-design-note { font-size:11px; line-height:1.65; color:var(--muted); margin-top:12px; max-width:470px; }
.product-art { min-width:0; }
.product-art-disc { top:4%; width:98%; background:radial-gradient(circle,#0b5cff16 0,transparent 65%); border:1px solid #0b5cff45; }
.product-art-disc:before { content:''; position:absolute; inset:11%; border:1px solid #0b5cff3d; border-radius:50%; }
.product-art-disc:after { content:''; position:absolute; inset:23%; border:1px solid #0b5cff45; border-radius:50%; }
.product-art #product-image { object-fit:contain; height:470px; width:100%; position:relative; z-index:1; border:0; box-shadow:none; }
.product-art #product-image[data-kind="enphase"] { transform:scale(1.08); }
.product-art #product-image[data-kind="nexis"] { transform:scale(1.08); }
.art-caption { text-align:center; min-height:34px; font-size:11px; margin-top:20px; padding-inline:8px; }
.carousel-controls { gap:12px; margin-top:20px; width:100%; }
.carousel-dots { gap:5px; }
.carousel-dots button { display:flex; align-items:center; justify-content:center; border:1px solid #ffffff2b; padding:10px 13px; border-radius:100px; min-height:44px; font-size:11px; font-weight:600; color:#c4c4c4; }
.carousel-dots button:after { display:none; }
.carousel-dots button[aria-pressed="true"] { background:var(--signal); border-color:var(--signal); color:var(--night); }
.carousel-controls .circle-button { width:40px; height:40px; flex:0 0 40px; }
#savings { padding-top:76px; }
.why-grid article { background:linear-gradient(145deg,#242424,#1b1b1b); padding:30px; border:1px solid #0b5cff3b; border-radius:12px; }
.why-grid article .why-symbol { display:block; font-family:Fander,Geist,sans-serif; font-size:56px; line-height:1; color:#0b5cff70; margin-bottom:38px; }
.why-grid .why-kicker { display:block; font-size:10px; }
.why-grid h3 { font-size:29px; line-height:1.1; margin-top:16px; }
.why-grid p { margin-top:16px; }
#markets.markets-compact { padding-block:50px; border-block:1px solid #0b5cff3b; background:#1b1b1b; }
.market-picker { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:start; }
.markets-compact .eyebrow { margin-bottom:12px; font-size:10px; }
.markets-compact h2 { font-size:clamp(30px,3.4vw,46px); color:var(--paper); }
.markets-compact .lead { margin-top:15px; font-size:14px; max-width:430px; }
.market-control label { display:block; margin:0 0 10px; font-size:12px; color:var(--muted); }
.market-control select { appearance:none; font:inherit; font-size:16px; background:#242424; color:#ffffff; width:100%; min-height:60px; border:1px solid #0b5cff80; padding:16px 48px 16px 20px; border-radius:8px; cursor:pointer; }
.market-control option { background:#242424; color:#ffffff; }
.select-wrap { position:relative; }
.select-wrap:after { content:''; position:absolute; right:23px; top:24px; width:9px; height:9px; border-right:2px solid var(--signal); border-bottom:2px solid var(--signal); transform:rotate(45deg); pointer-events:none; }
.market-detail { padding-top:24px; }
.market-detail h3 { font-family:Fander,Geist,sans-serif; font-size:29px; margin-block:8px 12px; color:var(--paper); }
.market-detail > p:last-child { color:var(--muted); font-size:14px; line-height:1.7; }
.market-detail[hidden] { display:none; }
.experience-grid { grid-template-columns:1fr 1fr; gap:72px; }
.energy-preview { isolation:isolate; padding:25px 12px 0; }
.energy-orbit { position:absolute; border:1px solid #0b5cff24; border-radius:50%; width:540px; height:540px; z-index:-1; top:100px; left:50%; transform:translateX(-50%); }
.orbit-two { width:400px; height:400px; top:170px; border-color:#0b5cff40; }
.energy-preview .phone { width:320px; height:680px; transform:rotate(-4deg); padding:8px; border-radius:46px; background:linear-gradient(135deg,#b9b9b9,#454545 25%,#141414 75%,#858585); border:1px solid #a4a4a4; box-shadow:25px 45px 70px #000b,0 0 70px #0b5cff14; }
.energy-preview .phone-camera { width:80px; height:20px; top:19px; background:#090909; }
.energy-screen { background:radial-gradient(ellipse at 50% 35%,#253a68,#181818 67%); border-radius:38px; padding:16px 18px; color:var(--paper); }
.energy-top { display:flex; justify-content:space-between; font-size:10px; padding:0 8px; }
.energy-brand { margin-top:19px; display:flex; justify-content:space-between; align-items:center; }
.energy-brand img { width:93px; height:38px; object-fit:contain; }
.system-ready { display:flex; gap:5px; align-items:center; font-size:8px; color:#c4c4c4; }
.system-ready i,.ready-dot { width:6px; height:6px; background:var(--signal); border-radius:50%; box-shadow:0 0 12px #0b5cff; }
.energy-welcome { margin-top:18px; }
.energy-welcome > span { color:#b8b8b8; font-size:10px; }
.energy-welcome strong { display:block; font-size:17px; font-weight:550; letter-spacing:-.03em; margin-top:5px; }
.energy-gauge { position:relative; width:200px; height:200px; margin:8px auto 3px; }
.energy-gauge svg { position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.energy-gauge circle { fill:none; stroke-width:5; }
.gauge-track { stroke:#343434; }
.energy-gauge .gauge-value { stroke:var(--signal); stroke-linecap:round; stroke-dasharray:540.35; stroke-dashoffset:70.25; filter:drop-shadow(0 0 5px #0b5cff55); transition:stroke-dashoffset .6s ease; }
.energy-gauge > div { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.energy-gauge span { font-size:9px; color:#c4c4c4; }
.energy-gauge strong { font-size:64px; font-weight:500; line-height:1.2; letter-spacing:-.08em; font-variant-numeric:tabular-nums; }
.energy-gauge small { font-size:22px; letter-spacing:-.04em; }
.energy-gauge .charge-status { color:var(--signal); font-size:9px; margin-top:2px; }
.energy-flow { display:flex; align-items:center; justify-content:center; margin:3px 16px 10px; }
.energy-flow span { display:grid; place-items:center; flex:0 0 34px; height:34px; border:1px solid #0b5cff50; border-radius:10px; background:#242424; }
.energy-flow svg { width:16px; height:16px; fill:none; stroke:var(--signal); stroke-width:1.4; }
.energy-flow i { height:1px; flex:1; background:#0b5cff4d; position:relative; }
.energy-flow i:after { content:''; width:5px; height:5px; position:absolute; top:-2px; background:var(--signal); box-shadow:0 0 8px var(--signal); border-radius:50%; animation:energy-travel 3s linear infinite; }
@keyframes energy-travel { from{left:0} to{left:95%} }
.energy-stats { display:grid; grid-template-columns:repeat(3,1fr); text-align:center; padding-bottom:18px; border-bottom:1px solid #ffffff12; }
.energy-stats span { font-size:9px; color:#c4c4c4; display:block; }
.energy-stats strong { font-size:18px; font-weight:500; display:block; margin-top:4px; font-variant-numeric:tabular-nums; }
.energy-stats small { font-size:8px; font-weight:400; color:#c4c4c4; }
.energy-chart { padding-top:15px; }
.energy-chart > div:first-child { display:flex; justify-content:space-between; font-size:9px; }
.energy-chart > div:first-child > span:last-child { color:var(--signal); font-size:8px; }
.energy-bars { height:52px; margin-top:14px; display:flex; gap:5px; align-items:end; }
.energy-bars i { height:var(--bar); flex:1; background:linear-gradient(0deg,#0b5cff30,var(--signal)); border-radius:2px 2px 0 0; transition:height .5s; }
.energy-bars i:nth-last-child(-n+5) { background:linear-gradient(0deg,#f4ff0025,#f4ff00); }
.energy-axis { display:flex; justify-content:space-between; margin-top:6px; font-size:7px; color:#a8a8a8; }
.energy-tabs { display:flex; gap:4px; margin-top:19px; background:#141414; padding:4px; border:1px solid #ffffff14; border-radius:100px; }
.energy-tabs button { flex:1; border:0; background:transparent; color:#c4c4c4; border-radius:100px; min-height:36px; font-size:10px; }
.energy-tabs button[aria-pressed="true"] { background:var(--signal); color:#141414; font-weight:700; }
.phone-home-line { width:85px; height:3px; background:#ffffffb0; border-radius:3px; margin:17px auto 0; }
.energy-floating { position:absolute; top:475px; right:-7px; padding:18px; background:#202020ed; border:1px solid #0b5cff6b; border-radius:12px; display:flex; gap:12px; align-items:center; box-shadow:0 15px 35px #0008; transform:rotate(3deg); }
.energy-floating span:not(.ready-dot) { display:block; color:var(--signal); font-size:10px; }
.energy-floating strong { display:block; font-size:14px; font-weight:500; margin-top:5px; }
.energy-preview .phone-caption { text-align:center; font-size:12px; line-height:1.6; margin-top:35px; }
.phone-caption > span { display:block; color:var(--muted); font-size:9px; margin-top:5px; }
[data-energy-mode="night"] .energy-gauge .gauge-value { stroke:#f4ff00; }
[data-energy-mode="night"] .energy-flow i:after { animation-direction:reverse; }
[data-energy-mode="backup"] .energy-flow i:after { animation-duration:5s; }
[data-energy-mode="backup"] .energy-bars i { height:calc(var(--bar) * .6); }
.story-card[data-info="support"] img { object-position:50% 45%; }
@media(max-width:1100px) {
  .product-grid { gap:35px; }
  .product-art #product-image { height:390px; }
  .carousel-dots button { padding-inline:10px; font-size:10px; }
  .experience-grid { gap:40px; }
  .energy-floating { right:-12px; padding:14px; }
}
@media(max-width:960px) {
  .hero { min-height:690px; padding-top:44px; }
  .hero h1 { font-size:clamp(68px,10vw,98px); }
  .product-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .product-copy h2 { font-size:clamp(32px,4.8vw,48px); }
  .product-benefit h3 { font-size:15px; }
  .product-benefit p { font-size:12px; }
  .carousel-controls { gap:6px; }
  .carousel-controls .circle-button { display:none; }
  .market-picker { gap:30px; }
  .experience-grid { display:flex; flex-direction:column; gap:40px; }
  .experience-copy { display:contents; }
  .experience-intro { order:0; width:100%; }
  .energy-preview { order:1; }
  .experience-features { order:2; width:100%; }
  .experience-copy > .text-link { order:3; align-self:flex-start; }
  .energy-preview { width:100%; max-width:500px; margin:auto; }
  .energy-floating { right:10px; }
  .experience-copy { max-width:660px; }
}
@media(max-width:640px) {
  .header .menu-toggle { width:42px; height:42px; }
  .mobile-nav { right:12px; }
  .hero { min-height:calc(100svh - var(--header)); padding:36px 0 100px; }
  .hero h1 { font-size:clamp(52px,13.8vw,78px); line-height:.98; }
  .hero .eyebrow { margin-bottom:22px; }
  .hero-description { font-size:15px; line-height:1.65; margin-top:25px; }
  .product-grid { display:flex; flex-direction:column; gap:24px; }
  .product-copy { display:contents; }
  .product-intro { order:0; width:100%; }
  .product-art { order:1; }
  .product-benefits { order:2; width:100%; margin-top:0; }
  #product-source { order:3; align-self:flex-start; margin-top:0; }
  .product-design-note { order:4; align-self:flex-start; margin-top:-12px; }
  .products { padding-block:56px; }
  .product-copy h2 { font-size:clamp(41px,10.5vw,58px); }
  .product-copy .lead { font-size:15px; }
  .product-benefit { padding-block:15px; }
  .product-benefit h3 { font-size:16px; }
  .product-benefit p { font-size:13px; }
  .product-art { width:100%; max-width:440px; }
  .product-art #product-image { height:330px; }
  .carousel-controls { gap:10px; }
  .carousel-controls .circle-button { display:inline-grid; width:34px; height:34px; flex-basis:34px; }
  .carousel-dots button { padding:10px 12px; font-size:10px; }
  .art-caption { font-size:10px; }
  #savings { padding-top:56px; }
  .why-grid article { padding:25px; }
  .why-grid article .why-symbol { margin-bottom:25px; }
  .market-picker { grid-template-columns:1fr; gap:25px; }
  #markets.markets-compact { padding-block:38px; }
  .markets-compact h2 { font-size:34px; }
  .experience-grid { display:flex; flex-direction:column; gap:40px; }
  .energy-preview { padding-inline:0; }
  .energy-preview .phone { width:300px; height:670px; transform:rotate(-3deg); }
  .energy-floating { right:-3px; top:484px; padding:13px; }
  .energy-floating strong { font-size:12px; }
  .energy-orbit { width:370px; height:370px; top:150px; }
  .orbit-two { width:280px; height:280px; top:195px; }
  .energy-screen { padding-inline:16px; }
}
@media(max-width:360px) {
  .product-art #product-image { height:285px; }
  .carousel-controls .circle-button { display:none; }
  .energy-preview .phone { width:272px; }
  .energy-floating { right:-2px; top:490px; }
  .energy-orbit { width:290px; height:290px; top:190px; }
  .orbit-two { width:230px; height:230px; top:220px; }
}
@media(prefers-reduced-motion:reduce) {
  .energy-flow i:after { animation:none; left:50%; }
  .gauge-value,.energy-bars i { transition:none; }
}

/* Official Prosper colors within the approved dark presentation.
   Blue carries large accents and actions; yellow identifies selected states.
   Small text stays white/yellow so it remains legible on the dark surfaces. */
:root {
  --prosper-blue: #0b5cff;
  --prosper-blue-functional: #0746c4;
  --prosper-yellow: #f4ff00;
  --prosper-ink: #141414;
  --prosper-white: #ffffff;
  --signal: var(--prosper-blue);
  --signal-strong: var(--prosper-blue-functional);
  --yellow: var(--prosper-yellow);
  --paper: var(--prosper-white);
}
::selection { background:var(--yellow); color:var(--night); }
:focus-visible { outline-color:var(--yellow); }
.brand img,.brand-watermark { filter:none; }
.eyebrow,.why-kicker,.step-label { color:var(--yellow) !important; }
.menu-label,.menu-destinations a span,.mobile-nav a[aria-current],
.mobile-nav a:last-child,.benefit-index { color:var(--yellow); }
.menu-toggle,.circle-button,.video-toggle,.dialog-close,.quote-person a {
  color:var(--paper);
}
.button { background:var(--prosper-blue); color:var(--paper); }
.button:hover { background:var(--prosper-blue-functional); color:var(--paper); }
.button.yellow,.footer-quote > a.button { background:var(--yellow); color:var(--night); }
.button.yellow:hover { background:var(--paper); color:var(--night); }
.hero h1 > span:last-child,.closing h2 span {
  color:var(--yellow); text-shadow:0 0 26px #f4ff002b;
}
.hero .button.yellow,.closing .button.yellow {
  background:var(--prosper-blue); color:var(--paper);
  box-shadow:0 0 0 1px #0b5cff66,0 12px 30px #00000070;
}
.hero .button.yellow:hover,.closing .button.yellow:hover {
  background:var(--prosper-blue-functional); color:var(--paper);
}
.header .outline:hover,.circle-button:hover:enabled,.video-toggle:hover,
.dialog-close:hover { background:var(--prosper-blue); color:var(--paper); }
.text-link,.explore,.phone-caption,.day-night-grid figcaption,
.footer-main h2,.footer a:hover,.footer button:hover,
.story-top,.step-icon,.journey-controls,.faq-list summary:after,
.feature-list > div > span,.experience-features > div > span,
.service-icon,.dialog-secondary,.dialog-lead strong { color:var(--yellow); }
.text-link:hover { color:var(--paper); }
.carousel-dots button { color:var(--paper); }
.carousel-dots button[aria-pressed="true"],
.energy-tabs button[aria-pressed="true"] {
  background:var(--yellow); border-color:var(--yellow); color:var(--night);
}
.choice-card:before,.why-grid article:before,.market-card:before {
  background:var(--yellow); box-shadow:0 0 16px #f4ff003d;
}
.select-wrap:after { border-color:var(--yellow); }
.market-control select { border-color:var(--prosper-blue); }
.market-control select:focus-visible { border-color:var(--yellow); }
.savings-highlight {
  background:linear-gradient(120deg,var(--prosper-blue-functional),var(--prosper-blue));
  border-color:var(--prosper-blue);
}
.bill-comparison > div:last-child strong { color:var(--paper); }
.comparison-arrow { color:var(--yellow); }
.bill-range { accent-color:var(--yellow); }
.bill-range::-webkit-slider-thumb { background:var(--yellow); }
.bill-range::-moz-range-thumb { background:var(--yellow); }
.proposal-tabs button[aria-selected="true"] { color:var(--yellow); border-color:var(--yellow); }
.energy-screen { background:radial-gradient(ellipse at 50% 35%,#0b5cff20,#181818 67%); }
.system-ready i,.ready-dot { background:var(--yellow); box-shadow:0 0 12px #f4ff0040; }
.energy-gauge .charge-status,.energy-chart > div:first-child > span:last-child,
.energy-floating span:not(.ready-dot) { color:var(--yellow); }
.energy-flow svg { stroke:var(--yellow); }
.energy-flow i:after { background:var(--yellow); box-shadow:0 0 8px #f4ff0080; }
.energy-bars i { background:linear-gradient(0deg,#0b5cff66,var(--prosper-blue)); }
.energy-bars i:nth-last-child(-n+5) { background:linear-gradient(0deg,#f4ff003d,var(--yellow)); }
[data-energy-mode="night"] .energy-gauge .gauge-value { stroke:var(--yellow); }
.story-arrow { color:var(--paper); }
.story-card:hover .story-arrow { background:var(--yellow); border-color:var(--yellow); color:var(--night); }

/* Visual sweep: explicit control surfaces prevent browser-default white boxes. */
button.text-link {
  appearance:none; -webkit-appearance:none;
  border:0; border-radius:0; padding:0;
  background:transparent; box-shadow:none; text-align:left;
  color:var(--yellow); cursor:pointer;
}
button.text-link:hover { background:transparent; color:var(--paper); }
.story-card { background-color:var(--night); }
.energy-brand img,.proposal-top img { object-fit:contain; filter:none; }
.button.yellow:hover { background:var(--prosper-blue); color:var(--paper); }
.footer-quote > a.button:hover { background:var(--prosper-blue); color:var(--paper); }
.energy-tabs button:not([aria-pressed="true"]):hover,
.carousel-dots button:not([aria-pressed="true"]):hover {
  background:#0b5cff33; color:var(--paper); border-color:var(--prosper-blue);
}
.circle-button:disabled { opacity:.4; cursor:default; }
.mobile-nav a:hover,.mobile-nav button:hover { color:var(--yellow); background:#0b5cff1a; }
.mobile-nav :focus-visible,.energy-tabs button:focus-visible,
.carousel-dots button:focus-visible,.proposal-tabs button:focus-visible,
button.text-link:focus-visible {
  outline:2px solid var(--yellow); outline-offset:4px;
}
#main #quote h2 span { color:var(--yellow); }
#main .film-scene { overflow:hidden; }
#lifetime-saving { color:var(--paper); }
.journey > .container > .button,.closing > .container > .button,
.savings > .container > .button { margin-top:28px; }