/* ============================================================
   CHOPPA — site components
   ============================================================ */

/* ═══════════════════════════════════════════
   1. מעברים בין עמודים
   ═══════════════════════════════════════════ */

@view-transition { navigation: auto; }

::view-transition-group(root) { animation-duration: .56s; }

::view-transition-old(root) {
  animation: vt-old .56s cubic-bezier(.76,0,.24,1) both;
  mix-blend-mode: normal;
}
::view-transition-new(root) {
  animation: vt-new .56s cubic-bezier(.76,0,.24,1) both;
  mix-blend-mode: normal;
}
@keyframes vt-old {
  from { transform: none; opacity: 1; }
  to   { transform: translateX(9%); opacity: 0; }
}
@keyframes vt-new {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0 0 0); }
}

/* התמונה של המוצר עפה מהקטלוג לתוך עמוד המוצר */
::view-transition-group(hero-media) {
  animation-duration: .62s;
  animation-timing-function: cubic-bezier(.62,.02,.2,1);
}
::view-transition-old(hero-media),
::view-transition-new(hero-media) { animation: none; mix-blend-mode: normal; height: 100%; }

/* הכותרת והלוגו לא קופצים */
::view-transition-group(site-hdr) { animation-duration: .4s; }
::view-transition-old(site-hdr),
::view-transition-new(site-hdr) { animation: none; mix-blend-mode: normal; }

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) { animation: none !important; }
}

/* וילון לדפדפנים בלי View Transitions (פיירפוקס) */
.curtain {
  position: fixed;
  inset: 0;
  z-index: 900;
  background: var(--ink);
  transform: scaleX(0);
  transform-origin: right;
  pointer-events: none;
  will-change: transform;
}
.curtain.is-closing { animation: curt-close .42s cubic-bezier(.76,0,.24,1) forwards; }
.curtain.is-opening { animation: curt-open .52s cubic-bezier(.76,0,.24,1) forwards; }
@keyframes curt-close { from { transform: scaleX(0); transform-origin: right; } to { transform: scaleX(1); transform-origin: right; } }
@keyframes curt-open  { from { transform: scaleX(1); transform-origin: left; }  to { transform: scaleX(0); transform-origin: left; } }


/* ═══════════════════════════════════════════
   2. Header
   ═══════════════════════════════════════════ */

.hdr {
  position: fixed;
  inset-block-start: 0;
  inset-inline: 0;
  z-index: 500;
  height: var(--hdr);
  display: flex;
  align-items: center;
  view-transition-name: site-hdr;
  transition: background .45s var(--ease), border-color .45s var(--ease), color .45s var(--ease);
  border-bottom: 1px solid transparent;
}
.hdr__in {
  width: 100%;
  max-width: var(--maxw);
  margin-inline: auto;
  padding-inline: var(--gut);
  display: flex;
  align-items: center;
  gap: clamp(1rem, 3vw, 3rem);
}

/* מצב מעל הירו הכהה */
.hdr[data-on="dark"] { color: #fff; }
.hdr[data-on="dark"] .brand__wing { filter: brightness(0) invert(1); }
/* מצב גלילה — נייר */
.hdr[data-on="paper"] {
  background: rgba(255,255,255,.93);
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom-color: var(--line);
  color: var(--ink);
}

.brand { display: flex; align-items: center; gap: .55rem; flex: 0 0 auto; }
.brand__wing {
  width: 34px; height: auto;
  transition: filter .45s var(--ease), transform .5s var(--ease);
}
.brand:hover .brand__wing { transform: translateY(-2px); }
.brand__word {
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: 1.34rem;
  letter-spacing: -.02em;
  direction: ltr;
  line-height: 1;
  padding-top: 2px;
}

.hdr__nav { display: flex; align-items: center; gap: clamp(.9rem, 2vw, 2rem); }
.hdr__link {
  font-size: .855rem;
  font-weight: 400;
  letter-spacing: .002em;
  position: relative;
  padding-block: .35em;
}
.hdr__link::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .38s var(--ease-io);
}
.hdr__link:hover::after, .hdr__link[aria-current]::after { transform: scaleX(1); transform-origin: left; }
.hdr__link[aria-current]::after { transform: scaleX(1); height: 1.5px; }

.hdr__tools { display: flex; align-items: center; gap: .35rem; margin-inline-start: auto; }
.icobtn {
  width: 42px; height: 42px;
  display: grid; place-items: center;
  position: relative;
  transition: opacity .3s var(--ease);
}
.icobtn:hover { opacity: .55; }
.icobtn svg { width: 19px; height: 19px; stroke: currentColor; fill: none; stroke-width: 1.35; }
.cart-count {
  position: absolute;
  inset-block-start: 6px; inset-inline-start: 5px;
  min-width: 16px; height: 16px;
  padding-inline: 4px;
  display: grid; place-items: center;
  background: var(--spark);
  color: #fff;
  font-family: var(--ff-mono);
  font-size: 9.5px;
  line-height: 1;
  border-radius: 9px;
  transform: scale(0);
  transition: transform .34s cubic-bezier(.34,1.56,.64,1);
}
.cart-count.is-on { transform: scale(1); }

/* כפתור התפריט */
.menu-btn { display: flex; align-items: center; gap: .55rem; font-size: .82rem; letter-spacing: .01em; padding: .5rem 0; }
.menu-btn__bars { display: grid; gap: 4px; width: 20px; }
.menu-btn__bars i { display: block; height: 1.4px; background: currentColor; transition: transform .4s var(--ease-io), width .4s var(--ease-io); }
.menu-btn__bars i:nth-child(2) { width: 13px; margin-inline-start: auto; }
.menu-btn:hover .menu-btn__bars i:nth-child(2) { width: 20px; }


/* ═══════════════════════════════════════════
   3. מגה־מניו
   ═══════════════════════════════════════════ */

.mega {
  position: fixed;
  inset: 0;
  z-index: 700;
  background: var(--ink);
  color: #fff;
  display: grid;
  grid-template-rows: var(--hdr) 1fr auto;
  clip-path: inset(0 0 100% 0);
  transition: clip-path .62s var(--ease-io);
  overflow-y: auto;
}
.mega.is-open { clip-path: inset(0 0 0 0); }
body.mega-open { overflow: hidden; }

.mega__bar {
  display: flex; align-items: center;
  padding-inline: var(--gut);
  max-width: var(--maxw); width: 100%; margin-inline: auto;
}
.mega__close { margin-inline-start: auto; display: flex; align-items: center; gap: .6rem; font-size: .82rem; }
.mega__close svg { width: 17px; height: 17px; stroke: currentColor; stroke-width: 1.4; }

.mega__body {
  display: grid;
  grid-template-columns: 1fr .82fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
  padding: clamp(1.5rem, 4vw, 3.5rem) var(--gut) clamp(2rem,5vw,4rem);
  max-width: var(--maxw); width: 100%; margin-inline: auto;
}
@media (max-width: 980px) { .mega__body { grid-template-columns: 1fr; } .mega__aside { display: none; } }

.mega__list li { border-bottom: 1px solid rgba(255,255,255,.12); }
.mega__list li:first-child { border-top: 1px solid rgba(255,255,255,.12); }
.mega__row {
  display: flex; align-items: baseline; gap: 1.1rem;
  padding: clamp(.75rem, 1.5vw, 1.15rem) 0;
  opacity: 0; transform: translateY(16px);
}
.mega.is-open .mega__row { opacity: 1; transform: none; transition: opacity .6s var(--ease), transform .6s var(--ease); }
.mega.is-open li:nth-child(1) .mega__row { transition-delay: .16s; }
.mega.is-open li:nth-child(2) .mega__row { transition-delay: .22s; }
.mega.is-open li:nth-child(3) .mega__row { transition-delay: .28s; }
.mega.is-open li:nth-child(4) .mega__row { transition-delay: .34s; }
.mega.is-open li:nth-child(5) .mega__row { transition-delay: .40s; }
.mega.is-open li:nth-child(6) .mega__row { transition-delay: .46s; }

