.footer {
    width: 100%;
    background: #15151E;
    position: relative;
    font-family: 'iransans';
	direction: rtl;
	font-size: 16px;
	line-height: 25px;
	margin-top: 20px;
}
.footer::before {
    content: "";
    width: 100%;
    display: block;
    height: 285px;
    background-image: url(https://www.yejayekhoob.com/mh_assets/footer/images/footer_city_d.webp);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: bottom;
    opacity: 0.3;
    position: absolute;
    bottom: 60px;
}
.footer .container {
    width: 90%;
    max-width: 1280px;
    margin: 0 auto;
}
.footer>.container {
    position: relative;
    display: grid;
    grid-template-columns: 1.2fr 0.9fr 0.9fr 2fr;
    /* grid-template-rows: 1fr 100px 70px 50px; */
    grid-template-rows: 1fr auto 100px 100px;
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    padding: 30px 0;
}
.footer>.container::before , .footer>.container::after {
    content: "";
    width: 100%;
    height: 4px;
    background: var(--priymary-color-light);
    border-radius: 0 0 20px 20px;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    overflow: hidden;
    box-shadow: 0 6px 20px 0px var(--priymary-color-light);
}
.footer>.container::after {
    box-shadow: none;
    top: unset;
    bottom: -1px;
    height: 2px;
    border-radius: 50px;
}
.div1 {
    grid-area: 1 / 1 / 2 / 4;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.div2 { 
    grid-area: 2 / 3 / 5 / 4;
    width: 100%;
}
.div3 { 
    grid-area: 2 / 2 / 5 / 3;
    width: 100%;
}
.div4 { 
    grid-area: 2 / 1 / 5 / 2;
    width: 100%;
}
.div5 {
    grid-area: 1 / 4 / 2 / 5;
    width: 100%;
    height: 135px;
    display: flex;
    flex-direction: row;
    gap: 10px;
}
.div6 {
    grid-area: 2 / 4 / 3 / 5;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.div7 {
    grid-area: 3 / 4 / 4 / 5;
    width: 100%;
}
.div7 , .div8 {
	display: flex;
    flex-direction: column;
    gap: 10px;
}
.footer__item--insta-holder {
    width: 100%;
    height: 70px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.div8 {
    grid-area: 4 / 4 / 5 / 5;
    width: 100%;
}
.footer__item--title {
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    font-size: 20px;
    color: var(--priymary-color-light);
    font-weight: 500;
}
.footer__item--title img {
    width: 15px;
    height: auto;
	display: flex;
}
.footer__item--desc {
    color: var(--gray);
    font-weight: 200;
    font-size: 16px;
    line-height: 30px;
    text-align: justify;
}
.footer__item--ul {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-top: 20px;
}
.footer__item--li {
    list-style: none;
    transition: all .3s ease;
    position: relative;
}
.footer__item--li a {
    color: var(--gray);
    font-size: 16px;
    font-weight: 200;
    transition: all .3s ease;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
}
.footer__item--li::before {
    content: "";
    transition: all .5s ease;
    position: absolute;
    bottom: calc(50% - 3px);
    right: -5px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
}
.footer__item--li:hover {
    padding-right: 10px;
}
.footer__item--li:hover::before {
    max-width: 100%;
    background: var(--priymary-color-light);
}
.news .footer__item--li:hover {
    padding-right: 0;
}
.news .footer__item--li::before {
	display: none;
}
.footer__item--li-icon{
	width: 20px;
	height: auto;
	filter: var(--filter-gray-light);
	transition: all .3s ease;
}
.news .footer__item--li:hover .footer__item--li-icon {
	filter: var(--filter-white);
	margin-left: 5px;
}
.footer__item--li:hover a {
    color: var(--tertiary-color);
}
.footer__item--support {
    display: flex;
    flex-direction: column;
    gap: 10px;
    color: var(--gray);
    background: #ffffff10;
    padding: 10px;
    border-radius: var(--radius-big);
    width: 100%;
    text-wrap: nowrap;
}
.footer__item--phone {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.footer__item--phone a {
    height: 40px;
    border: 1px solid var(--priymary-color-light);
    border-radius: var(--radius-big);
    background: #60A7FF20;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    letter-spacing: 1px;
    padding: 10px;
}
.footer__item--phone a span {
    color: var(--gray);
    font-weight: 600;
    height: 20px;
    transition: all .3s ease;
	display: flex;
    align-items: center;
}
.footer__item--phone a:hover span {
    color: var(--priymary-color-light);
}
.footer__item--phone img {
    filter: var(--filter-priymary-color);
    width: 20px;
    height: auto;
}
.footer__item--enamad {
    background: var(--white);
    border-radius: var(--radius-big);
    overflow: hidden;
    width: 30%;
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.footer__item--trust_logo {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: visible;
    border-radius: var(--radius-big);
}
.footer__item--trust_logo::before {
    content: "";
    position: absolute;
    top: -15px;
    right: calc(50% - 10px);
    width: 20px;
    height: 3px;
    background: var(--priymary-color-light);
    border-radius: 20px;
    box-shadow: 0 5px 20px 2px #60A7FF;
}
.footer__item--trust_logo img {
    background: var(--white);
    border-radius: var(--radius-big);
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.footer__item--instagram_caption {
    width: 51%;
    background: #60A7FF20;
    height: 90%;
    border-radius: var(--radius-big);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    color: var(--tertiary-color);
	gap: 5px;
}

.footer__item--instagram_link {
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 100%;
    background: linear-gradient(311deg, #FCA642, #F1202C, #8938AC);
    border-radius: var(--radius-large);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 30px;
    padding: 10px;
    color: var(--tertiary-color);
    font-size: 30px;
    font-weight: bold;
    transition: all .3s ease;
    text-wrap: nowrap;
}
.footer__item--insta-holder:hover .footer__item--instagram_link {
    scale: 1.02;
    box-shadow: 0 0 15px 1px #00000080;
}
.footer__item--instagram_link img {
    filter: var(--filter-white);
    width: 60px;
    height: 60px;
}
.footer__item--instagram_link span {
    direction: ltr;
	height: 33px;
    font-family: sans-serif;
	display: flex;
    align-items: center;
	justify-content: center;
}
.footer__item--location_icon {
    height: 40px;
    width: 40px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--priymary-color-light);
    border-radius: var(--radius-big);
    background: #60A7FF30;
}
.footer__item--location_icon img {
    width: 15px;
    height: auto;
    filter: var(--filter-priymary-color);
}
.footer__item--location_title {
    color: var(--gray);
}
.footer__item--tags {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px;
    padding-top: 20px;
    max-height: 90%;
    align-items: flex-start;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--priymary-color-light) transparent;
}
.footer__item--tags::-webkit-scrollbar {
    width: 3px;
    background: transparent;
}

.footer__item--tags::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: var(--priymary-color-light);
}

.footer__item--tags::-webkit-scrollbar-track {
    background: transparent;
}
.footer__item--tag {
    color: var(--tertiary-color);
    font-size: 14px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px;
    transition: all .3s ease;
    text-wrap: wrap;
}
.footer__item--tag:hover {
    color: var(--priymary-color-light);
}
.footer__item--tag::before {
    content: "";
    width: 15px;
    height: 15px;
    background: url(https://www.yejayekhoob.com/Libraries/svg/hashtag.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    filter: var(--filter-priymary-color);
}
.footer__law {
    background: #000000;
    width: 100%;
    height: 60px;
    position: relative;
}
.footer__law>.container {
    height: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.footer__law--desc {
    color: var(--gray-bright);
    font-size: 14px;
}
.footer__law--social {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}
.footer__law--social a {
    position: relative;
    overflow: hidden;
    height: 40px;
    width: 40px;
}
.footer__law--social img {
    transition: all .3s ease;
    position: absolute;
}
.footer__law--befor_img , .footer__law--after_img {
    width: 100%;
    height: 100%;
}
.footer__law--befor_img {
    filter: grayscale(1) contrast(0.5) brightness(1);
    top: 0;
}
.footer__law--after_img {
    top: 100%;
}
.footer__law--social a:hover .footer__law--befor_img {
    top: -100%;
}
.footer__law--social a:hover .footer__law--after_img {
    top: 0;
}
.footer__item--social{
	display: none;
}
.instagram_title {
	/* font-size: 16px;
	color: var(--tertiary-color); */
	font-size: 16px;
    color: var(--tertiary-color);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
}
.footer__item--instagram_caption img{
	width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #fff;
}
.hidden_checkbox {
	display: none;
}

/* RESPONCIVE */
@media (max-width: 1024px){
    .footer>.container {
        grid-template-columns: repeat(6, 1fr);
        /* grid-template-rows: 140px 200px 135px 70px; */
        grid-template-rows: 140px 200px 135px auto;
    }
    .div1 { grid-area: 1 / 1 / 2 / 7; }
    .div2 { grid-area: 2 / 1 / 3 / 3; }
    .div3 { grid-area: 2 / 3 / 3 / 5; }
    .div4 { grid-area: 2 / 5 / 3 / 7; }
    .div5 { grid-area: 3 / 1 / 4 / 4; height: 130px;}
    .div6 { grid-area: 4 / 1 / 5 / 4; }
    .div7 { grid-area: 3 / 4 / 4 / 7; }
    .div8 { grid-area: 4 / 4 / 5 / 7; }
    .div2 , .div3 , .div4 {
        text-align: center;
    }
    .div2 .footer__item--title , .div3 .footer__item--title , .div4 .footer__item--title , .footer__item--tags{
        justify-content: center; 
        text-wrap: nowrap; 
    }
    .div2 .footer__item--title::after , 
    .div2 .footer__item--title::before ,
    .div3 .footer__item--title::after , 
    .div3 .footer__item--title::before ,
    .div4 .footer__item--title::after , 
    .div4 .footer__item--title::before {
        content: "";
        height: 1px;
        background: linear-gradient(to right , transparent , var(--tertiary-color));
        width: 100%;    
        width: -moz-available;
        width: -webkit-fill-available;
        width: stretch;
        width: fill-available;
    }
    .div2 .footer__item--title::before ,
    .div3 .footer__item--title::before ,
    .div4 .footer__item--title::before {
        background: linear-gradient(to left , transparent , var(--tertiary-color));
    }
    .footer__law--social {
        gap: 10px;
    }
	.footer__item--li a {
		justify-content: center;
	}
}
@media (max-width: 992px){
    .footer__item--instagram_link {
        gap: 10px;
    }
    .footer__item--support {
        font-size: 14px;
    }
}
@media (max-width: 800px){
    .footer__law>.container {
        flex-direction: column-reverse;
        gap: 20px;
    }
    .footer__law {
        height: auto;
        padding: 10px 0;
    }
    .footer>.container {
        grid-template-columns: 1fr;
        /* grid-template-rows: repeat(4, 1fr) 130px 170px 70px 50px; */
        grid-template-rows: auto;
    }
    .div1 { grid-area: 1 / 1 / 2 / 2; }
    .div2 { grid-area: 2 / 1 / 3 / 2; }
    .div3 { grid-area: 3 / 1 / 4 / 2; }
    .div4 { grid-area: 4 / 1 / 5 / 2; }
    .div5 { grid-area: 5 / 1 / 6 / 2; }
    .div6 { grid-area: 6 / 1 / 7 / 2; }
    .div7 { grid-area: 7 / 1 / 8 / 2; }
    .div8 { grid-area: 8 / 1 / 9 / 2; }
    .footer__law--social {
        width: 100%;
        justify-content: space-between;
    }
    .footer__law--desc {
        text-align: center;
    }
    .footer__item--instagram_link {
        gap: 0;
    }
    .footer__item--instagram_link span {
        width: 100%;
        text-align: center;
    }
    .footer::before {
        height: 180px;
        background-image: url(https://www.yejayekhoob.com/mh_assets/footer/images/footer_city_m.webp);
        bottom: 102px;
    }
    .footer__item--li::before {
        display: none;
    }
    .footer__item--li:hover {
        padding-right: 0;
    }
    .footer__item--li:hover a {
        color: var(--gray);
    }
    .footer__item--li:active a {
        color: var(--tertiary-color);
        text-shadow: 0 0 10px var(--tertiary-color);
    }
	.footer__item--li a {
		justify-content: center;
	}
	.footer__item label.footer__item--title span {
		display: flex;
		align-items: center;
		gap: 8px;
	}
	.footer__item label.footer__item--title span:after {
		content: "";
		width: 18px;
		height: 18px;
		background: url(https://www.yejayekhoob.com/Libraries/svg/angle-down.svg);
		background-size: 100%;
		background-repeat: no-repeat;
		background-position: center;
		filter: var(--filter-priymary-color);
		transition: all .3s ease;
	}
	.footer__item--tags , .footer__item--ul.news {
		/* max-height: 0; */
		overflow: hidden;
		transition: all .3s ease;
	}
	.footer__item .hidden_checkbox:checked ~ .footer__item--tags , .footer__item .hidden_checkbox:checked ~ .footer__item--ul.news {
		max-height: 400px;
	}
	.footer__item .hidden_checkbox:checked + label.footer__item--title span:after {
		transform: rotateX(180deg);
	}
	/* ============== */
	.footer>.container {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: unset;
    }
	.div1 {
        grid-area: 1 / 1 / 2 / 3;
    }
	.div2 {
        grid-area: 2 / 1 / 2 / 1;
		position: relative;
    }
	.div3 {
        grid-area: 2 / 2 / 3 / 2;
		position: relative;
    }
	.div4 {
        grid-area: 4 / 1 / 5 / 3;
		position: relative;
    }
	.div5 {
        grid-area: 5 / 1 / 6 / 3;
    }
	.div6 {
        grid-area: 6 / 1 / 7 / 3;
    }
	.div7 {
        grid-area: 7 / 1 / 8 / 3;
    }
	.div8 {
        grid-area: 8 / 1 / 9 / 3;
    }

	.div2 .footer__item--title::before {
		content: unset;
    }
	.div3 .footer__item--title::before {
		content: unset;
    }
	.div4 .footer__item--title::before {
		content: unset;
    }
	.footer__item--tags {
		max-height: unset;
	}
	.div2::before , .div3::before , .div4::before {
		content: "";
		width: 100%;
		height: 1px;
		position: absolute;
		top: 0;
		right: 0;
		background: linear-gradient(to right, transparent, #fff, transparent);
	}
	.div2 .footer__item--title , .div3 .footer__item--title , .div4 .footer__item--title {
		display: none;
    }
	.div3 .footer__item--li-icon {
		display: none;
	}
}
@media (max-width: 700px) {
    .footer::before {
        bottom: 120px;
    }
	.footer__law--befor_img {
		filter: unset;
		top: 0;
	}
}
@media (max-width: 480px) {
    
	.footer__item--li a {
    	font-size: 14px;
	}
    .footer__item--instagram_link img {
        width: 40px;
        height: 40px;
    }
    .footer__item--instagram_link span {
        font-size: 24px;
        height: 30px;
    }
    .footer__item--insta-holder {
        height: 55px;
    }
    .div5 {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
    }
    .footer__item--support {
        font-size: 16px;
        width: 100%;
    }
    .footer__item--enamad {
        width: 100%;
    }
    .div6 {
        margin-top: 10px;
    }
	.footer__law--social{
		display: none;
	}
	.footer__item--social .footer__law--social {
		display: flex;
	}
	.footer__item--social {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 20px;
        color: var(--tertiary-color);
        margin-bottom: 10px;
    }
	.footer__law--social a {
		width: 15%;
	}
	.footer__item--instagram_caption {
    	width: 61%;
		font-size: 16px;
	}
	.footer__item--instagram_link {
    	width: 40%;
	}
	.footer::before {
        bottom: 60px !important;
    }	
	.footer__item--enamad {
		justify-content: flex-start;
	}
}
@media (max-width: 350px) {
    .footer::before {
        bottom: 140px;
    }
}
@media (max-width: 320px) {
    .footer__item--instagram_link span {
        font-size: 20px;
        height: 20px;
    }
}