:root{
  --ink:#15171A; --ink2:#1D2024; --ink3:#0E1012;
  --paper:#F4F3EE; --white:#fff; --rule:#D9D8D0; --rule-d:#33383D;
  --g:#8ABD36; --g-dk:#4F7D12;
  --text:#E9ECEA; --mute-d:#9AA19D; --mute:#5A605C;
  --on-g:#15171A; --rest:#15171A;
  --f:'IBM Plex Sans Hebrew','Heebo',sans-serif;
  --bg:#fff; --fg:#15171A; --alt:#F4F3EE; --bt:#3B403D; --surf:#fff; --ph:#E6E5DE; --ph-line:#C8C7BE; --line:var(--ink);
  color-scheme:light;
}
/* pure light: every surface light */
html[data-theme="light"]{
  --rest:#F1F0EA; --ink:#F1F0EA; --ink2:#FFFFFF; --ink3:#E4E2D9; --text:#15171A; --mute-d:#5A605C; --rule-d:#D2D0C6; --line:#15171A; --g:#5FA10E;
}
/* pure dark: every surface dark */
html[data-theme="dark"]{
  --bg:#23272C; --fg:#EEF1EF; --alt:#2A2F34; --bt:#CBD1CD; --surf:#31363C; --ph:#2F343A; --ph-line:#464C53; --line:#EEF1EF;
  --paper:#2A2F34; --rule:#3E444B; --mute:#A9B0AB; --g-dk:#9BD84A;
  --ink:#1E2226; --ink2:#2A2F34; --ink3:#181B1F; --rest:#1E2226; --rule-d:#3E444B;
  color-scheme:dark;
}
/* contrast sections: dark inside light theme, light inside dark theme */
html[data-theme="light"] .on-dark,html[data-theme="light"] .foot{
  --bg:#0E1012; --fg:#E9ECEA; --alt:#16191C; --bt:#B9BFBB; --surf:#1D2024; --ph:#1D2125; --ph-line:#33383D; --line:#E9ECEA;
  --rest:#15171A; --ink:#15171A; --ink2:#1D2024; --ink3:#0E1012; --text:#E9ECEA; --mute-d:#9AA19D; --rule-d:#33383D;
  --paper:#16191C; --rule:#2E3338; --mute:#9AA19D; --g-dk:#8FCB3A; --g:#8ABD36; color-scheme:dark;
}
html[data-theme="dark"] .on-dark,html[data-theme="dark"] .foot{
  --bg:#fff; --fg:#15171A; --alt:#F4F3EE; --bt:#3B403D; --surf:#fff; --ph:#E6E5DE; --ph-line:#C8C7BE; --line:#15171A;
  --rest:#F1F0EA; --ink:#F1F0EA; --ink2:#FFFFFF; --ink3:#E4E2D9; --text:#15171A; --mute-d:#5A605C; --rule-d:#D2D0C6;
  --paper:#F4F3EE; --rule:#D9D8D0; --mute:#5A605C; --g-dk:#4F7D12; --g:#5FA10E; color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--nav-h,77px)}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--f);font-size:17px;line-height:1.65;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%}
h1,h2,h3,h4,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
:focus-visible{outline:3px solid var(--g);outline-offset:3px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f);font-weight:600;font-size:16px;padding:14px 28px;border-radius:2px;border:1.5px solid transparent;cursor:pointer;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}
.btn-g{background:var(--g);color:var(--on-g)}
.btn-g:hover{background:#8FCB3A}
.btn-o{border-color:currentColor}
.link-arrow{font-weight:600;border-bottom:1.5px solid currentColor;padding-bottom:2px;transition:color .15s}
.link-arrow::after{content:' ←'}
.link-arrow:hover{color:var(--g)}

/* ---------- nav (white) ---------- */
.nav{position:sticky;top:0;z-index:20;background:var(--nav-bg,rgba(255,255,255,.97));border-bottom:1px solid var(--rule)}
.nav-in{display:flex;align-items:center;gap:36px;padding-top:12px;padding-bottom:12px}
.brand{display:flex;flex-shrink:0}
.brand img{display:block;height:52px;width:auto}
.menu{display:flex;gap:10px;flex-grow:1;justify-content:flex-start;padding-inline-start:clamp(8px,2vw,32px)}
/* hover: a live "busbar" on the nav's bottom edge glides to the hovered link (js/script.js), with terminal dots at both ends */
.menu a{position:relative;white-space:nowrap;font-weight:500;font-size:16px;padding:8px 18px;color:var(--fg);transition:color .18s,letter-spacing .25s}
.menu a:hover,.menu a:focus-visible,.menu a.cur{color:var(--g)}
.menu a:hover,.menu a:focus-visible{letter-spacing:.03em}
.nav-ind{position:absolute;top:60px;left:0;width:0;height:2px;background:var(--g2,#9BE33A);opacity:0;pointer-events:none;transition:left .38s cubic-bezier(.3,1.25,.5,1),top .2s,width .55s cubic-bezier(.3,1.25,.5,1),opacity .25s,box-shadow .25s}
.nav-ind::before,.nav-ind::after{content:"";position:absolute;top:-1px;width:4px;height:4px;box-sizing:border-box;border-radius:50%;background:var(--nav-bg,#fff);border:1px solid var(--g2,#9BE33A)}
.nav-ind::before{left:-2px}.nav-ind::after{right:-2px}
.nav-ind.rest{opacity:.5}
.nav-ind.live{opacity:1;box-shadow:0 0 10px var(--g2,#9BE33A),0 0 18px var(--g)}
.nav-ind.live::before,.nav-ind.live::after{background:var(--g2,#9BE33A);box-shadow:0 0 5px var(--g2,#9BE33A)}
@media (prefers-reduced-motion:reduce){.nav-ind{transition:opacity .2s}}
.phone-link{font-weight:600;font-size:16px;white-space:nowrap;direction:ltr}
.phone-link svg{display:none}
.nav-cta{padding:11px 22px;font-size:15px}
.burger{display:none;width:46px;height:46px;border:1px solid var(--rule);border-radius:2px;background:var(--surf);color:var(--fg);align-items:center;justify-content:center;cursor:pointer}

/* ---------- type ---------- */
h1{font-weight:700;font-size:64px;line-height:1.08;letter-spacing:-.02em}
h2{font-weight:700;font-size:44px;line-height:1.15;letter-spacing:-.015em}
h3{font-weight:600;font-size:22px;line-height:1.3}
.eyebrow{display:flex;align-items:center;gap:12px;font-weight:500;font-size:16px;letter-spacing:.08em;color:var(--mute)}
.on-dark .eyebrow,.hero .eyebrow{color:var(--mute-d)}
.lead{font-size:20px;color:#B9BFBB;max-width:520px}
.body-l{font-size:19px;color:var(--bt)}
.g{color:var(--g)}

/* ---------- sections ---------- */
section{padding:112px 0}
.on-dark{background:var(--ink);color:var(--text)}
.on-paper{background:var(--alt)}
.sec-head{display:flex;flex-direction:column;gap:16px;max-width:680px;margin-bottom:56px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:80px;align-items:center}
@media (min-width:1001px){#about .two{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}}
.stack{display:flex;flex-direction:column;gap:22px}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--ink);color:var(--text);padding:0;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%}
.hero-in{position:relative;padding-top:104px;padding-bottom:112px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:center}
.hero-text{display:flex;flex-direction:column;gap:28px;align-items:flex-start}
.cta-row{display:flex;align-items:center;gap:32px;flex-wrap:wrap;margin-top:6px}
.bus{position:absolute;inset-inline:0;bottom:0;height:3px;background:repeating-linear-gradient(90deg,var(--g) 0 18px,transparent 18px 30px);background-size:30px 3px;animation:bus 1.2s linear infinite;opacity:.9}
@keyframes bus{to{background-position:-30px 0}}
.flow{stroke-dasharray:8 12;animation:flow 2s linear infinite}
@keyframes flow{to{stroke-dashoffset:-40}}

/* nameplate panel */
.panel{background:var(--ink2);border:1px solid #3A4046;border-radius:4px;padding:0;box-shadow:0 24px 60px rgba(0,0,0,.45)}
.panel-head{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid var(--rule-d);font-size:13px;letter-spacing:.06em;color:var(--mute-d)}
.panel-head b{font-weight:600;color:var(--text)}
.panel-body{padding:20px}
.brk{cursor:pointer;background:var(--ink);border:1px solid #3A4046;border-radius:3px;color:#C9CECB;font-family:var(--f);font-size:14px;transition:border-color .15s}
.brk:hover{border-color:var(--g)}
.main-brk{width:100%;display:flex;align-items:center;gap:14px;padding:12px 16px;margin-bottom:14px;color:var(--text);font-size:15px;font-weight:600}
.grow{flex-grow:1;text-align:right}
.state{font-size:12px;letter-spacing:.08em;padding:2px 10px;border-radius:2px;background:#33383D;color:#C9CECB}
.main-brk[aria-pressed="true"] .state{background:var(--g);color:var(--on-g)}
.led{display:block;width:9px;height:9px;border-radius:50%;background:#3A4046}
.led.on{background:var(--g);box-shadow:0 0 8px rgba(138,189,54,.8)}
.brk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.brk-grid .brk{display:flex;flex-direction:column;align-items:center;gap:9px;padding:14px 6px 12px}
.slot{width:32px;height:62px;border-radius:3px;background:#0B0C0E;border:1px solid #3A4046;display:flex;flex-direction:column;justify-content:flex-end;padding:3px}
.lever{display:block;width:100%;height:26px;border-radius:2px;background:#5C635F}
.brk[aria-pressed="true"] .slot{justify-content:flex-start}
.brk[aria-pressed="true"] .lever{background:var(--g)}
.load{margin-top:18px;height:6px;background:#0B0C0E;border-radius:1px;overflow:hidden}
.load-bar{height:100%;width:0;background:var(--g);transition:width .3s}
.load-txt{margin-top:8px;display:flex;justify-content:space-between;font-size:13px;color:var(--mute-d)}
.load-txt b{font-weight:600;color:var(--text)}

/* hero spec strip */
.spec{position:relative;border-top:1px solid var(--rule-d);background:rgba(14,16,18,.6)}
.spec-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.spec-in div{padding:14px 24px;border-inline-start:1px solid var(--rule-d)}
.spec-in div:first-child{border-inline-start:0;padding-inline-start:0}
.spec-in b{display:block;font-weight:600;font-size:16px;color:var(--text)}
.spec-in span{font-size:14px;color:var(--mute-d)}

/* ---------- about ---------- */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:14px;border-top:1px solid var(--rule)}
.stats div{padding:18px 0 0;border-inline-start:1px solid var(--rule);padding-inline-start:20px}
.stats div:first-child{border-inline-start:0;padding-inline-start:0}
.stats b{display:block;font-weight:300;font-size:48px;line-height:1.1;letter-spacing:-.02em}
.stats span{font-size:14px;color:var(--mute)}

.ph{position:relative;background:var(--ph);display:flex;align-items:flex-end;height:280px;padding:16px;color:var(--mute);font-size:13px}
.ph::before{content:'';position:absolute;inset:10px;border:1px solid var(--ph-line);pointer-events:none}
.ph.tall{height:380px}
.about-ph{height:520px}
.explode{height:560px;background:radial-gradient(ellipse at 50% 85%,#2a3036,var(--ink) 70%);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;perspective:1400px}
.explode::after{content:'';position:absolute;left:50%;bottom:9%;width:60%;height:40px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(0,0,0,.6),transparent 70%);filter:blur(6px)}
.explode .fit{transform:translate(-125px,0) scale(var(--k,.9));transform-style:preserve-3d}
.explode .scene{position:relative;transform-style:preserve-3d}
.explode .scene div{position:absolute;transform-style:preserve-3d;backface-visibility:visible}
.explode .part{will-change:transform}
.explode .fx::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,rgba(255,255,255,.22) 0,rgba(255,255,255,0) 38%,rgba(0,0,0,.16) 100%)}
.explode .door-in div,.explode .door-out div{backface-visibility:hidden}
.explode .lcd{opacity:.85}
.explode .hbar{animation:hbar 2.2s ease-in-out infinite alternate}
.explode .needle{animation:needle 3.1s ease-in-out infinite alternate;transform:rotate(-30deg)}
@keyframes needleKick{0%{transform:rotate(-34deg)}35%{transform:rotate(40deg)}100%{transform:rotate(-10deg)}}
.explode.mono .play[class*="play"] .hbar,.explode.mono .hbar{background:linear-gradient(#f3f4f4,#8d9499)}
.explode.line .hbar{width:3px!important;border-radius:2px}
@keyframes hbar{from{transform:scaleY(.35)}to{transform:scaleY(1)}}
@keyframes needle{from{transform:rotate(-34deg)}to{transform:rotate(18deg)}}
.explode .play,.explode .play-bg{cursor:pointer}
.explode .play:hover{outline:2px solid rgba(166,228,74,.85);outline-offset:1px}
.explode .led{transition:filter .2s,box-shadow .2s}
.explode.dead .hbar{animation:none;transform:scaleY(.08)}
.explode.dead .needle{animation:none;transform:rotate(-34deg)}
.explode.fast .hbar{animation-duration:.7s}
.explode.fast .needle{animation-duration:1.1s}
html[data-theme="light"] .explode.on .led{box-shadow:0 0 6px 1px currentColor;animation:ledPulse 2.4s ease-in-out infinite}
@keyframes ledPulse{50%{box-shadow:0 0 2px 0 currentColor;filter:brightness(.75)}}
.explode.on .lamp{box-shadow:0 0 0 4px #2b2f33,0 0 14px 4px currentColor}
/* switched off: dark indicators (after the .on glow rules) */
.explode.on .led.off,.explode.on.dead .led:not(.lamp){animation:none;box-shadow:none;filter:brightness(.22)}
.explode.on .lamp.off{box-shadow:0 0 0 4px #2b2f33,0 3px 5px rgba(0,0,0,.45);animation:none;filter:brightness(.3)}
html.a11y-motion .explode .hbar,html.a11y-motion .explode .needle{animation:none}
@media (prefers-reduced-motion:reduce){.explode .hbar,.explode .needle,.explode.on .led{animation:none}}
.chip{position:relative;background:#fff;color:var(--ink);font-size:13px;padding:5px 12px;border-radius:2px}

/* ---------- services (rows) ---------- */
.rows{border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:90px minmax(0,4fr) minmax(0,5fr);gap:32px;align-items:baseline;padding:34px 0;border-bottom:1px solid var(--rule);transition:background .2s,box-shadow .2s}
.row>*{transition:transform .2s}
.row:hover{background:var(--paper);box-shadow:-16px 0 0 var(--paper),16px 0 0 var(--paper)}
.row:hover>*{transform:translateX(-16px)}
.row .n{font-weight:800;font-size:44px;line-height:1;color:var(--g-dk);letter-spacing:-.02em;font-variant-numeric:tabular-nums;align-self:center}
.row h3{font-size:28px}
.row p{font-size:18px;color:var(--bt)}

/* ---------- panel types (cards) ---------- */
.pcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pcard{display:flex;flex-direction:column;gap:10px;padding:28px 26px;background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--g);border-radius:6px;transition:transform .2s,border-color .2s}
.pcard:hover{transform:translateY(-3px);border-color:var(--g)}
.pcard .n{font-weight:800;font-size:40px;line-height:1;color:var(--g-dk);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pcard h3{font-size:22px}
.pcard p{font-size:17px;color:var(--bt)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:10px}
.chips li{font-size:14px;color:var(--mute);border:1px solid var(--rule);border-radius:999px;padding:4px 12px;background:var(--bg)}
.pcard-cta{justify-content:center;background:transparent;border-style:dashed;text-decoration:none;color:inherit}
.pcard-cta p{font-weight:500}
@media(max-width:1000px){.pcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.pcards{grid-template-columns:minmax(0,1fr)}.pcard{padding:22px 20px}}
.tbl{border-top:2px solid var(--line)}
.tr{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,4fr);gap:32px;padding:26px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.tr.th{padding:12px 0;font-size:13px;letter-spacing:.08em;color:var(--mute);font-weight:500}
.tr h3{font-size:22px}
.tr p{font-size:17px;color:var(--bt)}
.tr .uses{font-size:15px;color:var(--mute)}
.tr-cta{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px 0}
.tr-cta p{font-size:19px;font-weight:500}

/* ---------- why ---------- */
.why-list li{display:grid;grid-template-columns:70px 1fr;gap:12px;padding:22px 0;align-items:center;border-bottom:1px solid var(--rule-d)}
.why-list li:first-child{border-top:1px solid var(--rule-d)}
.why-list b{font-weight:800;font-size:38px;line-height:1;color:var(--g);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.why-list h3{margin-bottom:2px}
.why-list p{font-size:17px;color:var(--mute-d)}

/* ---------- process ---------- */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;position:relative}
.step{position:relative;padding-top:38px;text-align:center;--d:.45s}
.step:nth-child(3){--d:1.35s}.step:nth-child(4){--d:2.25s}.step:nth-child(5){--d:3.15s}
/* pad node: ring + core, lights with a ripple when the current arrives */
.step::before{content:'';position:absolute;top:-3px;left:calc(50% - 9px);width:18px;height:18px;border-radius:50%;box-sizing:border-box;z-index:1;
  background:radial-gradient(circle,#5E8F2E 0 3px,var(--ink) 3.5px);border:2px solid #5E8F2E}
.steps.go .step::before{animation:padOn .6s ease-out var(--d) forwards}
@keyframes padOn{0%{}40%{box-shadow:0 0 18px 5px rgba(166,228,74,.8)}100%{background:radial-gradient(circle,#C3F76A 0 4px,var(--ink) 4.5px);border-color:#A6E44A;box-shadow:0 0 9px 1px rgba(138,189,54,.6)}}
.steps::before{content:'';position:absolute;inset-inline:0;top:5px;height:2px;background:#3A5230}
html[data-theme="light"] .steps::before{background:#9DB88A}
.steps .fill{position:absolute;inset-inline:0;top:5px;height:2px;background:linear-gradient(90deg,#C3F76A,var(--g));box-shadow:0 0 9px rgba(138,189,54,.85);transform:scaleX(0);transform-origin:right}
.steps.go .fill{animation:fillGo 3.6s linear forwards}
@keyframes fillGo{to{transform:scaleX(1)}}
.steps::after{content:'';position:absolute;top:2px;right:-110px;height:8px;width:110px;border-radius:4px;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,#D4FA8C,rgba(166,228,74,0));filter:drop-shadow(0 0 5px rgba(138,189,54,.9))}
.steps.go::after{opacity:1;animation:stepsRun 5s linear 3.8s infinite}
@keyframes stepsRun{from{right:-110px}to{right:100%}}
.step b,.step h3{transition:color .3s}.step:hover h3{color:var(--g)}
.ic{display:block;width:64px;height:64px;margin:0 auto 14px;fill:none;stroke:var(--mute);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.ic .d{stroke-dasharray:1;stroke-dashoffset:0}
.steps:not(.go) .ic .d{stroke-dashoffset:1}
.steps.go .ic .d{animation:draw 1.1s ease-out var(--d) both}
@keyframes draw{from{stroke-dashoffset:1;stroke:#A6E44A}to{stroke-dashoffset:0}}
.steps.go .ic{stroke:#8ABD36;transition:stroke .6s calc(var(--d) + .9s)}
.ic .lev{fill:var(--mute);stroke:none;transform:translateY(7px);transition:transform .35s cubic-bezier(.3,1.6,.5,1) calc(var(--d) + 1s),fill .2s calc(var(--d) + 1s)}
.steps.go .ic .lev{transform:none;fill:#A6E44A}
.ic .bolt{fill:transparent;stroke-width:2;transition:fill .3s calc(var(--d) + 1s),filter .3s calc(var(--d) + 1s)}
.steps.go .ic .bolt{fill:#A6E44A;filter:drop-shadow(0 0 8px rgba(166,228,74,.95));animation:flick .5s steps(1) calc(var(--d) + 1s) 1}
@keyframes flick{0%{opacity:0}20%{opacity:1}35%{opacity:.2}55%{opacity:1}70%{opacity:.4}100%{opacity:1}}
.ic .dot{fill:var(--mute);stroke:none;opacity:.5}
.steps.go .ic .dot{fill:#A6E44A;opacity:1;transition:all .3s calc(var(--d) + .9s)}
.step b{display:block;font-weight:500;font-size:13px;letter-spacing:.08em;color:var(--mute);margin-bottom:6px}
.step h3{margin-bottom:6px}
.step p{font-size:16px;color:var(--bt)}
h2.sm{font-size:40px;margin-bottom:56px}

/* ---------- projects ---------- */
.filters{display:flex;gap:28px;margin:-16px 0 36px;border-bottom:1px solid var(--rule)}
.filter{font-family:var(--f);font-weight:500;font-size:16px;padding:10px 0;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;background:none;color:var(--mute);cursor:pointer}
.filter:hover{color:var(--fg)}
.filter.on{color:var(--fg);border-bottom-color:var(--g);font-weight:600}
.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 28px}
.proj.wide{grid-column:span 2}
.proj[hidden]{display:none}
.proj .cap{padding-top:16px}
.proj h3{font-size:21px;margin-bottom:6px}
.meta{font-size:15px;color:var(--mute);border-top:1px solid var(--rule);margin-top:10px;padding-top:8px}
.cat{font-size:13px;letter-spacing:.08em;color:var(--g-dk);font-weight:600}

/* ---------- faq ---------- */
.faq-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:80px;align-items:start}
.faq details{border-bottom:1px solid var(--rule)}
.faq details:first-child{border-top:2px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;padding:22px 0;font-weight:600;font-size:19px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-weight:300;font-size:28px;line-height:1;color:var(--g-dk)}
.faq details[open] summary::after{content:'−'}
.faq details p{padding:0 0 22px;font-size:17px;color:var(--bt);max-width:600px}
.ul{border-bottom:2px solid var(--g)}

/* ---------- contact ---------- */
.info{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}
.info a{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:22px 10px;border:1px solid var(--rule-d);border-radius:12px;transition:background .2s,color .2s,border-color .2s}
.info svg{width:36px;height:36px;fill:none;stroke:var(--g);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s}
.info .lbl{font-size:13px;letter-spacing:.08em;color:var(--mute-d);transition:color .2s}
.info b{font-weight:600;font-size:15px;line-height:1.3}
.info a:hover{background:var(--g);color:var(--on-g);border-color:var(--g)}
.info a:hover svg{stroke:var(--on-g)}.info a:hover .lbl{color:var(--on-g)}
.form{background:var(--ink2);border:1px solid var(--rule-d);border-top:3px solid var(--g);border-radius:2px;padding:36px;display:flex;flex-direction:column;gap:18px;position:relative}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:14px;letter-spacing:.04em;color:var(--mute-d)}
.field input,.field textarea,.field select{font-family:var(--f);font-size:17px;border-radius:8px;border:1px solid #454B51;transition:border-color .2s,box-shadow .2s;background:var(--ink);color:var(--text);padding:0 14px}
.field input,.field select{height:50px}
.field textarea{padding:12px 14px;resize:vertical}
.field .bad{border-color:#FF8A7A}
.row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.submit{height:54px;padding:0;font-size:17px;width:100%}
.submit[disabled]{opacity:.6;cursor:wait}
.form-msg{font-size:15px;min-height:1.6em;color:var(--g)}
.form-msg.err{color:#FF8A7A}
.consent{font-size:14px;color:var(--mute-d)}
.consent a{text-decoration:underline}
.hp{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip-path:inset(50%);pointer-events:none}

/* ---------- footer ---------- */
.foot{background:var(--ink3);color:var(--mute-d);padding:64px 0 24px}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(5,minmax(0,1fr));gap:28px;font-size:16px}
.foot-grid nav,.foot-grid>div:last-child{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.foot-brand{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.foot .brand{background:#fff;padding:6px 14px;border-radius:2px}
.foot .brand img{height:48px}
.foot h4{font-weight:600;font-size:14px;letter-spacing:.08em;color:var(--text);margin:0 0 6px}
.foot a:hover{color:var(--g)}
.foot-bot{margin-top:44px;padding-top:20px;border-top:1px solid var(--rule-d);font-size:14px}

/* ---------- mobile bar / a11y ---------- */
.m-bar{display:none}
.a11y{position:fixed;left:16px;bottom:16px;z-index:60}
.a11y-btn{width:48px;height:48px;border-radius:50%;box-shadow:0 6px 20px rgba(0,0,0,.35);border:1.5px solid var(--g);background:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.a11y-btn svg{width:24px;height:24px;fill:none;stroke:var(--g);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.a11y-panel{position:absolute;bottom:58px;left:0;width:220px;background:var(--ink2);border:1px solid #454B51;border-radius:4px;padding:14px;display:flex;flex-direction:column;gap:8px;color:var(--text);box-shadow:0 20px 50px rgba(0,0,0,.5)}
.a11y-panel[hidden]{display:none}
.a11y-panel b{font-size:15px}
.a11y-panel button{font-family:var(--f);font-size:15px;text-align:right;padding:9px 12px;border-radius:2px;border:1px solid #454B51;background:var(--ink);color:var(--text);cursor:pointer}
.a11y-panel button[aria-pressed="true"]{border-color:var(--g);background:rgba(138,189,54,.16)}
.a11y-panel a{font-size:14px;text-decoration:underline;color:var(--mute-d)}
.to-top{position:fixed;left:76px;bottom:16px;z-index:60;width:52px;height:52px;border-radius:50%;border:0;padding:0;background:conic-gradient(#8ABD36 calc(var(--p,0)*1%),rgba(138,189,54,.28) 0);box-shadow:0 6px 20px rgba(0,0,0,.4);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s}
.to-top::before{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--ink)}
.to-top:hover{transform:translateY(-3px)}
.to-top[hidden]{display:none}
.to-top svg{position:relative;width:22px;height:22px;fill:none;stroke:#8ABD36;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:721px){.to-top{left:auto;right:16px}}
html.a11y-lg body{zoom:1.12}
html.a11y-sm body{zoom:.92}
html.a11y-contrast body{filter:contrast(1.3)}
html.a11y-links a{text-decoration:underline !important;text-underline-offset:3px}
html.a11y-motion *{animation:none !important;transition:none !important;scroll-behavior:auto !important}

/* ---------- simple pages ---------- */
.doc{max-width:820px;margin:0 auto;padding:64px 32px 96px}
.doc h1{font-size:44px;margin-bottom:24px}
.doc h2{font-size:26px;margin:32px 0 8px}
.doc p,.doc li{font-size:18px;color:var(--bt)}
.doc li{list-style:disc;margin-inline-start:22px}
.doc a{text-decoration:underline}
.doc .note{border:1px dashed var(--g-dk);padding:14px 18px;color:var(--g-dk);font-size:16px;margin-bottom:16px}
.doc p{margin-bottom:12px}
.doc .cta-box{margin:40px 0 8px;padding:28px;background:var(--alt);border-inline-start:4px solid var(--g)}
.doc .cta-box h2{margin-top:0}
.doc .cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.doc .cta-row .btn{text-decoration:none}
.doc .cta-row .btn-g{color:var(--on-g)}
.doc .faq{margin-top:8px}
.doc .faq a{text-decoration:underline}
@media (max-width:720px){.doc{padding:40px 20px 120px}.doc h1{font-size:32px}.doc .cta-row .btn{flex:1 1 100%}}

@media (prefers-reduced-motion:reduce){.flow,.bus{animation:none}html{scroll-behavior:auto}}

/* ---------- tablet ---------- */
@media (max-width:1180px){.phone-link{display:none}}
@media (max-width:1000px){
  section{padding:80px 0}
  h1{font-size:52px}h2{font-size:38px}
  .hero-in,.two,.faq-in{grid-template-columns:minmax(0,1fr);gap:48px}
  .spec-in{grid-template-columns:repeat(2,minmax(0,1fr))}
  .spec-in div:nth-child(3){border-inline-start:0;padding-inline-start:0}
  .spec-in div:nth-child(n+3){border-top:1px solid var(--rule-d)}
  .tr{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
  .tr .uses{grid-column:2}
  .tr.th{display:none}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px}
  .steps::before,.steps::after,.steps .fill{display:none}
  .projects{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- mobile ---------- */
@media (max-width:720px){
  body{font-size:16px}
  .foot{padding-bottom:100px}
  .wrap{padding:0 20px}
  section{padding:56px 0}
  h1{font-size:40px}h2{font-size:30px}h2.sm{font-size:28px;margin-bottom:32px}
  h3{font-size:20px}
  .lead,.body-l{font-size:17px}
  .sec-head{margin-bottom:32px}
  .nav-in{gap:12px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
  .brand img{height:40px}
  .burger{display:flex;margin-inline-start:auto}
  .nav-cta{display:none}
  .menu{display:none;flex-direction:column;gap:0;width:100%;flex-basis:100%;padding-bottom:6px}
  .menu.open{display:flex}
  .menu{justify-content:flex-start;padding-inline-start:0}
  .menu a{padding:14px 0;border-bottom:1px solid var(--rule);font-size:17px}
  .menu a::after{inset-inline:0;bottom:-1px}
  .hero-in{padding-top:48px;padding-bottom:56px;gap:36px}
  .hero-text{gap:20px}
  .cta-row{gap:20px}
  .cta-row .btn{flex:1}
  .panel-body{padding:14px}
  .spec-in div{padding:12px 14px}
  .spec-in b{font-size:15px}.spec-in span{font-size:13px}
  .about-ph{height:260px}
  .explode{height:380px}
  .explode .fit{--k:.46;transform:translate(-88px,0) scale(var(--k))}
  .stats b{font-size:34px}
  .row{grid-template-columns:52px 1fr;gap:6px 12px;padding:22px 0}
  .row .n{font-size:32px;grid-row:span 2}
  .pcard .n{font-size:32px}
  .why-list li{grid-template-columns:52px 1fr}.why-list b{font-size:30px}
  .row p{grid-column:2;font-size:16px}
  .row h3{font-size:22px}
  .row:hover{background:none;box-shadow:none}
  .row:hover>*{transform:none}
  .tr{grid-template-columns:minmax(0,1fr);gap:6px;padding:20px 0}
  .tr .uses{grid-column:auto}
  .tr-cta{flex-direction:column;align-items:flex-start}
  .steps{grid-template-columns:minmax(0,1fr);gap:28px}
  .steps::before{display:block;content:'';position:absolute;inset-inline-start:8px;top:0;bottom:0;width:2px;height:auto;background:#3A5230}
  html[data-theme="light"] .steps::before{background:#9DB88A}
  .steps .fill{display:block;position:absolute;inset-inline:auto;inset-inline-start:8px;top:0;bottom:0;width:2px;height:auto;background:linear-gradient(180deg,#A6E44A,var(--g));box-shadow:0 0 8px rgba(138,189,54,.8);transform:scaleY(0);transform-origin:top}
  .steps.go .fill{animation:fillGoV 3.6s linear forwards}
  @keyframes fillGoV{to{transform:scaleY(1)}}
  .step{padding-top:0;padding-inline-start:44px;text-align:start}
  .ic{margin:0 0 14px}
  .step::before{top:2px;left:auto;inset-inline-start:0}
  .projects{grid-template-columns:minmax(0,1fr);gap:32px}
  .proj.wide{grid-column:auto}
  .ph,.ph.tall{height:220px}
  .filters{gap:18px;overflow-x:auto}
  .faq summary{font-size:17px}
  .form{padding:22px}
  .row2{grid-template-columns:minmax(0,1fr)}
  .foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px}
  .foot-brand{grid-column:span 2}
  .m-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;position:fixed;inset-inline:0;bottom:0;z-index:40;padding:10px 12px;background:var(--surf);border-top:1px solid var(--rule)}
  .m-bar .btn{height:48px;padding:0;font-size:15px;color:var(--on-g)}
  .m-bar .btn-o{color:var(--fg)}
  .m-bar .btn-o{border-color:var(--fg)}
  .a11y{bottom:16px}
  .m-bar~.a11y,.m-bar~.to-top{bottom:84px}
}



/* ---------- hero traces ---------- */
.hero-bg-m{display:none}
.trace-base path{stroke:#3A5230;stroke-width:2}
.trace-pulses{filter:drop-shadow(0 0 4px rgba(138,189,54,.9))}
.trace-pulses .pulse{stroke:#A6E44A;stroke-width:2.5;stroke-dasharray:70 1100;animation:pulse linear infinite}
.trace-dots{filter:drop-shadow(0 0 3px rgba(138,189,54,.9))}
.trace-dots path{fill:none;stroke:#C8FF6B;stroke-width:3;stroke-linecap:round;stroke-dasharray:.1 110;animation:dots linear infinite}
@keyframes dots{from{stroke-dashoffset:0}to{stroke-dashoffset:-330.3}}
@media (prefers-reduced-motion:reduce){.trace-dots{display:none}}
@keyframes pulse{from{stroke-dashoffset:0}to{stroke-dashoffset:-1170}}
.pads circle{fill:var(--ink);stroke:#5E8F2E;stroke-width:2}
@media (max-width:720px){.hero-bg:not(.hero-bg-m){display:none}.hero-bg-m{display:block}}
@media (prefers-reduced-motion:reduce){.steps::after{display:none}.steps *,.steps .fill{animation-duration:.01s!important;animation-delay:0s!important;transition-delay:0s!important}}
@media (prefers-reduced-motion:reduce){.trace-pulses .pulse{animation:none;stroke-dasharray:none;stroke-opacity:.0}}


/* traces live in their own band, never behind text */
.trace-band{position:relative;height:110px;border-top:1px solid var(--rule-d);overflow:hidden;background:rgba(14,16,18,.55)}
.trace-band svg{position:absolute;inset:0;width:100%;height:100%;display:block}

@media (max-width:720px){.hero-bg:not(.hero-bg-m){display:block}.trace-band{height:84px}}

.btn{background-color:transparent;font-family:var(--f)}
.btn-g{background-color:var(--g)}
.btn-g:hover{background-color:#8FCB3A}


/* traces as hero background: behind text (faded by a scrim) and behind the board */
.hero-bg-m{display:none}
.hero-in{padding-top:104px}
.hero-text{position:relative;isolation:isolate}
.hero-text::before{content:'';position:absolute;z-index:-1;inset:-60px -90px -60px -90px;background:radial-gradient(ellipse at 50% 50%,rgba(21,23,26,.96) 0,rgba(21,23,26,.9) 48%,rgba(21,23,26,0) 75%);pointer-events:none}
@media (max-width:720px){
  .hero-in{padding-top:48px}
  .hero-bg:not(.hero-bg-m){display:none}.hero-bg-m{display:block}
  .hero-text::before{inset:-30px -40px}
}

@media (max-width:720px){.hero-text::before{inset:-30px 0;background:linear-gradient(180deg,rgba(21,23,26,0),rgba(21,23,26,.85) 25%,rgba(21,23,26,.85) 75%,rgba(21,23,26,0))}}


/* ---------- hero graphic: three stages merge into one board ---------- */
.orb{margin:0;display:flex;justify-content:center;position:relative;z-index:1}
.orb svg{width:min(100%,400px);height:auto;overflow:visible}
.m-base path{fill:none;stroke:#3A5230;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.m-bus path.b{fill:none;stroke:#3A5230;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.m-bus path.pu{fill:none;stroke:#A6E44A;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0;filter:drop-shadow(0 0 4px rgba(138,189,54,.9))}
.m-flow{filter:drop-shadow(0 0 4px rgba(138,189,54,.9))}
.m-flow path{fill:none;stroke:#A6E44A;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.m-via rect{fill:rgba(138,189,54,.14);stroke:#5E8F2E;stroke-width:1.5;stroke-opacity:.8}
.m-src rect{fill:var(--chip,#15171A);stroke:#8ABD36;stroke-width:2}
.m-src text{fill:#E6EAE7;font:600 14px "IBM Plex Sans Hebrew",sans-serif;text-anchor:middle}
.m-src text.n{fill:#8ABD36;font-size:16px;font-weight:800;font-variant-numeric:tabular-nums}
.m-core rect:not(.pin){fill:#15171A;stroke:#8ABD36;stroke-width:2.5}
.m-core .pin{fill:#5E8F2E}
.bolt{fill:#A6E44A;filter:drop-shadow(0 0 6px rgba(166,228,74,.8));transform-box:fill-box;transform-origin:center}
.halo{opacity:.4}
.m-pads circle{fill:#15171A;stroke:#5E8F2E;stroke-width:2}
@media (max-width:1000px){.orb svg{width:min(80%,320px)}}
@media (min-width:1001px){.hero-in{padding-top:56px;padding-bottom:28px}.orb svg{width:auto;max-width:100%;height:min(520px,calc(100svh - 270px));min-height:340px}}



/* the bus coming from above sits further back */
.m-bus .rt{opacity:.6}
.m-bus path.pu.rt{opacity:0}

/* scroll-linked current */
.offscreen *,.offscreen *::before,.offscreen *::after{animation-play-state:paused !important}
.spine{position:absolute;top:0;left:auto;z-index:4;pointer-events:none}

/* SEO landing pages */
.row h3 a,.tr h3 a{color:inherit;text-decoration:none}
.row h3 a:hover,.tr h3 a:hover{text-decoration:underline}
.crumbs{font-size:15px;color:var(--mute);margin-bottom:16px}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}

/* ---------- dark mode ---------- */
html[data-theme="dark"]{--nav-bg:rgba(35,39,44,.96)}
html[data-theme="dark"] .nav .brand,html[data-theme="dark"] .brand{background:#fff;padding:4px 10px;border-radius:2px;align-items:center}
html[data-theme="dark"] .brand img{height:44px}
html[data-theme="dark"] .row:hover{background:var(--alt)}
html.theme-fade *,html.theme-fade *::before,html.theme-fade *::after{transition:background-color .35s,color .35s,border-color .35s !important}
@media (max-width:720px){
  .burger{order:1}.menu{order:2}
  html[data-theme="dark"] .brand img{height:34px}
}

/* light mode: fixes for hard-coded dark values */
html[data-theme="light"] .lead{color:#454B47}
html[data-theme="light"] .spec,html[data-theme="light"] .trace-band{background:rgba(228,226,217,.7)}
html[data-theme="light"] .hero-text::before{background:radial-gradient(ellipse at 50% 50%,rgba(241,240,234,.96) 0,rgba(241,240,234,.9) 48%,rgba(241,240,234,0) 75%)}
html[data-theme="light"] .hero svg #grid path{stroke:#000}
html[data-theme="light"] .m-src text{fill:#15171A}
html[data-theme="light"] .m-src rect,html[data-theme="light"] .m-core rect:not(.pin),html[data-theme="light"] .m-pads circle,html[data-theme="light"] .pads circle{fill:#F1F0EA}
html[data-theme="light"] .m-base path,html[data-theme="light"] .m-bus path.b,html[data-theme="light"] .trace-base path{stroke:#9DB88A}
@media (max-width:720px){html[data-theme="light"] .hero-text::before{background:linear-gradient(180deg,rgba(241,240,234,0),rgba(241,240,234,.9) 25%,rgba(241,240,234,.9) 75%,rgba(241,240,234,0))}}


/* sparks + flash */
.spark{position:fixed;z-index:200;width:6px;height:6px;border-radius:50%;background:#C8FF6B;box-shadow:0 0 8px 2px #A6E44A;pointer-events:none}
.theme-flash{position:fixed;inset:0;z-index:150;pointer-events:none;opacity:0}

/* circuit spark-gap theme switch: three spark gaps cut into the hero's own output traces */
.orb{position:relative}
.ksw{cursor:pointer;outline:none}
.ksw:focus-visible .ksw-hit{stroke:var(--g);stroke-width:2;stroke-dasharray:4 4}
.sg-pad{fill:var(--ink);stroke:var(--g);stroke-width:2.5}
.sg-collar{fill:#22262A;stroke:#8ABD36;stroke-width:1.4}
.sg-rod{fill:url(#ksMetal);stroke:#5A636B;stroke-width:.8}
.sg-spec{fill:none;stroke:#fff;stroke-width:1.1;stroke-linecap:round;opacity:.75}
.sg-corona{fill:none;stroke:#A6E44A;stroke-width:1.2;opacity:0}
.sg-glow{opacity:0;transition:opacity .3s;pointer-events:none}
.sg-bolt{opacity:0}
.sg-av{opacity:0}
.sg-aw{fill:none;stroke:#A6E44A;stroke-width:5;stroke-linejoin:round;stroke-linecap:round;opacity:.5;filter:blur(2px)}
.sg-ac{fill:none;stroke:#F4FFD2;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.ksw:hover .sg-collar,.ksw:focus-visible .sg-collar{fill:#2E3A1F}
/* closed: a live arc that flickers between three shapes */
html[data-theme="light"] .sg-glow{opacity:.85}
html[data-theme="light"] .sg-bolt{opacity:1}
html[data-theme="light"] .sg-av{animation:sgAv .3s steps(1) infinite;animation-delay:var(--o)}
html[data-theme="light"] .sg-corona{opacity:.9;animation:sgCor .3s ease-in-out infinite alternate}
@keyframes sgAv{0%{opacity:1}33.3%{opacity:0}100%{opacity:0}}
@keyframes sgCor{from{r:3;opacity:.9}to{r:6;opacity:.3}}
/* open: current stops at the first gap; electrodes hum with a faint corona and tease a spark now and then */
html[data-theme="dark"] .m-ext,html[data-theme="dark"] #mFlow{mask:url(#gapMask)}
html[data-theme="dark"] .sg-corona{animation:sgHum 2.6s var(--d) ease-in-out infinite}
html[data-theme="dark"] .sg-bolt{animation:sgTease 4.2s var(--d) infinite}
html[data-theme="dark"] .sg-av:first-child{opacity:1}
@keyframes sgHum{0%,100%{opacity:0;r:3}50%{opacity:.55;r:6.5}}
@keyframes sgTease{0%,88%,100%{opacity:0}90%{opacity:1}92%{opacity:.15}94%{opacity:.9}97%{opacity:0}}
html.a11y-motion .sg-av,html.a11y-motion .sg-corona,html.a11y-motion .sg-bolt{animation:none}
@media (prefers-reduced-motion:reduce){.sg-av,.sg-corona,.sg-bolt{animation:none !important}}

/* the bolt in the board is a second theme switch */
.bolt-hit,.bolt{cursor:pointer}
.m-core:hover .bolt{filter:drop-shadow(0 0 10px rgba(166,228,74,1))}

/* the three stage chips (01 / 02 / 03) get a deepening green tint */
.m-src g:nth-child(1){--chip:#243A12}
.m-src g:nth-child(2){--chip:#2C4A12}
.m-src g:nth-child(3){--chip:#355A12}
html[data-theme="light"] .m-src g:nth-child(1){--chip:#E6F4CB}
html[data-theme="light"] .m-src g:nth-child(2){--chip:#D6EDAB}
html[data-theme="light"] .m-src g:nth-child(3){--chip:#C3E583}
html[data-theme="light"] .m-src rect{fill:var(--chip)}
html[data-theme="light"] .m-via rect{fill:rgba(94,143,46,.12)}
.m-src text.n{fill:#A6E44A}
html[data-theme="light"] .m-src text.n{fill:#3F6A0C}

/* the current from the right-edge strip continues into two more sections */
/* why: a trace links the five numbers, each with a pad */
.why-list{position:relative}
.why-list::before{content:'';position:absolute;inset-inline-start:-21px;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--g),rgba(138,189,54,.35));opacity:.8}
.why-list::after{content:'';position:absolute;inset-inline-start:-22px;top:0;width:4px;height:90px;border-radius:2px;
  background:linear-gradient(180deg,transparent,#A6E44A);filter:drop-shadow(0 0 4px rgba(138,189,54,.9));animation:whyRun 5s linear infinite}
@keyframes whyRun{from{top:-90px}to{top:100%}}
.why-list li{position:relative}
.why-list li::before{content:'';position:absolute;inset-inline-start:-26px;top:50%;margin-top:-5px;width:10px;height:10px;border-radius:50%;
  background:var(--ink);border:2px solid var(--g);box-sizing:border-box}
@media (max-width:720px){
  .why-list::before{inset-inline-start:-11px}.why-list::after{inset-inline-start:-12px}
  .why-list li::before{inset-inline-start:-16px}
}
@media (prefers-reduced-motion:reduce){.why-list::after{display:none}}

/* footer is light in dark theme: drop the white logo plate and let the logo's white background blend into the surface */
html[data-theme="dark"] .foot .brand{background:transparent;padding:0}
html[data-theme="dark"] .foot .brand img{mix-blend-mode:multiply}

/* logo: a transparent light-ink variant for dark surfaces (nav in dark theme, footer in light theme) */
.brand img.logo-dk{display:none}
html[data-theme="dark"] .nav .brand,html[data-theme="light"] .foot .brand{background:transparent;padding:0}
html[data-theme="dark"] .nav .brand img.logo-lt,html[data-theme="light"] .foot .brand img.logo-lt{display:none}
html[data-theme="dark"] .nav .brand img.logo-dk,html[data-theme="light"] .foot .brand img.logo-dk{display:block}

/* contact form: a live wire that energizes as the form is filled */
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--g);box-shadow:inset 0 0 0 1px var(--g)}
.form ::selection{background:rgba(138,189,54,.35);color:inherit}
.form.full .submit{animation:ready 1.6s ease-in-out infinite}
@keyframes ready{50%{box-shadow:0 0 0 6px rgba(122,185,41,.25),0 0 22px rgba(166,228,74,.55)}}
@media (prefers-reduced-motion:reduce){.form.full .submit{animation:none}}

/* "נדליק אותו" switches on like a neon sign when the contact section scrolls into view */
.ignite{color:#4a5a38;transition:color .3s,text-shadow .3s}
.ignite.on{color:#A6E44A;text-shadow:0 0 8px rgba(166,228,74,.85),0 0 24px rgba(122,185,41,.6);animation:neon 1.1s steps(1,end) both}
@keyframes neon{0%{color:#4a5a38;text-shadow:none}10%{color:#A6E44A;text-shadow:0 0 8px rgba(166,228,74,.85),0 0 24px rgba(122,185,41,.6)}18%{color:#4a5a38;text-shadow:none}30%{color:#A6E44A;text-shadow:0 0 8px rgba(166,228,74,.85),0 0 24px rgba(122,185,41,.6)}38%{color:#4a5a38;text-shadow:none}55%{color:#A6E44A;text-shadow:0 0 12px rgba(166,228,74,1),0 0 36px rgba(122,185,41,.8)}100%{color:#A6E44A;text-shadow:0 0 8px rgba(166,228,74,.85),0 0 24px rgba(122,185,41,.6)}}
html[data-theme="light"] .ignite{color:#9aa38f}
html[data-theme="light"] .ignite.on{color:var(--g-dk);text-shadow:0 0 14px rgba(122,185,41,.55)}
@media (prefers-reduced-motion:reduce){.ignite.on{animation:none}}

/* contact form polish */
.form{border-radius:14px;padding:40px 36px 32px;gap:20px;box-shadow:0 30px 70px -36px rgba(0,0,0,.55),0 0 0 1px rgba(122,185,41,.08)}
.field label{font-size:13.5px;font-weight:600;letter-spacing:.02em}
.field input,.field textarea,.field select{border-radius:10px;border-width:1.5px;padding-inline:16px}
.field input,.field select{height:52px}
.field select{appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%237AB929' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 16px center;padding-inline-end:16px;padding-inline-start:16px}
.field input:hover,.field textarea:hover,.field select:hover{border-color:var(--g)}
.field textarea{min-height:110px}
.submit{border-radius:10px;display:flex;align-items:center;justify-content:center;gap:10px;font-weight:700;transition:transform .15s,box-shadow .2s}
.submit svg{width:18px;height:18px;fill:currentColor;transition:transform .25s}
.submit:hover:not([disabled]){transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(122,185,41,.8)}
.submit:hover:not([disabled]) svg{transform:rotate(-12deg) scale(1.2)}
@media (max-width:720px){.form{padding:32px 20px 24px}}

/* form: 2x2 grid, medium sizing */
.form{padding:34px 32px 28px;gap:18px;border-radius:14px}
.form .row2{gap:16px}
.field{gap:6px}
.field label{font-size:13.5px}
.field input,.field select{height:50px;font-size:17px}
.field input,.field textarea,.field select{border-width:1.5px;border-radius:10px;padding-inline:16px}
.field select{background-position:left 16px center;padding-inline:16px}
.field textarea{min-height:100px;font-size:17px;padding:12px 16px}
.consent{font-size:14px;margin-top:0}
.submit{height:52px;font-size:17px;border-radius:10px}
.form-msg{min-height:0;margin:0}
.form-msg:empty{display:none}
@media (max-width:720px){.form{padding:26px 18px 22px}.form .row2{grid-template-columns:minmax(0,1fr)}}

/* submit button: always the bright brand green (light theme's --g is darker) */
.btn-g.submit{background:linear-gradient(180deg,#A6E44A,#8ABD36);background-color:#9BE33A;color:#15171A}
.btn-g.submit:hover:not([disabled]){background:linear-gradient(180deg,#B4F05A,#9BE33A)}

/* header CTA: smaller, softer, friendlier */
.btn.nav-cta{padding:10px 22px;font-size:15px;font-weight:700;line-height:1.2;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;border-radius:2px;border:1px solid #9BE33A;background:#9BE33A;color:#15171A;box-shadow:none;transition:background .15s,color .15s}
.btn.nav-cta:hover{background:transparent;color:#9BE33A;transform:none;box-shadow:none}

/* section headings nudged right of the content edge (RTL: inline-start is the right side) */
.sec-head{margin-inline-start:-16px}
@media(max-width:720px){.sec-head{margin-inline-start:-6px}}

/* declutter: the long background traces recede behind the central graphic */
.trace-base{opacity:.3}
.pads{opacity:.4}
.m-ext .m-base{opacity:.4}
.m-bus .rt{opacity:.3}

/* a red current runs down two of the buses into the chip */
.m-red{filter:drop-shadow(0 0 5px rgba(166,228,74,.85))}
.m-red path{fill:none;stroke:#E4FFB0;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22 78;animation:redRun 3.8s linear infinite}
@keyframes redRun{from{stroke-dashoffset:22}to{stroke-dashoffset:-86}}
@media (prefers-reduced-motion:reduce){.m-red{display:none}}
html.a11y-motion .m-red path{animation:none;opacity:0}
html[data-theme="light"] .m-red{filter:drop-shadow(0 0 3px rgba(21,23,26,.35))}
html[data-theme="light"] .m-red path{stroke:#4F7D12}

/* hero headline accent: a brighter green on the dark hero */
.hero h1 .g{color:#A6E44A}
html[data-theme="light"] .hero h1 .g{color:var(--g)}

/* hero fills the first screen; spec strip sits at its bottom edge */
.hero{display:flex;flex-direction:column;min-height:calc(100svh - var(--nav-h,68px))}
.hero-in{flex:1 0 auto}
.spec{margin-top:auto}

/* hero text sits higher on desktop */
@media (min-width:1001px){.hero-text{align-self:start;margin-top:clamp(0px,4vh,48px);margin-inline-start:-28px}}

/* contact form progress: four slim segments that fill as the key fields are completed */
.prog{position:absolute;inset-inline:0;top:-3px;pointer-events:none}
.prog-bar{position:relative;height:11px;border-radius:14px 14px 0 0;background:#4B5E3B;border-bottom:1px solid #62794A;overflow:hidden}
.prog-bar i{position:absolute;inset-block:0;inset-inline-start:0;width:calc(var(--p,0)*100%);border-radius:0;background:linear-gradient(270deg,#5B8F22 0%,#8ABD36 45%,#B4F04F 85%,#E6FFA8 100%);box-shadow:0 0 12px rgba(166,228,74,.7);transition:width .22s ease-out}
.form.full .prog-bar i{box-shadow:0 0 16px rgba(190,255,90,.95);filter:brightness(1.12) saturate(1.1)}
@media (prefers-reduced-motion:reduce){.prog-bar i{transition:none}}

/* clients: infinite marquee */
.clients{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.clients-track{list-style:none;margin:0;padding:0;display:flex;gap:20px;width:max-content;animation:clients-scroll 24s linear infinite}
.clients:hover .clients-track{animation-play-state:paused}
.clients li{background:#fff;border-radius:6px;display:flex;align-items:center;justify-content:center;flex:none;width:240px;height:116px;padding:24px 32px}
.clients img{max-width:100%;max-height:46px;width:auto;height:auto;object-fit:contain}
.clients img[src*="gilgal"],.clients img[src*="negev-gas"],.clients img[src*="or-torah"],.clients img[src*="iec"]{max-height:84px;margin:-8px 0}
@keyframes clients-scroll{to{transform:translateX(50%)}}
@media(max-width:720px){.clients-track{gap:12px}.clients li{width:176px;height:92px;padding:16px 20px}.clients img[src*="gilgal"],.clients img[src*="negev-gas"],.clients img[src*="or-torah"],.clients img[src*="iec"]{max-height:70px;margin:-4px 0}}
@media (prefers-reduced-motion:reduce){.clients{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.clients-track{animation:none}.clients li[aria-hidden]{display:none}}


/* sparse background traces entering from the left in a few sections (same language as the hero's) */
.has-deco{position:relative;overflow:hidden}
.has-deco>.wrap{position:relative;z-index:1}
.deco-l{position:absolute;left:0;width:min(44vw,520px);height:auto;pointer-events:none;z-index:0}
.deco-b{bottom:0}.deco-t{top:0}
.deco-l path{fill:none}
.dl-base path{fill:none;stroke:#5E8F2E;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter;opacity:.3}
.dl-pads circle{fill:none;stroke:#5E8F2E;stroke-width:2;opacity:.45}
.deco-l .trace-pulses{filter:drop-shadow(0 0 3px rgba(138,189,54,.8))}
.deco-l .pulse{stroke-width:2.5;stroke-dasharray:60 900}
@media (max-width:720px){.deco-l{width:56vw}}

/* ---------- hero intro: the pieces arrive from different directions and lock into place ---------- */
@keyframes heroIn{from{opacity:0;translate:var(--fx,0) var(--fy,0)}to{opacity:1;translate:0 0}}
@keyframes heroGlow{0%,100%{opacity:.4}50%{opacity:1}}
.hero-text,.hero .spec,.hero .m-src>g,.hero .m-core,.hero .m-pads,.hero .m-ext,.hero .ksw,.hero-bg .trace-base,.hero-bg .pads{animation:heroIn .9s cubic-bezier(.2,.8,.2,1) backwards}
.hero-text{--fx:90px}
.hero .spec{--fy:60px;animation-delay:.5s}
.hero .m-src>g:nth-child(1){--fx:110px;--fy:-90px}
.hero .m-src>g:nth-child(2){--fy:-130px;animation-delay:.12s}
.hero .m-src>g:nth-child(3){--fx:-110px;--fy:-90px;animation-delay:.24s}
.hero .m-core{--fy:110px;animation-delay:.35s}
.hero .m-pads{--fy:90px;animation-delay:.5s}
.hero .m-ext{--fx:-60px;--fy:60px;animation-delay:.6s}
.hero .ksw{--fx:-90px;animation-delay:.7s}
.hero-bg .trace-base{--fx:-70px;animation-delay:.2s}
.hero-bg .pads{animation-delay:.6s}
.hero .halo{animation:heroGlow 1.6s ease-out .9s 1}
html.a11y-motion .hero *{animation:none !important}
@media (prefers-reduced-motion:reduce){.hero-text,.hero .spec,.hero .m-src>g,.hero .m-core,.hero .m-pads,.hero .m-ext,.hero .ksw,.hero-bg .trace-base,.hero-bg .pads,.hero .halo{animation:none}}

/* hero: larger type */
.hero h1{font-size:76px}
.hero .lead{font-size:23px;max-width:600px}
@media (max-width:1000px){.hero h1{font-size:60px}}
@media (max-width:720px){.hero h1{font-size:46px}.hero .lead{font-size:19px}}