*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;

    font-family:Yekan_Regular;
}

body
{
    margin:0;
}


:root {

    --yellow1: #f2c94c;      /* زرد گرم */
    --brown1: #5a3e2b;       /* قهوه‌ای تیره */
    --cream1: #faf6ef;       /* کرم */
    --gray-dark1: #3f3f3f;   /* خاکستری تیره */
    --gray-light1: #e5e5e5;  /* خاکستری روشن */
}


/*----------------------------------------------*/
h2
{
    font-size: 26px;
    margin-bottom: 50px;
    text-align:center;
    Color: var(--brown1);
}

p
{
    /*font-size: 20px;*/
    text-align: center;
    direction: rtl;
}

/*----------------------------------------------*/
.container
{
    width:100%;
    min-height:10vh;
    padding:50px 0;
    background-color:var(--cream);
}

.top-grid
{
    width:80%;
    min-height:80vh;
    margin:0 auto;

    display:grid;
    grid-auto-columns:1fr;
    grid-auto-rows:1fr;
    gap:1em;

    grid-template-areas:
        "box-1 box-2 box-2"
        "box-1 box-3 box-4"
        "box-5 box-5 box-6";
}

    .top-grid .box
    {
        color:white;
        font-weight:bold;
        border-radius:20px;
        padding:20px;

        display:flex;
        flex-direction:column;
        align-items:center;
    }

    .top-grid h2
    {
        margin-bottom: 0;
        text-align: center;
        Color: inherit;
    }

    .top-grid p
    {
        margin:auto 0;
    }

#box-1
{
    grid-area:box-1;
    background-image:url("../../Images/HomeImages/Content/4.jpg");
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
}

#box-2
{
    grid-area:box-2;
    color:var(--brick-light);
    background-color:var(--pink);
}

#box-3
{
    grid-area:box-3;
    background-color:var(--brick-light);
}

#box-4
{
    grid-area:box-4;
    background-color:var(--copper);
}

#box-5
{
    grid-area:box-5;
    background-color:var(--brick);
}

#box-6
{
    grid-area:box-6;
    background-image:url("../../Images/HomeImages/Content/3.jpg");
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
}

/*----------------------------------------------*/

.devider
{
    border-top:1px solid var(--gray-light1);
    margin:25px 0;
}
 /*----------------------------------------------*/
.speciality
{
    display:grid;
    grid-template-columns:0.5fr 1fr;
    gap:25px;
    align-items:center;
}
        .speciality img
        {
            width:100%;
            border-radius:10px;
        }

/* Categories */
/*----------------------------------------------*/

/* Belief */
/*----------------------------------------------*/
.belief {
    Background: #fff;
    Padding: 150px 10%;
    Text-align: center;
}

.belief .icon {
    Font-size: 40px;
    Color: var(--yellow1);
    Margin-bottom: 20px;
}

.belief p {
    Color: var(--gray-dark1);
    Font-size: 20px;
    Line-height: 2;
}


/*----------------------------------------------*/
.Trust
{
    width:100%;
    background-color:var(--cream1);
    padding:50px;
    text-align:center;
    font-family: Yekan_Regular;
    color:var(--gray);
}

    .Trust ul
    {
        width: 80%;
        list-style-type: none;
        display: flex;
        flex-direction: row;
        align-items: baseline;
        justify-content:space-evenly;
        flex-wrap:wrap;
        margin: 0 auto;
        margin-top:30px;
    }

        .Trust ul li
        {
            width: 100px;
            height:auto;
            text-align: center;
            margin-bottom: 10px;            
        }

            .Trust ul li img
            {
                width:80%;                
            }

            .Trust ul li p
            {
                width:100%;
            }


/*----------------------------------------- Tablet --------------------------------------*/
@media (max-width: 768px)
{

    h2
    {
        font-size: 20px;
    }

    p
    {
        font-size: 15px;
    }

/*-------------------------------------*/
    .top-grid
    {
        width: 80%;
        min-height: 80vh;
        grid-auto-columns: 1fr;
        grid-auto-rows: 1fr;
        gap: 1em;
        grid-template-areas: 
            "box-2 box-2"
            "box-1 box-1"
            "box-1 box-1"
            "box-3 box-4"
            "box-6 box-6" 
            "box-5 box-5";
    }

    /*-------------------------------------*/

    .categories,
    .why-us,
    .belief
    {
        Padding: 60px 5%;
    }

    .belief p 
    {
        Font-size: 18px;
    }
}

/*------------------------------------------- Mobile ------------------------------------*/
@media (max-width: 420px)
{

    h2
    {
        font-size: 15px;
    }

    p
    {
        font-size: 13px;
    }

    /*-------------------------------------*/

        .top-grid
    {
        width: 80%;
        min-height: 80vh;
        grid-auto-columns: 1fr;
        grid-auto-rows: 1fr;
        gap: 0.7em;
        grid-template-areas: 
            "box-2"
            "box-1"
            "box-1"
            "box-3"
            "box-4"
            "box-6" 
            "box-5";
    }

    /*-------------------------------------*/


    .categories,
    .why-us,
    .belief
    {
        Padding: 60px 5%;
    }

    .belief p 
    {
        Font-size: 18px;
    }
}