* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline-style: none;
}

html {
    font-size: 12px;
    color: #000;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

:root {
    --txtaccent: #fff;
    --txtaccent1: #FAF6F0;
    --textaccent2: #4A443D;
    --textaccent3: #8A8278;
    --haccent: #E9B384;
    --haccent_withOpacity: rgba(233, 179, 132, 0.6);
    --haccent2: #D9C7A9;
    --bgaccent: #1A1C27;
    --bgaccent_withOpacity: rgba(26, 28, 39, 0.96);
}

.container {
    width: 95%;
    margin: 0 auto;
    padding: 0;
}

/* SECTION ZERO = LANDING VIEW */
#sec-0 {
    position: relative;
}

/* 伪元素：单独承载背景图 + 高斯模糊 */
#sec-0::before {
    content: "";
    position: absolute;
    inset: 0; /* 铺满父容器 */
    /* 你的原图配置，删掉黑色渐变遮罩 */
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../Images/banner.jpg) no-repeat center center/cover;
    filter: blur(4px); /* 高斯模糊数值自行调整 */
    transform: scale(1.1); /* 放大消除模糊四周白边 */
    z-index: -1; /* 放到最底层，文字在上方 */
}

#sec-0 article {
    display: flex;
    align-items: center;
    text-align: center;
    padding: 6rem 0;
}

#sec-0 article h1 {
    font-size: 2.4rem;
    color: #FFFFFF;
    margin-bottom: 2rem;
    font-weight: 900;
}

#sec-0 article h2 {
    font-size: 1.4rem;
    color: var(--txtaccent1);
    font-weight: 400;
}

/* SECTION 3 = Our Services */
#sec-3 {
    background-color: var(--txtaccent);
    padding-top: 30px;
    padding-bottom: 30px;
}

#sec-3 h1 {
    text-transform: uppercase;
    font-size: 2.4rem;
    margin-bottom: 32px;
    text-align: center;
    color: var(--haccent);
    font-weight: 700;
}

#sec-3 .cont {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: column;
    align-content: space-around;
}

#sec-3 .card {
    width: 90%;
    margin-bottom: 30px;
}

#sec-3 .card p {
    text-align: justify;
    word-break: break-all;
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    color: var(--textaccent3);
}

#sec-3 .card h2 {
    text-transform: uppercase;
    font-size: 1.8rem;
    color: var(--textaccent2);;
    font-weight: 500;
}

#sec-3 .card h4 {
    text-transform: uppercase;
    font-size: 1.4rem;
    color: var(--textaccent3);
    font-weight: 500;
}

#sec-3 .card > div {
    position: relative;
}

/* SECTION 4 */
#sec-4 {
    background: linear-gradient(rgba(78, 76, 70, 0.8), rgba(78, 76, 70, 0.8)), url(../Images/bg2.jpg) no-repeat center center/cover;
    text-align: center;
    padding-top: 2rem;
    padding-bottom: 4rem;
}

#sec-4 h1 {
    text-transform: uppercase;
    font-size: 1.7rem;
    margin-bottom: 1.6rem;
    color: var(--txtaccent);
    font-weight: 800;
}

#sec-4 p {
    color: var(--txtaccent);
    font-size: 0.9rem;
    padding: 0 6rem;
    margin-bottom: 2rem;
}

#sec-4 .cont {
    width: 90%;
    margin: 0 auto;
}

#sec-4 .cont > img {
    width: 100%;
    display: block;
    margin: 0 auto 20px;
}

#sec-4 aside {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

#sec-4 aside img {
    margin-bottom: 10px;
    width: 48%;
}

/* SECTION SEVEN */
#sec-7 {
    background-color: var(--txtaccent);
    padding: 20px 0 10px;
    text-align: center;
    font-size: 0.7rem;
}

#sec-7 p {
    color: var(--bgaccent);
}

#sec-7 p span {
    color: var(--bgaccent);
}

/*MEDIA QUERRIES*/
/*Smart phones */
@media (min-width: 576px) {
    html {
        font-size: 13px;
    }

    .container {
        width: 520px;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    html {
        font-size: 14px;
    }

    .container {
        width: 720px;
    }

    #sec-0 article {
        padding: 12rem 0;
    }

    #sec-0 article h1 {
        font-size: 3.2rem;
    }

    #sec-0 article h2 {
        font-size: 1.8rem;
    }

    #sec-3 {
        padding-top: 40px;
        padding-bottom: 50px;
    }

    #sec-3 .cont {
        flex-direction: row;
    }

    #sec-3 .card {
        width: 48%;
    }

    #sec-3 .card:last-child {
        margin-left: auto;
        margin-right: auto;
    }

    #sec-4 .cont {
        width: 100%;
        margin: 0;
    }

    #sec-4 aside img {
        margin-bottom: 15px;
        width: 48%;
    }
}

/* Standard PC screens */
@media (min-width: 1200px) {
    html {
        font-size: 15px;
    }

    .container {
        width: 1140px;
    }

    #sec-3 {
        padding-top: 70px;
        padding-bottom: 60px;
    }

    #sec-3 .card {
        width: 31%;
    }

    #sec-3 .card:last-child {
        margin-left: 0;
        margin-right: 0;
    }

    #sec-4 .cont {
        display: flex;
        flex-flow: row wrap;
        justify-content: space-between;
    }

    #sec-4 .cont > img {
        width: 50%;
        margin: 0;
    }

    #sec-4 aside {
        display: flex;
        flex-flow: row wrap;
        justify-content: space-between;
        width: 49%;
        gap: 10px;
    }

    #sec-4 aside img {
        width: 49%;
        margin: 0;
    }
}

@media (min-width: 1400px) {
    html {
        font-size: 17px;
    }

    .container {
        width: 1340px;
    }
}

/* END OF SHEET */