.mega__num { font-family: var(--ff-mono); font-size: 11px; color: rgba(255,255,255,.4); flex: 0 0 auto; direction: ltr; }
.mega__name {
  font-family: var(--ff-display); font-weight: 700;
  font-size: clamp(1.7rem, 4vw, 3.3rem);
  line-height: 1; letter-spacing: -.025em;
  transition: transform .48s var(--ease), opacity .4s var(--ease);
}
.mega__row:hover .mega__name { transform: translateX(-12px); }
.mega__list:hover .mega__row:not(:hover) .mega__name { opacity: .38; }
.mega__meta { margin-inline-start: auto; font-family: var(--ff-mono); font-size: 10px; letter-spacing: .16em; color: rgba(255,255,255,.45); text-transform: uppercase; direction: ltr; }

.mega__aside { position: relative; }
.mega__pane { position: relative; aspect-ratio: 4/5; background: #141414; overflow: hidden; }
.mega__pane img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0; transform: scale(1.06);
  transition: opacity .6s var(--ease), transform 1.1s var(--ease);
}
.mega__pane img.is-on { opacity: .9; transform: scale(1); }
.mega__asidetxt { margin-top: 1.1rem; font-size: .84rem; color: rgba(255,255,255,.55); font-weight: 300; }

.mega__foot {
  display: flex; flex-wrap: wrap; gap: 1rem 2.2rem;
  padding: 1.4rem var(--gut) 2rem;
  border-top: 1px solid rgba(255,255,255,.12);
  max-width: var(--maxw); width: 100%; margin-inline: auto;
  font-size: .84rem; color: rgba(255,255,255,.6);
}
.mega__foot a:hover { color: #fff; }


/* ═══════════════════════════════════════════
   4. Hero
   ═══════════════════════════════════════════ */

.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; overflow: hidden; background: #0B0B0B; }
.hero__media { position: absolute; inset: 0; }
.hero__media video, .hero__media img { width: 100%; height: 100%; object-fit: cover; }
.hero__media::after {
  content: "";
  position: absolute; inset: 0;
  background:
    linear-gradient(to top, rgba(6,6,6,.96) 0%, rgba(6,6,6,.7) 34%, rgba(6,6,6,.4) 66%, rgba(6,6,6,.62) 100%);
}
/* דה־סטורציה חלקית — שומר על המונוכרום בלי להרוג את התמונה */
.hero__media video, .hero__media img { filter: grayscale(.94) contrast(1.16) brightness(.7); }

.hero__in {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--maxw);
  margin-inline: auto;
  padding: 0 var(--gut) clamp(2.5rem, 6vw, 5rem);
  color: #fff;
}
.hero__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(1rem,2.2vw,2.4rem); align-items: end; }
.hero__head { grid-column: 1 / 9; }
@media (max-width: 900px) { .hero__head { grid-column: 1 / -1; } }

.hero__kicker { display: flex; align-items: center; gap: .8rem; margin-bottom: clamp(1rem,2vw,1.8rem); }
.hero__kicker .tag { color: rgba(255,255,255,.72); }
.hero__kicker .bar { width: clamp(30px,5vw,72px); height: 1px; background: rgba(255,255,255,.4); }

.hero h1 { color: #fff; }
.hero h1 em { font-style: normal; color: transparent; -webkit-text-stroke: 1.4px rgba(255,255,255,.85); }
.hero__sub { grid-column: 9 / 13; padding-bottom: .6rem; }
@media (max-width: 900px) { .hero__sub { grid-column: 1 / -1; margin-top: 1.6rem; } }
.hero__sub p { color: rgba(255,255,255,.78); font-weight: 300; font-size: clamp(.95rem,1.05vw,1.08rem); line-height: 1.62; }
.hero__cta { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.6rem; }
.hero .btn { border-color: #fff; background: #fff; color: var(--ink); }
.hero .btn::before { background: transparent; }
.hero .btn:hover { color: var(--ink); opacity: .82; }
.hero .btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.45); }
.hero .btn--ghost:hover { color: var(--ink); }
.hero .btn--ghost::before { background: #fff; }




/* ═══════════════════════════════════════════
   5. רצועת אמון (marquee)
   ═══════════════════════════════════════════ */

.strip { border-block: 1px solid var(--line); background: var(--paper-warm); overflow: hidden; }
.strip__track { display: flex; width: max-content; animation: slide 42s linear infinite; }
.strip:hover .strip__track { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .strip__track { animation: none; } }
@keyframes slide { to { transform: translateX(50%); } }
.strip__item {
  display: flex; align-items: center; gap: 1.1rem;
  padding: 2.1rem clamp(1.6rem,3.4vw,3.4rem);
  font-family: var(--ff-mono); font-weight: 500; font-size: clamp(17px,1.7vw,22px); letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-80); white-space: nowrap;
}
.strip__item i { display: block; width: 5px; height: 5px; background: var(--ink-35); border-radius: 50%; flex: 0 0 auto; }


/* ═══════════════════════════════════════════
   6. כותרות סקשן
   ═══════════════════════════════════════════ */

.shead { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1rem,2.2vw,2.4rem); align-items: end; margin-bottom: clamp(2rem,4.5vw,4rem); }
.shead__l { grid-column: 1 / 8; }
.shead__r { grid-column: 9 / 13; padding-bottom: .35rem; }
@media (max-width: 900px) { .shead__l, .shead__r { grid-column: 1 / -1; } .shead__r { margin-top: 1rem; } }
.shead__top { display: flex; align-items: center; gap: .8rem; margin-bottom: 1.1rem; }
.shead__top .bar { width: clamp(24px,4vw,56px); height: 1px; background: var(--line); }


/* ═══════════════════════════════════════════
   7. קטגוריות — אינדקס
   ═══════════════════════════════════════════ */

.cats { border-top: 1px solid var(--line); }
.cat {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  gap: clamp(.8rem,2vw,2rem);
  align-items: center;
  padding: clamp(1.1rem,2.4vw,2rem) 0;
  border-bottom: 1px solid var(--line);
  position: relative;
}
@media (max-width: 700px) { .cat { grid-template-columns: 38px 1fr; } .cat__go { display: none; } }
.cat__name {
  font-family: var(--ff-display); font-weight: 700;
  font-size: clamp(1.5rem, 3.4vw, 2.9rem);
  line-height: 1; letter-spacing: -.025em;
  transition: transform .5s var(--ease);
}
.cat__blurb { font-size: .88rem; color: var(--ink-55); font-weight: 300; margin-top: .5rem; max-width: 46ch; }
.cat:hover .cat__name { transform: translateX(-14px); }
.cat__go { display: flex; align-items: center; gap: .6rem; }
.cat__go svg { width: 26px; height: 10px; stroke: var(--ink); stroke-width: 1.2; fill: none; transition: transform .5s var(--ease); }
.cat:hover .cat__go svg { transform: translateX(-8px); }
/* תצוגה מקדימה שצפה ליד הסמן */
.cat__peek {
  position: absolute;
  inset-inline-end: 16%;
  inset-block-start: 50%;
  width: clamp(150px, 15vw, 230px);
  aspect-ratio: 4/3;
  transform: translateY(-50%) scale(.9) rotate(-3deg);
  opacity: 0;
  pointer-events: none;
  transition: opacity .4s var(--ease), transform .55s var(--ease);
  z-index: 3;
  background: var(--paper-warm);
}
.cat:hover .cat__peek { opacity: 1; transform: translateY(-50%) scale(1) rotate(-2deg); }
.cat__peek img { width: 100%; height: 100%; object-fit: contain; }
/* במגע אין hover — הלחיצה הראשונה מקפיצה את השולחן */
.cat.is-peek .cat__peek { opacity: 1; transform: translateY(-50%) scale(1) rotate(-2deg); }
@media (max-width: 1100px) {
  .cat__peek {
    inset-inline-end: 0;
    inset-block-start: auto;
    inset-block-end: 0;
    width: clamp(120px, 34vw, 200px);
    transform: translateY(18px) scale(.92);
  }
  .cat.is-peek .cat__peek { transform: translateY(0) scale(1) rotate(-2deg); }
  .cat.is-peek { padding-bottom: clamp(5rem, 26vw, 8rem); }
}


/* ═══════════════════════════════════════════
   8. כרטיסי מוצר + גריד אסימטרי
   ═══════════════════════════════════════════ */

