.proyectos-section .title-background-rectangle {
    align-self: flex-start;
    width: 100%;
    max-width: 50%;
    height: 10rem;
    margin-bottom: -9rem;
    /* transform: translateY(70%); */
    background-color: var(--theme-gray-1);
    /* z-index: 20 !important; */
}
.proyectos-section .box {
    flex-direction: column;
    align-items: flex-start;
    
    gap: 5rem;
}
.proyectos-section .box > button {
    align-self: flex-end;
}
.proyectos-section .box > .content {
    width: 100%;
    max-width: 520px;
    display: flex;
    flex-direction: column;
    /* flex-wrap: nowrap; */
    justify-content: space-between;
    align-items: center;

    gap: 1rem;
}
.proyectos-section .proyectos-cards {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;

    gap: 1rem;
}
.proyectos-section .project-card {
    font-weight: 400 !important;
    transition: ease 0.2s;
}
.proyectos-section .project-card:hover {
    transform: translateY(-5%);
}
.proyectos-section .project-card .card-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: start;
    
    gap: 1rem;
}
.proyectos-section .project-card .card-header img {
    width: 100%;
    max-width: 100px;
    box-shadow: var(--cards-box-shadow-1);
    border-radius: 100%;
}
.proyectos-section .proyecto-card .content {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    
    gap: 1rem;
    z-index: 10;
}
.proyectos-section .proyecto-card h3 {
    font-size: var(--subtitle-size-2-m);
}
.proyectos-section .proyecto-card p {
    font-size: var(--text-size-1-m);
    font-weight: 400;
}

@media screen and (max-width: 900px) {
    .proyectos-section .box .proyectos-cards {
        flex-wrap: wrap;
    }
    .proyectos-section .box .proyecto-card {
        max-width: 750px;
    }
    .proyectos-section .box > .content {
        flex-wrap: wrap;
    }
}
.proyectos-section .proyectos-cards-page-portafolio {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.proyectos-section .proyectos-cards-page-portafolio .project-card:first-of-type {
    background-image: var(--linear-gradient-1);
    color: var(--text-color-white-1);
}
.proyectos-section .proyectos-cards-page-portafolio .project-card .card-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: start;
    
    gap: 1rem;
}
.proyectos-section .proyectos-cards-page-portafolio .project-card .card-footer span.contract-number {
    font-size: var(--text-size-2-m);
    color: var(--secondary-color-1);
    font-weight: 700;
}
.projects-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-bottom: 2rem;
}

.pagination-container {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 3rem;
    padding: 1rem 0;
}

.pagination {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.page-numbers {
    padding: 0.5rem 1rem;
    border: 1px solid #ddd;
    text-decoration: none;
    border-radius: 4px;
    color: #333;
    transition: all 0.3s ease;
}

.page-numbers.current {
    background-color: #333;
    color: #fff;
    border-color: #333;
}

.page-numbers:hover:not(.current) {
    background-color: #f5f5f5;
}