/**
 * Staff / equipo de profesionales — grilla de tarjetas ([me_staff]).
 */
.me-staff {
    --st-acento: var(--wd-primary-color, #dd3333);
    --st-oscuro: #15161a;
    --st-texto: #1d1f24;
    --st-muted: #6b6f78;
    --st-borde: #e7e7ea;
    --st-fondo: #f6f6f7;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 28px;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--st-texto);
}
.me-staff * { box-sizing: border-box; }

.me-staff-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--st-borde);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
    transition: transform .2s ease, box-shadow .2s ease;
}
.me-staff-card:hover { transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0, 0, 0, .1); }

.me-staff-card__foto {
    aspect-ratio: 4 / 5;
    background: var(--st-fondo);
    overflow: hidden;
}
.me-staff-card__foto img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.me-staff-card__foto.is-vacio { background: linear-gradient(135deg, var(--st-oscuro) 0%, #3a1416 100%); }

.me-staff-card__body { display: flex; flex-direction: column; gap: 8px; padding: 22px; flex: 1; }
.me-staff-card__nombre {
    font-family: 'Archivo', sans-serif;
    font-weight: 800;
    font-size: 22px;
    line-height: 1.15;
    margin: 0;
    color: var(--st-oscuro);
}
.me-staff-card__rol {
    margin: 0;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--st-acento);
}
.me-staff-card__ubi { margin: 0; font-size: 14px; color: var(--st-muted); }
.me-staff-card__bio { margin: 6px 0 0; font-size: 15px; line-height: 1.55; color: #3a3d44; }

.me-staff-card__formacion { margin: 10px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; }
.me-staff-card__formacion li {
    position: relative;
    padding-left: 18px;
    font-size: 13.5px;
    line-height: 1.4;
    color: var(--st-muted);
}
.me-staff-card__formacion li::before {
    content: '';
    position: absolute;
    left: 0; top: 7px;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--st-acento);
}

.me-staff-card__redes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.me-staff-card__redes a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--st-fondo);
    color: var(--st-oscuro) !important;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: background .15s ease, color .15s ease, transform .15s ease;
}
.me-staff-card__redes a:hover { background: var(--st-acento); color: #fff !important; transform: translateY(-2px); }

.me-staff-card__btn {
    margin-top: auto;
    align-self: flex-start;
    margin-top: 16px;
    display: inline-block;
    padding: 11px 22px;
    border-radius: 999px;
    background: var(--st-oscuro);
    color: #fff !important;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    transition: filter .15s ease, transform .15s ease;
}
.me-staff-card__btn:hover { filter: brightness(1.25); transform: translateY(-1px); color: #fff !important; }

.me-staff-card__mas { color: var(--st-acento); font-weight: 700; list-style: none; }
.me-staff-card__mas::before { display: none; }

@media (max-width: 480px) {
    .me-staff { grid-template-columns: 1fr; gap: 20px; }
    .me-staff-card__body { padding: 18px; }
}

/* ── Página de detalle del profesional ──────────────────────────────── */
.me-prof {
    --st-acento: var(--wd-primary-color, #dd3333);
    --st-oscuro: #15161a;
    --st-texto: #1d1f24;
    --st-muted: #6b6f78;
    --st-borde: #e7e7ea;
    --st-fondo: #f6f6f7;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--st-texto);
}
.me-prof * { box-sizing: border-box; }
/* Hero oscuro de ancho completo: el header transparente del tema queda legible encima.
   full-bleed: se sale del contenedor del tema para ocupar todo el ancho del viewport. */
.me-prof__top {
    background: linear-gradient(135deg, var(--st-oscuro) 0%, #241013 100%);
    color: #fff;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.me-prof__inner { max-width: 1040px; margin: 0 auto; padding: 0 20px; }
.me-prof__top .me-prof__inner { padding-top: 150px; padding-bottom: 56px; }

.me-prof__volver { display: inline-block; margin-bottom: 24px; font-weight: 600; color: rgba(255,255,255,.7); text-decoration: none; }
.me-prof__volver:hover { color: #fff; }

.me-prof__hero { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 40px; align-items: start; }
.me-prof__foto { border-radius: 18px; overflow: hidden; aspect-ratio: 4 / 5; background: rgba(255,255,255,.06); box-shadow: 0 16px 44px rgba(0,0,0,.4); }
.me-prof__foto img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.me-prof__foto.is-vacio { background: linear-gradient(135deg, #2a2b31 0%, #3a1416 100%); }

.me-prof__nombre { font-family: 'Archivo', sans-serif; font-weight: 900; font-size: 38px; line-height: 1.08; margin: 0; color: #fff; }
.me-prof__rol { margin: 10px 0 0; font-weight: 700; font-size: 15px; text-transform: uppercase; letter-spacing: .05em; color: var(--st-acento); }
.me-prof__ubi { margin: 8px 0 0; color: rgba(255,255,255,.65); }
.me-prof__bio { margin: 20px 0 0; font-size: 16px; line-height: 1.65; color: rgba(255,255,255,.82); max-width: 640px; }
.me-prof__bio p { margin: 0 0 12px; }

.me-prof__cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.me-prof__btn {
    display: inline-block; padding: 12px 24px; border-radius: 999px;
    border: 1px solid rgba(255,255,255,.4); background: transparent; color: #fff !important;
    font-weight: 700; font-size: 14px; text-decoration: none; transition: all .15s ease;
}
.me-prof__btn:hover { transform: translateY(-1px); border-color: #fff; }
.me-prof__btn--primario { background: var(--st-acento); border-color: var(--st-acento); color: #fff !important; }
.me-prof__btn--primario:hover { filter: brightness(1.1); border-color: var(--st-acento); }

.me-prof__redes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.me-prof__redes a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.1);
    color: #fff !important; font-size: 16px; font-weight: 700; text-decoration: none; transition: all .15s ease;
}
.me-prof__redes a:hover { background: var(--st-acento); color: #fff !important; transform: translateY(-2px); }

.me-prof__seccion { padding: 52px 0 64px; }
.me-prof__titulo { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 24px; margin: 0 0 18px; color: var(--st-oscuro); }
.me-prof__certis { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px 24px; }
.me-prof__certis li { position: relative; padding: 10px 14px 10px 40px; background: var(--st-fondo); border-radius: 10px; font-size: 15px; line-height: 1.4; }
.me-prof__certis li span { position: absolute; left: 14px; top: 10px; color: var(--st-acento); font-weight: 800; }

@media (max-width: 760px) {
    .me-prof__hero { grid-template-columns: 1fr; gap: 24px; }
    .me-prof__foto { max-width: 320px; }
    .me-prof__nombre { font-size: 28px; }
    .me-prof__certis { grid-template-columns: 1fr; }
}
