/* CARD WRAPPER */ .expand-card { contain: layout paint; overflow-anchor: none; transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, background-color .35s ease; will-change: transform; } /* hover (легкий premium lift) */ .expand-card:hover { transform: translateY(-2px); box-shadow: 0 18px 50px rgba(0,0,0,.08); } /* COLLAPSED CONTENT */ .card-more { opacity: 0; transform: translateY(-6px); max-height: 0; overflow: hidden; transition: opacity .25s ease, transform .45s cubic-bezier(.22,1,.36,1), max-height .6s cubic-bezier(.22,1,.36,1); } /* OPEN STATE */ .expand-card.open .card-more { opacity: 1; transform: translateY(0); max-height: 500px; /* safe auto-limit */ } /* INNER CONTENT ANIMATION */ .card-more-inner > * { opacity: 0; transform: translateY(14px); transition: opacity .45s ease, transform .6s cubic-bezier(.22,1,.36,1); } .expand-card.open .card-more-inner > * { opacity: 1; transform: translateY(0); } /* STAGGER */ .expand-card.open .card-more-inner > *:nth-child(1) { transition-delay: .03s; } .expand-card.open .card-more-inner > *:nth-child(2) { transition-delay: .06s; } .expand-card.open .card-more-inner > *:nth-child(3) { transition-delay: .09s; } /* ARROW */ .card-arrow { transition: transform .6s cubic-bezier(.22,1,.36,1); } .expand-card.open .card-arrow { transform: rotate(180deg); }