#websites .solar-demo{position:relative;isolation:isolate;height:560px;min-height:0;padding:0;background:#080e17;overflow:hidden;color:#fff;--sx:65%;--sy:62%;--radius:105px;touch-action:pan-y;cursor:crosshair}#websites .solar-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}#websites .solar-night{filter:brightness(.17) saturate(.55) sepia(.15);transform:none}#websites .solar-day{mask-image:radial-gradient(circle var(--radius) at var(--sx) var(--sy),#000 65%,transparent 100%);-webkit-mask-image:radial-gradient(circle var(--radius) at var(--sx) var(--sy),#000 65%,transparent 100%);opacity:0;transition:opacity .25s}#websites .solar-demo.lit .solar-day{opacity:1}#websites .solar-shade{position:absolute;inset:0;background:linear-gradient(#050c17bb,transparent 55%,#050c1788);pointer-events:none}#websites .solar-copy{position:relative;z-index:2;padding:30px;pointer-events:none}#websites .solar-copy p{color:#e7eee9;font-size:9px;letter-spacing:.2em;margin:0 0 24px}#websites .solar-copy h3{font-size:clamp(30px,3.1vw,44px);line-height:1.04;letter-spacing:-.045em;color:#fff;max-width:400px;margin:0;text-shadow:0 2px 18px #0008}#websites .solar-copy h3 em{color:#e0edcb;font-style:normal}#websites .solar-controls{position:absolute;z-index:3;left:24px;right:24px;bottom:22px;display:flex;align-items:center;justify-content:space-between;gap:16px}#websites .solar-controls span{font-size:11px;line-height:1.5;color:#eee;max-width:155px}#websites .solar-controls button{font:inherit;font-size:12px;white-space:nowrap;background:#eff3e8;color:#111;border:1px solid #fff8;border-radius:100px;padding:12px 16px;cursor:pointer}#websites .solar-controls button:focus-visible{outline:3px solid #ff6039;outline-offset:4px}#websites .solar-demo.day-mode .solar-day{mask-image:none;-webkit-mask-image:none;opacity:1}#websites .solar-demo:focus-visible{outline:3px solid #ff6039;outline-offset:-3px}@media(max-width:600px){#websites .solar-demo{height:470px;--radius:88px}#websites .solar-copy{padding:24px}#websites .solar-copy h3{font-size:32px}#websites .solar-controls{left:18px;right:18px;gap:8px}#websites .solar-controls span{font-size:10px}}@media(prefers-reduced-motion:reduce){#websites .solar-day{transition:none}}

#websites .solar-controls .solar-switch{width:76px;height:44px;padding:5px;display:flex;align-items:center;justify-content:space-between;background:#121c22cc;border:1px solid #ffffff80;box-shadow:inset 0 2px 6px #0005;backdrop-filter:blur(12px)}
#websites .solar-switch svg{width:18px;height:18px;margin-left:5px;fill:none;stroke:#d8e0da;stroke-width:2;stroke-linecap:round}
#websites .solar-switch i{width:30px;height:30px;border-radius:50%;background:#f1f1e9;box-shadow:0 2px 5px #0005;transform:translateX(-30px);transition:transform .3s,background .3s}
#websites .solar-switch[aria-checked=true]{background:#d9efae;border-color:#e9f7ce}
#websites .solar-switch[aria-checked=true] svg{stroke:#294a27}
#websites .solar-switch[aria-checked=true] i{transform:translateX(0);background:#fff}
#websites .solar-tiles{position:absolute;z-index:2;left:24px;right:24px;bottom:88px;display:grid;grid-template-columns:1fr 1fr;gap:10px;opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity .4s,transform .4s,visibility .4s;pointer-events:none}
#websites .day-mode .solar-tiles{opacity:1;visibility:visible;transform:none}
#websites .solar-tiles>div{padding:14px;border-radius:12px;background:#f3f5eae8;border:1px solid #fff9;box-shadow:0 6px 20px #0002;backdrop-filter:blur(12px);color:#17251b}
#websites .solar-tiles small{display:block;font-size:7px;letter-spacing:.12em;color:#52654c}
#websites .solar-tiles strong{display:block;font-size:19px;letter-spacing:-.03em;margin:6px 0 4px}
#websites .solar-tiles span{display:block;font-size:10px;line-height:1.4;color:#43503d}
@media(max-width:600px){#websites .solar-tiles{left:18px;right:18px;bottom:82px;gap:8px}#websites .solar-tiles>div{padding:10px}#websites .solar-tiles strong{font-size:17px}#websites .solar-tiles span{font-size:9px}}
@media(prefers-reduced-motion:reduce){#websites .solar-tiles,#websites .solar-switch i{transition:none}}
