/*stack card section*/
.stack-button a.button {border: 2px solid #101828; background: #fff; display: inline-block; color: #0D41E1; border-radius: 6px; transition: 0.3s;}
.stack-button:hover a.button {box-shadow: 4px 4px 0px 0px #101828;}
.card__content .stack-title { font-family: "Plus Jakarta Sans", sans-serif; color: #fff; margin-bottom: 20px;}
.stack-content p { font-size: 20px; line-height: 1.6; color: #fff;}
.stack-content { margin-bottom: 24px;}
.stack-content p:last-child { margin-bottom: 0;}
.card__inner {transform-origin: top center;}
.sticky-title.last-active {transform: translateY(-100%); opacity: 0;}
.sticky-title { position: sticky; top: 120px; transform: translateY(0); opacity: 1; transition: transform 0.3s ease, opacity 0.3s ease;}
.stack-card-scroll .card { position: sticky; top: 200px;}
.stack-card-scroll .card__inner { border: 2px solid #000000; will-change: transform; position: relative; display: grid; justify-content: flex-start;  border-radius: 16px; padding: 35px 55px;
    min-height: 470px; transform-origin: top center !important;  gap: 45px;  grid-template-columns: 1fr 1fr;}
.stack-card-scroll .cards {width: 100%; margin: 0 auto;  display: grid; grid-template-rows: repeat(var(--cards-count), var(--card-height)); gap: 50px 0;}
.stack-card-scroll .card__image-container {  display: flex;  width: 100%;  justify-content: center;  align-items: center;}
.stack-card-scroll .card__image-container img { height: 374px;  object-fit: contain;}
.stack-card-scroll .space { height: 100px;}



@media (max-width: 960px) {
.sticky-title {top: 50px;}    
/*stack card*/
.stack-card-scroll .card__inner { display: flex; flex-direction: column-reverse;padding: 30px;}
.stack-card-scroll .card { top: 100px;}
.stack-card-scroll .card .card__content { text-align: center;}


}




@media (max-width: 767px) {
.stack-content p {font-size: 16px;line-height: 1.5;}
.stack-title { margin-bottom: 15px;}
.sticky-title { top: 40px; }
.stack-card-scroll .cards .card { top: 80px;}
.stack-card-scroll .card__image-container img { height: 250px;}
.stack-card-scroll .card__inner {padding: 24px; gap: 30px;}
.stack-card-scroll .card__inner{min-height: 520px;}
.stack-card-scroll .cards { gap: 30px 0;}




}