.design {
    margin: 0 3% !important;

    section {
        #section1 {
            .plans {
                gap: 6rem !important;
                justify-content: center !important;

                :nth-child(1) {
                    width: 900px; // Ocupa todo el ancho del contenedor
                    height: auto; // Ajusta la altura automáticamente manteniendo la proporción
                }

                :nth-child(2) {
                    width: 224px;
                    height: auto;
                }

                :nth-child(3) {

                    width: 900px; // Ocupa todo el ancho del contenedor
                    height: auto; // Ajusta la altura automáticamente manteniendo la proporción

                }

                :nth-child(4) {
                    margin-left: 1.2rem;
                    width: 200px;
                    object-fit: cover;
                    height: 400px;
                }
            }
        }
    }
}
            

@media screen and (max-width: 1890px) {
    .design {
        section {
            #section1 {
                .plans {
                    justify-content: flex-start !important;
                    padding-left: 2rem;
                    
                    :nth-child(1) {
                        width: 70%;       
                    }
                    :nth-child(2) {
                        width: 17%;       
                    }
                    :nth-child(3) {
                        width: 70%;       
                    } 
                }   
                div {
                    .text-container {
                        .text {
                            -webkit-line-clamp: 30;
                            line-clamp: 30;
                        }
                        .toggle-btn {
                            display: none;
                        }
                    }
                }              
            }
        }
    }
}

@media screen and (max-width: 1035px) {
    .design {
        section {
            #section1 {
                .plans {
                    padding-left: 0;
                    > :nth-child(1) {
                        width: 80%;       
                    }
                    > :nth-child(2) {
                        width: 20%;
                    }
                    > :nth-child(3) {
                        width: 80%;
                        margin-bottom: 2rem;         
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 860px) {
    .design {
        section {
            #section1 {
                .plans {
                    

                    > :nth-child(2) {
                        width: 24%;
                        object-fit: contain;
                        height: auto;
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 745px) {
    .design {
        section {
            #section1 {
                div {
                    .text-container {
                        .text {
                            -webkit-line-clamp: 14;
                            line-clamp: 14;
            
                            &.expanded {
                                -webkit-line-clamp: unset;
                                line-clamp: unset;
                                overflow: visible;
                            }
                        }
                        .toggle-btn {
                            display: inline-block;
                            bottom: 0;
                        }
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 600px) {
    .design {
        section {
            #section1 {
                .plans {
                    > :nth-child(2) {
                        width: 26%;
                    }
                    > :nth-child(4) {
                        width: 20%;
                    }
                }
            }
        }
    }
}