/* page 01 heroes 335-337 (Session 102): VSL (ice), person pop-out with mask (emerald), reels (charcoal). Copy is placeholders. */
.c-hre, .c-hrf, .c-hrg { direction: rtl; font-family: "Noto Sans Hebrew", sans-serif; font-weight: 400; letter-spacing: 0; overflow: clip; background: #fff; }
.c-hre :where(h1, p, ul, li), .c-hrf :where(h1, p, ul, li), .c-hrg :where(h1, p, ul, li) { margin: 0; padding: 0; list-style: none; }

/* 335 ice VSL, trapezoid */
.c-hre__sec { box-sizing: border-box; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 20px calc(48px + clamp(48px, 7vw, 110px)); background: var(--zk-bg, radial-gradient(60% 40% at 12% 0%, rgba(37, 99, 235, .14), transparent 72%), radial-gradient(55% 40% at 92% 100%, rgba(37, 99, 235, .10), transparent 72%), #eaf2ff); color: var(--zk-text, #0b1f4d);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - clamp(40px, 6vw, 88px)), 78% calc(100% - clamp(40px, 6vw, 88px)), 68% 100%, 32% 100%, 22% calc(100% - clamp(40px, 6vw, 88px)), 0 calc(100% - clamp(40px, 6vw, 88px))); }
.c-hre__aud { padding: 12px 32px; border-radius: 0 0 24px 24px; background: linear-gradient(135deg, var(--zk-btn-a, #3b6cf0) 0%, var(--zk-btn-b, #1d3fa8) 100%); box-shadow: 0 8px 22px var(--zk-glow, rgba(29, 63, 168, .32)), inset 0 1px 0 rgba(255, 255, 255, .24); color: var(--zk-on-btn, #fff); font-size: clamp(16px, 4vw, 20px); font-weight: 700; }
.c-hre__h { margin-top: 28px; font-size: clamp(30px, 6.6vw, 54px); line-height: 1.14; font-weight: 900; text-wrap: balance; }
.c-hre__l1 { display: block; font-weight: 300; }
.c-hre__l2 { display: block; color: var(--zk-accent, #1d4ed8); }
.c-hre__vsl { width: min(100%, 880px); margin-top: 30px; border-radius: 22px; overflow: hidden; box-shadow: 0 26px 56px var(--zk-glow, rgba(29, 63, 168, .3)); }
.c-hre__banner { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 12px 20px; background: var(--zk-card, #fff); color: var(--zk-accent, #1d4ed8); font-size: clamp(16px, 4vw, 20px); font-weight: 800; }
.c-hre__poster { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; padding: 0; border: 0; cursor: pointer; background: radial-gradient(120% 90% at 50% 0%, var(--zk-btn-a, #3b6cf0) 0%, var(--zk-poster-b, #223a8f) 55%, var(--zk-poster-c, #121a3d) 100%); }
.c-hre__play { position: absolute; top: 50%; left: 50%; box-sizing: border-box; width: 80px; height: 80px; transform: translate(-50%, -50%); border: 4px solid #e6e9ef; border-radius: 50%; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .4)); }
.c-hre__play::after { content: ""; position: absolute; top: 50%; left: 50%; border-style: solid; border-width: 14px 0 14px 23px; border-color: transparent transparent transparent #e6e9ef; transform: translate(-35%, -50%); }
.c-hre__cta { position: relative; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 64px; margin-top: 36px; padding: 8px 44px 8px 100px; border-radius: 999px; background: linear-gradient(135deg, var(--zk-btn-a, #3b6cf0) 0%, var(--zk-btn-b, #1d3fa8) 100%); color: var(--zk-on-btn, #fff); font-size: clamp(18px, 4.6vw, 22px); font-weight: 800; text-align: center; text-decoration: none; box-shadow: 0 10px 28px var(--zk-glow, rgba(29, 63, 168, .4)), inset 0 1px 0 rgba(255, 255, 255, .24); }
.c-hre__arr { position: absolute; left: 8px; top: 50%; width: 48px; height: 48px; transform: translateY(-50%); border-radius: 50%; background: #fff; }
.c-hre__arr::after { content: ""; position: absolute; inset: 13px; background: var(--zk-btn-b, #1d3fa8); -webkit-mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; }
.c-hre__proof { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 36px; }
.c-hre__av { display: flex; justify-content: center; }
.c-hre__av li { width: 48px; height: 48px; margin-inline-start: -12px; border: 3px solid var(--zk-bg-solid, #eaf2ff); border-radius: 50%; overflow: hidden; background: var(--zk-card-2, #c7d7fb); }
.c-hre__av li:first-child { margin-inline-start: 0; }
.c-hre__av img { display: block; width: 100%; height: 100%; object-fit: cover; }
.c-hre__pt { font-size: clamp(17px, 4.2vw, 20px); color: var(--zk-text-2, #26407e); }
.c-hre__pt b { font-family: Poppins, sans-serif; font-weight: 800; font-size: 1.3em; color: var(--zk-accent, #1d4ed8); }

/* 336 emerald person pop-out, S-curve */
.c-hrf__sec { box-sizing: border-box; padding: 28px 20px calc(24px + clamp(56px, 8vw, 120px)); background: #0f766e; color: #fff;
  -webkit-mask: linear-gradient(#000, #000) top / 100% calc(100% - clamp(56px, 8vw, 120px) + 1px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V14C1000 14 440 112 0 112Z'/%3E%3C/svg%3E") bottom / 100% clamp(56px, 8vw, 120px) no-repeat;
  mask: linear-gradient(#000, #000) top / 100% calc(100% - clamp(56px, 8vw, 120px) + 1px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V14C1000 14 440 112 0 112Z'/%3E%3C/svg%3E") bottom / 100% clamp(56px, 8vw, 120px) no-repeat; }
.c-hrf__in { display: grid; gap: 28px; width: min(100%, 1180px); margin-inline: auto; }
.c-hrf__text { display: flex; flex-direction: column; align-items: center; text-align: center; }
.c-hrf__aud { padding: 10px 24px; border: 1px solid rgba(255, 255, 255, .45); border-radius: 999px; background: rgba(0, 0, 0, .1); font-size: clamp(16px, 4vw, 19px); font-weight: 700; }
.c-hrf__h { margin-top: 20px; font-size: clamp(30px, 6.6vw, 56px); line-height: 1.14; font-weight: 900; text-wrap: balance; }
.c-hrf__l1 { display: block; font-weight: 300; }
.c-hrf__l2 { display: block; }
.c-hrf__mk { background: linear-gradient(transparent 56%, rgba(153, 246, 228, .5) 56%, rgba(153, 246, 228, .5) 92%, transparent 92%); padding: 0 .1em; }
.c-hrf__sub { margin-top: 16px; max-width: 34ch; font-size: clamp(18px, 4.4vw, 22px); line-height: 1.5; color: rgba(255, 255, 255, .92); }
.c-hrf__cta { position: relative; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 64px; margin-top: 36px; padding: 8px 44px 8px 100px; border-radius: 999px; background: #fff; color: #064e48; font-size: clamp(18px, 4.6vw, 22px); font-weight: 800; text-align: center; text-decoration: none; box-shadow: 0 12px 30px rgba(4, 38, 34, .35); }
.c-hrf__arr { position: absolute; left: 8px; top: 50%; width: 48px; height: 48px; transform: translateY(-50%); border-radius: 50%; background: #0f766e; }
.c-hrf__arr::after { content: ""; position: absolute; inset: 13px; background: #fff; -webkit-mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; }
.c-hrf__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; width: min(100%, 520px); margin-top: 36px; }
.c-hrf__n { display: block; font-family: Poppins, sans-serif; font-weight: 800; font-size: clamp(30px, 8vw, 46px); line-height: 1; color: #99f6e4; }
.c-hrf__stats span { display: block; margin-top: 6px; font-size: clamp(14px, 3.6vw, 17px); line-height: 1.35; }
.c-hrf__vis { position: relative; display: flex; justify-content: center; align-items: flex-end; min-height: 440px; }
.c-hrf__panel { position: absolute; bottom: 0; left: 50%; width: min(100%, 420px); height: clamp(300px, 70vw, 440px); transform: translateX(-50%); border: 1px solid rgba(255, 255, 255, .25); border-radius: 36px; background: linear-gradient(180deg, #14a090 0%, #0a5c54 55%, #0a5c54 100%); }
.c-hrf__fig { position: relative; overflow: hidden; height: clamp(360px, 84vw, 520px); aspect-ratio: 492 / 1000; -webkit-mask-image: linear-gradient(#000 0, #000 38%, rgba(0, 0, 0, 0.995) 42.5%, rgba(0, 0, 0, 0.965) 47.0%, rgba(0, 0, 0, 0.896) 51.5%, rgba(0, 0, 0, 0.790) 56.0%, rgba(0, 0, 0, 0.653) 60.5%, rgba(0, 0, 0, 0.500) 65.0%, rgba(0, 0, 0, 0.347) 69.5%, rgba(0, 0, 0, 0.210) 74.0%, rgba(0, 0, 0, 0.104) 78.5%, rgba(0, 0, 0, 0.035) 83.0%, rgba(0, 0, 0, 0.005) 87.5%, rgba(0, 0, 0, 0.000) 92.0%); mask-image: linear-gradient(#000 0, #000 38%, rgba(0, 0, 0, 0.995) 42.5%, rgba(0, 0, 0, 0.965) 47.0%, rgba(0, 0, 0, 0.896) 51.5%, rgba(0, 0, 0, 0.790) 56.0%, rgba(0, 0, 0, 0.653) 60.5%, rgba(0, 0, 0, 0.500) 65.0%, rgba(0, 0, 0, 0.347) 69.5%, rgba(0, 0, 0, 0.210) 74.0%, rgba(0, 0, 0, 0.104) 78.5%, rgba(0, 0, 0, 0.035) 83.0%, rgba(0, 0, 0, 0.005) 87.5%, rgba(0, 0, 0, 0.000) 92.0%); }
.c-hrf__fig img { position: absolute; display: block; width: 233.33%; height: auto; max-width: none; left: -2.44%; top: -36.8%; }

/* 337 charcoal reels, V-notch */
.c-hrg__sec { box-sizing: border-box; padding: 0 0 calc(48px + clamp(40px, 7vw, 100px)); background: radial-gradient(60% 40% at 50% 8%, rgba(234, 88, 12, .2), transparent 72%), #121212; color: #fff; text-align: center;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - clamp(40px, 7vw, 100px)), 0 100%); }
.c-hrg__bar { padding: 16px 20px; background: linear-gradient(135deg, #ea580c 0%, #b8400a 100%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24), 0 8px 24px rgba(184, 64, 10, .35); font-size: clamp(17px, 4.2vw, 22px); line-height: 1.4; font-weight: 700; }
.c-hrg__in { display: flex; flex-direction: column; align-items: center; padding: 28px 20px 0; }
.c-hrg__h { font-size: clamp(30px, 6.6vw, 54px); line-height: 1.14; font-weight: 900; text-wrap: balance; }
.c-hrg__l1 { display: block; font-weight: 300; }
.c-hrg__l2 { display: block; color: #fb923c; }
.c-hrg__sub { margin-top: 16px; max-width: 34ch; font-size: clamp(18px, 4.4vw, 22px); line-height: 1.5; color: rgba(255, 255, 255, .85); }
.c-hrg__reels { display: flex; gap: 16px; box-sizing: border-box; width: calc(100% + 40px); margin: 36px -20px 0; padding: 0 20px 6px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.c-hrg__reels::-webkit-scrollbar { display: none; }
.c-hrg__r { flex: 0 0 74%; max-width: 300px; scroll-snap-align: center; }
.c-hrg__poster { position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; padding: 0; border: 2px solid transparent; border-radius: 24px; cursor: pointer; overflow: hidden; background: radial-gradient(120% 70% at 50% 0%, #5a3a2a 0%, #2a1c16 55%, #17110e 100%) padding-box, linear-gradient(225deg, rgba(251, 146, 60, .95), rgba(255, 255, 255, .2) 45%, rgba(234, 88, 12, .05)) border-box; }
.c-hrg__play { position: absolute; top: 46%; left: 50%; box-sizing: border-box; width: 72px; height: 72px; transform: translate(-50%, -50%); border: 4px solid #e6e9ef; border-radius: 50%; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .4)); }
.c-hrg__play::after { content: ""; position: absolute; top: 50%; left: 50%; border-style: solid; border-width: 12px 0 12px 20px; border-color: transparent transparent transparent #e6e9ef; transform: translate(-35%, -50%); }
.c-hrg__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 12px 16px; background: linear-gradient(transparent, rgba(0, 0, 0, .65)); font-size: 15px; text-align: center; }
.c-hrg__cap b { display: block; font-size: 18px; }
.c-hrg__cta { position: relative; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 64px; margin-top: 36px; padding: 8px 44px 8px 100px; border-radius: 999px; background: linear-gradient(135deg, #ea580c 0%, #b8400a 100%); color: #fff; font-size: clamp(18px, 4.6vw, 22px); font-weight: 800; text-align: center; text-decoration: none; box-shadow: 0 10px 28px rgba(184, 64, 10, .4), inset 0 1px 0 rgba(255, 255, 255, .24); }
.c-hrg__arr { position: absolute; left: 8px; top: 50%; width: 48px; height: 48px; transform: translateY(-50%); border-radius: 50%; background: #fff; }
.c-hrg__arr::after { content: ""; position: absolute; inset: 13px; background: #b8400a; -webkit-mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; mask: url(../assets/icons/ph-arrow-left-bold.svg) center / contain no-repeat; }
@media (min-width: 900px) {
  .c-hre__sec { padding-top: 0; }
  .c-hrf__sec { padding-top: 40px; }
  .c-hrf__in { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: center; gap: 56px; }
  .c-hrf__text { align-items: flex-start; text-align: start; }
  .c-hrf__vis { min-height: 560px; }
  .c-hrf__panel { width: 460px; height: 470px; }
  .c-hrf__fig { height: 560px; }
  .c-hrg__in { padding-top: 36px; }
  .c-hrg__reels { justify-content: center; overflow: visible; width: 100%; margin-inline: 0; padding-inline: 0; max-width: 1000px; }
  .c-hrg__r { flex: 1 1 0; max-width: none; }
}

/* VSL banner: a WHITE bar with blue text and a speaker icon on each side (Liav, Session 102), used in 331 and 335 */
.c-spk { flex: none; width: 26px; height: 26px; background: currentColor; -webkit-mask: url(../assets/icons/ph-speaker-high-bold.svg) center / contain no-repeat; mask: url(../assets/icons/ph-speaker-high-bold.svg) center / contain no-repeat; }
.c-hra :where(p) { margin: 0; }
.c-hra__video { overflow: hidden; border: 2px solid rgba(143, 176, 255, .55); border-radius: 24px; }
.c-hra__video .c-hra__poster { border: 0; border-radius: 0; background: radial-gradient(120% 90% at 50% 0%, #3b6cf0 0%, #223a8f 50%, #121a3d 100%); }
.c-hra__banner { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 12px 20px; background: #fff; color: #1d4ed8; font-size: clamp(16px, 4vw, 20px); font-weight: 800; }
/* 335 light mode: the VSL bar is a pale tint of the page blue with deep brand text (white looked foreign on the ice page) */
.c-hre__banner { background: var(--zk-banner-bg, linear-gradient(180deg, #f4f8ff 0%, #d9e6ff 100%)); color: var(--zk-on-btn, #1d3fa8); border-bottom: 1px solid var(--zk-hair, rgba(29, 63, 168, .18)); }