.pgrid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(1.6rem,3vw,3.4rem) clamp(1rem,2.2vw,2.4rem); }
.pcard { grid-column: span 4; display: flex; flex-direction: column; }
@media (max-width: 1024px) { .pcard { grid-column: span 6; } }
@media (max-width: 620px)  { .pgrid { grid-template-columns: 1fr; } .pcard { grid-column: span 1; } }

/* כרטיסי המוצר תמיד באותו גודל — גריד סימטרי ומסודר */
.pcard { grid-column: span 4; }
@media (max-width: 1024px) { .pcard { grid-column: span 6; } }
@media (max-width: 620px)  { .pcard { grid-column: span 1; } }

.pcard__media {
  position: relative;
  aspect-ratio: 5/4;
  background: var(--paper-warm);
  overflow: hidden;
  display: grid; place-items: center;
}
.pcard__media img {
  width: 100%; height: 100%;
  object-fit: contain;
  padding: 9%;
  transition: transform 1s var(--ease);
  mix-blend-mode: multiply;
}
.pcard__media img.is-photo { object-fit: cover; padding: 0; mix-blend-mode: normal; }
.pcard:hover .pcard__media img { transform: scale(1.055); }
.pcard__badges { position: absolute; inset-block-start: 12px; inset-inline-start: 12px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; z-index: 2; }
.pcard__badges .badge { background: rgba(255,255,255,.9); backdrop-filter: blur(4px); }

.pcard__quick {
  position: absolute;
  inset-inline: 12px;
  inset-block-end: 12px;
  z-index: 2;
  opacity: 0; transform: translateY(10px);
  transition: opacity .38s var(--ease), transform .42s var(--ease);
}
.pcard:hover .pcard__quick, .pcard:focus-within .pcard__quick { opacity: 1; transform: none; }
@media (hover: none) { .pcard__quick { opacity: 1; transform: none; } }
.pcard__quick .btn { width: 100%; padding-block: .85em; font-size: .8rem; }

.pcard__body { padding-top: 1rem; display: flex; flex-direction: column; gap: .38rem; flex: 1; }
.pcard__top { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.pcard__name { font-family: var(--ff-display); font-weight: 700; font-size: clamp(1.12rem,1.5vw,1.42rem); line-height: 1.08; letter-spacing: -.018em; direction: ltr; text-align: right; }
.pcard__name[lang="he"] { direction: rtl; }
.pcard__sub { font-size: .82rem; color: var(--ink-55); font-weight: 300; }
.pcard__foot { margin-top: auto; padding-top: .7rem; display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; border-top: 1px solid var(--line-soft); }
.pcard__price { font-size: 1.02rem; }
.pcard__fit { font-size: .76rem; color: var(--ink-35); }


/* ═══════════════════════════════════════════
   9. סקשן "בשטח" — תמונות אמיתיות
   ═══════════════════════════════════════════ */

.field { background: var(--ink); color: #fff; }
.field .shead__top .bar { background: rgba(255,255,255,.25); }
.field .tag { color: rgba(255,255,255,.5); }
.field .lede { color: rgba(255,255,255,.68); }
.fieldgrid { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(.8rem,1.6vw,1.6rem); }
.fieldgrid figure { position: relative; overflow: hidden; background: #151515; }
.fieldgrid img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.08) brightness(.92); transition: filter .7s var(--ease), transform 1.2s var(--ease); }
.fieldgrid figure:hover img { filter: grayscale(0) contrast(1.02) brightness(1); transform: scale(1.04); }
.fieldgrid figcaption {
  position: absolute; inset-block-end: 0; inset-inline: 0;
  padding: 1.6rem 1rem .85rem;
  background: linear-gradient(to top, rgba(0,0,0,.8), transparent);
  font-family: var(--ff-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.85);
}
.fieldgrid .f1 { grid-column: span 5; aspect-ratio: 4/5; }
.fieldgrid .f2 { grid-column: span 7; aspect-ratio: 16/10; align-self: end; }
.fieldgrid .f3 { grid-column: span 4; aspect-ratio: 1; }
.fieldgrid .f4 { grid-column: span 4; aspect-ratio: 1; margin-top: clamp(1rem,3vw,3rem); }
.fieldgrid .f5 { grid-column: span 4; aspect-ratio: 1; }
@media (max-width: 800px) {
  .fieldgrid .f1, .fieldgrid .f2 { grid-column: span 12; }
  .fieldgrid .f3, .fieldgrid .f4, .fieldgrid .f5 { grid-column: span 6; margin-top: 0; }
}


/* ═══════════════════════════════════════════
   10. המלצות
   ═══════════════════════════════════════════ */

.quotes { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.6rem,3vw,3rem); }
.quote { grid-column: span 4; display: flex; flex-direction: column; gap: 1.1rem; padding-top: 1.4rem; border-top: 1px solid var(--ink); }
.quote:nth-child(2) { margin-top: clamp(1.5rem,4vw,4rem); }
.quote:nth-child(3) { margin-top: clamp(.8rem,2vw,2rem); }
@media (max-width: 900px) { .quote { grid-column: span 12; margin-top: 0 !important; } }
.quote__txt { font-family: var(--ff-display); font-size: clamp(1.02rem,1.3vw,1.22rem); line-height: 1.44; font-weight: 500; letter-spacing: -.01em; }
.quote__who { margin-top: auto; }
.quote__who strong { display: block; font-weight: 500; font-size: .9rem; }
.quote__who span { font-size: .8rem; color: var(--ink-55); }
.quote__stars { display: flex; gap: 2px; color: var(--ink); font-size: .78rem; letter-spacing: .1em; }


/* ═══════════════════════════════════════════
   11. בלוק מכירתי / הבטחות
   ═══════════════════════════════════════════ */

.promise { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.4rem,2.6vw,2.6rem); }
.promise__i { grid-column: span 3; display: flex; flex-direction: column; gap: .55rem; padding-top: 1.1rem; border-top: 1px solid var(--line); }
@media (max-width: 900px) { .promise__i { grid-column: span 6; } }
@media (max-width: 520px) { .promise__i { grid-column: span 12; } }
.promise__i h3 { font-family: var(--ff-display); font-size: 1.16rem; font-weight: 700; letter-spacing: -.015em; }
.promise__i p { font-size: .855rem; color: var(--ink-55); font-weight: 300; }


/* ═══════════════════════════════════════════
   12. CTA כפול
   ═══════════════════════════════════════════ */

