/* אופציה C — פתקים על לוח: הצעדים הם פתקים צבעוניים עם תמונה מודבקת, וקו מצויר מוביל ביניהם */
.s3c { background: radial-gradient(circle at 1px 1px, rgba(28,26,25,.07) 1px, transparent 1.4px) 0 0 / 26px 26px, var(--paper); }
.s3c .s3-pin { background: inherit; }
.s3c__head { position: absolute; z-index: 2; top: clamp(100px, 13vh, 140px); right: clamp(16px, 6vw, 96px); }
.s3c__track { position: absolute; top: 0; bottom: 0; right: 0; display: flex; align-items: center; gap: clamp(70px, 9vw, 150px); padding-inline: clamp(16px, 8vw, 130px) 34vw; padding-top: 90px; will-change: transform; }
.s3c__path { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.s3c__path path { fill: none; stroke: var(--pink-deep); stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 2 10; }
.bn {
  position: relative; z-index: 1; flex: 0 0 auto; width: clamp(300px, 28vw, 400px); padding: 44px 34px 36px;
  background: var(--c); border-radius: 4px 4px 26px 4px; transform: rotate(var(--r));
  box-shadow: 0 2px 2px rgba(0,0,0,.04), 0 26px 40px -18px rgba(60,40,30,.42);
}
.bn:nth-of-type(2n) { margin-top: 120px; }
.bn:nth-of-type(2n+1) { margin-bottom: 60px; }
.bn__num { position: absolute; top: 18px; right: 28px; font-size: clamp(74px, 6vw, 96px); color: var(--ink); }
.bn .s3-h { margin-top: 76px; }
.bn__photo {
  position: absolute; z-index: 2; left: -38px; top: -70px; width: clamp(140px, 12vw, 170px); margin: 0;
  background: #fff; padding: 8px 8px 30px; transform: rotate(var(--pr)); box-shadow: 0 14px 24px -12px rgba(60,40,30,.45);
}
.bn__photo img { width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 25%; }
.bn--cta { width: clamp(320px, 30vw, 430px); }
.bn--cta .s3-cta { text-align: right; }
.bn--cta .s3-cta p, .bn--cta .s3-cta strong { color: var(--ink); }

@media (max-width: 760px) {
  .s3c__head { top: 92px; }
  .s3c__track { gap: 70px; padding-inline: 32px 24vw; padding-top: 120px; }
  .bn { width: 76vw; padding: 36px 24px 28px; }
  .bn:nth-of-type(2n) { margin-top: 60px; }
  .bn .s3-h { margin-top: 60px; font-size: 26px; }
  .bn__photo { width: 118px; left: -18px; top: -62px; }
  .bn__num { font-size: 66px; }
}
