@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/eot/IRANSansWeb_Bold.eot');
    src: url('../fonts/eot/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff2/IRANSansWeb_Bold.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/woff/IRANSansWeb_Bold.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb_Bold.ttf') format('truetype');
}
    
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/eot/IRANSansWeb.eot');
    src: url('../fonts/eot/IRANSansWeb.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff2/IRANSansWeb.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/woff/IRANSansWeb.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb.ttf') format('truetype');
}



.title1{
   
   
   background-position: top;
   width: 100%;
   /* height: 369px; */
   position: relative;
   /* background-color: #269dff; */
  font-family: IRANSans;
    display: flex;
    flex-direction: column;
    background-size: contain;

}

.title1 img{
    width: 14%;
    border-radius: 95%;
    float: left;
    margin-left: 44%;
    margin-top: 47px;
    background-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.title1 h1{
    width: 100%;
    height: 55px;
    text-align: center;
    float: right;
    color: #464646;
}
.title1 hr{
    width: 30%;
    height: auto;
    float: right;
     margin: -30px 35% 0 0; 
    margin-left: 33%;
    border-bottom: 3px solid #ffffff;
}
.title1 h4{
    width: 100%;
    height: auto;
    float: left;
    text-align: center;
    /* margin-left: 43%; */
    margin-top: 0%;
    color: #464646;
}


.main{
    width: 85%;
    float: right;
    margin-right: 6%;
    height: auto;

    background-color: #e0dfdf; 
    
}
.main .prsonality-right{
    float: right;
    /* text-align: right; */
    width: 40%;
    height: auto;
    font-family: IRANSans;

}
.main .prsonality-right ul{
    float: right;
    text-align: right;
    direction: rtl;
}
.main .prsonality-right .img-1{
    width: 100%;
    /* text-align: right; */
    float: right;
    height: auto;

}
.main .prsonality-right .img-1 i{
    width: 11%;
    float: right;
    margin-top: 0.5%;
    color: #ffffff;
    background-color: #996515;
    border: 5px solid #996515;
    font-size: 32px;
    text-align: center;

}
.main .prsonality-right .img-1 p,
.main .prsonality-right .img-1 a {
    width: 70%;
    height: auto;
    float: right;
    text-align: right;
    margin-right: 3%;
    margin-top: 1.5%;
    color: black; /* تایپی cloro رو هم درست کردم */
    text-decoration: none;
}
.main .prsonality-right .maharat {
    width: 100%;
    float: right;
    height: auto;
}
.main .prsonality-right .maharat h2{
    width: 100%;
    float: right;
    text-align: right;
    font-size: 20px;
    color: #e39a2b;

}
.main .prsonality-right .maharat hr{
    width: 90%;
    float: right;
    margin-top: -3%;
    border-bottom: 3px solid #ffffff;
}
/*.main .prsonality-right .maharat .nameOfMaharat{*/
/*    width: 100%;*/
/*    height: auto;*/
/*    float: right;*/
/*    margin-top: 2%;*/
/*}*/
/*.main .prsonality-right .maharat .nameOfMaharat p{*/
/*    width: 70%;*/
/*    float: right;*/
/*    text-align: right;*/
/*}*/
/*.main .prsonality-right .maharat .nameOfMaharat .person {*/
/*   background: #996515;*/
/*   width: 10%;*/
/*    float: left;*/
/*    transform: rotate(28deg);*/
/*    border-radius: 98%;*/
/*}*/
/*.main .prsonality-right .maharat .nameOfMaharat .person p{*/
/*    float: left;*/
/*    margin-left: 9%;*/
/*    background: white;*/
/*    border-radius: 35%;*/
/*    width: 83%;*/
/*    text-align: center;*/
    /* padding: 8px 0px; */
/*    transform: rotate(-27deg);*/
/*    background-position: center;*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/

/*}*/

//نوع دیگر بیان مهارت ها
/* فقط برای بخش قدیمی */
.main .prsonality-right .maharat.old-skills h2 {
    width: 100%;
    float: right;
    text-align: right;
    font-size: 20px;
    color: #e39a2b;
}

.main .prsonality-right .maharat.old-skills hr {
    width: 90%;
    float: right;
    margin-top: -3%;
    border-bottom: 3px solid #ffffff;
}

.skills-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 20px;
  margin-top: 72px;
}