.split { display: grid; grid-template-columns: 1fr 1fr; min-height: clamp(360px, 56vh, 600px); }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; } }
.split__half { padding: clamp(2.4rem,5vw,5rem) var(--gut); display: flex; flex-direction: column; justify-content: center; gap: 1.2rem; }
.split__half--ink { background: var(--ink); color: #fff; }
.split__half--ink .lede { color: rgba(255,255,255,.7); }
.split__half--ink .tag { color: rgba(255,255,255,.45); }
.split__half--ink .btn { border-color: #fff; background: #fff; color: var(--ink); }
.split__half--paper { background: var(--paper-warm); }
.split__half .btn { align-self: flex-start; }


/* ═══════════════════════════════════════════
   13. Footer
   ═══════════════════════════════════════════ */

.ftr { background: var(--ink); color: rgba(255,255,255,.62); padding-block: clamp(3rem,6vw,5.5rem) 2rem; }
.ftr__top { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.6rem,3vw,3rem); padding-bottom: clamp(2.4rem,5vw,4rem); }
.ftr__brand { grid-column: span 4; }
.ftr__col { grid-column: span 2; }
.ftr__contact { grid-column: span 4; }
@media (max-width: 900px) { .ftr__brand { grid-column: span 12; } .ftr__col { grid-column: span 6; } .ftr__contact { grid-column: span 12; } }
.ftr__wordmark { display: flex; align-items: center; gap: .6rem; color: #fff; margin-bottom: 1.1rem; }
.ftr__wordmark img { width: 40px; filter: brightness(0) invert(1); }
.ftr__wordmark span { font-family: var(--ff-display); font-weight: 700; font-size: 1.6rem; letter-spacing: -.02em; direction: ltr; }
.ftr h4 { font-family: var(--ff-mono); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.38); margin-bottom: 1rem; font-weight: 500; direction: ltr; text-align: right; }
.ftr li + li { margin-top: .5rem; }
.ftr a { font-size: .875rem; transition: color .3s var(--ease); }
.ftr a:hover { color: #fff; }
.ftr__contact a { display: block; font-family: var(--ff-display); font-size: clamp(1.05rem,1.5vw,1.35rem); color: #fff; letter-spacing: -.01em; margin-bottom: .35rem; direction: ltr; text-align: right; }
.ftr__bot { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; align-items: center; padding-top: 1.6rem; border-top: 1px solid rgba(255,255,255,.12); font-size: .78rem; color: rgba(255,255,255,.4); }
.ftr__bot .sp { margin-inline-start: auto; }


/* ═══════════════════════════════════════════
   14. וואטסאפ צף
   ═══════════════════════════════════════════ */

.wa-fab {
  position: fixed;
  inset-block-end: clamp(16px, 3vw, 28px);
  inset-inline-start: clamp(16px, 3vw, 28px);
  z-index: 480;
  display: flex; align-items: center; gap: .5rem;
  transform: translateY(120%);
  transition: transform .6s var(--ease);
}
.wa-fab.is-on { transform: none; }
.wa {
  display: flex; align-items: center; gap: .6rem;
  padding: 12px 18px 12px 14px;
  background: var(--ink); color: #fff;
  border-radius: 999px;
  box-shadow: 0 10px 34px rgba(0,0,0,.22);
  transition: background .35s var(--ease);
}
.wa:hover { background: #1E1E1C; }
.wa svg { width: 20px; height: 20px; fill: #fff; flex: 0 0 auto; }
.wa span { font-size: .84rem; font-weight: 400; white-space: nowrap; }
.wa i {
  display: block; width: 6px; height: 6px; border-radius: 50%;
  background: #4ADE80; flex: 0 0 auto;
  box-shadow: 0 0 0 0 rgba(74,222,128,.7);
  animation: pulse 2.6s infinite;
}
@keyframes pulse { 70% { box-shadow: 0 0 0 7px rgba(74,222,128,0); } 100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); } }
@media (prefers-reduced-motion: reduce) { .wa i { animation: none; } }
.wa-fb {
  display: flex; align-items: center; justify-content: center;
  width: 54px; height: 54px; flex: 0 0 auto;
  background: var(--paper); color: var(--ink);
  border-radius: 50%;
  box-shadow: 0 10px 34px rgba(0,0,0,.28);
  transition: background .35s var(--ease), transform .25s var(--ease);
}
.wa-fb:hover { background: var(--paper-warm); transform: scale(1.06); }
.wa-fb svg { width: 24px; height: 24px; fill: var(--ink); }
@media (max-width: 600px) { .wa span { display: none; } .wa { padding: 14px; } .wa-fb { width: 50px; height: 50px; } .wa-fb svg { width: 22px; height: 22px; } }


/* ═══════════════════════════════════════════
   15. עמוד מוצר
   ═══════════════════════════════════════════ */

.pdp { padding-top: calc(var(--hdr) + clamp(1.5rem,3vw,3rem)); }
.crumbs { display: flex; align-items: center; gap: .5rem; font-size: .78rem; color: var(--ink-35); margin-bottom: clamp(1.4rem,3vw,2.4rem); }
.crumbs a:hover { color: var(--ink); }
.crumbs span { opacity: .5; }

.pdp__main { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.6rem,3vw,3.4rem); align-items: start; }
.pdp__media { grid-column: 1 / 8; position: relative; }
.pdp__info  { grid-column: 8 / 13; position: sticky; top: calc(var(--hdr) + 2rem); }
@media (max-width: 980px) { .pdp__media, .pdp__info { grid-column: 1 / -1; } .pdp__info { position: static; } }

.pdp__stage {
  position: relative;
  aspect-ratio: 5/4;
  background: var(--paper-warm);
  overflow: hidden;
  display: grid; place-items: center;
}
.pdp__stage img { width: 100%; height: 100%; object-fit: contain; padding: 5%; mix-blend-mode: multiply; }
.pdp__stage img.is-photo { object-fit: cover; padding: 0; mix-blend-mode: normal; }
.pdp__badges { position: absolute; inset-block-start: 16px; inset-inline-start: 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 7px; z-index: 2; }
.pdp__badges .badge { background: rgba(255,255,255,.92); }

.pdp__thumbs { display: grid; grid-template-columns: repeat(4,1fr); gap: clamp(.5rem,1vw,.9rem); margin-top: clamp(.5rem,1vw,.9rem); }
.pdp__thumb { aspect-ratio: 1; background: var(--paper-warm); overflow: hidden; position: relative; }
.pdp__thumb img { width: 100%; height: 100%; object-fit: cover; opacity: .78; transition: opacity .4s var(--ease), transform .8s var(--ease); }
.pdp__thumb:hover img, .pdp__thumb[aria-selected="true"] img { opacity: 1; transform: scale(1.05); }
.pdp__thumb[aria-selected="true"]::after { content: ""; position: absolute; inset: 0; border: 1.5px solid var(--ink); }

.pdp__eyebrow { display: flex; align-items: center; gap: .7rem; margin-bottom: .9rem; }
.pdp h1 { font-family: var(--ff-display); font-weight: 700; font-size: clamp(1.9rem,3.2vw,3rem); line-height: .98; letter-spacing: -.028em; direction: ltr; text-align: right; }
.pdp h1[lang="he"] { direction: rtl; }
.pdp__sub { margin-top: .55rem; font-size: .95rem; color: var(--ink-55); font-weight: 300; }
.pdp__lead { margin-top: 1.3rem; font-size: 1rem; line-height: 1.65; color: var(--ink-80); font-weight: 300; }

.pdp__pricerow { margin-top: 1.6rem; padding-top: 1.3rem; border-top: 1px solid var(--line); display: flex; align-items: baseline; gap: .9rem; flex-wrap: wrap; }
.pdp__price { font-size: clamp(1.5rem,2.2vw,2rem); font-weight: 500; letter-spacing: -.02em; }
.pdp__save { font-family: var(--ff-mono); font-size: 10px; letter-spacing: .13em; text-transform: uppercase; color: var(--spark-deep); border: 1px solid var(--spark-deep); padding: .35em .7em .3em; }

/* בלוק ההטבה — הדבר שתופס את העין */
.perk {
  margin-top: 1.2rem;
  border: 1px solid var(--ink);
  padding: 1.05rem 1.15rem;
  display: grid; gap: .55rem;
  position: relative;
  overflow: hidden;
  background: var(--paper);
}
.perk::before {
  content: "";
  position: absolute; inset-block: 0; inset-inline-start: 0;
  width: 3px; background: var(--spark);
}
.perk__row { display: flex; align-items: flex-start; gap: .65rem; font-size: .875rem; }
.perk__row svg { width: 15px; height: 15px; flex: 0 0 auto; margin-top: 3px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
.perk__row b { font-weight: 500; }
.perk__row span { color: var(--ink-55); font-weight: 300; }

.pdp__buy { margin-top: 1.3rem; display: grid; gap: .55rem; }
.qty { display: flex; align-items: center; border: 1px solid var(--line); width: max-content; }
.qty button { width: 42px; height: 46px; display: grid; place-items: center; font-size: 1.05rem; transition: background .3s; }
.qty button:hover { background: var(--paper-warm); }
.qty input { width: 46px; height: 46px; text-align: center; border: 0; background: none; font-variant-numeric: tabular-nums; -moz-appearance: textfield; }
.qty input::-webkit-outer-spin-button, .qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pdp__buyrow { display: flex; gap: .55rem; align-items: stretch; }
.pdp__buyrow .btn { flex: 1; }
.pdp__wa { display: flex; align-items: center; justify-content: center; gap: .55rem; padding: 1em; border: 1px solid var(--line); font-size: .85rem; transition: border-color .35s var(--ease), background .35s var(--ease); }
.pdp__wa:hover { border-color: var(--ink); background: var(--paper-warm); }
.pdp__wa svg { width: 17px; height: 17px; fill: var(--ink); }

/* מפרט */
.pdp__detail { margin-top: clamp(3rem,7vw,7rem); display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.6rem,3vw,3.4rem); }
.pdp__copy { grid-column: 1 / 7; }
.pdp__spec { grid-column: 8 / 13; }
@media (max-width: 980px) { .pdp__copy, .pdp__spec { grid-column: 1 / -1; } }
.pdp__copy p + p { margin-top: 1.1rem; }
.pdp__copy p { color: var(--ink-80); font-weight: 300; line-height: 1.72; }
.spec { border-top: 1px solid var(--ink); }
.spec tr { border-bottom: 1px solid var(--line); }
.spec th, .spec td { padding: .85rem 0; text-align: right; vertical-align: top; font-size: .875rem; }
.spec th { font-weight: 400; color: var(--ink-55); width: 40%; }
.spec td { font-weight: 400; }

/* אקורדיון שו״ת */
.acc { border-top: 1px solid var(--line); }
.acc__i { border-bottom: 1px solid var(--line); }
.acc__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 0; text-align: right; font-size: .95rem; font-weight: 400; }
.acc__q i { position: relative; width: 13px; height: 13px; flex: 0 0 auto; }
.acc__q i::before, .acc__q i::after { content: ""; position: absolute; background: var(--ink); transition: transform .4s var(--ease-io); }
.acc__q i::before { inset-block-start: 6px; inset-inline: 0; height: 1.2px; }
.acc__q i::after { inset-inline-start: 6px; inset-block: 0; width: 1.2px; }
.acc__i.is-open .acc__q i::after { transform: scaleY(0); }
.acc__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .48s var(--ease-io); }
.acc__i.is-open .acc__a { grid-template-rows: 1fr; }
.acc__a > div { overflow: hidden; }
.acc__a p { padding-bottom: 1.2rem; font-size: .885rem; color: var(--ink-55); font-weight: 300; line-height: 1.7; max-width: 62ch; }


