B15 · שלדים (Skeletons)

CSS

/* מחלקות עזר של המאגר שהרכיב הזה משתמש בהן */
.stage{padding:var(--sec, clamp(120px, 12vw, 260px)) var(--gutter, clamp(24px, 5vw, 96px));position:relative}
.stage.tight{padding-block:clamp(48px,5vw,90px)}
.stage.full{padding-inline:0}

/* B15 · שלדים (Skeletons) */
.sk-card{background:var(--card, #fff);border:1px solid var(--line, #e4e4ee);border-radius:var(--r, 14px);padding:22px;max-width:420px;margin-inline:auto;display:flex;flex-direction:column;gap:12px}
.sk{background:linear-gradient(90deg,#ececf4 25%,var(--bg, #f7f7fa) 50%,#ececf4 75%);background-size:200% 100%;animation:sk 1.4s infinite;border-radius:8px}
@keyframes sk{from{background-position:200% 0}to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.sk{animation:none}}

HTML

<div class="stage tight"><div class="sk-card">
<div class="sk" style="height:120px"></div>
<div class="sk" style="height:18px;width:70%"></div>
<div class="sk" style="height:14px"></div>
<div class="sk" style="height:14px;width:85%"></div>
</div></div>