/* =============================================================
   ABOUT — page-about.php (.abx-*)
   Enqueued solo is_page_template('page-about.php')
   ============================================================= */

.abx-eyebrow {
    display: inline-block;
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .2em;
    color: var(--mpg-gold);
    margin-bottom: var(--space-sm);
}
.abx-eyebrow--light { color: var(--mpg-cream); opacity: .9; }

.abx-h2 {
    font-size: clamp(2.6rem, 4vw, 3.8rem);
    margin-bottom: var(--space-md);
}
.abx-prose {
    font-size: 1.6rem;
    line-height: 1.7;
    color: var(--mpg-text-muted);
    margin-bottom: var(--space-md);
}

.abx-container {
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--container-pad);
}
.abx-section { padding: var(--space-xl) 0; }
.abx-section--bg { background: var(--mpg-cream); }
.abx-section--surface { background: var(--mpg-cream-alt); }

.abx-head { max-width: 68rem; margin-bottom: var(--space-xl); }
.abx-head--center { margin-inline: auto; text-align: center; }
.abx-head__sub { font-size: 1.6rem; color: var(--mpg-text-muted); margin-top: var(--space-sm); }

/* ── HERO ── */
.abx-hero {
    position: relative;
    min-height: 52rem;
    display: flex;
    align-items: center;
    background: var(--mpg-dark-green-2) center/cover no-repeat;
}
.abx-hero__scrim { position: absolute; inset: 0; background: var(--mpg-scrim-hero); }
.abx-hero__content {
    position: relative; z-index: 1;
    max-width: 78rem;
    margin-inline: auto;
    text-align: center;
    padding: var(--space-xl) var(--container-pad);
}
.abx-hero__title {
    font-family: var(--font-heading);
    color: var(--mpg-text-on-dark);
    font-size: clamp(3rem, 5.5vw, 5rem);
    line-height: 1.15;
    margin-bottom: var(--space-md);
}
.abx-hero__sub {
    font-size: 1.7rem;
    color: var(--mpg-text-on-dark-muted);
    line-height: 1.6;
}

/* ── STORY (img + body) ── */
.abx-story {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-lg);
    align-items: center;
}
.abx-story__img {
    aspect-ratio: 4/3;
    border-radius: var(--mpg-radius-card);
    background: var(--mpg-sand) center/cover no-repeat;
}
.abx-story__body .abx-btn { margin-top: var(--space-sm); }

/* ── MISSION (body + img, reversed order on desktop) ── */
.abx-mission {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-lg);
    align-items: center;
}
.abx-mission__img {
    aspect-ratio: 4/3;
    border-radius: var(--mpg-radius-card);
    background: var(--mpg-sand) center/cover no-repeat;
}

/* ── BUTTONS (.abx-btn) ── */
.abx-btn {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    padding: 1.3rem 2.6rem;
    border-radius: var(--mpg-radius-pill);
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
}
.abx-btn:hover { transform: translateY(-2px); box-shadow: var(--mpg-shadow-card); }
.abx-btn--blue,
.abx-btn--primary { background: var(--mpg-grad-gold-135); color: var(--mpg-dark-green); }
.abx-btn--glass { background: rgba(246,241,230,.14); color: var(--mpg-cream); border: 1.5px solid rgba(246,241,230,.4); }
.abx-btn--glass:hover { background: rgba(246,241,230,.24); }
.abx-btn svg,
.abx-btn .macglo-ic { width: 1.7rem; height: 1.7rem; }

/* ── MILESTONES (timeline horizontal) ── */
.abx-timeline {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    position: relative;
    padding-left: var(--space-lg);
    border-left: 2px solid var(--mpg-sand);
}
.abx-timeline__item {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .4rem;
}
.abx-timeline__item::before {
    content: '';
    position: absolute;
    left: calc(-1 * var(--space-lg) - 6px);
    top: .3rem;
    width: 1.2rem; height: 1.2rem;
    border-radius: 50%;
    background: var(--mpg-gold);
    border: 3px solid var(--mpg-cream);
    box-shadow: 0 0 0 2px var(--mpg-gold);
}
.abx-timeline__year {
    font-family: var(--font-heading);
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--mpg-forest);
}
.abx-timeline__label { font-size: 1.4rem; color: var(--mpg-text-muted); }

