.DTWeb-card-container {
    position: relative;
    margin: 0px 0;
}
.DTWeb-card-container.default {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.DTWeb-card-container.stacked {
    perspective: clamp(62rem, 62vw, 62vw);
    overflow: visible;
    width: 100%;
    aspect-ratio: 16 / 12;
    height: auto;
    overflow: visible; /* Permitimos que las cartas se vean fuera del contenedor */
}
.DTWeb-card-container.default .card{
    flex:0 0 25%;
}

.DTWeb-card-container.default .card {
    background: #fff;
    border-radius: clamp(1rem, 1vw, 1vw);
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15);
    box-shadow: 0 clamp(0.3125rem, 0.3125vw, 0.3125vw) clamp(1.5rem, 1.5vw, 1.5vw) rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: clamp(1.8rem, 1.8vw, 1.8vw);
    transition: all 16s cubic-bezier(0.25, 0.8, 0.25, 1);
    transform-origin: center bottom;
    padding: clamp(1.25rem, 1.25vw, 1.25vw);
    box-sizing: border-box;
}


/* Animación */
.DTWeb-card-container.default .card {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.6s ease;
  }
 
.DTWeb-card-container.default .card.visible {
    opacity: 1;
    transform: translateY(0);
  }



.DTWeb-card-container.stacked .card {position: absolute;width: 80%;height: 70%;background: #fff;border-radius: clamp(1rem, 1vw, 1vw);box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15);box-shadow: 0 clamp(0.3125rem, 0.3125vw, 0.3125vw)clamp(1.5rem, 1.5vw, 1.5vw) rgba(0, 0, 0, 0.15);display: flex;flex-direction: column;align-items: center;justify-content: center;font-size: clamp(1.8rem, 1.8vw, 1.8vw);transition: all 16s cubic-bezier(0.25, 0.8, 0.25, 1);transform-origin: center bottom;padding: clamp(1.25rem, 1.25vw, 1.25vw);box-sizing: border-box;}
.DTWeb-card-container.stacked .content-card h3 {
    margin-bottom: clamp(2rem, 2vw, 2vw);
}

.DTWeb-card-container.stacked .content-card {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 90%;display: flex;justify-content: center;align-items: center;flex-direction: column;text-align: center;}

/* Posicionamiento inicial de todas las cartas */
.DTWeb-card-container.stacked .card {left: 10%;top: 0;transform: scale(1);opacity: 1;z-index: 1;}
/* Cartas inactivas (las 3 detrás de la activa) */
.DTWeb-card-container.stacked .card:nth-last-child(1) {/* Más atrás */transform: scale(1) translateY(40px);opacity: 1;z-index: 1;left: 8%;filter: brightness(0.95);}
.DTWeb-card-container.stacked .card:nth-last-child(2) {/* Intermedia */transform: scale(1) translateY(25px);opacity: 1;z-index: 2;left: 9%;filter: brightness(0.97);}
.DTWeb-card-container.stacked .card:nth-last-child(3) {/* Casi activa */transform: scale(0.9) translateY(10px);opacity: 0.85;z-index: 3;left: 10%;}
.DTWeb-card-container.stacked .card.active {/* Carta activa */transform: scale(1);opacity: 1;z-index: 4;left: 0%;top: 0;box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);}
.DTWeb-card-container.stacked .card:not(.active){overflow:hidden:}
@media (max-width: 993px) {
    .DTWeb-card-container.default {
      grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (max-width: 767px) {
    .DTWeb-card-container.stacked {
        padding: clamp(0rem, 0vw, 0vw) 0 clamp(8rem, 8vw, 8vw) 0;
        top: 0%;
        margin-left: 0%;
        width: 100%;
    }
    .DTWeb-card-container.stacked  .content-card p {
        font-size: clamp(1.25rem, 1.25vw, 1.25vw);
    }
    .DTWeb-card-container.stacked .card {position: absolute;width: 80%;height: 80%; }



    .DTWeb-card-container.default {
      grid-template-columns: 1fr;
    }
}