/* ═══════════════════════════════════════════
   16. קטלוג — פילטרים
   ═══════════════════════════════════════════ */

.page-head { padding-top: calc(var(--hdr) + clamp(2.5rem,6vw,6rem)); }
.page-head h1 { margin-top: 1rem; }

.filters {
  position: sticky;
  top: var(--hdr);
  z-index: 60;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-block: 1px solid var(--line);
  margin-bottom: clamp(2rem,4vw,3.5rem);
}
.filters__in { display: flex; align-items: center; gap: .35rem; overflow-x: auto; scrollbar-width: none; padding-block: .7rem; }
.filters__in::-webkit-scrollbar { display: none; }
.fbtn {
  padding: .55em 1.1em;
  font-size: .845rem;
  white-space: nowrap;
  border: 1px solid transparent;
  color: var(--ink-55);
  transition: color .3s var(--ease), border-color .3s var(--ease), background .3s var(--ease);
}
.fbtn:hover { color: var(--ink); }
.fbtn[aria-pressed="true"] { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.fbtn__n { font-family: var(--ff-mono); font-size: 9.5px; opacity: .55; margin-inline-start: .4em; }
.pcard.is-hidden { display: none; }


/* ═══════════════════════════════════════════
   17. סל + צ'קאאוט
   ═══════════════════════════════════════════ */

.cart-wrap { padding-top: calc(var(--hdr) + clamp(2rem,5vw,5rem)); }
.cart-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.6rem,3vw,3.4rem); align-items: start; }
.cart-list { grid-column: 1 / 8; }
.cart-side { grid-column: 8 / 13; position: sticky; top: calc(var(--hdr) + 2rem); }
@media (max-width: 980px) { .cart-list, .cart-side { grid-column: 1 / -1; } .cart-side { position: static; } }

.citem { display: grid; grid-template-columns: 96px 1fr auto; gap: 1.1rem; padding: 1.2rem 0; border-bottom: 1px solid var(--line); align-items: start; }
.citem:first-child { border-top: 1px solid var(--ink); }
.citem__img { aspect-ratio: 1; background: var(--paper-warm); overflow: hidden; }
.citem__img img { width: 100%; height: 100%; object-fit: contain; padding: 8%; mix-blend-mode: multiply; }
.citem__name { font-family: var(--ff-display); font-weight: 700; font-size: 1.05rem; letter-spacing: -.015em; }
.citem__sub { font-size: .8rem; color: var(--ink-55); margin-top: .2rem; }
.citem__ctl { display: flex; align-items: center; gap: .8rem; margin-top: .7rem; }
.citem__ctl .qty button { width: 32px; height: 34px; }
.citem__ctl .qty input { width: 34px; height: 34px; font-size: .85rem; }
.citem__rm { font-size: .78rem; color: var(--ink-35); text-decoration: underline; text-underline-offset: 3px; }
.citem__rm:hover { color: var(--ink); }
.citem__price { text-align: left; font-weight: 500; white-space: nowrap; }

.summary { border: 1px solid var(--ink); padding: clamp(1.3rem,2.2vw,1.9rem); }
.summary h3 { font-family: var(--ff-display); font-size: 1.3rem; font-weight: 700; letter-spacing: -.02em; margin-bottom: 1.2rem; }
.summary__row { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; font-size: .885rem; }
.summary__row--total { margin-top: .7rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: 1.2rem; font-weight: 500; }
.summary .btn { margin-top: 1.3rem; }
.summary__note { margin-top: .9rem; font-size: .76rem; color: var(--ink-35); line-height: 1.6; }

.empty { padding: clamp(3rem,8vw,7rem) 0; text-align: center; }
.empty p { color: var(--ink-55); margin: 1rem 0 1.8rem; }

/* טופס */
.field-set { display: grid; gap: 1rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 620px) { .field-row { grid-template-columns: 1fr; } }
.fld { display: grid; gap: .4rem; }
.fld label { font-family: var(--ff-mono); font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-35); }
.fld input, .fld select, .fld textarea {
  width: 100%;
  padding: .85em .95em;
  border: 1px solid var(--line);
  background: var(--paper);
  font-size: .92rem;
  transition: border-color .3s var(--ease);
}
.fld input:focus, .fld select:focus, .fld textarea:focus { outline: none; border-color: var(--ink); }
.pay-note {
  margin-top: 1.2rem; padding: 1rem 1.1rem;
  background: var(--paper-warm); border-inline-start: 3px solid var(--ink);
  font-size: .82rem; color: var(--ink-55); line-height: 1.65;
}

/* דיאלוג הצלחה */
.done { position: fixed; inset: 0; z-index: 800; display: none; place-items: center; padding: var(--gut); background: rgba(11,11,11,.86); }
.done.is-on { display: grid; }
.done__box { background: var(--paper); max-width: 460px; width: 100%; padding: clamp(1.8rem,4vw,2.8rem); text-align: center; }
.done__box h3 { font-family: var(--ff-display); font-size: 1.7rem; font-weight: 700; letter-spacing: -.025em; margin-bottom: .8rem; }
.done__box p { color: var(--ink-55); font-size: .9rem; margin-bottom: 1.5rem; }


/* ═══════════════════════════════════════════
   18. מדריך / אודות / צור קשר
   ═══════════════════════════════════════════ */

.prose { max-width: 66ch; }
.prose h2 { font-family: var(--ff-display); font-size: clamp(1.5rem,2.4vw,2.1rem); font-weight: 700; letter-spacing: -.024em; margin: clamp(2rem,4vw,3.2rem) 0 .9rem; }
.prose h3 { font-family: var(--ff-display); font-size: 1.22rem; font-weight: 700; letter-spacing: -.018em; margin: 1.8rem 0 .5rem; }
.prose p { color: var(--ink-80); font-weight: 300; line-height: 1.75; }
.prose p + p { margin-top: 1rem; }
.prose ul { margin-top: .8rem; display: grid; gap: .5rem; }
.prose li { position: relative; padding-inline-start: 1.1rem; font-weight: 300; color: var(--ink-80); }
.prose li::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: .72em; width: 5px; height: 1px; background: var(--ink); }

