/* ==========================================================
   BlitzLeistung · sections (mobile first)
   ========================================================== */

/* ================= HERO ================= */
.hero{position:relative;background:var(--ral7021);color:var(--paper)}
.hero__stage{position:relative;height:100svh;min-height:600px;overflow:hidden}
.hero-scrub .hero{height:520vh}
.hero-scrub .hero__stage{position:sticky;top:0;height:100vh}
.hero__media{position:absolute;inset:0}
.hero__poster,.hero__video,.hero__canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
@media (min-width:900px){.hero__poster,.hero__video{object-position:0% 50%;transform:scale(1.12);transform-origin:0% 50%}}
.hero__video{opacity:0;transition:opacity .8s}
.hero__video.is-playing{opacity:1}
.hero__canvas{opacity:0;transition:opacity .5s}
.hero__canvas.is-ready{opacity:1}
.hero__shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,23,25,.96) 0%,rgba(20,23,25,.82) 42%,rgba(20,23,25,.2) 66%,rgba(20,23,25,0) 78%)}
.hero__frame{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:clamp(40px,7vh,88px)}
.hero__copy{max-width:600px;will-change:opacity,transform}
.hero h1{font-size:clamp(2.75rem,1rem + 3.6vw,5rem);line-height:.94;letter-spacing:-.015em;margin-bottom:var(--s-5)}
.hero__copy p{font-size:1.125rem;line-height:1.55;color:rgba(241,243,239,.86);max-width:36em}
.hero__copy strong{color:var(--paper);font-weight:600}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-6)}
.tour,.tour__index{display:none}
@media (max-width:899px){
  .hero__stage{height:auto;min-height:100svh;display:flex;flex-direction:column}
  .hero__media{position:relative;inset:auto;height:52svh;flex:none}
  .hero__shade{background:linear-gradient(0deg,var(--ral7021) 0%,rgba(43,47,50,0) 45%)}
  .hero__frame{height:auto;flex:1;justify-content:flex-start;margin-top:-56px;padding-top:0;padding-bottom:var(--s-7)}
}

@media (min-width:900px){
  .hero__shade{background:
    linear-gradient(90deg,rgba(20,23,25,.86) 0%,rgba(20,23,25,.55) 30%,rgba(20,23,25,0) 56%),
    linear-gradient(0deg,rgba(20,23,25,.7) 0%,rgba(20,23,25,0) 34%)}
  .hero__copy p{font-size:1.1875rem}
}

/* tour captions + index (scroll-film mode only) */
.hero-scrub .tour{display:block;position:absolute;left:var(--gutter);bottom:clamp(40px,7vh,88px);width:min(560px,40vw);height:260px;pointer-events:none}
.tour__cap{position:absolute;left:0;bottom:0;width:100%;opacity:0;transform:translate3d(0,14px,0);transition:opacity .45s,transform .7s var(--ease)}
.tour__cap.is-on{opacity:1;transform:none}
.tour__cap h2{font-size:clamp(2.25rem,1.3rem + 2.4vw,3.75rem);line-height:1;margin-bottom:var(--s-4)}
.tour__cap p{font-size:1.125rem;line-height:1.55;color:rgba(241,243,239,.86);max-width:34em}
.hero-scrub .tour__index{display:flex;gap:var(--s-5);position:absolute;right:var(--gutter);bottom:clamp(40px,7vh,88px)}
.tour__index li{position:relative;padding-top:var(--s-3);min-width:72px;font:500 .9375rem/1 var(--f-display);color:var(--paper-2);transition:color .3s}
.tour__index li::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:rgba(241,243,239,.25);transition:background-color .3s}
.tour__index li.is-on{color:var(--paper)}
.tour__index li.is-on::before{background:var(--lime)}

/* ================= INTRO ================= */
.sec.intro{padding-bottom:calc(var(--sec-y) * .6)}
.intro__text{font:500 clamp(1.5rem,1.1rem + 1.35vw,2.375rem)/1.2 var(--f-display);letter-spacing:-.005em;max-width:none}
.facts>div{display:grid;grid-template-columns:7.5rem 1fr;gap:var(--s-4);padding-block:var(--s-3);border-top:1px solid var(--rule)}
.facts>div:last-child{border-bottom:1px solid var(--rule)}
.facts dt{font-size:var(--t-small);font-weight:600;color:var(--fg-2)}
.facts dd{font-size:var(--t-small)}
@media (min-width:900px){
  .intro__text{grid-column:1/span 7}
  .facts{grid-column:9/span 4;align-self:end}
}

/* ================= SERVICES / BOARD ================= */
.sec.svc{padding-top:calc(var(--sec-y) * .4)}
.svc__head{padding-top:calc(var(--sec-y) * .6);border-top:1px solid var(--rule);margin-bottom:var(--s-7);row-gap:var(--s-4)}
.svc__head p{color:var(--fg-2)}
@media (min-width:900px){
  .svc__head h2{grid-column:1/span 6}
  .svc__head p{grid-column:8/span 5;align-self:end}
}

