/* @u */
/* Success stories + "3 steps" section - Figma file MZpypl41ZiKTBvRwIRNBUV, frame 32:776 (1920 x 1668).
   The Figma frame is built from absolutely positioned text boxes, which collide when fonts change. Here the cards are normal flow
   (text stacks with real spacing), so nothing can overlap. Sizes, colours, gradients are from Figma. Fonts: Poppins (Latin/digits) + Noto Sans Hebrew.
   >=1280px: the block at the bottom is in Figma px, converted by build.js to calc(N * var(--u)). */
.c-sw { --u: calc(min(100vw, 1920px) / 1920); --sw-grad: linear-gradient(160deg, #cf157c 0%, #8a2c8f 100%); --sw-text-grad: linear-gradient(90deg, #cf157c 0%, #8a2c8f 100%);
  background: #0a0a0a; color: #fff; direction: rtl; font-family: "Poppins", "Noto Sans Hebrew", sans-serif; overflow-x: clip; }
.c-sw :where(h2, h3, p, figure) { margin: 0; }
.c-sw__section { position: relative; padding: 110px 16px 50px; background-color: #0a0a0a;
  background-image: radial-gradient(40% 30% at 20% 20%, #f0d88414 0%, #f0d88400 50%), radial-gradient(40% 30% at 80% 80%, #f0d8840d 0%, #f0d88400 50%); }
.c-sw__row { display: flex; flex-direction: column; align-items: center; gap: 96px; }
.c-sw-br { display: none; }
.c-sw__section--steps { padding-top: 40px; }
.c-sw__section--steps .c-sw__intro { margin-top: 0; }
.c-sw__grad { background: var(--sw-text-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }

.c-sw-card { position: relative; box-sizing: border-box; display: flex; flex-direction: column; width: min(520px, 100%); padding: 82px 32px 28px; border-radius: 30px; background-image: var(--sw-grad); filter: drop-shadow(0 24px 25px rgba(207, 21, 124, .28)); text-align: right; }
.c-sw-card__avatar { position: absolute; top: -58px; left: 50%; display: grid; place-items: center; width: 116px; height: 116px; border-radius: 58px; background: #fff; filter: drop-shadow(0 10px 12.5px rgba(0, 0, 0, .2)); transform: translateX(-50%); }
.c-sw-card__avatar img { width: 106px; height: 106px; border-radius: 53px; object-fit: cover; }
.c-sw-card__avatar--icon img { width: 54px; height: 54px; border-radius: 0; object-fit: contain; }
.c-sw-card__hh { font: inherit; }
.c-sw-card__hh > span { display: block; }
.c-sw-card__who { margin-bottom: 10px; font-size: 22.6px; line-height: 1.4; opacity: .95; }
.c-sw-card__head { font-size: 24.2px; font-weight: 900; line-height: 1.55; }
.c-sw-card__mark { display: inline-block; max-width: 100%; margin-top: 6px; padding: 2px 10px; border-radius: 6px; background: rgba(255, 255, 255, .18); line-height: 1.5; }
.c-sw-card__text { margin-top: 20px; font-size: 18.4px; line-height: 1.65; opacity: .92; }
.c-sw-card__proof { box-sizing: border-box; margin-top: auto; padding: 10px; border-radius: 18px; background: #fff; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .12)); }
.c-sw-card__text + .c-sw-card__proof { margin-top: 24px; }
.c-sw-card__proof img { display: block; width: 100%; height: auto; border-radius: 10px; }
.c-sw-card__step { font-size: 21.2px; line-height: 1.6; opacity: .95; }
.c-sw-card__stitle { margin-top: 4px; font-size: 25.5px; font-weight: 900; line-height: 1.45; }
.c-sw-card__sdesc { margin-top: 16px; font-size: 17.4px; line-height: 1.75; opacity: .95; }

.c-sw__intro { display: flex; flex-direction: column; align-items: center; margin: 70px auto; text-align: center; }
.c-sw__label { font-size: 23px; line-height: 1.5; opacity: .95; }
.c-sw__title { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 0 .28em; margin-top: 12px; font-size: clamp(26px, 6vw, 39.4px); font-weight: 900; line-height: 1.3; }
.c-sw__lead { margin-top: 24px; font-size: clamp(26px, 6vw, 40.6px); font-weight: 900; line-height: 1.45; }
.c-sw__model { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 0 .3em; margin-top: 20px; font-size: clamp(22px, 5vw, 34px); font-weight: 900; line-height: 1.45; opacity: .95; }
.c-sw__model-2 { font-size: .91em; }

@media (min-width: 1280px) {
  .c-sw__section { box-sizing: border-box; min-height: calc(1668.14 * var(--u)); padding: calc(130 * var(--u)) 0 calc(30 * var(--u)); background-image: radial-gradient(calc(217.22 * var(--u)) calc(188.73 * var(--u)) at calc(384 * var(--u)) calc(333.63 * var(--u)), #f0d88414 0%, #f0d88400 50%), radial-gradient(calc(217.22 * var(--u)) calc(188.73 * var(--u)) at calc(1536 * var(--u)) calc(1334.5 * var(--u)), #f0d8840d 0%, #f0d88400 50%), radial-gradient(calc(135.76 * var(--u)) calc(117.96 * var(--u)) at calc(960 * var(--u)) calc(834.07 * var(--u)), #f0d88408 0%, #f0d88400 70%); }
  .c-sw__row { flex-direction: row; align-items: stretch; justify-content: center; gap: calc(48 * var(--u)); width: calc(1560 * var(--u)); margin: 0 auto; }
  .c-sw-card { width: calc(488 * var(--u)); padding: calc(82 * var(--u)) calc(40 * var(--u)) calc(28 * var(--u)); }
  .c-sw-card--leeroy .c-sw-card__mark { font-size: calc(25.2 * var(--u)); }
  .c-sw-card--moran .c-sw-card__head { font-size: calc(24.8 * var(--u)); }
  .c-sw-card--moran .c-sw-card__mark { font-size: max(13px, calc(22.9 * var(--u))); }
  .c-sw-card--ariel .c-sw-card__who { font-size: max(13px, calc(23 * var(--u))); }
  .c-sw-card--ariel .c-sw-card__head { font-size: calc(25.5 * var(--u)); }
  .c-sw-card--ariel .c-sw-card__mark { font-size: calc(24.8 * var(--u)); }
  .c-sw-card--ariel .c-sw-card__text { font-size: max(13px, calc(19 * var(--u))); }
  .c-sw-card--step { padding-top: calc(78 * var(--u)); }

  .c-sw__intro { margin: calc(80 * var(--u)) auto 0; }
  .c-sw__title { margin-top: calc(10 * var(--u)); font-size: calc(39.4 * var(--u)); }
  .c-sw__title .c-sw__grad { font-size: calc(40.2 * var(--u)); }
  .c-sw__lead { width: calc(730 * var(--u)); max-width: 100%; margin-top: calc(34 * var(--u)); font-size: calc(40.6 * var(--u)); line-height: calc(57.5 * var(--u)); }
  .c-sw__model { margin-top: calc(24 * var(--u)); font-size: calc(34 * var(--u)); }
  .c-sw__model-2 { font-size: calc(30.9 * var(--u)); }
  .c-sw__row--steps { margin-top: calc(140 * var(--u)); }
  .c-sw__section--only { min-height: 0; padding-bottom: calc(90 * var(--u)); }
  .c-sw__section--steps { min-height: 0; padding-top: calc(60 * var(--u)); }
}

/* Blue version of the "3 simple steps" section (page: how it works). Same gradient structure, hue only; stories keep the pink above.
   Variables set on the section itself win over the ones inherited from .c-sw (including the !important one in 99-contrast.css). */
.c-sw__section--steps { --sw-grad: linear-gradient(160deg, #2f80ed 0%, #1d3f9e 100%); --sw-text-grad: linear-gradient(90deg, #3d8bf2 0%, #7fb2ff 100%); }
.c-sw__section--steps .c-sw-card { filter: drop-shadow(0 24px 25px rgba(47, 128, 237, .28)); }