.skill-box {
  background: linear-gradient(145deg, #fffaf5, #f1ece6);
  border-radius: 16px;
  padding: 20px;
  text-align: center;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
  border: 1px solid #eee;
}

.skill-box:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  background: linear-gradient(145deg, #fff1e0, #ffe7c7);
}

.skill-box h3 {
  font-size: 18px;
  color: #e39a2b;
  margin-bottom: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.skill-box p {
  font-size: 15px;
  color: #333;
  line-height: 1.6;
}

/* این خط باعث می‌شد روی همه h2ها اثر بذاره — حذف شد */






.main .prsonality-left{
    float: left;
    width: 50%;
    text-align: right;
    height: auto;
    font-family: IRANSans;

}
.main .prsonality-left .maharat h2,
.main .prsonality-right.maharat h2{
    width: 100%;
    float: right;
    text-align: right;
    font-size: 20px;
    color: #e39a2b;

}
.main .prsonality-left .maharat hr,
.main .prsonality-right .maharat hr{
    width: 90%;
    float: right;
    margin-top: -3%;
    border-bottom: 3px solid #ffffff;
}
.main .prsonality-left .madrak-tahsili,
.main .prsonality-right .madrak-tahsili {
    width: 100%;
    float: right;
    height: auto;
    
}

.main .prsonality-left .madrak-tahsili h3,
.main .prsonality-right .madrak-tahsili h3{
    width: 93%;
    float: right;
    text-align: right;
    margin-top: 0;
    font-size: 14px;
}

.main .prsonality-left .madrak-tahsili .project,
.main .prsonality-right .madrak-tahsili .project{
  width: 100%;
  float: right;
  margin-bottom: 15px;
}
.main .prsonality-left .madrak-tahsili .project h3,
.main .prsonality-right .madrak-tahsili .project h3{
  font-size: 18px;
  margin-bottom: 5px;
  color: #464646;
  text-align: center;
}
.en-text {
  direction: ltr;
  text-align: left;
  unicode-bidi: embed;
}
.fa-text {
  direction: rtl;
  text-align: right;
  unicode-bidi: embed;
}
.main .prsonality-left .madrak-tahsili .project .tech,
.main .prsonality-right .madrak-tahsili .project .tech{
  font-size: 16px;
  font-weight: bold;
  color: #e39a2b;
  margin-bottom: 5px;
}

.main .prsonality-left .madrak-tahsili .project .desc,
.main .prsonality-right .madrak-tahsili .project .desc{
  font-size: 14px;
  color: #000;
  line-height: 1.7;
}



.main .prsonality-left .madrak-maharat{
    width: 100%;
    float: right;
    height: auto;
}
.main .prsonality-left .madrak-maharat .ypo{
    width: 100%;
    
}
.main .prsonality-left .madrak-maharat .ypo p{
    direction: rtl;
}
.main .prsonality-left .madrak-maharat .ypo img{
    width: 7%;
    float: right;
    margin-left: 2%;
}
.main .prsonality-left .madrak-maharat h5{
    margin-top: -10px;
}
.main .prsonality-left .madrak-maharat h6{
    margin-top: -10px;
    margin-bottom: 4px;
}
.main .prsonality-left .all-circle .circle1{

    position: relative;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    float: right;
    background-color: #ccc;
    font-size: 55px;
    margin: 5px 19px;
    margin-bottom: 40px;
}
.main .prsonality-left .all-circle .circle1 span{
    color: #e39a2b;
    font-size: 12px;
    line-height: 50px;
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 5em;
    display: block;
    text-align: center;
    white-space: nowrap;
    
}





.main .prsonality-left .all-circle .circle1 .circle2{
    clip: rect(auto,auto,auto,auto);
    position: absolute;
    width: 1em;
    height: 1em;
}

.main .prsonality-left .all-circle .circle1 .circle2 .bar{
    border: 0.08em solid #e39a2b;
    transform: rotate(243deg);
    position: absolute;
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}
.main .prsonality-left .all-circle .circle1 .circle2 .fill{
    position: absolute;
    border: 0.08em solid #e39a2b;
    transform: rotate(180deg);
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}

.main .prsonality-left .all-circle .circle1 .circle3{
    clip: rect(auto,auto,auto,auto);
    position: absolute;
    width: 1em;
    height: 1em;
}
.main .prsonality-left .all-circle .circle1 .circle3 .bar{
    border: 0.08em solid #e39a2b;
    transform: rotate(216deg);
    position: absolute;
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}
.main .prsonality-left .all-circle .circle1 .circle3 .fill{
    position: absolute;
    border: 0.08em solid #e39a2b;
    transform: rotate(180deg);
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}

.main .prsonality-left .all-circle .circle1 .circle4{
    clip: rect(auto,auto,auto,auto);
    position: absolute;
    width: 1em;
    height: 1em;
}
.main .prsonality-left .all-circle .circle1 .circle4 .bar{
    border: 0.08em solid #e39a2b;
    transform: rotate(183deg);
    position: absolute;
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}
.main .prsonality-left .all-circle .circle1 .circle4 .fill{
    position: absolute;
    border: 0.08em solid #e39a2b;
    transform: rotate(180deg);
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}

.main .prsonality-left .all-circle .circle1 .circle5{
    clip: rect(auto,auto,auto,auto);
    position: absolute;
    width: 1em;
    height: 1em;
}
.main .prsonality-left .all-circle .circle1 .circle5 .bar{
    border: 0.08em solid #e39a2b;
    transform: rotate(204deg);
    position: absolute;
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}
.main .prsonality-left .all-circle .circle1 .circle5 .fill{
    position: absolute;
    border: 0.08em solid #e39a2b;
    transform: rotate(180deg);
    width: 0.84em;
    height: 0.84em;
    clip: rect(0em,0.5em,1em,0em);
    border-radius: 50%;
}








.main .prsonality-left .all-circle .circle1 .all-circle-title{
    width: 100%;
    height: auto;
    float: right;
    text-align: right;
    margin-top: 100%;
}
.main .prsonality-left .all-circle .circle1 .all-circle-title p{

    width: 100%;
    height: auto;
    float: right;
    font-size: 17px;
}


.footer-end
{
    width: 100%;
    height: auto;
    font-family: IRANSans;

}
.footer-end hr{
    float: right;
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 6%;
    border-bottom: 3px solid #ffffff;
}
/* .footer-end .end {
    float: right;
    margin-right: 40%;
    color: rgb(66, 65, 65);
}  */
.footer-end  .end{
    width: 100%;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    direction: rtl;
    margin-top: -18px;

}
.footer-end  .end p{
    float: right;
    direction: rtl;
    font-size: 20px;
    margin-right: 0.5%;

}