.guide-toc { position: sticky; top: calc(var(--hdr) + 2rem); }
.guide-toc a { display: block; padding: .45rem 0; font-size: .855rem; color: var(--ink-55); border-inline-start: 1px solid var(--line); padding-inline-start: .9rem; transition: color .3s, border-color .3s; }
.guide-toc a:hover, .guide-toc a.is-on { color: var(--ink); border-inline-start-color: var(--ink); }

.cmp { border-top: 1px solid var(--ink); margin-top: 1.6rem; }
.cmp tr { border-bottom: 1px solid var(--line); }
.cmp th, .cmp td { padding: .95rem .6rem; text-align: right; font-size: .875rem; vertical-align: top; }
.cmp thead th { font-family: var(--ff-mono); font-size: 9.5px; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-35); font-weight: 500; }
.cmp tbody th { font-weight: 500; }

.contact-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.6rem,3vw,3.4rem); }
.contact-grid__l { grid-column: 1 / 7; }
.contact-grid__r { grid-column: 8 / 13; }
@media (max-width: 900px) { .contact-grid__l, .contact-grid__r { grid-column: 1 / -1; } }
.cline { display: block; padding: 1.1rem 0; border-bottom: 1px solid var(--line); }
.cline:first-child { border-top: 1px solid var(--ink); }
.cline strong { display: block; font-family: var(--ff-display); font-size: clamp(1.15rem,1.8vw,1.6rem); font-weight: 700; letter-spacing: -.02em; direction: ltr; text-align: right; }
.cline span { font-family: var(--ff-mono); font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-35); direction: ltr; display: block; text-align: right; margin-bottom: .3rem; }

/* עמוד אודות — פורטרט */
.about-hero { display: grid; grid-template-columns: repeat(12,1fr); gap: clamp(1.6rem,3vw,3.4rem); align-items: end; }
.about-hero__t { grid-column: 1 / 8; }
.about-hero__m { grid-column: 8 / 13; }
@media (max-width: 900px) { .about-hero__t, .about-hero__m { grid-column: 1 / -1; } }
.about-hero__m figure { aspect-ratio: 4/5; overflow: hidden; background: var(--paper-warm); }
.about-hero__m img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.06); }

.stat-row { display: grid; grid-template-columns: repeat(4,1fr); gap: clamp(1rem,2vw,2rem); margin-top: clamp(2.5rem,5vw,4.5rem); }
@media (max-width: 700px) { .stat-row { grid-template-columns: repeat(2,1fr); } }
.stat { padding-top: 1rem; border-top: 1px solid var(--ink); }
.stat b { display: block; font-family: var(--ff-display); font-size: clamp(2rem,3.4vw,3.1rem); font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.stat span { display: block; margin-top: .5rem; font-size: .8rem; color: var(--ink-55); }


/* ═══════════════════════════════════════════
   19. טוסט "נוסף לסל"
   ═══════════════════════════════════════════ */

.toast {
  position: fixed;
  inset-block-end: clamp(16px, 3vw, 28px);
  inset-inline-end: clamp(16px, 3vw, 28px);
  z-index: 490;
  display: flex; align-items: center; gap: .9rem;
  padding: .8rem .9rem;
  background: var(--paper);
  border: 1px solid var(--ink);
  box-shadow: 0 14px 40px rgba(0,0,0,.14);
  max-width: min(340px, calc(100vw - 2rem));
  transform: translateY(140%);
  opacity: 0;
  transition: transform .55s var(--ease), opacity .4s var(--ease);
}
.toast.is-on { transform: none; opacity: 1; }
.toast__img { width: 52px; height: 52px; flex: 0 0 auto; background: var(--paper-warm); overflow: hidden; }
.toast__img img { width: 100%; height: 100%; object-fit: contain; padding: 6%; mix-blend-mode: multiply; }
.toast__txt { display: grid; gap: 2px; min-width: 0; }
.toast__txt b { font-family: var(--ff-mono); font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: var(--ink-35); }
.toast__txt span { font-size: .855rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.toast__go { margin-inline-start: auto; flex: 0 0 auto; font-size: .82rem; font-weight: 500; text-decoration: underline; text-underline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { .toast { transition: opacity .2s; } .toast.is-on { transform: none; } }


/* ═══════════════════════════════════════════
   20. מובייל — תיקוני פריסה
   ═══════════════════════════════════════════ */

/* מתחת ל־1080 הניווט עובר כולו למגה־מניו */
@media (max-width: 1080px) {
  .hdr__link { display: none; }
  .hdr__nav { margin-inline-start: auto; }
  .hdr__tools { margin-inline-start: 0; }
}

/* כל grid-column שנקבע ידנית על 12 עמודות — מתאפס במסך צר */
@media (max-width: 900px) {
  .g12 > *,
  .hero__grid > *,
  .shead > *,
  .pdp__main > *,
  .pdp__detail > *,
  .contact-grid > *,
  .about-hero > *,
  .cart-grid > * { grid-column: 1 / -1 !important; }

  .g12 { gap: clamp(1.4rem, 4vw, 2rem); }
  .guide-toc { display: none; }
  .shead { margin-bottom: clamp(1.6rem, 5vw, 2.4rem); }
  .shead__r { margin-top: .9rem; }
}

@media (max-width: 620px) {
  .hero { min-height: 92svh; }
  .hero__in { padding-bottom: 2.2rem; }
  .hero__cta .btn { flex: 1 1 auto; }
  .brand__word { font-size: 1.16rem; }
  .brand__wing { width: 28px; }
  .menu-btn span { display: none; }
  .menu-btn { padding-inline: .4rem; }

  .pdp__thumbs { grid-template-columns: repeat(4, 1fr); }
  .citem { grid-template-columns: 72px 1fr; }
  .citem__price { grid-column: 2; text-align: start; margin-top: .4rem; }
  .quote:nth-child(n) { margin-top: 0; }
  .stat-row { gap: 1.2rem 1rem; }
  .cmp th, .cmp td { padding: .7rem .4rem; font-size: .8rem; }
  .prose { max-width: none; }
}

/* טבלאות רחבות לא שוברות את העמוד */
.cmp, .spec { display: block; overflow-x: auto; }
.cmp table, .spec table { min-width: 100%; }


/* ═══════════════════════════════════════════
   21. דילוג לתוכן + סימוני עבודה פנימיים
   ═══════════════════════════════════════════ */

.skip {
  position: absolute; inset-block-start: -60px; inset-inline-start: 12px;
  z-index: 1000; padding: .7em 1.2em;
  background: var(--ink); color: #fff; font-size: .85rem;
  transition: inset-block-start .25s var(--ease);
}
.skip:focus { inset-block-start: 12px; }

/* תווית "ממתין לאישור" — נעלמת כש-REVIEW_MODE=False */
.rv {
  display: inline-flex; align-items: center; gap: .4em;
  padding: .34em .7em .3em;
  font-family: var(--ff-mono); font-size: 9px; letter-spacing: .12em; text-transform: uppercase;
  color: #8A5A00; border: 1px dashed #C79A3A; background: #FFF8E8;
  white-space: nowrap; cursor: help;
}
.rv::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #C79A3A; }

.rvbox {
  margin: 1.1rem 0; padding: .95rem 1.05rem;
  border: 1px dashed #C79A3A; background: #FFFBF2;
  display: grid; gap: .4rem;
}
.rvbox b {
  font-family: var(--ff-mono); font-size: 9.5px; letter-spacing: .14em;
  text-transform: uppercase; color: #8A5A00; font-weight: 500;
}
.rvbox p { font-size: .83rem; line-height: 1.6; color: #5C4A28; }
.rvbox--wide { margin-bottom: 2rem; }

/* שדה שדורש נתון מאושרי, בתוך מסמכי המדיניות */
.ph {
  background: #FFF0B8; color: #6B5310; padding: .1em .45em;
  border-bottom: 1px dashed #C79A3A; font-size: .95em;
}


/* ═══════════════════════════════════════════
   22. עמוד מוצר — מה כלול, תוספות, אספקה
   ═══════════════════════════════════════════ */

.pdp__lead-time {
  margin-top: .5rem;
  font-size: .85rem; font-weight: 500; color: var(--ink);
  display: flex; align-items: center; gap: .5em;
}
.pdp__lead-time::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: #2E9E5B; flex: 0 0 auto;
}

.price--ask { font-size: 1.3rem; font-weight: 500; color: var(--ink-55); }

/* מה כלול במחיר */
/* מה כלול במחיר — הבלוק הראשון שהעין תופסת אחרי המחיר */
.incl {
  margin-top: 1.4rem;
  padding: 1.05rem 1.15rem;
  border: 1px solid var(--ink);
  background: var(--paper-warm);
  position: relative;
}
.incl h3 {
  display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap;
  margin-bottom: .75rem;
}
.incl h3 span {
  font-family: var(--ff-body); font-size: .95rem; font-weight: 500;
  letter-spacing: -.005em; color: var(--ink); text-transform: none;
}
.incl h3 em {
  font-style: normal;
  font-family: var(--ff-mono); font-size: 9px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-55);
  border: 1px solid var(--line); padding: .3em .6em .25em;
}
.incl ul { display: grid; gap: .4rem; }
.incl li { position: relative; padding-inline-start: 1.4rem; font-size: .89rem; }
.incl li::before {
  content: ""; position: absolute; inset-inline-start: 0; inset-block-start: .45em;
  width: 9px; height: 5px;
  border-inline-start: 1.5px solid var(--ink); border-block-end: 1.5px solid var(--ink);
  transform: rotate(-45deg);
}

/* בוררי תוספות ואספקה — גדולים ונוחים ללחיצה במובייל */
.opt { border: 0; padding: 0; margin: 1.5rem 0 0; }
.opt legend {
  font-family: var(--ff-mono); font-size: 9.5px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--ink-35); font-weight: 500;
  padding: 0; margin-bottom: .7rem;
}
.opt__note { margin-top: .6rem; }

/* פירוק המחיר: מוצר / אספקה / סה״כ */
.pdp__breakdown {
  display: flex; align-items: baseline; gap: .8rem; flex-wrap: wrap;
  margin-top: .35rem; min-height: 1.2em;
  font-size: .84rem; color: var(--ink-55);
}
.pdp__breakdown strong { font-weight: 500; color: var(--ink); }
.pdp__breakdown:empty { display: none; }

/* כותרת משנה בתוך רשימת התוספות */
.opt__group {
  font-family: var(--ff-mono); font-size: 9px; letter-spacing: .15em;
  text-transform: uppercase; color: var(--ink-35);
  margin: 1.1rem 0 .45rem;
}
.opt__group:first-child { margin-top: 0; }

/* בחירה שהיא חלק מהמוצר (צבע וכו') — לא תוספת תשלום */
.opt--pick .pick { display: grid; gap: .35rem; }
.opt--pick .pick + .pick { margin-top: .8rem; }
.opt--pick label {
  font-size: .85rem; color: var(--ink-55);
}
.opt--pick select {
  width: 100%;
  padding: .8em .9em;
  border: 1px solid var(--line);
  background: var(--paper);
  font-size: .93rem;
  transition: border-color .3s var(--ease);
}
.opt--pick select:hover { border-color: var(--ink-35); }
.opt--pick select:focus { outline: none; border-color: var(--ink); }

.optrow {
  position: relative;
  display: grid;
  grid-template-columns: 22px 1fr auto;
  align-items: center;
  gap: .85rem;
  padding: 1rem 1.05rem;
  border: 1px solid var(--line);
  cursor: pointer;
  transition: border-color .25s var(--ease), background .25s var(--ease);
  min-height: 62px;
}
.optrow + .optrow { margin-top: .5rem; }
.optrow:hover { border-color: var(--ink-35); background: var(--paper-warm); }
.optrow input { position: absolute; opacity: 0; width: 0; height: 0; }
.optrow::before {
  content: "";
  grid-column: 1;
  width: 22px; height: 22px;
  border: 1.5px solid var(--ink-35);
  transition: border-color .2s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease);
}
.optrow:has(input[type="radio"])::before { border-radius: 50%; }
.optrow:has(input:checked) { border-color: var(--ink); background: var(--paper-warm); }
.optrow:has(input:checked)::before {
  border-color: var(--ink); background: var(--ink);
  box-shadow: inset 0 0 0 4px var(--paper);
}
.optrow:has(input:focus-visible) { outline: 2px solid var(--ink); outline-offset: 2px; }

