/* ======================================================
   ABOUT SECTION
====================================================== */

.about-section{
width:100%;
padding:30px 20px;
}

.about-title{
text-align:center;
font-size:2rem;
margin-bottom:40px;
color:var(--violet);
}


/* ======================================================
   ABOUT CARD
====================================================== */

.about-card{

width:min(1000px,92vw);
margin:0 auto 30px auto;

background:#151533;

border-radius:16px;

border:1px solid rgba(182,107,255,.18);

box-shadow:0 6px 24px rgba(0,0,0,.25);

padding:clamp(18px,3vw,32px);

}


/* ======================================================
   CARD LAYOUT
====================================================== */

.about-inner{

display:grid;
grid-template-columns:220px 1fr;

gap:24px;

align-items:center;

direction:ltr;

}

.about-inner-reverse{
direction:rtl;
}


/* ======================================================
   PHOTO / ICON AREA
====================================================== */

.about-photo-wrap{
display:flex;
justify-content:center;
}


/* الصورة */

.about-photo{

width:180px;
height:180px;

border-radius:20px;

object-fit:cover;

border:2px solid rgba(182,107,255,.3);

box-shadow:0 4px 12px rgba(0,0,0,.3);

}


/* أيقونة */

.about-icon{

width:180px;
height:180px;

display:flex;
align-items:center;
justify-content:center;

border-radius:20px;

border:2px solid rgba(182,107,255,.3);

background:#151533;

font-size:60px;

color:#b66bff;

box-shadow:0 6px 18px rgba(0,0,0,.35);

}

/* Glow للأيقونة */

.about-icon i{
filter:drop-shadow(0 0 8px rgba(182,107,255,.6));
}


/* ======================================================
   TEXT AREA
====================================================== */

.about-text{
direction:rtl;
text-align:right;
}

.about-name{
font-size:1.8rem;
font-weight:800;
margin-bottom:10px;
}

.about-bio{
font-size:1rem;
line-height:1.8;
color:#ccc;
}


/* ======================================================
   ACHIEVEMENTS SECTION
====================================================== */

.azhar-achievements{
margin-top:60px;
}

.achievements-title{
margin-top:60px;
margin-bottom:35px;
}


/* ======================================================
   ICON ANIMATION
====================================================== */

.floating-icon{
animation: floatIcon 3.5s ease-in-out infinite;
}

@keyframes floatIcon{

0%{
transform:translateY(0);
}

50%{
transform:translateY(-10px);
}

100%{
transform:translateY(0);
}

}


/* ======================================================
   ALTERNATE CARD (ICON LEFT / RIGHT)
====================================================== */

.icon-left .about-inner{
direction:ltr;
}

.icon-left .about-text{
direction:rtl;
text-align:right;
}


/* ======================================================
   MOBILE RESPONSIVE
====================================================== */

@media (max-width:768px){

.about-inner{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
direction:rtl;
}

.about-inner-reverse{
flex-direction:column;
}

.icon-left .about-inner{
flex-direction:column;
}

.about-text{
text-align:center;
}

}
/* الكلمات المهمة */

.highlight{
color:#FFD54A;
font-weight:600;
}


/* حركة أيقونات الإنجازات */

.floating-icon{
animation: floatIcon 3s ease-in-out infinite;
}

@keyframes floatIcon{

0%{
transform:translateY(0);
}

50%{
transform:translateY(-12px);
}

100%{
transform:translateY(0);
}

}


/* تحسين شكل البطاقة */

.about-card{
transition:all .3s ease;
}

.about-card:hover{

transform:translateY(-6px);

box-shadow:0 10px 30px rgba(0,0,0,.4);

border:1px solid rgba(182,107,255,.35);

}


/* Glow للأيقونات */

.about-icon i{
filter:drop-shadow(0 0 8px rgba(182,107,255,.7));
}
.highlight{
color:#FFD54A;
font-weight:600;
text-decoration:none;
}

/* الروابط تكون أوضح */

a.highlight{
font-weight:900;
}

/* تأثير بسيط عند الهوفر */

a.highlight:hover{
text-shadow: #ccc 0px 0px 4px;
}