/**
 * HBREA About Page Styles
 *
 * About-specific sections only. Shared inner page styles
 * (header sticky, accent hero) are in inner-shared.css.
 *
 * @package HBREA
 * @since 1.1.0
 */

/* Mission Grid */
body.hbrea-about .hbrea-about__mission-grid { display: grid; grid-template-columns: 1fr; gap: var(--hbrea-space-12); align-items: center; }
@media (min-width: 768px) { body.hbrea-about .hbrea-about__mission-grid { grid-template-columns: 1fr 1fr; } }
body.hbrea-about .hbrea-about__mission-image { border-radius: 8px; overflow: hidden; box-shadow: var(--hbrea-shadow-lg); background: var(--hbrea-gray-200); min-height: 300px; }
body.hbrea-about .hbrea-about__mission-image img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Timeline */
body.hbrea-about .hbrea-timeline { position: relative; max-width: 800px; margin: 0 auto; }
body.hbrea-about .hbrea-timeline::before { content: ''; position: absolute; left: 20px; top: 0; bottom: 0; width: 2px; background: var(--hbrea-gray-200); }
@media (min-width: 768px) { body.hbrea-about .hbrea-timeline::before { left: 50%; transform: translateX(-50%); } }
body.hbrea-about .hbrea-timeline__item { position: relative; padding-left: 60px; padding-bottom: var(--hbrea-space-10); }
@media (min-width: 768px) {
    body.hbrea-about .hbrea-timeline__item { padding-left: 0; padding-right: 0; }
    body.hbrea-about .hbrea-timeline__item:nth-child(odd) { padding-right: calc(50% + 40px); text-align: right; }
    body.hbrea-about .hbrea-timeline__item:nth-child(even) { padding-left: calc(50% + 40px); }
}
body.hbrea-about .hbrea-timeline__item:last-child { padding-bottom: 0; }
body.hbrea-about .hbrea-timeline__dot { position: absolute; left: 12px; top: 0; width: 18px; height: 18px; background: var(--hbrea-gold); border-radius: 50%; border: 3px solid var(--hbrea-white); box-shadow: 0 0 0 2px var(--hbrea-gold); }
@media (min-width: 768px) { body.hbrea-about .hbrea-timeline__dot { left: 50%; transform: translateX(-50%); } }
body.hbrea-about .hbrea-timeline__year { font-family: var(--hbrea-font-heading); font-size: var(--hbrea-text-sm); font-weight: var(--hbrea-font-bold); color: var(--hbrea-gold); text-transform: uppercase; letter-spacing: var(--hbrea-tracking-wide); margin-bottom: var(--hbrea-space-2); display: block; }
body.hbrea-about .hbrea-timeline__title { font-family: var(--hbrea-font-heading); font-size: var(--hbrea-text-xl); font-weight: var(--hbrea-font-bold); color: var(--hbrea-navy); margin: 0 0 var(--hbrea-space-2); }
body.hbrea-about .hbrea-timeline__text { color: var(--hbrea-gray-600); line-height: var(--hbrea-leading-relaxed); margin: 0; }

/* Leadership */
body.hbrea-about .hbrea-about__leadership-section { margin-bottom: var(--hbrea-space-12); }
body.hbrea-about .hbrea-about__leadership-section:last-child { margin-bottom: 0; }
body.hbrea-about .hbrea-about__leadership-title { font-family: var(--hbrea-font-heading); font-size: var(--hbrea-text-lg); font-weight: var(--hbrea-font-bold); color: var(--hbrea-navy); text-transform: uppercase; letter-spacing: var(--hbrea-tracking-wide); margin: 0 0 var(--hbrea-space-6); padding-bottom: var(--hbrea-space-3); border-bottom: 2px solid var(--hbrea-gold); }
body.hbrea-about .hbrea-leaders-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--hbrea-space-6); }
@media (min-width: 768px) { body.hbrea-about .hbrea-leaders-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { body.hbrea-about .hbrea-leaders-grid { grid-template-columns: repeat(4, 1fr); } }
body.hbrea-about .hbrea-leader-card { text-align: center; }
body.hbrea-about .hbrea-leader-card__photo { width: 120px; height: 120px; border-radius: 50%; overflow: hidden; margin: 0 auto var(--hbrea-space-4); background: var(--hbrea-gray-200); }
body.hbrea-about .hbrea-leader-card__photo img { width: 100%; height: 100%; object-fit: cover; }
body.hbrea-about .hbrea-leader-card__name { font-family: var(--hbrea-font-heading); font-size: var(--hbrea-text-base); font-weight: var(--hbrea-font-bold); color: var(--hbrea-navy); margin: 0 0 var(--hbrea-space-1); }
body.hbrea-about .hbrea-leader-card__title { font-size: var(--hbrea-text-sm); color: var(--hbrea-gray-600); margin: 0; }

/* NAREB Pillars */
body.hbrea-about .hbrea-about__pillars-grid { display: grid; grid-template-columns: 1fr; gap: var(--hbrea-space-8); }
@media (min-width: 768px) { body.hbrea-about .hbrea-about__pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { body.hbrea-about .hbrea-about__pillars-grid { grid-template-columns: repeat(3, 1fr); } }
body.hbrea-about .hbrea-about__pillar { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); padding: var(--hbrea-space-6); border-radius: 8px; transition: background var(--hbrea-transition); }
body.hbrea-about .hbrea-about__pillar:hover { background: rgba(255, 255, 255, 0.08); }
body.hbrea-about .hbrea-about__pillar-name { font-family: var(--hbrea-font-heading); font-size: var(--hbrea-text-lg); font-weight: var(--hbrea-font-bold); color: var(--hbrea-white); margin: 0 0 var(--hbrea-space-3); }
body.hbrea-about .hbrea-about__pillar-desc { font-size: var(--hbrea-text-sm); color: var(--hbrea-gray-400); line-height: var(--hbrea-leading-relaxed); margin: 0; }