.optrow__t { display: grid; gap: .15rem; min-width: 0; }
.optrow__t b { font-weight: 500; font-size: .93rem; line-height: 1.3; }
.optrow__t em { font-style: normal; font-size: .79rem; color: var(--ink-55); line-height: 1.45; }
.optrow__p { font-weight: 500; font-size: .93rem; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* כפתור הקנייה — הכפתור המרכזי בעמוד */
.btn--buy { padding-block: 1.25em; font-size: .95rem; font-weight: 500; letter-spacing: .01em; }

/* סרגל קנייה דביק במובייל */
.buybar {
  position: fixed;
  inset-inline: 0; inset-block-end: 0;
  z-index: 470;
  display: flex; align-items: center; gap: .8rem;
  padding: .7rem clamp(.9rem, 4vw, 1.4rem);
  padding-block-end: calc(.7rem + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.97);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-block-start: 1px solid var(--line);
  transform: translateY(110%);
  transition: transform .42s var(--ease);
}
.buybar.is-on { transform: none; }
.buybar__p { font-size: 1.12rem; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.buybar .btn { flex: 1; padding-block: 1.05em; }
@media (min-width: 861px) { .buybar { display: none; } }
body.has-buybar .wa-fab { transform: translateY(-66px); }
body.has-buybar .toast { inset-block-end: calc(clamp(16px,3vw,28px) + 66px); }


/* ═══════════════════════════════════════════
   23. שלבי רכישה, סל וסיכום
   ═══════════════════════════════════════════ */

.steps {
  display: flex; flex-wrap: wrap; gap: .4rem 1.6rem;
  margin-bottom: clamp(1.6rem, 3vw, 2.4rem);
  padding-bottom: 1.1rem; border-bottom: 1px solid var(--line);
  font-family: var(--ff-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-35); counter-reset: st;
}
.steps li { counter-increment: st; display: flex; align-items: center; gap: .5em; }
.steps li::before {
  content: counter(st);
  width: 18px; height: 18px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1px solid currentColor; font-size: 9px;
}
.steps li.is-on { color: var(--ink); }
.steps li.is-on::before { background: var(--ink); color: var(--paper); border-color: var(--ink); }

.summary__lines {
  display: grid; gap: .5rem;
  padding-bottom: .9rem; margin-bottom: .3rem;
  border-bottom: 1px solid var(--line-soft);
}
.summary__line { display: flex; justify-content: space-between; gap: 1rem; font-size: .82rem; }
.summary__line span:first-child { color: var(--ink-55); min-width: 0; }
.summary__line b { font-weight: 500; white-space: nowrap; }

/* שורת פריט בסל — תוספות ואספקה */
.citem__meta { display: grid; gap: .28rem; margin-top: .5rem; }
.citem__meta span {
  font-size: .78rem; color: var(--ink-55);
  display: flex; align-items: center; gap: .4em;
}
.citem__meta span::before {
  content: ""; width: 4px; height: 4px; background: var(--ink-35);
  border-radius: 50%; flex: 0 0 auto;
}
.citem__dlv { margin-top: .6rem; display: grid; gap: .3rem; font-size: .78rem; }
.citem__dlv label { font-family: var(--ff-mono); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-35); }
.citem__dlv select {
  border: 1px solid var(--line); padding: .5em .6em; font-size: .82rem;
  background: var(--paper); max-width: 100%; width: 100%;
}
.citem__dlv select:focus { outline: none; border-color: var(--ink); }


/* ═══════════════════════════════════════════
   24. מסך אישור הזמנה
   ═══════════════════════════════════════════ */

.done__box { max-width: 480px; }
.done__mark {
  width: 46px; height: 46px; margin: 0 auto 1rem;
  display: grid; place-items: center;
  border-radius: 50%; border: 1.5px solid var(--ink); color: var(--ink);
}
.done__mark svg { width: 22px; height: 22px; }
.done__num { font-size: .9rem; margin-bottom: 1rem; }
.done__num strong { font-family: var(--ff-mono); letter-spacing: .06em; }
.done__sum {
  text-align: start; margin: 0 0 1.2rem;
  border-block: 1px solid var(--line); padding-block: .9rem;
  display: grid; gap: .45rem;
}
.done__sum .summary__line { font-size: .83rem; }
.done__acts { display: grid; gap: .5rem; }


/* ═══════════════════════════════════════════
   25. טבלאות רחבות + מסמכי מדיניות
   ═══════════════════════════════════════════ */

.tblwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: 1.6rem; }
.tblwrap .cmp { min-width: 560px; margin-top: 0; }

