/* Matched to the live JUBOK final-nav, long-fade hero and light brand intro.
   Scoped to the solar-brand checkout; never imported by corporate pages. */
:root{--ink:#142536;--muted:#536473;--ease:cubic-bezier(.2,.78,.2,1);--content-width:1180px;--hero-content-width:1320px;--nav-width:1240px;--page-gutter:clamp(20px,4vw,54px)}
/* The same centered rails as the corporate site, including ultrawide screens.
   This intentionally overrides the older fluid .wrap breakpoint rules. */
.wrap{width:min(calc(100% - var(--page-gutter)*2),var(--content-width));max-width:var(--content-width);margin-inline:auto}
body{font-weight:435;letter-spacing:-.018em;font-synthesis:none}
h1,h2{font-weight:645;letter-spacing:-.038em}h3{font-weight:590;letter-spacing:-.028em}
.eyebrow{font-weight:515;letter-spacing:.055em}.title{font-weight:645}
.button{border-radius:0;font-weight:545}.button span{transition:transform .3s var(--ease)}.button:hover span{transform:translateX(3px)}
.site-header{position:fixed;z-index:120;top:18px;left:50%;transform:translateX(-50%);width:min(calc(100% - 32px),var(--nav-width));height:70px;padding:0 24px 0 27px;gap:24px;border:1px solid transparent;border-radius:0;background:linear-gradient(135deg,rgba(255,255,255,.79),rgba(242,244,251,.66)) padding-box,linear-gradient(112deg,rgba(255,255,255,1),rgba(117,101,200,.34),rgba(101,174,188,.33),rgba(255,255,255,.95)) border-box;box-shadow:0 20px 56px rgba(46,57,88,.12),inset 0 1px 0 rgba(255,255,255,.9);backdrop-filter:blur(22px) saturate(135%);transition:top .3s ease,box-shadow .3s ease}
.site-header.is-scrolled{top:9px;box-shadow:0 20px 55px #11273d29,inset 0 1px 0 #ffffffe6}
.brand{gap:12px}.brand>b{font-size:30px;line-height:1;letter-spacing:-.07em;font-weight:800}.brand>span{font-size:14px;font-weight:500;letter-spacing:.1em}.brand-dot{display:none}
.site-header nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(16px,1.5vw,25px);font-size:14.5px;font-weight:535}
.site-header nav>a{position:relative;padding:25px 0 23px;line-height:1;white-space:nowrap;color:#344656}
.site-header nav>a.nav-service{font-weight:700}
.site-header nav>a::after{content:"";position:absolute;left:0;right:100%;bottom:16px;height:1px;background:var(--navy);transition:right .35s var(--ease)}
.site-header nav>a:hover::after,.site-header nav>a[aria-current]::after,.site-header nav>a:focus-visible::after{right:0}
.menu-toggle{display:none;border:0;background:transparent;color:var(--navy);width:56px;height:44px;padding:0;font-size:13px;font-weight:560;letter-spacing:.05em;border-radius:0}
.hero{width:min(100%,1920px);height:clamp(700px,46.875vw,900px);min-height:0;margin:0 auto;background:#f7f9fb;color:#142536;display:flex;align-items:center;overflow:hidden}
.hero>img{z-index:-2;object-position:center;filter:none}
.hero::after{background:linear-gradient(90deg,rgba(248,250,252,.99) 0%,rgba(248,250,252,.97) 18%,rgba(247,249,251,.88) 34%,rgba(245,248,250,.68) 48%,rgba(242,246,248,.39) 61%,rgba(238,244,246,.14) 74%,rgba(238,244,246,0) 86%),linear-gradient(180deg,rgba(12,30,45,.02),rgba(12,30,45,.12))}
.hero-content{width:min(calc(100% - 104px),var(--hero-content-width));max-width:var(--hero-content-width);padding:100px 0 100px}
.hero .eyebrow{display:flex;align-items:center;gap:14px;color:var(--navy);font-size:14px;font-weight:515;letter-spacing:.055em;margin-bottom:24px}
.hero .eyebrow::before{content:"";width:38px;height:1px;background:var(--navy)}
.hero h1{color:#142536;font-size:clamp(48px,5.1vw,78px);font-weight:635;letter-spacing:-.04em;line-height:1.15;max-width:740px;text-wrap:balance}
.hero .lead{color:#354d61;font-size:19px;font-weight:435;line-height:1.75;max-width:660px;margin:25px 0 32px}
.hero .button.light{background:var(--navy);border-color:var(--navy);color:white}.hero .button.light:hover{background:#285780}
.hero-link{color:var(--navy);border-color:#173b6366;font-weight:545}
.hero-bottom{left:0;right:0;bottom:34px;width:min(calc(100% - 104px),var(--hero-content-width));max-width:var(--hero-content-width);margin-inline:auto;padding-top:20px;border-color:#173b6338;color:var(--navy)}
.hero-bottom span:first-child{font-size:13px;font-weight:515;letter-spacing:.06em}
.hero-bottom span:last-child{padding:7px 10px;margin-top:-7px;background:#ffffffcf;border:1px solid #ffffffd9;backdrop-filter:blur(8px);font-size:13px}
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 48% 68% at 12% 48%,rgba(126,110,205,.055),transparent 74%);z-index:0}
.hero-content{position:static;z-index:1}.hero-bottom{position:absolute;z-index:2}
/* The light wash between sections echoes the main site's subtle purple/teal tint. */
#services{position:relative;background:radial-gradient(ellipse 70% 150px at 15% 0,rgba(117,101,200,.045),transparent),#fff}
.service-photo,.why-photo,.space-card img,.partner-image,.sub-visual{border-radius:0}
.service-copy h3{font-weight:590}.service-copy p,.why-item p,.info-card p{font-weight:435}
.service-more{font-weight:545}.service-more>span{transition:transform .35s var(--ease)}
.service-card:hover .service-more>span,.service-card:focus-visible .service-more>span{transform:translate(3px,-3px)}
.service-photo img,.space-card img{transition:transform .85s var(--ease),filter .6s ease}
.service-card:hover img{transform:scale(1.035);filter:saturate(.92)}
.space-card{overflow:hidden}.space-card img{clip-path:inset(0)}
.metrics-section{background:linear-gradient(120deg,#f6f7fc,#f1f6f8)}
.metric{border-radius:0;border:1px solid #d8e3e5}.metric strong{font-weight:645}.metric strong em{font-weight:485}
.metric.revenue{background:#e5efed}.metric.generation{background:#e5edf5}
.metric.plants,.metric.capacity{border-color:transparent}
.monitor-section{background:linear-gradient(130deg,#0d263d 0%,#173b63 54%,#1d598a 100%);position:relative;isolation:isolate}
.monitor-section:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(150,210,236,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(150,210,236,.05) 1px,transparent 1px);background-size:12.5% 200px;mask-image:linear-gradient(180deg,#000,transparent 75%);pointer-events:none}
.monitor-tabs button,.monitor-actions .motion-control{border-radius:0;font-weight:515}
.dashboard{border-radius:8px;box-shadow:0 24px 70px #04172926}.dash-side{border-radius:8px 0 0 8px}
.dash-kpis strong,.dash-head h3{font-weight:645}.photo-tag{border-radius:0;background:#ffffffed;backdrop-filter:blur(12px);border:1px solid #fff}
.why-grid .title{text-wrap:balance}.why-item h3{font-weight:590}.timeline{border-top:1px solid #becedc;gap:0}
.timeline>div{position:relative;border-top:0;padding:26px 22px 0 0}.timeline>div:before{content:"";position:absolute;left:0;top:-4px;width:7px;height:7px;background:var(--navy)}
.timeline b{font-weight:645}.space-section{background:#f4f7f9}.space-card h3{font-weight:590}
.cta{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(115deg,#102c49,#173b63 68%,#214e77)}
.cta:after{content:"JUBOK";position:absolute;z-index:-1;right:-.06em;bottom:-.16em;font-family:Jubok,sans-serif;font-size:clamp(100px,17vw,245px);font-weight:800;letter-spacing:-.075em;line-height:.8;color:#ffffff06;pointer-events:none}
.cta h2{font-weight:645}.site-footer{background:linear-gradient(120deg,#fff 45%,#f6f8fb)}
.sub-hero{padding:158px 0 70px;background:radial-gradient(ellipse at 8% 45%,#7565c80b,transparent 55%),linear-gradient(110deg,#f8fafc,#edf3f5)}
.sub-hero h1{font-weight:635}.sub-visual>span{border-radius:0;background:#ffffffeb;color:var(--navy);border:1px solid #fff;backdrop-filter:blur(12px)}
.step,.contract-panel,.contract-tabs button,.contract-node,.consult-form{border-radius:0}
.step{background:#f2f5f7;border-top:1px solid #afc2d3}.step h3,.info-card h3,.contract-panel h3{font-weight:590}
.contract-tabs button{font-weight:545}.faq summary{font-weight:590}
/* Brand entry: visible only after the synchronous head bootstrap opts in.
   Without JS, with reduced motion, in comparisons and on repeat visits it stays hidden. */
.site-intro{display:none}.site-intro[hidden]{display:none!important}
.intro-pending .site-intro{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden;color:var(--navy);background:radial-gradient(circle at 40% 52%,rgba(117,101,200,.15),transparent 29%),radial-gradient(circle at 61% 48%,rgba(101,174,188,.14),transparent 30%),#f7f8fc;pointer-events:none}
.intro-lockup{text-align:center}.intro-word{display:flex;align-items:baseline;gap:clamp(12px,2.1vw,32px);line-height:1}
.intro-word b{font-family:Jubok,sans-serif;font-weight:800;letter-spacing:-.075em;font-size:clamp(48px,9vw,138px)}
.intro-word span{font-size:clamp(22px,3.8vw,58px);font-weight:500;letter-spacing:.1em}
.intro-word{animation:brand-word-in .75s .08s var(--ease) both}
.intro-caption{font-size:13px;font-weight:515;letter-spacing:.13em;color:#5b7188;margin-top:30px;animation:brand-word-in .65s .24s var(--ease) both}
.intro-rule{width:54px;height:1px;margin:24px auto 0;background:#173b6366;transform-origin:left;animation:brand-rule-in .75s .3s var(--ease) both}
.intro-exiting .site-intro{animation:brand-intro-exit .65s cubic-bezier(.76,0,.24,1) both}
.intro-pending .hero-content>.eyebrow,.intro-pending .hero h1,.intro-pending .hero .lead,.intro-pending .hero .actions{opacity:0}
.entry-ready .hero>img{animation:brand-photo-in 1.65s var(--ease) both}
.entry-ready .hero-content>.eyebrow{animation:brand-word-in .7s .06s var(--ease) both}
.entry-ready .hero h1{animation:brand-word-in .85s .13s var(--ease) both}
.entry-ready .hero .lead{animation:brand-word-in .85s .23s var(--ease) both}
.entry-ready .hero .actions{animation:brand-word-in .85s .32s var(--ease) both}
.entry-ready .hero-bottom{animation:brand-word-in .75s .42s var(--ease) both}
.motion-ready .reveal{transform:translateY(22px);transition-duration:.75s;transition-delay:var(--reveal-delay,0ms)}
.motion-ready .reveal.seen{transform:none}
@keyframes brand-word-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes brand-rule-in{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes brand-intro-exit{from{clip-path:inset(0)}to{clip-path:inset(0 0 100% 0);visibility:hidden}}
@keyframes brand-photo-in{from{transform:scale(1.035)}to{transform:scale(1)}}
@media(max-width:1080px){
 .site-header{height:64px}.site-header nav{display:none;position:absolute;left:0;right:0;top:calc(100% + 12px);padding:13px;border:1px solid #173b6324;background:rgba(249,252,254,.97);box-shadow:0 24px 58px #11273d2b;backdrop-filter:blur(20px)}
 .site-header nav.open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
 .site-header nav>a{padding:17px 12px;border-bottom:1px solid var(--line);font-size:15px;line-height:1.5;white-space:normal}
 .site-header nav>a::after{display:none}.site-header nav>a:hover,.site-header nav>a[aria-current]{background:#173b6308}
 .menu-toggle{display:block}.hero h1{max-width:680px;font-size:58px}.hero .lead{max-width:560px}
}
@media(max-width:900px){.hero{height:700px;max-height:none}.hero h1{font-size:54px;max-width:640px}.sub-hero{padding:140px 0 55px}.timeline{border-top:0;gap:30px}.timeline>div{border-top:1px solid #becedc}}
@media(max-width:650px){
 .site-header{top:10px;width:calc(100% - 20px);padding:0 16px;gap:12px}.site-header.is-scrolled{top:9px}
 .brand>b{font-size:25px}.brand>span{font-size:13px}.brand{gap:10px}
 .hero{width:calc(100% - 12px);height:calc(100svh - 6px);min-height:720px;margin:0 auto 0;border-radius:0 0 16px 16px;align-items:flex-end;color:white;background:#0b1928}
 .hero>img{filter:saturate(.88) contrast(.96) brightness(.88);object-position:65% center}
 .hero::after{background:linear-gradient(180deg,rgba(5,14,22,.12),rgba(5,14,22,.28) 42%,rgba(5,14,22,.9))}
 .hero:before{display:none}.hero-content{width:100%;padding:0 24px 145px}
 .hero .eyebrow{color:#fff;font-size:13px;gap:12px;margin-bottom:20px}.hero .eyebrow:before{background:#fff;width:32px}
 .hero h1{color:white;font-size:clamp(37px,10.5vw,43px);line-height:1.2;max-width:none;letter-spacing:-.04em}
 .hero .lead{color:#edf2f7;font-size:17px;line-height:1.65;max-width:none;margin:22px 0 26px}
 .hero .actions{gap:20px;flex-wrap:wrap}.hero .button.light{background:white;border-color:white;color:var(--navy);font-size:15px;min-height:50px;padding:13px 18px;gap:17px}
 .hero-link{color:white;border-color:#ffffff70;font-size:15px}.hero-bottom{width:calc(100% - 48px);bottom:28px;border-color:#ffffff5c;color:white;gap:12px;padding-top:18px}
 .hero-bottom span:last-child{background:none;border:0;padding:0;margin:0;backdrop-filter:none;font-size:13px}.hero-bottom span:first-child{font-size:13px}
 .sub-hero{padding:128px 0 48px}.sub-hero h1{font-size:38px}.service-photo,.space-card img{border-radius:0}
 .intro-word{gap:14px}.intro-word b{font-size:clamp(42px,13vw,66px)}.intro-word span{font-size:23px}.intro-caption{font-size:13px;letter-spacing:.08em;margin-top:24px}
}
@media(max-width:370px){.hero .actions{gap:16px}.hero-link{font-size:14px}.hero-content{padding-inline:20px}.hero h1{font-size:37px}.hero-bottom{width:calc(100% - 40px)}}
@media(prefers-reduced-motion:reduce){.site-intro{display:none!important}.intro-pending .hero-content>.eyebrow,.intro-pending .hero h1,.intro-pending .hero .lead,.intro-pending .hero .actions{opacity:1}*,*::before,*::after{animation:none!important;transition:none!important}}