/* ===========================================================
   יצירה ועץ / קונספט D
   כל התמונות אומתו מול אתר הלקוח ומשויכות לקטגוריה הנכונה.
   צבעי מותג: A1CB3D ירוק / 985C28 חום / 2B2724 פחם
   =========================================================== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#0D0C0A;color:#F7F4EE;font-family:Rubik,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,h4{margin:0;font-weight:900;letter-spacing:-.035em;line-height:.98}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
:root{
  --ink:#0D0C0A; --ink2:#191714; --ink3:#242019;
  --bone:#F7F4EE; --bone2:#EBE6DC;
  --green:#A1CB3D; --green-d:#8AB22C;
  --wood:#985C28;
  --mute:#8A8278;
  --line:rgba(255,255,255,.12);
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,monospace;
}

.wrap{max-width:1320px;margin:0 auto;padding:0 40px}
.full{width:100%}

/* ---------- כפתורים ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:15.5px;padding:16px 30px;border-radius:2px;transition:transform .18s cubic-bezier(.2,.8,.3,1),background .18s,color .18s,border-color .18s;white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn-g{background:var(--green);color:#121607}
.btn-g:hover{background:#B4E046}
.btn-w{background:var(--bone);color:var(--ink)}
.btn-w:hover{background:#fff}
.btn-d{background:var(--ink);color:var(--bone)}
.btn-d:hover{background:#2A251E}
.btn-o{border:1.5px solid rgba(255,255,255,.3);color:#fff}
.btn-o:hover{border-color:var(--green);color:var(--green)}
.btn-ol{border:1.5px solid rgba(13,12,10,.25);color:var(--ink)}
.btn-ol:hover{border-color:var(--ink);background:var(--ink);color:var(--bone)}
.lnk{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:15px}
.lnk svg{transition:transform .25s cubic-bezier(.2,.8,.3,1)}
.lnk:hover svg{transform:translateX(-6px)}

/* ---------- סרגל + כותרת ---------- */
.util{background:#000;color:#8A8278;font-size:12.5px;border-bottom:1px solid var(--line)}
.util .wrap{display:flex;align-items:center;gap:22px;height:42px}
.util .g{color:var(--green);font-weight:600}
.util .r{margin-inline-start:auto;display:flex;gap:22px}
.util a:hover{color:#fff}

.hdr{position:sticky;top:0;z-index:60;background:rgba(13,12,10,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);transition:height .25s}
.hdr .wrap{display:flex;align-items:center;gap:36px;height:86px;transition:height .25s}
.hdr.sm .wrap{height:66px}
.hdr .logo{height:56px;width:auto;transition:height .25s}
.hdr.sm .logo{height:42px}
.nav{display:flex;gap:28px;font-size:15.5px;font-weight:500;color:#BDB6AC}
.nav a{position:relative;padding:6px 0}
.nav a::after{content:'';position:absolute;inset-block-end:0;inset-inline-start:0;width:0;height:2px;background:var(--green);transition:width .26s cubic-bezier(.2,.8,.3,1)}
.nav a:hover{color:#fff}
.nav a:hover::after{width:100%}
.hdr .r{margin-inline-start:auto;display:flex;align-items:center;gap:18px}
.tel{font-family:var(--mono);font-weight:700;font-size:19px;color:#fff;direction:ltr;letter-spacing:-.03em}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:clamp(560px,86vh,860px);display:flex;align-items:flex-end;overflow:hidden;background:#0D0C0A}
.hero-img{position:absolute;inset:0}
.hero-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.04)}
.hero::after{content:'';position:absolute;inset:0;background:
  linear-gradient(to left,rgba(13,12,10,.93) 0%,rgba(13,12,10,.72) 38%,rgba(13,12,10,.15) 72%,rgba(13,12,10,.45) 100%),
  linear-gradient(to top,rgba(13,12,10,.9) 0%,transparent 44%)}
.hero .wrap{position:relative;z-index:3;padding-block:0 0;width:100%}
.hero-in{padding-block:110px 0}
/* בלי מונוספייס ובלי ריווח אותיות לטיני. עברית נקראת רע בשניהם */
.kick{display:inline-flex;align-items:center;gap:10px;font-size:12.5px;letter-spacing:.09em;color:var(--green);font-weight:700}
.kick::before{content:'';width:30px;height:2px;background:currentColor;flex:0 0 auto}
.hero h1{margin-top:22px;font-size:clamp(42px,7.2vw,104px);max-width:13ch;letter-spacing:-.045em}
.hero h1 em{font-style:normal;color:var(--green)}
.hero .sub{margin-top:26px;font-size:clamp(16.5px,1.7vw,20px);line-height:1.6;color:#C9C2B8;max-width:46ch;font-weight:300}
.hero .acts{margin-top:36px;display:flex;gap:12px;flex-wrap:wrap}
.hero-meta{margin-top:64px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}
.hero-meta div{padding:22px 0 26px;border-inline-start:1px solid var(--line);padding-inline-start:22px}
.hero-meta div:first-child{border-inline-start:0;padding-inline-start:0}
.hero-meta b{display:block;font-family:var(--mono);font-size:clamp(20px,2.4vw,30px);font-weight:700;color:#fff;letter-spacing:-.04em}
.hero-meta span{display:block;margin-top:6px;font-size:12.5px;color:var(--mute);font-weight:400}

/* ---------- רצועת מלאי ---------- */
.tick{background:var(--green);color:#121607;overflow:hidden;padding-block:15px;border-block:0}
.tick-t{display:flex;width:max-content;animation:tk 48s linear infinite}
.tick:hover .tick-t{animation-play-state:paused}
.tick span{font-size:15px;font-weight:700;padding:0 20px;white-space:nowrap;letter-spacing:-.01em}
.tick span::after{content:'';display:inline-block;width:5px;height:5px;background:#121607;border-radius:50%;margin-inline-start:20px;vertical-align:3px;opacity:.5}
@keyframes tk{to{transform:translateX(-50%)}}

/* ---------- מבנה ---------- */
.sec{padding-block:clamp(64px,8vw,116px)}
.sec.bone{background:var(--bone);color:var(--ink)}
.sec.bone h2,.sec.bone h3{color:var(--ink)}
.sec.ink2{background:var(--ink2)}
.hd{display:flex;align-items:flex-end;justify-content:space-between;gap:34px;flex-wrap:wrap;margin-bottom:clamp(32px,4vw,58px)}
.hd h2{font-size:clamp(30px,5vw,62px);max-width:17ch}
.hd .note{margin-top:18px;font-size:16.5px;line-height:1.6;color:var(--mute);max-width:50ch;font-weight:300}
.sec.bone .note{color:#6B645A}
.sec.bone .kick{color:var(--wood)}
.hd .kick{margin-bottom:18px}

/* ---------- פסיפס קטגוריות, ללא מרווחים ---------- */
.mos{display:grid;grid-template-columns:repeat(4,1fr)}
.tile{position:relative;aspect-ratio:1/.82;overflow:hidden;display:block;background:#1A1815}
.tile img{width:100%;height:100%;object-fit:cover;transition:transform .85s cubic-bezier(.16,.84,.26,1);filter:saturate(1.02)}
.tile:hover img{transform:scale(1.07)}
.tile::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(10,9,8,.88) 2%,rgba(10,9,8,.25) 42%,transparent 68%);transition:opacity .4s}
.tile:hover::after{opacity:.82}
.tile .cap{position:absolute;z-index:2;inset-block-end:0;inset-inline:0;padding:24px 24px 26px}
.tile .cap h3{font-size:clamp(19px,1.7vw,25px);color:#fff}
.tile .cap em{font-style:normal;display:block;margin-top:7px;font-size:13px;color:rgba(255,255,255,.66);font-weight:300;line-height:1.45}
.tile .cap i{display:block;width:0;height:3px;background:var(--green);margin-top:14px;transition:width .4s cubic-bezier(.2,.8,.3,1)}
.tile:hover .cap i{width:46px}

/* ---------- בורר הפרויקט ---------- */
.pick{display:grid;grid-template-columns:.86fr 1.14fr;gap:0;border:1px solid var(--line);background:var(--ink)}
.pick-l{padding:12px;display:flex;flex-direction:column;gap:2px;background:var(--ink)}
.pick-b{text-align:start;padding:30px 28px;border-radius:2px;transition:background .22s,color .22s;position:relative;display:flex;align-items:center;gap:16px}
.pick-b .n{font-family:var(--mono);font-size:11.5px;color:var(--mute);transition:color .22s}
.pick-b .t{font-size:clamp(20px,2.1vw,30px);font-weight:900;letter-spacing:-.035em;color:#C4BCB2;transition:color .22s}
.pick-b .ar{margin-inline-start:auto;opacity:0;transform:translateX(8px);transition:.26s;color:#121607}
.pick-b:hover .t{color:#E4DED4}
.pick-b.on{background:var(--green)}
.pick-b.on .t{color:#121607}
.pick-b.on .n{color:rgba(18,22,7,.55)}
.pick-b.on .ar{opacity:1;transform:none}
.pick-r{position:relative;min-height:580px;overflow:hidden;border-inline-start:1px solid var(--line)}
.pane{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .4s ease;display:grid;grid-template-columns:1fr;align-content:end}
.pane.on{opacity:1;visibility:visible}
.pane img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pane::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(10,9,8,.95) 8%,rgba(10,9,8,.5) 50%,rgba(10,9,8,.15) 100%)}
.pane .bd{position:relative;z-index:2;padding:40px 40px 42px}
.pane h3{font-size:clamp(22px,2.4vw,32px);color:#fff}
.pane .ch{margin-top:16px;display:flex;gap:7px;flex-wrap:wrap}
.pane .ch span{font-size:13px;font-weight:600;padding:7px 13px;border:1px solid rgba(255,255,255,.26);border-radius:2px;color:#E4DED4}
.pane .ch span.hot{background:var(--green);border-color:var(--green);color:#121607}
.pane .fx{margin-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16)}
.pane .fx em{font-style:normal;display:block;font-size:12px;letter-spacing:.07em;color:var(--green);font-weight:700}
.pane .fx p{margin-top:7px;font-size:14.5px;line-height:1.5;color:#C9C2B8;font-weight:300}
.pane .go{margin-top:24px;display:flex;gap:10px;flex-wrap:wrap}

/* ---------- מספרים ---------- */
.nums{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(13,12,10,.14)}
.nums div{padding:34px 24px 32px 0;border-inline-start:1px solid rgba(13,12,10,.14);padding-inline-start:24px}
.nums div:first-child{border-inline-start:0;padding-inline-start:0}
.nums b{display:block;font-family:var(--mono);font-size:clamp(34px,4.6vw,58px);font-weight:700;letter-spacing:-.05em;color:var(--ink)}
.nums span{display:block;margin-top:10px;font-size:14.5px;color:#6B645A;line-height:1.5;font-weight:400}
.claim{font-size:clamp(23px,3.1vw,42px);font-weight:800;letter-spacing:-.035em;line-height:1.2;max-width:21ch}
.claim i{font-style:normal;color:var(--wood)}

/* ---------- מוצרים ---------- */
.prods{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.prod{background:#fff;display:flex;flex-direction:column;transition:transform .3s cubic-bezier(.2,.8,.3,1);position:relative}
.prod:hover{transform:translateY(-6px)}
.prod .ph{aspect-ratio:1/.92;background:var(--bone2);display:grid;place-items:center;padding:26px;overflow:hidden}
.prod .ph img{max-height:100%;width:auto;object-fit:contain;mix-blend-mode:multiply;transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.prod:hover .ph img{transform:scale(1.06)}
.prod .bd{padding:18px 20px 22px;flex:1;display:flex;flex-direction:column}
.prod h3{font-size:17px;letter-spacing:-.025em;line-height:1.22;color:var(--ink)}
.prod .mk{margin-top:7px;font-family:var(--mono);font-size:11.5px;color:#9A9289;letter-spacing:.03em}
.prod .go{margin-top:auto;padding-top:16px;font-size:14.5px;font-weight:700;color:var(--wood);display:flex;align-items:center;gap:7px}
.prod:hover .go svg{transform:translateX(-5px)}
.prod .go svg{transition:transform .25s}
.pill{position:absolute;z-index:3;inset-block-start:12px;inset-inline-start:12px;background:var(--green);color:#121607;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.1em;padding:6px 10px}

/* ---------- גלריה בגרירה ---------- */
.rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:40px;padding-bottom:10px;cursor:grab;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail.drag{cursor:grabbing;scroll-snap-type:none}
.rail figure{margin:0;flex:0 0 clamp(260px,30vw,420px);scroll-snap-align:start}
.rail .fr{aspect-ratio:4/3;overflow:hidden;background:var(--ink3)}
.rail img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.16,.84,.26,1);pointer-events:none}
.rail figure:hover img{transform:scale(1.05)}
.rail figcaption{margin-top:12px;display:flex;gap:10px;align-items:baseline;font-size:14px;color:#A49C92;font-weight:300}
.rail figcaption em{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--green)}
.rail-hint{display:flex;align-items:center;gap:9px;font-size:12.5px;letter-spacing:.05em;color:var(--mute);margin-top:22px;font-weight:500}

/* ---------- ביקורות ---------- */
.revs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rev{background:var(--ink2);border:1px solid var(--line);padding:28px 26px;display:flex;flex-direction:column}
.rev .st{color:var(--green);font-size:14px;letter-spacing:3px}
.rev p{margin-top:15px;font-size:16px;line-height:1.6;color:#D4CEC4;font-weight:300;flex:1}
.rev .by{margin-top:22px;padding-top:16px;border-top:1px solid var(--line);display:flex;align-items:center;gap:12px}
.rev .av{width:38px;height:38px;border-radius:50%;background:var(--green);color:#121607;display:grid;place-items:center;font-weight:800;font-size:15px}
.rev .by b{display:block;font-size:14.5px;font-weight:600;color:#fff}
.rev .by span{font-size:12px;color:var(--mute);font-family:var(--mono)}
.gscore{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:26px;font-size:14.5px;color:var(--mute)}
.gscore b{font-family:var(--mono);font-size:30px;font-weight:700;color:#fff;letter-spacing:-.04em}

/* ---------- סניפים ---------- */
.brs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.br{border:1px solid var(--line);padding:30px 28px;transition:border-color .25s,background .25s}
.br:hover{border-color:var(--green);background:var(--ink2)}
.br .c{font-size:12.5px;letter-spacing:.09em;color:var(--green);font-weight:700}
.br h3{margin-top:12px;font-size:25px;color:#fff}
.br ul{margin-top:18px;display:grid;gap:11px;font-size:15px;color:#A49C92;font-weight:300}
.br li{display:flex;gap:10px;align-items:flex-start}
.br li svg{flex:0 0 auto;margin-top:3px;color:#5E574E}
.br .ac{margin-top:24px;display:flex;gap:9px}
.br .ac .btn{flex:1;padding:12px;font-size:14px}

/* ---------- טופס ---------- */
.lead{background:var(--green);color:#121607}
.lead .wrap{padding-block:clamp(56px,7vw,92px);display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(36px,5vw,76px);align-items:center}
.lead h2{font-size:clamp(30px,4.4vw,56px);color:#121607;max-width:13ch}
.lead .p{margin-top:20px;font-size:17px;line-height:1.6;color:#2B3410;max-width:38ch;font-weight:400}
.lead .or{margin-top:28px;padding-top:22px;border-top:1px solid rgba(18,22,7,.25)}
.lead .or em{font-style:normal;display:block;font-size:13px;letter-spacing:0;color:#1C2409;font-weight:700;margin-bottom:2px}
.lead .or a{display:inline-block;margin-top:8px;font-family:var(--mono);font-size:clamp(30px,3.6vw,46px);font-weight:700;color:#121607;direction:ltr;letter-spacing:-.05em}
/* הטופס יושב על כרטיס לבן בתוך הבלוק הירוק, כדי שיהיה קריא ושיהיה ברור שממלאים אותו */
.frm{display:grid;gap:0;background:#fff;padding:36px 36px 38px;border-radius:2px;box-shadow:0 34px 70px -34px rgba(0,0,0,.45)}
.frm .pair{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.fld{position:relative;padding-top:26px;border-bottom:2px solid rgba(13,12,10,.17);transition:border-color .22s}
.fld:focus-within{border-bottom-color:var(--green-d)}
.fld label{position:absolute;top:0;inset-inline-start:0;font-size:13px;letter-spacing:0;color:#5B5349;font-weight:700}
.fld input,.fld select{width:100%;background:transparent;border:0;outline:0;font:inherit;font-size:18px;font-weight:600;color:var(--ink);padding-block:10px 13px}
.fld input::placeholder{color:rgba(13,12,10,.34);font-weight:500}
.fld select option{background:#fff;color:var(--ink)}
.frm .btn{margin-top:34px;justify-self:start}
.frm .fine{margin-top:15px;font-size:13.5px;color:#6B645A;font-weight:400}

/* ---------- פוטר ---------- */
.ft{background:#000;color:#8A8278;font-size:15px;font-weight:300}
.ft .wrap{padding-block:70px 0}
.ft-g{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:44px}
.ft h4{font-size:12.5px;letter-spacing:.09em;color:#fff;margin-bottom:20px;font-weight:700}
.ft ul{display:grid;gap:11px}
.ft a:hover{color:var(--green)}
.ft .lg{height:60px;width:auto;margin-bottom:20px}
.ft .ab{line-height:1.7;font-size:14.5px;max-width:33ch}
.ft .soc{margin-top:22px;display:flex;gap:9px}
.ft .soc a{width:40px;height:40px;border:1px solid var(--line);display:grid;place-items:center;transition:.2s}
.ft .soc a:hover{background:var(--green);color:#121607;border-color:var(--green)}
.ft .bt{font-family:var(--mono);font-size:30px;font-weight:700;color:#fff;direction:ltr;display:inline-block;letter-spacing:-.045em}
.ft-b{margin-top:56px;border-top:1px solid var(--line);padding-block:22px;display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:#5E574E}
.ft-b span:last-child{margin-inline-start:auto}

.stick{display:none}

/* ---------- אנימציית כניסה ---------- */
/* ברירת מחדל גלויה. מוסתר רק כשיש JS שיחזיר אותו */
.js .rv{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.8,.3,1),transform .7s cubic-bezier(.2,.8,.3,1)}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  .tick-t{animation:none}
  *{scroll-behavior:auto!important}
}

/* ---------- נפילה חיננית ---------- */
.nf{background:linear-gradient(135deg,#8A6B4A,#5E4A35 58%,#332A22)!important;position:relative}
.nf::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 2px,transparent 2px 15px)}
.prod .ph.nf{background:linear-gradient(135deg,#EBE6DC,#D4CCBE)!important}

/* ---------- רספונסיבי ---------- */
@media(max-width:1100px){
  .wrap{padding:0 26px}
  .nav{display:none}
  .mos{grid-template-columns:repeat(2,1fr)}
  .pick{grid-template-columns:1fr}
  .pick-l{flex-direction:row;overflow-x:auto;padding:10px;scrollbar-width:none}
  .pick-l::-webkit-scrollbar{display:none}
  .pick-b{padding:16px 20px;white-space:nowrap}
  .pick-b .ar{display:none}
  .pick-r{border-inline-start:0;border-top:1px solid var(--line);min-height:430px}
  .prods{grid-template-columns:repeat(2,1fr)}
  .revs,.brs{grid-template-columns:1fr}
  .lead .wrap{grid-template-columns:1fr}
  .ft-g{grid-template-columns:1fr 1fr}
  .rail{padding-inline:26px}
}
@media(max-width:680px){
  .wrap{padding:0 18px}
  .hero{min-height:auto}
  .hero-in{padding-block:70px 0}
  .hero-meta{grid-template-columns:1fr 1fr;margin-top:40px}
  .hero-meta div:nth-child(3){border-inline-start:0;padding-inline-start:0}
  .hero-meta div{padding-block:16px}
  .util .r{display:none}
  .hdr .r .tel{display:none}
  /* קטלוג בנייד, שתי עמודות וכותרת בלבד. רשימות סוגי העץ יורדות כדי לא להעמיס */
  .mos{grid-template-columns:repeat(2,1fr)}
  .tile{aspect-ratio:1/1}
  .tile::after{background:linear-gradient(to top,rgba(10,9,8,.9) 4%,rgba(10,9,8,.3) 46%,transparent 72%)}
  .tile .cap{padding:14px 14px 15px}
  .tile .cap h3{font-size:16.5px;letter-spacing:-.03em}
  .tile .cap em{display:none}
  .tile .cap i{width:24px;margin-top:9px}
  .prods{grid-template-columns:repeat(2,1fr);gap:12px}
  .prod .ph{padding:16px;aspect-ratio:1/1}
  .prod .bd{padding:14px 14px 17px}
  .prod h3{font-size:14.5px}
  .prod .mk{font-size:10.5px;margin-top:5px}
  .prod .go{font-size:13px;padding-top:12px}
  .pill{inset-block-start:9px;inset-inline-start:9px;font-size:9.5px;padding:5px 8px}
  .nums{grid-template-columns:1fr 1fr}
  .nums div:nth-child(3){border-inline-start:0;padding-inline-start:0}
  /* כל חמשת הטאבים גלויים בנייד במקום גלילה אופקית שמסתירה שניים */
  .pick-l{flex-wrap:wrap;overflow:visible;gap:6px;padding:12px}
  .pick-b{flex:0 0 auto;padding:12px 15px;gap:9px}
  .pick-b .t{font-size:17px}
  .pick-b .n{font-size:10px}
  /* בנייד הפאנל זורם במקום להיות מוחלט, אחרת התוכן גולש על הכותרת */
  .pick-r{min-height:0}
  .pane{position:static;display:none;opacity:1;visibility:visible;transition:none}
  .pane.on{display:block}
  .pane img{position:relative;width:100%;height:208px;object-fit:cover}
  .pane::after{display:none}
  .pane .bd{padding:22px 18px 26px;background:var(--ink)}
  .pane .ch span{font-size:12.5px;padding:6px 11px}
  .pane .fx{grid-template-columns:1fr;gap:16px}
  .pane .go{margin-top:20px}
  .pane .go .btn{flex:1;padding:14px 10px;font-size:14.5px}
  .frm{padding:24px 20px 28px}
  .frm .pair{grid-template-columns:1fr;gap:0}
  .frm .btn{justify-self:stretch;margin-top:28px}
  .ft-g{grid-template-columns:1fr}
  .rail{padding-inline:18px}
  
  .stick{display:flex;position:sticky;bottom:0;z-index:70;background:#000;border-top:1px solid var(--line);padding:9px;gap:7px}
  .stick .btn{flex:1;padding:14px 6px;font-size:14.5px}
}

/* ============================================================
   REAL-CONTENT ADJUSTMENTS
   The mockup headline was 14 characters. The site's actual H1 is
   63 characters, so it needs a measure and guaranteed gutters.
   ============================================================ */
.hero .wrap{ padding-inline:clamp(18px,4vw,56px)!important; }
.hero-in{ max-width:1180px; margin-inline:auto; }
.hero h1{
  max-width:19ch;
  font-size:clamp(28px,4.3vw,58px);
  line-height:1.08;
  letter-spacing:-.035em;
  text-wrap:balance;
}
.hero .sub{ max-width:44ch; }

/* Shop row "מהחנות שלנו". Eight SVG icons from the live site, kept
   circular, filling only on hover so the row reads as one band. */
.shop{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:clamp(10px,1.4vw,20px);
}
.shop-item{
  display:flex; flex-direction:column; align-items:center; gap:14px;
  text-align:center;
  padding:10px 4px;
}
.shop-item .ic{
  width:clamp(62px,6vw,86px);
  aspect-ratio:1;
  border-radius:50%;
  background:var(--green);
  display:grid; place-items:center;
  transition:background .2s,transform .22s cubic-bezier(.2,.8,.3,1);
}
.shop-item .ic img{
  width:46%; height:46%;
  object-fit:contain;
}
.shop-item:hover .ic{ background:var(--ink); transform:translateY(-4px); }
.shop-item .t{
  font-size:15px; font-weight:600; letter-spacing:0;
  color:var(--ink);
}

/* Google reviews widget sits in a dark band. */
.revs .ti-widget-container,
.revs .ti-review-item{ border-radius:0!important; }

@media(max-width:1100px){ .shop{ grid-template-columns:repeat(4,1fr); } }
@media(max-width:560px){  .shop{ grid-template-columns:repeat(2,1fr); } }
/* ============================================================
   SURFACE LOCK
   wp_head() loads plugin stylesheets on this page (needed for the
   reviews widget). One of them resets body background to white,
   which turned every dark section light and made the white
   headings disappear. Pin the surfaces explicitly.
   ============================================================ */
html,body{ background:var(--ink)!important; color:var(--on-dark)!important; }
.sec{ background:var(--ink); color:var(--on-dark); }
.sec :is(h1,h2,h3,h4){ color:#fff; }
.sec.bone{ background:var(--bone)!important; color:var(--ink)!important; }
.sec.bone :is(h1,h2,h3,h4){ color:var(--ink); }
.sec.ink2{ background:var(--ink-2)!important; color:var(--on-dark)!important; }
.sec.ink2 :is(h1,h2,h3,h4){ color:#fff; }
.lead{ background:var(--green)!important; }
.lead :is(h1,h2,h3,h4){ color:var(--on-green)!important; }
.ft{ background:#000!important; }
.hdr{ background:rgba(13,12,10,.92)!important; }
.util{ background:#000!important; }
.br{ color:var(--on-dark); }
.br h3{ color:#fff; }
/* ============================================================
   HERO TEXT LOCK
   A plugin stylesheet loaded via wp_head() was setting h1 to the
   theme's dark body colour, which rendered the headline black on
   the dark hero photograph.
   ============================================================ */
.hero h1,
.hero h1 em{ color:#fff!important; }
.hero .kick{ color:var(--green)!important; }
.hero .sub{ color:var(--on-dark-soft)!important; }
.hero .btn-o{ color:#fff!important; border-color:rgba(255,255,255,.4)!important; }
.hero .btn-o:hover{ color:var(--green)!important; border-color:var(--green)!important; }