.prose.legal { max-width: 70ch; }
.prose.legal h2 { font-size: clamp(1.2rem, 1.8vw, 1.5rem); margin-top: clamp(1.8rem, 3.4vw, 2.6rem); }
.prose.legal p, .prose.legal li { font-size: .93rem; }



/* ═══════════════════════════════════════════
   21. הירו במובייל — הווידאו במלואו, בלי חיתוך
   ═══════════════════════════════════════════ */

@media (max-width: 760px) {
  .hero { min-height: 100svh; }
  .hero__in { padding: clamp(1.6rem, 7vw, 2.4rem) var(--gut) clamp(2rem, 8vw, 3rem); }
  .hero__grid { gap: 1.1rem; }
  .hero__cta { margin-top: 1.3rem; }
  .hero__cta .btn { flex: 1 1 100%; }
}


/* ═══════════════════════════════════════════
   22. גלריית מוצר — החלקה, חצים, נקודות
   ═══════════════════════════════════════════ */

.pdp__stage { padding: 0; }
.pdp__track {
  display: flex;
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
}
.pdp__track::-webkit-scrollbar { display: none; }
.pdp__track.is-dragging { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; }
.pdp__track:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }

.pdp__slide {
  flex: 0 0 100%;
  scroll-snap-align: center;
  display: grid;
  place-items: center;
  min-width: 0;
}
.pdp__slide img {
  width: 100%; height: 100%;
  object-fit: contain;
  padding: 5%;
  mix-blend-mode: multiply;
  -webkit-user-drag: none;
  user-select: none;
}
.pdp__slide img.is-photo { object-fit: cover; padding: 0; mix-blend-mode: normal; }

.pdp__nav {
  position: absolute;
  inset-block-start: 50%;
  translate: 0 -50%;
  z-index: 3;
  width: 42px; height: 42px;
  display: grid; place-items: center;
  background: rgba(255,255,255,.9);
  border: 1px solid var(--line);
  backdrop-filter: blur(6px);
  transition: opacity .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease);
}
.pdp__nav svg { width: 18px; height: 18px; fill: none; stroke: var(--ink); stroke-width: 1.5; }
.pdp__nav:hover { background: #fff; border-color: var(--ink); }
.pdp__nav:disabled { opacity: 0; pointer-events: none; }
.pdp__nav--prev { inset-inline-end: 10px; }
.pdp__nav--next { inset-inline-start: 10px; }
/* בעברית החץ "הקודם" מצביע ימינה */
.pdp__nav--prev svg { transform: scaleX(-1); }
.pdp__nav--next svg { transform: scaleX(-1); }
@media (hover: none) { .pdp__nav { display: none; } }

.pdp__dots {
  position: absolute;
  inset-block-end: 12px;
  inset-inline: 0;
  z-index: 3;
  display: flex;
  justify-content: center;
  gap: 6px;
}
.pdp__dots:has(.pdp__dot:only-child) { display: none; }
.pdp__dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--ink-35);
  opacity: .45;
  transition: opacity .3s var(--ease), background .3s var(--ease), width .3s var(--ease);
}
.pdp__dot[aria-current] { opacity: 1; background: var(--ink); width: 18px; border-radius: 4px; }

/* רמז החלקה — רק במגע, ורק כשיש יותר מתמונה אחת */
@media (hover: none) {
  .pdp__stage[data-gallery]::after {
    content: "החליקו לתמונות נוספות";
    position: absolute;
    inset-block-start: 12px; inset-inline-start: 12px;
    z-index: 3;
    font-family: var(--ff-mono);
    font-size: 9px; letter-spacing: .12em;
    padding: .45em .7em .4em;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--line);
    color: var(--ink-55);
    pointer-events: none;
  }
  .pdp__stage[data-gallery]:has(.pdp__dot:only-child)::after { content: none; }
}

.pdp__thumbs { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }


/* ═══════════════════════════════════════════
   23. תצוגת 360°
   ═══════════════════════════════════════════ */

.spin {
  position: relative;
  margin-top: clamp(.5rem, 1vw, .9rem);
  aspect-ratio: 5/4;
  background: var(--paper-warm);
  overflow: hidden;
  cursor: grab;
  touch-action: pan-y;
}
.spin.is-spinning { cursor: grabbing; }
.spin__frames { position: absolute; inset: 0; }
.spin__frames img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: contain;
  padding: 5%;
  opacity: 0;
  mix-blend-mode: multiply;
  -webkit-user-drag: none;
  user-select: none;
}
.spin__frames img.is-on { opacity: 1; }
.spin__hint {
  position: absolute;
  inset-block-end: 10px; inset-inline: 0;
  text-align: center;
  font-family: var(--ff-mono);
  font-size: 9px; letter-spacing: .13em;
  color: var(--ink-35);
  pointer-events: none;
}
.spin.is-spinning .spin__hint { opacity: 0; }


/* ═══════════════════════════════════════════
   24. כפתור פייסבוק
   ═══════════════════════════════════════════ */

.soc { display: inline-flex; align-items: center; gap: .45rem; }
.soc svg { width: 15px; height: 15px; fill: currentColor; flex: 0 0 auto; }
.mega__foot .soc:hover { color: #fff; }
.soc--ftr {
  margin-top: .5rem;
  padding-top: .7rem;
  border-top: 1px solid rgba(255,255,255,.12);
  width: 100%;
}



/* ═══════════════════════════════════════════
   25. אזורי לחיצה — מינימום 24px לפי WCAG 2.2
   ═══════════════════════════════════════════ */

/* הנקודות בגלריה היו 7px. הנקודה נשארת קטנה, שטח הלחיצה גדל. */
.pdp__dots { gap: 0; }
.pdp__dot {
  position: relative;
  background-clip: content-box;
  padding: 11px 7px;
  width: 21px;
  height: 29px;
  border-radius: 0;
}
.pdp__dot::after {
  content: "";
  position: absolute;
  inset: 11px 7px;
  border-radius: 50%;
  background: var(--ink-35);
  transition: background .3s var(--ease), inset .3s var(--ease);
}
.pdp__dot { background: none !important; opacity: 1; }
.pdp__dot[aria-current] { width: 32px; }
.pdp__dot[aria-current]::after {
  background: var(--ink);
  inset: 11px 7px;
  border-radius: 4px;
}
.pdp__dot:not([aria-current])::after { opacity: .45; }

/* כפתור התפריט היה 16px גובה */
.menu-btn { padding-block: .7rem; min-height: 44px; }

/* קישורים בפוטר, בתפריט, בפירורי הלחם ובכרטיסים */
.ftr__col a,
.ftr__contact a,
.mega__foot a,
.crumbs a,
.pcard__name a {
  display: inline-block;
  padding-block: 3px;
  min-height: 24px;
}
.ftr li + li { margin-top: .3rem; }
.brand { padding-block: 4px; }

@media (max-width: 700px) {
  .ftr__col a, .mega__foot a { padding-block: 6px; min-height: 30px; }
  .crumbs a { padding-block: 4px; }
}

.mega__close { padding-block: .6rem; min-height: 40px; }


/* הכפתור הצף מתפנה כשכפתור התשלום על המסך */
.wa-fab.is-away {
  opacity: 0;
  pointer-events: none;
  transform: translateY(14px) scale(.9);
}

/* אוויר בתחתית העמוד במובייל, כדי שהכפתור הצף לא ידרוך על התוכן האחרון */
@media (max-width: 760px) {
  main { padding-bottom: 26px; }
  .cart-wrap .summary { margin-bottom: 34px; }
}