/* ZY story + steps */
.zy-story{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,56px);align-items:center;
  margin-block:var(--spacing-24);padding:clamp(24px,5vw,56px);border-radius:32px;
  background:#D9BFA7;color:#3A1B1B;position:relative;overflow:hidden;
}
.zy-story::before{content:"";position:absolute;width:320px;height:320px;border-radius:50%;background:#E8A7A7;opacity:.5;inset-block-start:-120px;inset-inline-start:-90px}
.zy-story__text{position:relative;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.zy-eyebrow-s{padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.65);font-weight:700;font-size:13px}
.zy-story__text .heading{font-size:clamp(26px,3.4vw,40px);line-height:1.2;margin:0}
.zy-story__text p{margin:0;line-height:1.8;opacity:.9;max-width:52ch}

.zy-steps{position:relative;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.zy-steps::before{ /* connecting line */
  content:"";position:absolute;inset-block:26px;inset-inline-start:26px;width:2px;
  background:repeating-linear-gradient(to bottom,#5B2C2C 0 6px,transparent 6px 12px);opacity:.35;
}
.zy-step{
  position:relative;display:flex;align-items:center;gap:14px;
  padding:12px 16px;border-radius:20px;background:#FFF8F3;
  box-shadow:0 10px 24px rgba(91,44,44,.12);
  transition:transform .25s cubic-bezier(.3,.8,.4,1.5),box-shadow .25s ease;
}
.zy-step:hover{transform:translateX(-6px);box-shadow:0 16px 30px rgba(91,44,44,.2)}
html[dir=ltr] .zy-step:hover{transform:translateX(6px)}
.zy-step__num{
  flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  background:#5B2C2C;color:#F7E7DC;font-weight:800;font-size:13px;position:relative;z-index:1;
}
.zy-step__emoji{flex:none;font-size:26px;line-height:1;transition:transform .3s ease}
.zy-step:hover .zy-step__emoji{animation:zy-wiggle .6s ease}
.zy-step__body{display:flex;flex-direction:column;line-height:1.3}
.zy-step__body b{font-size:16px;font-weight:800;color:#5B2C2C}
.zy-step__body small{font-size:13px;opacity:.75}

@media (max-width:820px){.zy-story{grid-template-columns:1fr;border-radius:24px}}
@media (prefers-reduced-motion:reduce){.zy-step:hover{transform:none}}
