/* Story band - Figma frame "Container" 1:2159 (1920 x 783.8), page bg #031926 (requested), white diagonal wedges top/bottom.
   Desktop (>=1280px) scales with --u = viewport/1920 so every number below is the Figma px. Below 1280 the layout stacks. */
.c-bsw { --u: calc(min(100vw, 1920px) / 1920); background: #031926; direction: rtl; font-family: "Noto Sans Hebrew", sans-serif; color: #fff; overflow-x: clip; isolation: isolate; }
.c-bsw :where(h2, p) { margin: 0; padding: 0; }
.c-bsw img { display: block; max-width: none; }

.c-bsw__section { position: relative; background: #031926; padding: calc(clamp(40px, 11.25vw, 216px) + 36px) 20px calc(clamp(44px, 12.08vw, 232px) + 34px); }

/* white diagonal wedges (SVG, stretched to the width; bottom one is the same shape flipped vertically) */
.c-bsw__wedge { position: absolute; left: 0; width: 100%; height: clamp(40px, 11.25vw, 216px); pointer-events: none; }
.c-bsw__wedge--top { top: -1px; transform: scaleX(-1); }
.c-bsw__wedge--bottom { bottom: -1px; height: clamp(44px, 12.08vw, 232px); transform: scale(-1, -1); }

.c-bsw__row { position: relative; display: flex; flex-direction: column; align-items: center; gap: 30px; }
.c-bsw__text { width: min(960px, 100%); }
.c-bsw__title { text-align: right; }
.c-bsw__title span { display: block; }
.c-bsw__title-1 { font-size: 30px; font-weight: 300; line-height: 1.3; color: #fff; }
.c-bsw__title-2 { font-size: 32px; font-weight: 900; line-height: 1.3; color: transparent; background-image: linear-gradient(90deg, #fff, #7d7d7d); -webkit-background-clip: text; background-clip: text; }
.c-bsw__body { margin-top: 18px; }
.c-bsw__body p { margin-bottom: 18px; font-size: 18px; font-weight: 400; line-height: 1.65; text-align: right; color: #fff; }
.c-bsw__br { display: none; }
.c-bsw__visual { position: relative; width: min(420px, 90%); }
.c-bsw__portrait { width: 100%; height: auto; }

@media (min-width: 1280px) {
  .c-bsw__section { padding: calc(200 * var(--u)) 0 calc(50 * var(--u)); }
  .c-bsw__wedge { height: calc(216 * var(--u)); }
  .c-bsw__wedge--bottom { height: calc(232 * var(--u)); }

  .c-bsw__row { flex-direction: row; direction: rtl; justify-content: center; align-items: center; gap: calc(20 * var(--u)); }
  .c-bsw__text { display: flex; flex: none; flex-direction: column; align-items: flex-start; gap: calc(20 * var(--u)); width: calc(1010 * var(--u)); padding: calc(10 * var(--u)); direction: rtl; }

  .c-bsw__title { display: block; width: 100%; height: calc(33.41 * var(--u) + 20 * var(--u) + 41.2 * var(--u) + 16 * var(--u)); position: relative; text-align: right; }
  .c-bsw__title-1, .c-bsw__title-2 { position: absolute; right: 0; white-space: nowrap; }
  .c-bsw__title-1 { top: calc(-6 * var(--u)); font-size: calc(50 * var(--u)); line-height: calc(42 * var(--u)); }
  .c-bsw__title-2 { top: calc(33.41 * var(--u) + 20 * var(--u) - 5 * var(--u)); font-size: calc(52 * var(--u)); line-height: calc(60 * var(--u)); }

  .c-bsw__body { width: calc(990 * var(--u)); max-width: 100%; margin-top: 0; padding-bottom: calc(140 * var(--u)); }
  .c-bsw__body p { margin-bottom: calc(22 * var(--u)); font-size: calc(21 * var(--u)); line-height: calc(34 * var(--u)); white-space: normal; }
  .c-bsw__body p:last-child { margin-bottom: calc(14.39 * var(--u)); }
  .c-bsw__br { display: none; }

  .c-bsw__visual { flex: none; width: calc(800 * var(--u)); height: calc(179.31 * var(--u)); }
  .c-bsw__portrait { position: absolute; top: calc(-385 * var(--u)); left: calc(32 * var(--u)); width: calc(800 * var(--u)); height: calc(795.31 * var(--u)); }
}

/* copy 154: smaller person, no bottom wedge (the white triangle under the person is gone, the band simply ends in its own colour) */
.c-bsw__section { padding-bottom: 56px; }
.c-bsw__visual { width: min(300px, 70%); }
.c-bsw__portrait { -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 60%, rgba(0, 0, 0, .7) 72%, rgba(0, 0, 0, .35) 84%, transparent 97%); mask-image: linear-gradient(180deg, #000 0%, #000 60%, rgba(0, 0, 0, .7) 72%, rgba(0, 0, 0, .35) 84%, transparent 97%); }
@media (min-width: 1280px) {
  .c-bsw__section { padding-bottom: calc(120 * var(--u)); }
  .c-bsw__visual { width: calc(640 * var(--u)); }
  .c-bsw__portrait { top: calc(-250 * var(--u)); left: calc(40 * var(--u)); width: calc(560 * var(--u)); height: calc(557 * var(--u)); }
}