/* ═══════════════════════════════════════════════════
   about.css
═══════════════════════════════════════════════════ */
/* ── ABOUT SECTION ── */
.about-section { 
  padding: 90px 5%; 
  max-width: 1100px; 
  margin: 0 auto; 
  display: grid; 
  grid-template-columns: 350px 1fr; 
  gap: 60px; 
  align-items: start; 
}

/* Left Profile Image */
.about-image-col { text-align: center; position: sticky; top: 100px; }
.about-avatar-wrap { position: relative; margin: 0 auto 30px; width: 220px; height: 220px; }
.about-avatar-ring { position: absolute; inset: -12px; border-radius: 50%; border: 2px dashed var(--gold); animation: spin-ring 30s linear infinite; opacity: 0.5; }
.about-avatar-glow { position: absolute; inset: -6px; border-radius: 50%; animation: gold-glow-pulse 3s ease-in-out infinite; }
.about-avatar { width: 100%; height: 100%; border-radius: 50%; border: 4px solid var(--gold); background: var(--navy-light); display: flex; align-items: center; justify-content: center; overflow: hidden; font-size: 5rem; position: relative; box-shadow: var(--shadow-lg); z-index: 2; }
.about-avatar img { width: 100%; height: 100%; object-fit: cover; }
.contact-links { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; }
.contact-btn { padding: 12px; border-radius: 8px; background: var(--white); border: 1px solid var(--grey-200); color: var(--navy); font-weight: 600; text-decoration: none; transition: 0.2s; box-shadow: var(--shadow-sm); }
.contact-btn:hover { border-color: var(--gold); color: var(--gold); transform: translateY(-2px); }

/* Right Content */
.about-name { font-size: 2.4rem; color: var(--navy); margin-bottom: 8px; }
.about-role { font-family: var(--font-alt); font-size: 1.1rem; color: var(--gold); font-weight: 600; margin-bottom: 30px; letter-spacing: 0.5px; }
.about-text { font-size: 1.05rem; color: var(--grey-600); line-height: 1.8; margin-bottom: 24px; }

.mission-box { background: var(--white); border-left: 4px solid var(--gold); padding: 30px; border-radius: 0 12px 12px 0; box-shadow: var(--shadow-sm); margin: 40px 0; }
.mission-box h3 { font-size: 1.4rem; color: var(--navy); margin-bottom: 12px; }
.mission-box p { font-size: 0.95rem; color: var(--grey-600); line-height: 1.7; }

/* Stats Row */
.about-stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 40px; }
.about-stat-badge { background: var(--white); border: 1px solid var(--grey-200); border-radius: 12px; padding: 24px 16px; text-align: center; box-shadow: var(--shadow-sm); transition: 0.2s; }
.about-stat-badge:hover { border-color: var(--gold); transform: translateY(-3px); }
.about-stat-badge .val { display: block; font-family: var(--font-display); font-size: 1.8rem; font-weight: 800; color: var(--navy); margin-bottom: 5px; }
.about-stat-badge .lbl { font-size: 0.8rem; color: var(--grey-600); font-weight: 500; text-transform: uppercase; letter-spacing: 1px; }

/* Responsive */
  @media (max-width: 900px) { 
    .about-section { grid-template-columns: 1fr; gap: 40px; }
    .about-image-col { position: relative; top: 0; }
  }
  @media (max-width: 600px) { 
    .about-stats-row { grid-template-columns: 1fr; } 
  }