/* =========================================================
   BODHIWELL · TARJETA PROFESIONAL ESTANDARIZADA
   Uso único: Grid de profesionales + autor profesional en Blog.
   Un solo componente, mismas medidas, misma jerarquía y mismos estados.

   Jerarquía tipográfica aprobada:
   1. Nombre            22.5 px / 800
   2. Profesión/práctica 13 px / 700
   3. Especialidad       11.5 px / 700

   Especialidades:
   - se muestra 1 especialidad + “+N” con la cantidad restante;
   - cápsula y +N toman un tinte de --dimension-color;
   - el ícono de etiqueta NO cambia: #8B9A92 (manual).

   MSP:
   - no es una cápsula;
   - se muestra como “Registro MSP verificado” con check #39A84B.
   ========================================================= */
.professional-card {
  --pc-surface: #F7F5F1;
  --pc-text: #13231D;
  --pc-muted: #5D7067;
  --pc-primary: #82B194;
  --dimension-color: #304E8F;
  --pc-specialty-text: color-mix(in srgb, var(--dimension-color) 86%, #24342D 14%);
  --pc-specialty-border: color-mix(in srgb, var(--dimension-color) 36%, white 64%);
  --pc-specialty-bg: color-mix(in srgb, var(--dimension-color) 10%, white 90%);
  width: 100%;
  max-width: 288px;
  height: 484px;
  min-width: 0;
  min-height: 484px;
  max-height: 484px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(12, 36, 28, .08);
  border-radius: 24px;
  background: var(--pc-surface);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .03);
  color: var(--pc-text);
  font-family: var(--bw-font-family, "Sora", system-ui, -apple-system, sans-serif);
  transition: transform .16s ease, box-shadow .16s ease;
}

.professional-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(14, 42, 34, .08);
}

.professional-card__media {
  position: relative;
  display: block;
  flex: 0 0 268px;
  width: 100%;
  height: 268px;
  min-height: 268px;
  max-height: 268px;
  overflow: hidden;
  background: #ECEAE5 center 24%/cover no-repeat;
  text-decoration: none;
}

.professional-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, .13) 0%, rgba(0, 0, 0, 0) 38%);
  pointer-events: none;
}

.professional-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 24%;
}

.professional-card__dimension {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--dimension-color) 32%, white 68%);
  background: color-mix(in srgb, var(--dimension-color) 14%, white 86%);
  color: var(--dimension-color);
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  backdrop-filter: blur(4px);
}

.professional-card__body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 16px 16px 17px;
  text-align: left;
}

.professional-card__copy {
  width: 100%;
  min-height: 0;
  display: block
}

.professional-card__name {
  margin: 0;
  display: block;
  color: var(--pc-text);
  font-size: 22.5px;
  line-height: 1.04;
  font-weight: 800;
  letter-spacing: -.028em;
}

.professional-card__role {
  margin: 6px 0 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #3F574C;
  font-size: 13px;
  line-height: 1.28;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

/* Especialidades · 1 visible + cantidad restante */
.professional-card__specialties {
  margin-top: 10px;
  min-height: 27px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.professional-card__specialties-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  display: block;
  color: #8B9A92;
  margin-top: -11px;
}

.professional-card__specialties-list {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
}

.professional-card__specialty-chip,
.professional-card__specialty-more {
  display: inline-block;
  vertical-align: middle;
  height: 27px;
  line-height: 27px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
}

.professional-card__specialty-chip {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 1px solid var(--pc-specialty-border);
  background: var(--pc-specialty-bg);
  color: var(--pc-specialty-text);
}

.professional-card__specialty-more {
  flex: 0 0 auto;
  padding-inline: 10px;
  border: 1px solid color-mix(in srgb, var(--dimension-color) 24%, white 76%);
  background: color-mix(in srgb, var(--dimension-color) 8%, white 92%);
  color: color-mix(in srgb, var(--dimension-color) 82%, #3F574C 18%);
}

.professional-card__specialties:empty {
  visibility: hidden
}

/* Validación MSP · misma lógica del Perfil público */
.professional-card__msp-row {
  min-height: 22px;
  margin-top: auto;
  display: flex;
  align-items: center;
}

.professional-card__msp-row:empty {
  visibility: hidden
}

.professional-card__msp {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--pc-muted);
  font-size: 10.5px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.professional-card__msp::before {
  content: "";
  width: 5px;
  height: 9px;
  margin-left: 1px;
  margin-right: 2px;
  flex: 0 0 auto;
  border-right: 3px solid #39A84B;
  border-bottom: 3px solid #39A84B;
  transform: rotate(40deg);
}

/* CTA Secondary oficial · radio 15 px */
.professional-card__cta,
.professional-card__cta.secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  margin-top: 10px;
  padding: 0 16px;
  border: 1px solid rgba(130, 177, 148, .58);
  border-radius: 15px;
  background: transparent;
  color: #32453B;
  font: inherit;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .12s ease;
}

.professional-card__cta:hover,
.professional-card__cta.secondary:hover {
  border-color: rgba(130, 177, 148, .88);
  background: rgba(130, 177, 148, .12);
  color: #32453B;
}

.professional-card__cta:focus-visible,
.professional-card__cta.secondary:focus-visible {
  outline: 3px solid rgba(130, 177, 148, .24);
  outline-offset: 2px;
  border-color: var(--pc-primary);
}

.professional-card__cta:active,
.professional-card__cta.secondary:active {
  border-color: var(--pc-primary);
  background: rgba(130, 177, 148, .18);
  transform: translateY(1px);
}

/* Blog: solo cambia posicionamiento. No se redefinen geometría ni jerarquías. */
.professional-card.article-author-card {
  margin: 0
}

@media(max-width:760px) {
  .professional-card {
    width: min(100%, 288px)
  }

  .professional-card.article-author-card {
    margin-inline: auto
  }
}

.glossary-intro, .sources-intro{
	margin-top: 20px;
}