@font-face {
	font-family: 'Yekan';
	src: url('../fonts/Yekan.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}
body {font-family: 'Yekan', sans-serif;direction: rtl;margin: 0 auto;padding: 0;color: #212121;max-width: 600px;min-height: 100vh;display: flex;flex-direction: column;padding-bottom: 150px;background: linear-gradient(135deg, #c3e6cb 0%, #e6e6fa 100%);font-size:.9rem}
a {  text-decoration: none;}
h5{font-size:1.5rem;margin:0;}
.footer {display: flex;justify-content: space-around;padding: 8px 0;background: #ffffff;position: fixed;bottom: 0;width: 100%;max-width: 600px;border-top: 1px solid #2F855A;z-index: 1000;box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);}
.footer div {display: flex;flex-direction: column;align-items: center;justify-content: center;cursor: pointer;transition: transform 0.3s, color 0.3s;width: 25%;text-align: center;}
.footer img {max-width: 100%;width: 35px;height: 35px;object-fit: contain;display: block;margin: 0 auto;}
.footer p {margin: 0;padding: 0;font-size: 0.85em;color: #121331;font-weight: 500;text-align: center;width: 100%;line-height: 1.2;}
.footer div:hover {transform: scale(1.15);}
.footer div:hover p {color: #2F855A;}
#install-banner {   position: fixed;  bottom: 68px;  left: 0;  right: 0;  background: #F5F5F5;  z-index: 1000;  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);  height: 80px;  max-width: 600px;  margin: auto;  border-radius: 5px;  overflow: hidden;}
#install-banner img { height: 70px; width: auto; object-fit: contain; display: block;}
.install-style{display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; height: 100%; padding: 0 10px;}
.install-img{flex-shrink: 0; height: 80px; width: auto; margin-left: 10px; display: flex; align-items: center;}
#install-banner button {  background-color: #af9937; color: white; padding: 12px 20px; font-size: 16px; border: none; border-radius: 8px; cursor: pointer; box-shadow: 0 4px 6px rgba(0,0,0,0.1); width: 100%;}
.ins-b{flex-grow: 1; text-align: right;}
/** Front **/
.heade img {
    border-bottom: 1px solid #264c0e;
    padding: 0;
    box-shadow: 5px 5px 5px #120606;
}
.slider {  max-width: 600px;  margin: 10px auto;  overflow: hidden;  position: relative;  padding: 10px;  background-color: #fff;  border-radius: 6px;  direction: rtl;}
.slider-container {  display: flex;  width: calc(100% * 4);   transition: transform 0.5s ease-in-out;}
.slider img {  width: calc(100% / 1);  height: auto;  flex-shrink: 0;  border-radius: 6px;  display: block;}
.slider-dots {  text-align: center;  margin-top: 12px;}
.swiper-pagination-bullet {  height: 12px;  width: 12px;  background-color: #d1d5db;  border-radius: 50%;  display: inline-block;  margin: 0 6px;  cursor: pointer;  transition: background-color 0.3s, transform 0.3s;}
.swiper-pagination-bullet-active {  background-color: #2F855A;  transform: scale(1.3);}
.content {padding: 5px 15px;text-align: center;flex: 1 0 auto;}
.grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 5px;grid-auto-rows: minmax(110px, auto);padding:0;clear:both}
.far.grid {display: grid;grid-template-columns: repeat(1, 1fr);gap: 5px;grid-auto-rows: minmax(110px, auto);padding:0;clear:both}

.grid div {background: #f7f7f7;border-radius: 8px;text-align: center;transition: background-color 0.3s;min-height: 110px;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.grid div:hover,.gridfar div:hover {background: #F4D03F;transform: translateY(-3px);}
.gridfar {    display: block;    width:100%;}
.grid img,.gridfar img,.far.grid img {    width: 100%;height:auto}
.farr{width:66%; float:right;background:#fff;margin:2% 0% 2% 1%;min-height: 110px;border-radius: 8px;background: #f7f7f7;}
.nar{width:33%;float:left;background:#fff;    margin: 2% 0% 2% 0%;min-height: 110px;border-radius: 8px;background: #f7f7f7;}
.grid p {margin: 0;font-size: 0.95em;color: #121331;font-weight: 500;}
hr {border: 0;height: 1px;background: #2F855A;margin: 25px 0;}
audio{width:100%;margin:10px auto;}