/* ABOUT.CSS - Elite Enterprises */
.about-hero {
  background: var(--bg-dark); padding: 180px 0 100px; text-align: center; position: relative; overflow: hidden;
}
.about-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 100%, rgba(201, 162, 39, 0.1), transparent 50%); }
.about-hero h1 { margin-bottom: 25px; }
.about-hero p { max-width: 800px; margin: 0 auto; color: var(--text-secondary); font-size: 1.1rem; }

.story-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.story-image { position: relative; }
.story-image::before { content: ''; position: absolute; inset: 0; border: 1px solid var(--accent); transform: translate(15px, 15px); z-index: -1; }
.story-image img { width: 100%; border: 1px solid var(--border-light); filter: grayscale(20%); }

.mission-vision { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 80px; }
.mv-box { background: var(--bg-soft); padding: 60px; border: 1px solid var(--border-dark); position: relative; }
.mv-box::before { content: ''; position: absolute; top: 0; left: 0; width: 3px; height: 100%; background: var(--accent); }

.leadership-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-top: 60px; }
.leader-card { background: var(--bg-soft); padding: 50px 30px; text-align: center; border: 1px solid var(--border-dark); transition: var(--transition-smooth); }
.leader-card:hover { border-color: var(--accent); transform: translateY(-10px); }
.leader-initials { width: 90px; height: 90px; border: 1px solid var(--accent); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; font-family: var(--font-heading); font-size: 1.8rem; color: var(--accent); position: relative; }
.leader-initials::before { content: ''; position: absolute; inset: 4px; border: 1px dashed var(--accent); border-radius: 50%; animation: spinSlow 20s linear infinite; }
.leader-role { color: var(--text-muted); font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
@media (max-width: 1024px) { .story-grid, .mission-vision, .leadership-grid { grid-template-columns: 1fr; } }