.board{margin-inline:calc(var(--gutter) * -1)}
.board__scroll{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:6px var(--gutter) 18px;scrollbar-width:thin;scrollbar-color:#8b928e transparent}
/* the open cabinet: powder-coated RAL 7035 steel with a folded edge */
.cab{width:max-content;margin-inline:auto;padding:14px;border-radius:8px;
  background:linear-gradient(180deg,#d7dbd7 0%,#c4c9c5 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -1px 0 rgba(0,0,0,.12),0 1px 0 rgba(0,0,0,.08),0 18px 30px -18px rgba(20,24,26,.55),0 2px 6px rgba(20,24,26,.18)}
/* the white cover plate, with four quarter-turn fasteners */
.cab__plate{--fx:radial-gradient(circle at 50% 50%,#d9dcd7 0 5px,#9ea4a1 5.5px 6.5px,transparent 7px);
  position:relative;padding:30px 40px 34px;border-radius:4px;
  background:
    linear-gradient(90deg,transparent 7px,#5d6462 7px 9px,transparent 9px) 11px 11px/16px 16px no-repeat,
    linear-gradient(90deg,transparent 7px,#5d6462 7px 9px,transparent 9px) calc(100% - 11px) 11px/16px 16px no-repeat,
    linear-gradient(90deg,transparent 7px,#5d6462 7px 9px,transparent 9px) 11px calc(100% - 11px)/16px 16px no-repeat,
    linear-gradient(90deg,transparent 7px,#5d6462 7px 9px,transparent 9px) calc(100% - 11px) calc(100% - 11px)/16px 16px no-repeat,
    var(--fx) 11px 11px/16px 16px no-repeat,var(--fx) calc(100% - 11px) 11px/16px 16px no-repeat,
    var(--fx) 11px calc(100% - 11px)/16px 16px no-repeat,var(--fx) calc(100% - 11px) calc(100% - 11px)/16px 16px no-repeat,
    linear-gradient(172deg,#f7f8f4 0%,#eceee8 55%,#e3e6e0 100%);
  box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(0,0,0,.06),0 3px 6px rgba(20,24,26,.22),0 1px 1px rgba(20,24,26,.2)}
.board__rail{--uw:64px;--label-h:50px;--front-h:128px;position:relative;display:flex;align-items:flex-start}
/* the cut-out the devices show through */
.board__rail::before{content:"";position:absolute;left:-6px;right:-6px;top:calc(var(--label-h) + 10px);height:calc(var(--front-h) + 12px);border-radius:3px;background:#2a2e30;box-shadow:inset 0 3px 6px rgba(0,0,0,.6),0 1px 0 #fff}
.mod{position:relative;flex:none;width:calc(var(--u) * var(--uw));display:flex;flex-direction:column;gap:16px;padding:0;text-align:left;scroll-snap-align:center;cursor:pointer}
.mod--rcd{cursor:default}
/* label strip behind a clear holder */
.mod__label{position:relative;display:flex;flex-direction:column;justify-content:space-between;height:var(--label-h);padding:6px 7px;background:#fcfcf9;border-block:1px solid #c9ccc6;border-right:1px dashed #d5d8d2}
.mod:first-child .mod__label{border-left:1px solid #c9ccc6;border-radius:2px 0 0 2px}
.mod:last-child .mod__label{border-right:1px solid #c9ccc6;border-radius:0 2px 2px 0}
.mod__label::after{content:"";position:absolute;inset:-1px 0;background:linear-gradient(180deg,rgba(255,255,255,.75) 0,rgba(255,255,255,0) 38%,rgba(190,210,220,.12) 100%);pointer-events:none}
.mod__label b{align-self:flex-start;padding:2px 4px;margin:-2px 0 0 -4px;border-radius:2px;font:600 .75rem/1 var(--f-display);color:var(--ink-2);letter-spacing:.02em;transition:background-color .2s,color .2s}
.mod__label i{font:600 .9375rem/.92 var(--f-hand);font-style:normal;color:var(--marker);letter-spacing:-.015em;hyphens:none;overflow-wrap:normal}
.mod[aria-checked="true"] .mod__label b{background:var(--lime);color:var(--lime-ink)}
/* device front */
.mod__body{position:relative;display:block;height:var(--front-h);margin-top:6px;border-radius:3px 3px 2px 2px;
  background:linear-gradient(180deg,#fafaf7 0%,#f1f1ed 30%,#e9eae5 31%,#f3f3ef 100%);
  box-shadow:inset 1px 0 0 #fff,inset -1px 0 0 rgba(0,0,0,.14),inset 0 -2px 0 rgba(0,0,0,.08),0 2px 3px rgba(0,0,0,.35)}
.mod+.mod .mod__body{margin-left:1px}
.mod__print{position:absolute;left:8px;top:8px;display:flex;flex-direction:column;gap:3px;color:#3a4043}
.mod__print b{font:700 .8125rem/1 var(--f-display);letter-spacing:.01em}
.mod__print small{align-self:flex-start;padding:1px 3px;border:1px solid #6d7476;font:600 .5625rem/1 var(--f-display);color:#555c5f}
.mod--rcd .mod__print small{border:0;padding:0;font-size:.6875rem}
.mod__test{position:absolute;right:8px;top:8px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:linear-gradient(180deg,#f2f3ef,#d9dcd6);box-shadow:inset 0 0 0 1px #a9ada8,0 1px 1px rgba(0,0,0,.25);font:700 .5625rem/1 var(--f-display);font-style:normal;color:#3a4043}
/* toggle recess and levers, one per pole, tied together on multi-pole devices */
.mod__slot{position:absolute;left:50%;top:42px;width:calc(var(--u) * var(--uw) - 18px);height:62px;transform:translateX(-50%);border-radius:3px;background:linear-gradient(180deg,#c9ccc6,#dfe1dc);box-shadow:inset 0 2px 3px rgba(0,0,0,.28),inset 0 -1px 0 #fff}
.mod__levers{--ly:12px;position:absolute;inset:0;display:flex;justify-content:space-around;align-items:center;transform:translateY(var(--ly));transition:transform .3s var(--ease-snap)}
.mod__lever{display:block;width:18px;height:32px;border-radius:4px 4px 3px 3px;background:linear-gradient(90deg,#2e3336 0%,#4a5054 45%,#3a3f43 60%,#2a2e31 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.22),0 3px 3px rgba(0,0,0,.4)}
.mod[style*="--u:2"] .mod__levers::after,.mod[style*="--u:3"] .mod__levers::after{content:"";position:absolute;left:calc(var(--uw) / 2 - 9px);right:calc(var(--uw) / 2 - 9px);top:50%;height:5px;margin-top:-9px;border-radius:2px;background:linear-gradient(180deg,#53595d,#2c3134);box-shadow:0 1px 1px rgba(0,0,0,.4)}
.mod[aria-checked="true"] .mod__levers,.mod--always .mod__levers,.mod--rcd .mod__levers{--ly:-12px}
.mod:not([aria-checked="true"]):not(.mod--always):hover .mod__levers{--ly:8px}
.mod:active:not(.mod--rcd) .mod__levers{transition-duration:.12s}
.mod__io{position:absolute;right:6px;top:42px;bottom:24px;display:flex;flex-direction:column;justify-content:space-between;font:700 .5625rem/1 var(--f-display);color:#7a8184}
.mod__io i{font-style:normal}
.mod[style*="--u:2"] .mod__io,.mod[style*="--u:3"] .mod__io{right:4px}
/* status flag: lime = on, signal yellow = the breaker that never goes off */
.mod__flag{position:absolute;left:50%;bottom:9px;width:14px;height:7px;margin-left:-7px;border-radius:1px;background:#8c9390;box-shadow:inset 0 1px 2px rgba(0,0,0,.4),0 0 0 1px #c5c8c2;transition:background-color .2s}
.mod[aria-checked="true"] .mod__flag{background:var(--lime)}
.mod--always .mod__flag,.mod--always[aria-checked="true"] .mod__flag,.mod--rcd .mod__flag{background:var(--signal)}
.mod--rcd .mod__flag{background:var(--lime)}
.mod:focus-visible{outline:none}
.mod:focus-visible .mod__body{outline:2px solid var(--ink);outline-offset:3px}
@media (min-width:900px){
  .board{margin-inline:0}
  .board__scroll{padding-inline:0}
  .cab{padding:18px}
  .cab__plate{padding:34px 48px 38px}
  .board__rail{--uw:clamp(68px,5.6vw,84px);--label-h:56px;--front-h:140px}
  .mod__label i{font-size:1.0625rem}
  .mod__slot{top:46px;height:66px}
}

.svc__panels{margin-top:var(--s-7)}
.svc__panel{display:none}
.svc__panel.is-on{display:grid;animation:panelIn .4s var(--ease)}
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.svc__img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-img)}
.svc__text h3{font-size:clamp(1.75rem,1.3rem + 1.4vw,2.75rem);font-weight:700;line-height:1.05}
.svc__text>p{margin-top:var(--s-4);color:var(--fg-2)}
.svc__text ul{margin-top:var(--s-5)}
.svc__text li{position:relative;padding:10px 0 10px 22px;border-top:1px solid var(--rule)}
.svc__text li:last-child{border-bottom:1px solid var(--rule)}
.svc__text li::before{content:"";position:absolute;left:0;top:50%;width:10px;height:2px;background:var(--ink)}
.svc__actions{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-6)}
@media (min-width:900px){
  .svc__img{grid-column:1/span 5}
  .svc__text{grid-column:7/span 6;align-self:center}
}

/* ================= WHY ================= */
.list{margin-top:var(--s-7)}
.list>div{padding-block:var(--s-5);border-top:1px solid var(--rule)}
.list>div:last-child{border-bottom:1px solid var(--rule)}
.list dt{font:600 1.375rem/1.2 var(--f-display)}
.list dd{margin-top:6px;color:var(--fg-2);max-width:52ch}
.why__fig img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-img)}
.why__fig figcaption{margin-top:var(--s-3);font-size:var(--t-small);color:var(--fg-2);max-width:44ch}
@media (min-width:900px){
  .why__text{grid-column:1/span 6}
  .why__fig{grid-column:8/span 5;position:sticky;top:calc(var(--hdr-h) + 40px);align-self:start;margin-top:12px}
  .why__fig img{aspect-ratio:4/3}
}

/* ================= WALLBOX ================= */
.wb__band{position:relative;height:clamp(380px,50vw,760px);overflow:hidden;background:var(--ral7021);color:var(--paper)}
.wb__band img,.wb__band video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 40%}
.wb__band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,23,25,.82) 0%,rgba(20,23,25,.35) 45%,rgba(20,23,25,0) 70%),linear-gradient(0deg,rgba(20,23,25,.55),rgba(20,23,25,0) 45%)}
.wb__band-copy{position:absolute;inset:auto 0 0;z-index:1;padding-bottom:var(--s-7);margin-inline:auto;left:0;right:0}
.wb__band h2{max-width:12ch}
.sec.wb__calc{padding-top:calc(var(--sec-y) * .7)}
.wb__ctrl .lead{margin-top:0}
.seg{margin-top:var(--s-6)}
.seg legend{font-weight:600;font-size:var(--t-small);margin-bottom:var(--s-3)}
.seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.seg legend{grid-column:1/-1}
.seg label{position:relative;cursor:pointer}
.seg input{position:absolute;left:0;top:0;opacity:0;pointer-events:none}
.seg span{display:block;height:100%;padding:12px 14px;border:1px solid var(--rule-strong);margin-left:-1px;background:var(--ral7035-hi);font:600 1.0625rem/1.2 var(--f-display);transition:background-color .15s,color .15s}
.seg label:first-of-type span{margin-left:0;border-radius:var(--r-ctl) 0 0 var(--r-ctl)}
.seg label:last-of-type span{border-radius:0 var(--r-ctl) var(--r-ctl) 0}
.seg small{display:block;margin-top:2px;font:400 var(--t-xs)/1.3 var(--f-body);color:var(--fg-2)}
.seg label:hover span{background:#e8ebe7}
.seg input:checked+span{background:var(--ink);color:var(--paper);border-color:var(--ink);position:relative}
.seg input:checked+span small{color:var(--paper-2)}
.seg input:focus-visible+span{outline:2px solid var(--focus);outline-offset:2px;position:relative}
.range{display:block;margin-top:var(--s-6)}
.range__row{display:flex;justify-content:space-between;align-items:baseline;font-weight:600;font-size:var(--t-small);margin-bottom:var(--s-2)}
.range output{font:600 1.25rem/1 var(--f-display)}
input[type=range]{--p:42.5%;-webkit-appearance:none;appearance:none;width:100%;height:32px;background:transparent;cursor:pointer;accent-color:var(--ink)}
input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--ink) var(--p),var(--rule-strong) var(--p))}
input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--ink) var(--p),var(--rule-strong) var(--p))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:-10px;border-radius:50%;background:var(--lime);border:2px solid var(--ink);box-shadow:0 2px 4px rgba(0,0,0,.25)}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--lime);border:2px solid var(--ink)}
input[type=range]:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
.charge{width:100%;border-collapse:collapse}
.charge caption{text-align:left;font:600 1.375rem/1.2 var(--f-display);padding-bottom:var(--s-4)}
.charge thead th{padding-bottom:var(--s-2);border-bottom:2px solid var(--ink);text-align:left;font-size:var(--t-xs);font-weight:600;color:var(--fg-2)}
.charge thead th:last-child{text-align:right}
.charge tbody th,.charge td{padding-block:var(--s-4);border-bottom:1px solid var(--rule);vertical-align:middle}
.charge tbody th{font:600 1.125rem/1.2 var(--f-display);text-align:left;padding-right:var(--s-4)}
.charge tbody th small{display:block;margin-top:4px;font:400 var(--t-xs)/1.3 var(--f-body);color:var(--fg-2);white-space:nowrap}
.charge__bar{width:38%;padding-right:var(--s-4)}
.charge__bar i{display:block;height:10px;border-radius:1px;background:var(--ink);transform-origin:left;transform:scaleX(var(--w,0));transition:transform .5s var(--ease)}
.charge tr:first-child .charge__bar i{background:#8a918d}
.charge__time{text-align:right;white-space:nowrap;font:600 1.25rem/1 var(--f-display)}
.wb__sum{margin-top:var(--s-5);font-size:1.125rem}
.wb__sum strong{font-weight:600}
.wb__result .note{margin-block:var(--s-3) var(--s-5)}
@media (min-width:900px){
  .wb__ctrl{grid-column:1/span 5}
  .wb__result{grid-column:7/span 6}
}
@media (max-width:520px){
  .charge__bar,.charge thead th:nth-child(2){display:none}
}

/* ================= SOS ================= */
.sos h2{max-width:14ch}
.sos__tel{display:inline-block;margin-block:var(--s-5);font:700 clamp(2.75rem,1.4rem + 5vw,6rem)/1 var(--f-display);letter-spacing:-.02em;color:var(--fg);text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:.14em;text-decoration-color:rgba(29,22,6,.3);transition:text-decoration-color .2s}
.sos__tel:hover{text-decoration-color:var(--fg)}
.sos__main p{color:var(--fg-2);font-size:1.125rem}
.sos__main time{color:var(--fg);font-weight:600}
.sos__steps h3{margin-bottom:var(--s-4)}
.sos__steps li{position:relative;padding-block:var(--s-4);border-top:1px solid var(--rule);color:var(--fg-2)}
.sos__steps li:last-child{border-bottom:1px solid var(--rule)}
.sos__steps b{color:var(--fg);font-weight:600}
@media (min-width:900px){
  .sos__main{grid-column:1/span 7}
  .sos__steps{grid-column:9/span 4;align-self:center}
}

/* ================= STRENGTHS / LIGHT SWITCH ================= */
.lamp__photo{position:relative;overflow:hidden;border-radius:var(--r-img);background:#0d0f10}
.lamp__photo img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:40% 50%;filter:brightness(.26) saturate(.5);transition:filter 1.4s cubic-bezier(.4,0,.2,1)}
/* LEDs dim up smoothly, like a dimmer */
.lamp.is-on .lamp__photo img{filter:none}
.switch{position:absolute;right:clamp(16px,3vw,32px);bottom:clamp(16px,3vw,32px);display:grid;place-items:center;width:88px;height:88px;border-radius:10px;background:linear-gradient(160deg,#fafaf7,#e9eae5);box-shadow:var(--sh-plate),inset 0 1px 0 #fff}
.switch__rocker{position:relative;width:58px;height:58px;border-radius:6px;background:linear-gradient(180deg,#fdfdfb 0%,#ecede8 50%,#dfe1db 100%);box-shadow:0 1px 0 #fff inset,0 2px 3px rgba(0,0,0,.18);transform:perspective(220px) rotateX(-12deg);transition:transform .22s var(--ease-snap)}
/* orientation light: lets you find the switch in the dark */
.switch__rocker::after{content:"";position:absolute;left:50%;top:10px;width:12px;height:3px;margin-left:-6px;border-radius:2px;background:var(--lime);transition:opacity .2s}
.lamp.is-on .switch__rocker{transform:perspective(220px) rotateX(12deg)}
.lamp.is-on .switch__rocker::after{opacity:0}
.switch:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
.lamp figcaption{margin-top:var(--s-3);font-size:var(--t-small);color:var(--fg-2)}
@media (min-width:900px){
  .lamp{grid-column:1/span 7;align-self:start;position:sticky;top:calc(var(--hdr-h) + 40px)}
  .strengths__text{grid-column:9/span 4}
}

/* ================= STEPS + REVIEWS ================= */
.steps__list{display:grid;gap:var(--s-6) var(--col-gap);margin-top:var(--s-7);counter-reset:none}
.steps__list li{padding-top:var(--s-4);border-top:2px solid var(--ink)}
.steps__n{display:block;font:700 3rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.steps__list h3{margin:var(--s-4) 0 var(--s-2)}
.steps__list p{color:var(--fg-2)}
@media (min-width:640px){.steps__list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.steps__list{grid-template-columns:repeat(4,minmax(0,1fr))}}
.reviews{margin-top:var(--sec-y);padding-top:calc(var(--sec-y) * .6);border-top:1px solid var(--rule)}
.reviews__text p{margin-top:var(--s-4);color:var(--fg-2)}
.rating{display:grid;gap:var(--s-4);align-content:start;padding:var(--s-6);border:1px solid var(--rule-strong);border-radius:var(--r-ctl);background:var(--ral7035-hi)}
.rating__head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-4)}
.rating__score{font:700 2.75rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.stars{position:relative;display:inline-block;width:120px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='m12 1.5 3.1 6.4 7 1-5.1 4.9 1.2 7L12 17.5l-6.2 3.3 1.2-7L1.9 8.9l7-1z' fill='none' stroke='%231f2427' stroke-width='1.5'/%3E%3C/svg%3E") 0 0/24px 22px repeat-x}
.stars i{position:absolute;inset:0 auto 0 0;width:var(--fill);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='m12 1.5 3.1 6.4 7 1-5.1 4.9 1.2 7L12 17.5l-6.2 3.3 1.2-7L1.9 8.9l7-1z' fill='%231f2427'/%3E%3C/svg%3E") 0 0/24px 22px repeat-x}
.rating__count{font-weight:600}
.rating__src{font-size:var(--t-xs);color:var(--fg-2)}
.rating__links{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-2)}
@media (min-width:900px){
  .reviews__text{grid-column:1/span 5}
  .rating{grid-column:7/span 6;align-self:center}
}

/* ================= LOCATIONS ================= */
.loc__head{margin-bottom:var(--s-7);row-gap:var(--s-4)}
.loc__head .lead{margin-top:0}
.loc__list{display:grid;align-content:start}
.addr{padding-block:var(--s-5);border-top:1px solid var(--rule);font-style:normal}
.addr:last-child{border-bottom:1px solid var(--rule)}
.addr h3{transition:color .2s}
.addr p{margin:var(--s-2) 0 var(--s-3);color:var(--fg-2)}
.addr.is-hot h3{color:var(--lime)}
.link{display:inline-flex;align-items:center;gap:6px;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.link svg{width:16px;height:16px}
.link:hover{text-decoration-thickness:2px}
@media (min-width:900px){
  .loc__head h2{grid-column:1/span 6}
  .loc__head .lead{grid-column:8/span 5;align-self:end}
  .map{grid-column:1/span 8}
  .loc__list{grid-column:10/span 3}
}

/* ================= CONTACT ================= */
.contact__lines{margin-top:var(--s-7)}
.contact__lines>div{padding-block:var(--s-4);border-top:1px solid var(--rule)}
.contact__lines>div:last-child{border-bottom:1px solid var(--rule)}
.contact__lines dt{font-size:var(--t-small);font-weight:600;color:var(--fg-2)}
.contact__lines dd{margin-top:2px;font:600 clamp(1.5rem,1.2rem + 1vw,2rem)/1.2 var(--f-display)}
.contact__lines a{text-decoration:none}
.contact__lines a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
.form{display:grid;gap:var(--s-5);align-content:start}
.form__topics legend{font-weight:600;font-size:var(--t-small);margin-bottom:var(--s-3)}
.form__topics legend span,.field label span{font-weight:400;color:var(--fg-2)}
.form__topics{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.form__topics label{position:relative;cursor:pointer}
.form__topics input{position:absolute;left:0;top:0;opacity:0;pointer-events:none}
.form__topics label span{display:block;padding:9px 14px;border:1px solid var(--rule-strong);border-radius:var(--r-ctl);background:var(--ral7035-hi);font-size:var(--t-small);font-weight:500;transition:background-color .15s,color .15s,border-color .15s}
.form__topics label:hover span{background:#e8ebe7}
.form__topics input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.form__topics input:focus-visible+span{outline:2px solid var(--focus);outline-offset:2px}
.form__row{display:grid;gap:var(--s-5)}
@media (min-width:640px){.form__row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.field>label:not(.check){display:block;margin-bottom:var(--s-2);font-size:var(--t-small);font-weight:600}
.field input,.field textarea{width:100%;padding:13px 14px;border:1px solid var(--rule-strong);border-radius:var(--r-ctl);background:var(--ral7035-hi);font:400 var(--t-body)/1.4 var(--f-body);color:var(--ink);caret-color:var(--ink);transition:border-color .15s,background-color .15s}
.field textarea{resize:vertical;min-height:132px}
.field input::placeholder,.field textarea::placeholder{color:#596063}
.field input:hover,.field textarea:hover{border-color:var(--ink-2)}
.field input:focus,.field textarea:focus{outline:2px solid var(--ink);outline-offset:0;border-color:var(--ink);background:#e6e9e5}
.field__err{display:none;margin-top:6px;font-size:var(--t-small);color:var(--error)}
.field.is-err input{border-color:var(--error)}
.field.is-err .field__err{display:block}
.check{position:relative;display:flex;gap:var(--s-3);align-items:flex-start;font-size:var(--t-small);color:var(--fg-2);cursor:pointer}
.check input{position:absolute;left:0;top:0;width:22px;height:22px;margin:0;opacity:0;pointer-events:none}
.check__box{flex:none;display:grid;place-items:center;width:22px;height:22px;margin-top:1px;border:1.5px solid var(--ink);border-radius:3px;background:var(--ral7035-hi)}
.check__box svg{width:14px;height:14px;stroke-width:3;color:var(--lime);opacity:0}
.check input:checked+.check__box{background:var(--ink)}
.check input:checked+.check__box svg{opacity:1}
.check input:focus-visible+.check__box{outline:2px solid var(--focus);outline-offset:2px}
.field.is-err .check__box{border-color:var(--error)}
.check a{color:var(--fg)}
.form .btn{justify-self:start}
.form__done{display:none;padding:var(--s-6);border:2px solid var(--ink);border-radius:var(--r-ctl)}
.form__done p{margin-top:var(--s-2);color:var(--fg-2)}
.form.is-done>*:not(.form__done){display:none}
.form.is-done .form__done{display:block}
@media (min-width:900px){
  .contact__text{grid-column:1/span 5}
  .form{grid-column:7/span 6}
}

}

.mod__io{display:none}

/* =====================================================================
   BRAND REFRESH: the client's own palette (black, white, #7ED321)
   ===================================================================== */
.sec--mist{--bg:#f3f5f2;--fg:var(--ink);--fg-2:var(--ink-2);--rule:rgba(13,15,13,.12);--rule-strong:rgba(13,15,13,.3);--focus:var(--ink)}
:root,.sec--light{--rule:rgba(13,15,13,.12);--rule-strong:rgba(13,15,13,.3)}
.sec--signal{--fg-2:#1f3a06}
.btn--signal:hover{background:var(--lime-hover)}

/* dark sections carry the film's own streak texture */
.sec--dark,.ftr{background:
  linear-gradient(180deg,rgba(5,6,5,.86) 0%,rgba(5,6,5,.72) 50%,rgba(5,6,5,.9) 100%),
  url("../assets/img/streaks.webp") center/cover no-repeat,#050605}

/* calls to action: solid brand green with a soft green glow */
.btn--lime{box-shadow:none}
.btn--lime:hover{background:var(--lime-hover)}
.btn svg{transition:transform .2s var(--ease)}
.btn:hover svg:last-child{transform:translateX(3px)}
.btn--outline{border-color:var(--ink);color:var(--ink);background:transparent}
.btn--outline:hover{background:var(--ink);color:#fff}
.btn--ink:hover{background:#000}

/* hero */
.hero .hl{color:var(--lime)}

/* trust bar */
.trustbar{background:#050605;color:var(--paper);border-bottom:1px solid rgba(126,211,33,.18)}
.trustbar__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));list-style:none}
.trustbar__list li{padding:var(--s-5) var(--s-4) var(--s-5) 0;border-top:1px solid rgba(245,247,243,.1)}
.trustbar__list a{display:block;text-decoration:none}
.trustbar__list b{display:flex;align-items:center;gap:10px;font:700 clamp(1.5rem,1.2rem + 1.2vw,2.25rem)/1 var(--f-display);color:var(--lime)}
.trustbar__list li>span,.trustbar__list a>span{display:block;margin-top:6px;font-size:var(--t-small);color:var(--paper-2)}
@media (min-width:900px){
  .trustbar__list{grid-template-columns:repeat(4,minmax(0,1fr))}
  .trustbar__list li{border-top:0;border-left:1px solid rgba(245,247,243,.1);padding:var(--s-6) var(--s-5)}
  .trustbar__list li:first-child{border-left:0;padding-left:0}
}
.stars--gold{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='m12 1.5 3.1 6.4 7 1-5.1 4.9 1.2 7L12 17.5l-6.2 3.3 1.2-7L1.9 8.9l7-1z' fill='%23d9dcd6'/%3E%3C/svg%3E")}
.stars--gold i{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='m12 1.5 3.1 6.4 7 1-5.1 4.9 1.2 7L12 17.5l-6.2 3.3 1.2-7L1.9 8.9l7-1z' fill='%23fbbc04'/%3E%3C/svg%3E")}
.stars--sm{width:90px;height:17px;background-size:18px 17px}
.stars--sm i{background-size:18px 17px}
.trustbar .stars--gold{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='m12 1.5 3.1 6.4 7 1-5.1 4.9 1.2 7L12 17.5l-6.2 3.3 1.2-7L1.9 8.9l7-1z' fill='%233a3f3a'/%3E%3C/svg%3E")}

/* services board on white */
.svc__head{border-top-color:transparent}
.svc__img img{border-radius:12px;box-shadow:0 24px 48px -28px rgba(0,0,0,.45)}
.svc__text li::before{background:var(--lime);height:3px;width:12px}

/* why + strengths on the textured dark */
.why__fig img,.lamp__photo{border-radius:12px;box-shadow:0 24px 48px -24px rgba(0,0,0,.8)}
.list>div{position:relative;padding-left:22px}
.list>div::before{content:"";position:absolute;left:0;top:calc(var(--s-5) + .6em);width:10px;height:3px;background:var(--lime)}
.sec--dark .list dt{color:#fff}

/* wallbox calculator as two white panels on mist */
.wb__ctrl,.wb__result{background:#fff;border-radius:12px;padding:clamp(24px,3vw,40px);border:1px solid var(--rule)}
.seg span{background:#fff}
.seg input:checked+span{background:var(--lime);border-color:var(--lime);color:var(--lime-ink)}
.seg input:checked+span small{color:#24420a}
input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,var(--lime) var(--p),#dfe3dc var(--p))}
input[type=range]::-moz-range-track{background:linear-gradient(90deg,var(--lime) var(--p),#dfe3dc var(--p))}
input[type=range]::-webkit-slider-thumb{background:#fff;border:3px solid var(--lime);box-shadow:0 1px 3px rgba(0,0,0,.3)}
input[type=range]::-moz-range-thumb{background:#fff;border:3px solid var(--lime)}
.charge__bar i{height:12px;border-radius:6px;background:var(--lime)}
.charge tr:first-child .charge__bar i{background:#c9cec6;box-shadow:none}
.wb__sum strong{color:#3c7a0a}

/* emergency band in full brand green */
.sos{background:var(--lime)}
.sos__tel{text-decoration-color:rgba(11,20,0,.35)}

/* steps */
.steps__list li{border-top:3px solid var(--lime)}

/* reviews */
.reviews__head{display:grid;gap:var(--s-5);align-items:end;margin-bottom:var(--s-7)}
.reviews__head p{margin-top:var(--s-3);color:var(--fg-2)}
.rating{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-4);padding:var(--s-4) var(--s-5);border:1px solid var(--rule);border-radius:12px;background:#fff}
.rating__g{width:34px;height:34px;stroke:none}
.rating__line{display:flex;align-items:center;gap:var(--s-3)}
.rating__score{font:700 2rem/1 var(--f-display)}
.rating__src{font-size:var(--t-xs);color:var(--fg-2);margin-top:4px}
.rating .btn{margin-left:auto}
.rv__grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.rv{display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5);border:1px solid var(--rule);border-radius:14px;background:#fff;transition:transform .25s var(--ease),box-shadow .25s}

.rv header{display:flex;align-items:center;gap:var(--s-3)}
.rv header b{font-weight:600;font-size:var(--t-small)}
.rv__av{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--c);color:#fff;font:600 1rem/1 var(--f-body);flex:none}
.rv__av svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:1.8}
.rv__g{width:20px;height:20px;margin-left:auto;stroke:none}
.rv p{flex:1;font-size:var(--t-small);line-height:1.55;color:var(--ink)}
.rv time{font-size:var(--t-xs);color:var(--fg-2)}
@media (min-width:900px){.reviews__head{grid-template-columns:1fr auto}}

/* locations: two cards, no map */
.loc__cards{display:grid;gap:var(--s-5)}
.addr{position:relative;padding:clamp(28px,3vw,44px);border:1px solid var(--rule);border-top:4px solid var(--lime);border-radius:4px 4px 12px 12px;background:#fff}

.addr__ic{display:block;margin-bottom:var(--s-4);color:#3f8a0c}
.addr__ic svg{width:30px;height:30px;stroke-width:1.6}
.addr__kicker{font-size:var(--t-small);font-weight:600;color:var(--fg-2)}
.addr h3{font-size:clamp(1.75rem,1.4rem + 1vw,2.375rem);margin-top:4px}
.addr p:not(.addr__kicker){color:var(--fg-2);margin:var(--s-3) 0 var(--s-5)}
.addr__actions{display:flex;flex-wrap:wrap;gap:var(--s-3)}
@media (min-width:760px){.loc__cards{grid-template-columns:1fr 1fr}}

/* contact: glass form on the textured dark */
.contact .lead{color:var(--paper-2)}
.contact__lines{list-style:none;margin-top:var(--s-7);display:grid;gap:var(--s-3)}
.contact__lines>li{padding:0;border:0}
.contact__lines a{display:flex;align-items:center;gap:var(--s-4);padding:var(--s-4) 0;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.12)}
.contact__lines a:hover>span:last-child{color:var(--lime)}
.contact__lines small{display:block;font:500 var(--t-xs)/1.3 var(--f-body);color:var(--paper-2)}
.contact__lines a>span:last-child{font:600 clamp(1.25rem,1.1rem + .6vw,1.625rem)/1.2 var(--f-display);color:#fff}
.contact__ic{display:grid;place-items:center;flex:none;width:44px;height:44px;color:var(--lime)}
.contact__ic svg{width:26px;height:26px;stroke-width:1.6}
.contact .form{padding:clamp(24px,3vw,40px);border-radius:12px;background:#111311;border:1px solid rgba(255,255,255,.1);border-top:4px solid var(--lime)}
.contact .field input,.contact .field textarea{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff;caret-color:var(--lime)}
.contact .field input::placeholder,.contact .field textarea::placeholder{color:#8f978c}
.contact .field input:hover,.contact .field textarea:hover{border-color:rgba(255,255,255,.4)}
.contact .field input:focus,.contact .field textarea:focus{outline:2px solid var(--lime);border-color:var(--lime);background:rgba(255,255,255,.09)}
.contact .form__topics label span{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:var(--paper)}
.contact .form__topics label:hover span{background:rgba(255,255,255,.12)}
.contact .form__topics input:checked+span{background:var(--lime);border-color:var(--lime);color:var(--lime-ink)}
.contact .check{color:var(--paper-2)}
.contact .check__box{background:transparent;border-color:rgba(255,255,255,.6)}
.contact .check input:checked+.check__box{background:var(--lime);border-color:var(--lime)}
.contact .check__box svg{color:var(--lime-ink)}
.contact .field__err{color:#ff9a8b}
.contact .field.is-err input{border-color:#ff9a8b}
.contact .form__done{border-color:var(--lime)}

/* footer */
.ftr{padding:var(--s-9) 0 var(--s-6);color:var(--paper);font-size:var(--t-small);border-top:1px solid rgba(126,211,33,.2)}
.ftr__cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-5);padding-bottom:var(--s-8);border-bottom:1px solid rgba(245,247,243,.12)}
.ftr__claim{font:700 clamp(1.75rem,1rem + 2.6vw,3.25rem)/1.05 var(--f-display);max-width:18ch;color:#fff}
.ftr__grid{display:grid;gap:var(--s-7);padding-block:var(--s-8)}
.ftr__brand img{height:30px;width:auto}
.ftr__brand p{margin-top:var(--s-4);color:var(--paper-2);max-width:32ch}
.ftr .ftr__live{display:flex;align-items:center;gap:10px;color:var(--paper)}
.ftr__dot{width:9px;height:9px;border-radius:50%;background:var(--lime);flex:none}
.ftr h3{font:600 .875rem/1.4 var(--f-body);color:#fff;margin-bottom:var(--s-3)}
.ftr .ftr__sub{margin-top:var(--s-5)}
.ftr ul{list-style:none;display:grid;gap:8px;color:var(--paper-2)}
.ftr a{text-decoration:none;color:var(--paper-2);transition:color .15s}
.ftr a:hover{color:var(--lime);text-decoration:none}
.ftr .ftr__cta .btn{color:var(--lime-ink)}
.ftr__base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-4);margin:0;padding-top:var(--s-5);border-top:1px solid rgba(245,247,243,.12);color:var(--paper-2)}
.ftr__base nav{display:flex;gap:var(--s-5)}
@media (min-width:640px) and (max-width:1023px){.ftr__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.ftr__grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr}}

/* original wordmark ships on black: screen-blend it into dark surfaces */
.hdr__logo img,.ftr__brand img{mix-blend-mode:screen}
.hdr__logo img{height:30px}
@media (min-width:1120px){.hdr__logo img{height:34px}}
.ftr__brand img{height:36px}
.lamp__photo img{object-position:50% 50%}
@media (min-width:1024px){.rv__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sec.contact{padding-bottom:calc(var(--sec-y) * .7)}
.ftr{padding-top:var(--s-8);border-top:1px solid rgba(245,247,243,.08)}
.hdr__logo img,.ftr__brand img{mix-blend-mode:normal}
.rating>div{flex:1;min-width:0}
@media (max-width:599px){.rating .btn{margin-left:0;width:100%}}

/* compositor hints for the scroll film and heavy layers */
.hero__canvas,.hero__copy{will-change:transform,opacity}
.hero-scrub .hero__stage{contain:paint}