/* Home page (Hebrew, RTL). Numbers in --x/--y/--w/--h are desktop px on the 1440 stage;
   --m* values are mobile units (see site.css). */

/* Elements pinned in both layouts (hero text). */
.pin {
  position: absolute;
  left: calc(var(--x) * 1px); top: calc(var(--y) * 1px); width: calc(var(--w) * 1px);
}

/* ---------- Hero ---------- */
.hero { background: #242424; overflow: hidden; }
.hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero h1 {
  padding-right: 40px;
  font: 68px/68px var(--heebo); letter-spacing: -0.05em;
}
.hero .subtitle { font: 28px/1.05em var(--heebo); letter-spacing: -0.04em; text-align: center; }

/* ---------- Text blocks ---------- */
.lead { font: 34px/1.2em var(--heebo); letter-spacing: -0.01em; }
.block h2 { font: 64px/64px var(--heebo); letter-spacing: -0.04em; }
.block p { font: 20px/1.3em var(--heebo); }
.block p.f27 { font-size: 27px; text-align: center; }
.acc { color: var(--accent); font-style: italic; }
.acc.upright { font-style: normal; }
.bitter { font-family: var(--bitter); }
.gold { color: var(--gold); }
.brown { color: var(--brown); }
.f23 { font-size: 23px; }
.f24 { font-size: 24px; }
.f25 { font-size: 25px; }
.f26 { font-size: 26px; }
.f28 { font-size: 28px; }
.f48 { font-size: 48px; }

/* ---------- Call to action ---------- */
.cta {
  display: block; height: 40px; padding: 0;
  background: #000; border: 1px solid var(--cta-border); border-radius: 30px;
  font: 24px/1 var(--playfair); letter-spacing: 1.2px; color: var(--accent);
  cursor: pointer;
}

/* ---------- Videos ---------- */
.video.abs { height: calc(var(--vh) * 1px); }

/* ---------- Mobile ---------- */
@media (max-width: 999px) {
  .sec { padding: calc(var(--pt, 0) * var(--u)) 0 calc(var(--pb, 0) * var(--u)); }
  .pin {
    left: calc(var(--mx) * var(--u)); top: calc(var(--my) * var(--u)); width: calc(var(--mw) * var(--u));
  }
  /* Wix overlaps the hero with the next section by 10 units: visible height is 320. */
  .hero { height: calc(320 * var(--u)); padding: 0; }
  .hero > img { height: calc(330 * var(--u)); }
  .hero h1 { padding-right: calc(40 * var(--u)); font-size: calc(29 * var(--u)); line-height: 1; }
  .hero .subtitle { font-size: calc(20 * var(--u)); }

  .txt { margin-inline: calc(20 * var(--u)); }
  .lead { font-size: calc(16 * var(--u)); }
  .block h2 { font-size: calc(21 * var(--u)); line-height: 1; }
  .block p { font-size: calc(11 * var(--u)); }
  .block p.f27 { font-size: calc(14 * var(--u)); }
  .f23, .f24 { font-size: calc(13 * var(--u)); }
  .f25, .f26, .f28 { font-size: calc(14 * var(--u)); }
  .f48 { font-size: calc(18 * var(--u)); }

  .cta {
    margin-inline: auto; width: calc(122 * var(--u)) !important; height: calc(29 * var(--u));
    font-size: calc(14 * var(--u)); letter-spacing: calc(0.7 * var(--u));
  }
  .video.abs { width: calc(var(--mw, 320) * var(--u)); height: calc(var(--mvh) * var(--u)); margin-right: auto; }
}