/* ── TEAM ── */
.abx-team {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-lg);
}
.abx-member {
    background: var(--mpg-cream-light);
    border: 1px solid var(--mpg-sand);
    border-radius: 1.2rem;
    overflow: hidden;
    transition: transform var(--transition), box-shadow var(--transition);
}
.abx-member:hover { transform: translateY(-4px); box-shadow: var(--mpg-shadow-card); }
.abx-member__photo,
.abx-member__photo--placeholder {
    aspect-ratio: 1/1;
    background: var(--mpg-sand) center/cover no-repeat;
    display: flex; align-items: center; justify-content: center;
}
.abx-member__photo--placeholder { background: linear-gradient(135deg, var(--mpg-sand), var(--mpg-cream-alt)); color: var(--mpg-text-muted); }
.abx-member__photo-icon { width: 4rem; height: 4rem; }
.abx-member__body { padding: var(--space-md); }
.abx-member__name { font-size: 1.7rem; margin-bottom: .3rem; }
.abx-member__role {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--mpg-gold);
    margin-bottom: var(--space-sm);
}
.abx-member__bio { font-size: 1.4rem; color: var(--mpg-text-muted); line-height: 1.6; }

/* Miembro líder (CEO / Fundadora) — tarjeta destacada a ancho completo */
.abx-member--lead {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr;
    background: var(--mpg-forest);
    border-color: var(--mpg-forest);
    color: var(--mpg-cream-light);
}
.abx-member--lead .abx-member__photo,
.abx-member--lead .abx-member__photo--placeholder { aspect-ratio: 4/3; }
.abx-member--lead .abx-member__body { padding: var(--space-lg); }
.abx-member--lead .abx-member__name { font-size: 2.4rem; color: var(--mpg-cream-light); }
.abx-member--lead .abx-member__role { color: var(--mpg-gold-light, var(--mpg-gold)); }
.abx-member--lead .abx-member__bio { font-size: 1.55rem; color: rgba(246, 241, 230, .82); }

/* ── VALUES ── */
.abx-values {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-lg);
}
.abx-value {
    text-align: center;
    padding: var(--space-lg);
    background: var(--mpg-cream-light);
    border: 1px solid var(--mpg-sand);
    border-radius: 1.2rem;
}
.abx-value__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 5.6rem; height: 5.6rem;
    border-radius: 50%;
    background: var(--mpg-cream-alt);
    color: var(--mpg-forest);
    margin-bottom: var(--space-md);
}
.abx-value__icon svg,
.abx-value__icon .macglo-ic { width: 2.6rem; height: 2.6rem; }
.abx-value__title { font-size: 1.7rem; margin-bottom: .6rem; }
.abx-value__text { font-size: 1.4rem; color: var(--mpg-text-muted); line-height: 1.6; }

/* ── CTA ── */
.abx-cta {
    position: relative;
    min-height: 42rem;
    display: flex;
    align-items: center;
    background: var(--mpg-dark-green-2) center/cover no-repeat;
}
.abx-cta__scrim { position: absolute; inset: 0; background: var(--mpg-scrim-hero); }
.abx-cta__content {
    position: relative; z-index: 1;
    max-width: 74rem;
    margin-inline: auto;
    text-align: center;
    padding: var(--space-xl) var(--container-pad);
}
.abx-cta__headline {
    font-family: var(--font-heading);
    color: var(--mpg-text-on-dark);
    font-size: clamp(2.6rem, 4.6vw, 4rem);
    margin-bottom: var(--space-md);
}
.abx-cta__sub {
    font-size: 1.6rem;
    color: var(--mpg-text-on-dark-muted);
    margin-bottom: var(--space-lg);
}
.abx-cta__buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-md); }
