@media screen and (max-width: 480px) {

    
    .nav-list {
        display: flex;
        gap: 20px;
        justify-content: center;
    }
    .nav-title {
        padding-bottom: 20px;
    }
    .nav-container {
        display: block;
        padding: 20px 0px;
        text-align: center;
    }
    /* banner section */
    .banner {
        margin-top: 20px;
        text-align: center;
    }
    .banner-des {
        margin-bottom: 53px;
        font-size: 16px;
        padding: 0 0px;
    }
    .banner-img {
        margin-top: 35px;
        justify-content: center;
        padding: 10px;
    }
    .banner-title {
        padding-bottom: 25px;
        font-size: 40px;
        font-weight: 700;
        line-height: 40px;
    }

    /* section 1 */

    .section1 {
        display: flex;
        align-items: center;
        padding: 5px ;
        column-gap: 3px;
        flex-direction: column-reverse;
    }

    .sec1-title {
        text-align: center;
        margin-top: 25px;
    }
    .sec1-des {
        text-align: center;
    }
   
    .sec1-img-col {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 25px;
        margin-top: 54px;
        width: 75%;
    }

    /* section 2 */

    .section2 {
        display: block;
        padding: 50px 30px;
    }
    .sec2-info-col {
        width: 100%;
        text-align: justify;
    }
    .sec2-title {
        text-align: center;
    }

    .sec2-img-col {
        width: 100%;
        height: 720px;
        display: flex;
        align-items: flex-end;
        background-image: url(../images/architect.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        border-radius: 0px 50px;
        transition: transform .3s;
    }
    .sec2-img-col:hover {
        transform: scale(1.05);
    }

    .sec2-btn-special {
        font-size: 45px;
        font-weight: 700;
        text-align: center;
        margin: 32px 32px;
        line-height: 40px;
        padding: 45px;
        text-decoration: none;
        color: var(--white-color);
        background-color: var(--golden-color);
        border-radius: 10px;
        border: 1px solid var(--golden-color);
        transition: background-color .5s , color .5s;
    }

/* section 3 */

.section3 {
    padding: 0;
}
.sec3-des {
    width: 100%;
    text-align: center;
    padding: 0 25px;
}
.sec3-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    padding: 45px;
}

.sec3-title {
    text-align: center;
    padding: 25px;
}

.sec3-single-card {
    padding: 20px;
}

.sec3-card-info {
    padding: 0;
    font-size: 72%;
}
.sec3-card-number {
    font-size: 100%;
}

/* footer */

.footer-icons {
    display: grid;
    padding: 0;
    gap: 27px;
    grid-template-columns: 1fr 1fr;
    justify-items: center;
}
.footer-icons img{
    text-align: center;
    width: 50%;
}
.figma {
    grid-column: 1 / span 2;
}

.copyright {
    margin-top: 50px;
    padding: 0;
}

footer {
    margin-bottom: 50px;
    margin-top: 20px;
}
    
  }