/* Folding stack (parts/stack.php), after monday.com's sticky card scroll.
   Each card sticks a little lower than the one before; stack.js sets --s on a
   card as the next one covers it, so it shrinks back and darkens slightly.
   Phones and reduced motion: a plain list of cards. */
.stk{display:grid;gap:0;padding-bottom:4vh}
.stk-card{--s:1;--dim:0;position:sticky;top:calc(var(--stk-top,96px) + var(--i) * 18px);min-height:clamp(440px,62vh,560px);margin-bottom:12vh;
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr);border-radius:32px;overflow:hidden;
  background:#F4F5F8;border:1px solid color-mix(in srgb,var(--line) 70%,transparent);
  box-shadow:0 -30px 60px -44px rgba(12,22,56,.35);transform-origin:50% 0;transform:scale(var(--s));
  transition:transform .12s linear}
.stk-card:last-child{margin-bottom:0}
.pp .stk{--stk-top:140px}
.stk-card::after{content:"";position:absolute;inset:0;background:#0C1638;opacity:var(--dim);pointer-events:none;border-radius:inherit}
.stk-copy{padding:clamp(28px,4vw,52px);display:flex;flex-direction:column;gap:14px}
.stk-n{display:inline-flex;align-items:center;gap:10px;font-family:var(--fd);font-weight:800;font-size:15px;color:color-mix(in srgb,var(--k) 60%,var(--ink))}
.stk-ic{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#fff;color:var(--k);--ic-accent:var(--k);box-shadow:0 6px 14px -8px rgba(12,22,56,.3)}
.stk-copy h3{font-size:clamp(1.7rem,3.2vw,2.7rem);line-height:1.02;letter-spacing:-.04em;margin:auto 0 0;max-width:13ch}
.stk-copy p{margin:0;color:var(--ink-2);font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.55;max-width:38ch}
.stk-link{display:inline-flex;gap:8px;align-items:center;font-weight:700;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--k);padding-bottom:2px;width:max-content}
.stk-link:hover{gap:12px}
.stk-visual{position:relative;padding:clamp(24px,3vw,40px) 0 0 clamp(20px,3vw,40px);display:flex;align-items:flex-end;overflow:hidden;
  background:radial-gradient(120% 100% at 100% 100%,color-mix(in srgb,var(--k) 22%,#fff),color-mix(in srgb,var(--k) 7%,#fff))}
.stk-visual>.rp,.stk-visual>img{border-radius:16px 0 0 0;border-right:0;border-bottom:0;margin-right:-2px;width:118%;max-width:none;box-shadow:-24px -24px 60px -40px rgba(12,22,56,.35)}
.stk-visual>img{height:auto}

@media (max-width:900px),(prefers-reduced-motion:reduce){
  .stk-card{position:relative;top:auto;transform:none;margin-bottom:16px;min-height:0}
  .stk-card::after{display:none}
}
@media (max-width:900px){
  .stk-card{grid-template-columns:minmax(0,1fr);border-radius:24px}
  .stk-copy h3{margin-top:4px}
  .stk-visual{padding:18px 0 0 18px}
  .stk-visual>.rp,.stk-visual>img{width:128%}
}