/* ───────────────────────────────────────────────────────────────
   Línea de empresas — estilos de sección.
   Se carga solo en /empresas/ y /ca/empreses/, encima de soma.css.

   Mismo lenguaje visual que el resto del sitio: contenedor de 1080,
   radio de 12, filete fino, azul 293 como acento, amarillo reservado
   para la palabra destacada y los kickers sobre fondo oscuro.
   La cabecera y el pie son los del sitio; aquí solo se define lo
   propio de la sección.
   ─────────────────────────────────────────────────────────────── */

/* La barra de sección es hermana de <main class="emp">, así que las variables
   se declaran en las dos: si no, hereda de :root y se queda sin contenedor. */
.emp, .emp-subnav {
  --emp-max: 1080px;
  --emp-pad: clamp(20px, 6vw, 64px);
  --emp-section: clamp(64px, 8vw, 104px);
}
.emp { background: var(--surface-page); }

/* ── Barra de sección ─────────────────────────────────────────── */
.emp-subnav {
  background: var(--surface-paper);
  border-bottom: 1px solid var(--border-hairline);
  position: relative; /* ancla de los desplegables a ancho completo en móvil */
}
.emp-subnav-in {
  max-width: var(--emp-max);
  margin: 0 auto;
  padding: 12px var(--emp-pad);
  display: flex;
  align-items: center;
  gap: 18px;
}
.emp-subnav-label {
  font: 700 11.5px var(--font-body);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--soma-blue-500);
  white-space: nowrap;
  flex: none;
}
.emp-subnav-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  list-style: none;
  margin: 0;
  padding: 0;
  margin-right: auto;
}
.emp-subnav-menu > li { position: relative; }
.emp-subnav-menu > li > a,
.emp-drop-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font: 600 14px var(--font-body);
  color: var(--soma-black-900);
  text-decoration: none;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 9px 14px;
  border-radius: 999px;
  white-space: nowrap;
  transition: background .22s ease, color .22s ease;
}
.emp-subnav-menu > li > a:hover,
.emp-drop-toggle:hover { background: rgba(255, 255, 255, 0.75); color: var(--accent-primary); }
.emp-subnav-menu > li > a[aria-current="page"] { background: var(--accent-primary); color: #fff; }
/* El grupo que contiene la página abierta queda señalado sin abrirlo */
.emp-has-drop.is-here > .emp-drop-toggle { color: var(--accent-primary); box-shadow: inset 0 0 0 1.5px var(--accent-primary); }

.emp-caret {
  width: 7px; height: 7px;
  border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  opacity: .55;
  transition: transform .18s ease;
}
.emp-drop-toggle[aria-expanded="true"] .emp-caret { transform: rotate(-135deg) translate(-3px, -3px); }

.emp-drop {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 30;
  min-width: 310px;
  background: #fff;
  border: 1px solid var(--border-hairline);
  border-radius: 12px;
  box-shadow: 0 18px 44px rgba(4, 30, 66, 0.16);
  padding: 8px;
  list-style: none;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.emp-has-drop:hover > .emp-drop,
.emp-has-drop:focus-within > .emp-drop,
.emp-drop-toggle[aria-expanded="true"] + .emp-drop { opacity: 1; visibility: visible; transform: none; }
.emp-drop > li { margin: 0; }
.emp-drop a {
  display: block;
  padding: 11px 13px;
  border-radius: 9px;
  text-decoration: none;
  font: 700 14.5px/1.3 var(--font-body);
  color: var(--soma-black-900);
}
.emp-drop a small {
  display: block;
  font: 400 12.5px/1.45 var(--font-body);
  color: var(--text-on-light-secondary);
  margin-top: 4px;
}
.emp-drop a:hover { background: var(--surface-paper); }
.emp-drop a[aria-current="page"] { background: var(--accent-primary); color: #fff; }
.emp-drop a[aria-current="page"] small { color: rgba(255, 255, 255, 0.82); }
.emp-subnav-cta {
  font: 700 14px var(--font-body);
  background: var(--soma-navy-900);
  color: #fff;
  text-decoration: none;
  padding: 11px 20px;
  border-radius: 999px;
  white-space: nowrap;
  flex: none;
}
.emp-subnav-cta:hover { color: #fff; }
@media (max-width: 980px) {
  .emp-subnav-label { display: none; }
}
@media (max-width: 760px) {
  .emp-subnav-cta { display: none; }
  .emp-subnav-in { padding-top: 8px; padding-bottom: 8px; }
  .emp-subnav-menu > li > a,
  .emp-drop-toggle { padding: 8px 11px; font-size: 13.5px; }
  /* el desplegable no cabe anclado al botón: ocupa el ancho de la barra */
  .emp-drop { left: 0; right: 0; min-width: 0; }
  .emp-has-drop { position: static; }
}

/* ── Secciones ────────────────────────────────────────────────── */
.emp-s { padding: var(--emp-section) var(--emp-pad); }
.emp-in { max-width: var(--emp-max); margin: 0 auto; }
.emp-narrow { max-width: 820px; }
.emp-s--soft { background: var(--surface-paper); }
.emp-s--dark { background: var(--soma-navy-900); color: #fff; }
.emp-s--blue { background: var(--soma-blue-500); color: #fff; }

/* Kicker con el mismo filete que .soma-kicker del resto del sitio */
.emp-kicker {
  font: 700 12.5px var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-kicker);
  margin: 0 0 14px;
}
.emp-kicker::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 2px;
  background: currentColor;
  margin-right: 12px;
  vertical-align: 0.32em;
  opacity: 0.9;
}
.emp-s--dark .emp-kicker, .emp-s--blue .emp-kicker, .emp-hero .emp-kicker { color: var(--soma-yellow-500); }

.emp-h1 { font: 800 clamp(2.1rem, 4.6vw, 3.6rem)/1.05 var(--font-display); margin: 0 0 24px; text-wrap: pretty; }
.emp-h2 { font: 800 clamp(1.6rem, 3vw, 2.2rem)/1.2 var(--font-display); margin: 0 0 18px; text-wrap: pretty; }
.emp-h3 { font: 800 20px/1.3 var(--font-display); margin: 0 0 12px; }
.emp-lead { font: 400 18px/1.6 var(--font-body); color: var(--text-on-light-secondary); max-width: 62ch; margin: 0 0 32px; }
.emp-s--dark .emp-lead, .emp-s--blue .emp-lead, .emp-hero .emp-lead { color: rgba(255, 255, 255, 0.88); }
.emp-p { font: 400 16.5px/1.7 var(--font-body); color: var(--text-on-light-secondary); margin: 0 0 18px; max-width: 68ch; }
.emp-s--dark .emp-p, .emp-s--blue .emp-p { color: rgba(255, 255, 255, 0.82); }
.emp-p strong, .emp-lead strong { color: var(--text-on-light); font-weight: 700; }
.emp-s--dark .emp-p strong, .emp-s--dark .emp-lead strong,
.emp-s--blue .emp-p strong, .emp-hero .emp-lead strong { color: #fff; }

/* Palabra destacada: igual que en el resto del sitio */
.emp-mark {
  background: var(--soma-yellow-500);
  color: var(--soma-black-900);
  padding: 2px 12px;
  border-radius: 6px;
  display: inline-block;
  white-space: nowrap;
}
@media (max-width: 520px) { .emp-mark { white-space: normal; display: inline; } }

/* ── Hero ─────────────────────────────────────────────────────── */
.emp-hero {
  background: var(--soma-navy-900);
  color: #fff;
  padding: clamp(56px, 9vw, 92px) var(--emp-pad);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.emp-hero .emp-in { position: relative; z-index: 2; }

/* Ilustración de marca: solo en la portada de la sección, igual que la home
   es la única página del sitio con vídeo en la cabecera. */
.emp-hero-bg {
  position: absolute;
  inset: 0 0 0 auto;
  width: min(58%, 820px);
  z-index: 0;
  pointer-events: none;
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  opacity: .42;
  filter: saturate(.8);
}
.emp-hero-bg::after {
  content: "";
  position: absolute;
  inset: -1px;
  background: linear-gradient(90deg, var(--soma-navy-900) 6%, rgba(4, 30, 66, .92) 44%, rgba(4, 30, 66, .62) 100%);
}
@media (max-width: 940px) {
  .emp-hero-bg { width: 100%; opacity: .28; }
  .emp-hero-bg::after { background: linear-gradient(180deg, rgba(4, 30, 66, .9) 20%, rgba(4, 30, 66, .78) 100%); }
}

.emp-hero-grid {
  display: grid;
  gap: clamp(30px, 4vw, 56px);
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  align-items: center;
}
@media (max-width: 940px) { .emp-hero-grid { grid-template-columns: 1fr; } }

.emp-hero-card {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 12px;
  padding: 26px 26px 8px;
}
.emp-hero-card h2 {
  font: 700 12.5px var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--soma-yellow-500);
  margin: 0 0 18px;
}
.emp-hero-card ul { margin: 0; padding: 0; }
.emp-hero-card li { list-style: none; padding: 15px 0; border-top: 1px solid rgba(255, 255, 255, 0.14); }
.emp-hero-card li:first-of-type { border-top: 0; padding-top: 0; }
.emp-hero-card b { display: block; font: 700 14.5px var(--font-body); color: #fff; margin-bottom: 4px; }
.emp-hero-card span { font: 400 14px/1.55 var(--font-body); color: rgba(255, 255, 255, 0.7); }

/* ── Botones: mismos que el resto del sitio ───────────────────── */
.emp-btns { display: flex; flex-wrap: wrap; gap: 14px; }

/* El botón de los bloques de pasos colgaba pegado bajo la primera columna y
   parecía pertenecer al paso 01. Separado de la retícula y centrado, se lee
   como lo que es: la acción de toda la sección. */
.emp-steps-cta { margin-top: clamp(32px, 4vw, 48px); padding-top: clamp(24px, 3vw, 32px); border-top: 1px solid var(--border-hairline); }
.emp-steps-cta .emp-btns { justify-content: center; }
.emp-s--dark .emp-steps-cta, .emp-s--blue .emp-steps-cta { border-top-color: rgba(255, 255, 255, .14); }
.emp-btn {
  display: inline-block;
  font: 700 16px var(--font-body);
  padding: 16px 28px;
  border-radius: 999px;
  text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease;
}
.emp-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(4, 30, 66, 0.16); }
.emp-btn:active { transform: translateY(0); box-shadow: none; }
.emp-btn--y, .emp-btn--b { background: var(--accent-primary); color: #fff; }
.emp-btn--y:hover, .emp-btn--b:hover { background: var(--accent-primary-hover); color: #fff; }
.emp-btn--ghost { background: rgba(255, 255, 255, 0.12); color: #fff; border: 1px solid rgba(255, 255, 255, 0.4); }
.emp-btn--ghost:hover { background: rgba(255, 255, 255, 0.2); color: #fff; }
.emp-btn--line { background: transparent; color: var(--soma-navy-900); border: 1.5px solid var(--soma-navy-900); }
.emp-btn--line:hover { background: var(--soma-navy-900); color: #fff; }
.emp-s--dark .emp-btn--line, .emp-s--blue .emp-btn--line { color: #fff; border-color: rgba(255, 255, 255, 0.5); }
.emp-s--dark .emp-btn--line:hover { background: #fff; color: var(--soma-navy-900); }

/* ── Migas ────────────────────────────────────────────────────── */
.emp-crumbs { font: 500 13px/1.5 var(--font-body); color: rgba(255, 255, 255, 0.6); margin: 0 0 20px; }
.emp-crumbs a { color: rgba(255, 255, 255, 0.82); text-decoration: none; }
.emp-crumbs a:hover { color: var(--soma-yellow-500); }

/* ── Rejillas y tarjetas ──────────────────────────────────────── */
.emp-grid { display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 258px), 1fr)); }
.emp-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); }
.emp-grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }

.emp-card {
  background: #fff;
  border: 1px solid var(--border-hairline);
  border-radius: 12px;
  padding: 30px 28px;
  display: flex;
  flex-direction: column;
  transition: transform .22s ease, box-shadow .22s ease;
}
.emp-card:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(4, 30, 66, 0.12); }
.emp-card-n { font: 800 13px var(--font-body); color: var(--accent-primary); margin: 0 0 12px; letter-spacing: .04em; }
.emp-card p { font: 400 15.5px/1.65 var(--font-body); color: var(--text-on-light-secondary); margin: 0 0 16px; }
.emp-card ul { margin: 0 0 18px; padding: 0; list-style: none; }
.emp-card li {
  font: 400 14.5px/1.55 var(--font-body);
  color: var(--text-on-light-secondary);
  padding: 7px 0 7px 24px;
  position: relative;
}
.emp-card li::before {
  content: "";
  position: absolute;
  left: 2px; top: 13px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--soma-yellow-500);
}
/* `min-height` para que el enlace de la tarjeta sea pulsable en móvil: con la
   altura de su texto (20 px) se quedaba por debajo del mínimo de la WCAG. */
.emp-card .emp-more { margin-top: auto; font: 700 15px var(--font-body); color: var(--accent-primary); text-decoration: none; display: inline-flex; align-items: center; min-height: 26px; }
.emp-card .emp-more:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ── Cifras ───────────────────────────────────────────────────── */
.emp-stat { border-top: 3px solid var(--soma-black-900); padding-top: 18px; }
.emp-s--dark .emp-stat, .emp-s--blue .emp-stat { border-top-color: var(--soma-yellow-500); }
.emp-stat b {
  display: block;
  font: 800 clamp(1.9rem, 3.4vw, 2.7rem)/1 var(--font-display);
  color: var(--soma-navy-900);
  margin-bottom: 12px;
}
.emp-s--dark .emp-stat b, .emp-s--blue .emp-stat b { color: var(--soma-yellow-500); }
.emp-stat span { display: block; font: 400 14.5px/1.55 var(--font-body); color: var(--text-on-light-secondary); }
.emp-s--dark .emp-stat span { color: rgba(255, 255, 255, .78); }
.emp-stat cite { display: block; font: 600 12px var(--font-body); color: var(--accent-primary); font-style: normal; margin-top: 10px; }
.emp-s--dark .emp-stat cite { color: var(--soma-yellow-500); }
.emp-banner {
  margin-top: 44px;
  background: var(--soma-navy-900);
  color: #fff;
  border-radius: 12px;
  padding: 30px 32px;
  font: 800 clamp(1.15rem, 2vw, 1.5rem)/1.35 var(--font-display);
  text-wrap: pretty;
}

/* ── Tabla comparativa ────────────────────────────────────────── */
.emp-rows { border-top: 2px solid var(--soma-black-900); }
.emp-row {
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) minmax(0, 1.6fr);
  gap: 10px 28px;
  padding: 20px 0;
  border-bottom: 1px solid var(--border-hairline);
}
@media (max-width: 700px) { .emp-row { grid-template-columns: 1fr; gap: 6px; } }
.emp-row b { font: 700 16px/1.4 var(--font-body); color: var(--soma-black-900); }
.emp-row span { font: 400 15.5px/1.6 var(--font-body); color: var(--text-on-light-secondary); }
.emp-row--us {
  background: var(--soma-navy-900);
  border-radius: 12px;
  padding: 26px 28px;
  margin-top: 22px;
  border-bottom: 0;
  grid-template-columns: 1fr;
  gap: 12px;
}
.emp-row--us b { color: var(--soma-yellow-500); font: 700 11.5px var(--font-body); letter-spacing: .14em; text-transform: uppercase; }
.emp-row--us span { color: #fff; font: 800 clamp(1.05rem, 1.9vw, 1.35rem)/1.35 var(--font-display); }

/* ── Pasos ────────────────────────────────────────────────────── */
.emp-step { padding-top: 20px; border-top: 2px solid rgba(255, 255, 255, 0.28); }
.emp-s:not(.emp-s--dark):not(.emp-s--blue) .emp-step { border-top-color: var(--border-hairline); }
.emp-step b { display: block; font: 800 13px var(--font-body); letter-spacing: .12em; color: var(--soma-yellow-500); margin-bottom: 12px; }
.emp-s:not(.emp-s--dark):not(.emp-s--blue) .emp-step b { color: var(--accent-primary); }
.emp-step h3 { font: 800 18px/1.3 var(--font-display); margin: 0 0 10px; }
.emp-step p { font: 400 15px/1.65 var(--font-body); margin: 0; color: rgba(255, 255, 255, 0.78); }
.emp-s:not(.emp-s--dark):not(.emp-s--blue) .emp-step p { color: var(--text-on-light-secondary); }

/* ── Listas por bloque (catálogo) ─────────────────────────────── */
.emp-block { background: #fff; border: 1px solid var(--border-hairline); border-radius: 12px; padding: 28px 26px; }
.emp-block h3 {
  font: 700 12.5px var(--font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent-primary);
  margin: 0 0 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border-hairline);
}
.emp-block ol { margin: 0; padding: 0; list-style: none; counter-reset: t; }
.emp-block li {
  counter-increment: t;
  font: 500 15.5px/1.5 var(--font-body);
  color: var(--soma-black-900);
  padding: 11px 0 11px 32px;
  position: relative;
  border-top: 1px solid var(--border-hairline);
}
.emp-block li:first-child { border-top: 0; }
.emp-block li::before {
  content: counter(t, decimal-leading-zero);
  position: absolute;
  left: 0; top: 13px;
  font: 700 12px var(--font-body);
  color: var(--text-on-light-secondary);
}

/* ── Checklist ────────────────────────────────────────────────── */
.emp-check { margin: 0 0 8px; padding: 0; list-style: none; max-width: 74ch; }
.emp-check li {
  font: 400 16px/1.6 var(--font-body);
  color: var(--text-on-light-secondary);
  padding: 13px 0 13px 32px;
  position: relative;
  border-bottom: 1px solid var(--border-hairline);
}
.emp-check li:last-child { border-bottom: 0; }
.emp-check li::before {
  content: "";
  position: absolute;
  left: 4px; top: 19px;
  width: 12px; height: 7px;
  border-left: 2.5px solid var(--accent-primary);
  border-bottom: 2.5px solid var(--accent-primary);
  transform: rotate(-45deg);
}
.emp-s--dark .emp-check li { color: rgba(255, 255, 255, 0.84); border-bottom-color: rgba(255, 255, 255, 0.16); }
.emp-s--dark .emp-check li::before { border-color: var(--soma-yellow-500); }
.emp-check li strong { color: var(--text-on-light); }
.emp-s--dark .emp-check li strong { color: #fff; }

/* ── Split (texto + panel o imagen) ───────────────────────────── */
.emp-split { display: grid; gap: clamp(30px, 5vw, 58px); grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); align-items: center; }
@media (max-width: 940px) { .emp-split { grid-template-columns: 1fr; } }
.emp-split--top { align-items: start; }
.emp-panel { background: var(--soma-navy-900); color: #fff; border-radius: 12px; padding: 32px 30px; }
.emp-s--dark .emp-panel { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .2); }
.emp-panel h3 { font: 800 18px/1.3 var(--font-display); color: #fff; margin: 0 0 16px; }
.emp-panel ul { margin: 0; padding: 0; }
.emp-panel li { list-style: none; font: 400 15px/1.6 var(--font-body); color: rgba(255, 255, 255, 0.8); padding: 12px 0; border-top: 1px solid rgba(255, 255, 255, 0.14); }
.emp-panel li:first-of-type { border-top: 0; padding-top: 0; }

/* Imagen de sección */
.emp-media { border-radius: 12px; overflow: hidden; background: var(--soma-navy-900); margin: 0; }
.emp-media img { display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; }
.emp-media--tall img { aspect-ratio: 4 / 5; }
.emp-media--portrait img { aspect-ratio: 3 / 4; object-position: center 24%; }
.emp-media--light { background: var(--surface-paper); border: 1px solid var(--border-hairline); }
.emp-media--light img { object-fit: contain; padding: 14px; }
.emp-media figcaption {
  font: 500 12.5px/1.5 var(--font-body);
  color: var(--text-on-light-secondary);
  padding: 12px 16px;
  background: #fff;
  border-top: 1px solid var(--border-hairline);
}

/* ── FAQ ──────────────────────────────────────────────────────── */
.emp-faq { border-top: 2px solid var(--soma-black-900); }
.emp-faq details { border-bottom: 1px solid var(--border-hairline); }
.emp-faq summary {
  cursor: pointer;
  list-style: none;
  padding: 22px 44px 22px 0;
  font: 800 17.5px/1.4 var(--font-display);
  color: var(--soma-black-900);
  position: relative;
}
.emp-faq summary:hover { color: var(--accent-primary); }
.emp-faq summary::-webkit-details-marker { display: none; }
.emp-faq summary::after {
  content: "+";
  position: absolute;
  right: 6px; top: 19px;
  font: 400 24px/1 var(--font-body);
  color: var(--accent-primary);
}
.emp-faq details[open] summary::after { content: "−"; }
.emp-faq p { font: 400 16px/1.7 var(--font-body); color: var(--text-on-light-secondary); margin: 0 0 22px; max-width: 76ch; }

/* ── Caso ─────────────────────────────────────────────────────── */
.emp-case {
  background: #fff;
  border: 1px solid var(--border-hairline);
  border-left: 3px solid var(--soma-yellow-500);
  border-radius: 0 12px 12px 0;
  padding: 30px 30px;
  margin: 0;
}
.emp-case dt { font: 700 12px var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--accent-primary); margin: 0 0 8px; }
.emp-case dd { font: 400 16px/1.7 var(--font-body); color: var(--text-on-light-secondary); margin: 0 0 22px; }
.emp-case dd:last-child { margin-bottom: 0; }
.emp-note { font: 400 13px/1.6 var(--font-body); color: var(--text-on-light-secondary); font-style: italic; margin: 26px 0 0; max-width: 70ch; }
.emp-s--dark .emp-note { color: rgba(255, 255, 255, .6); }

/* ── Sello ────────────────────────────────────────────────────── */
/* El círculo lleva `box-sizing: border-box` a propósito: con el de por
   defecto los 24px de padding se sumaban al ancho, el sello se comía los
   48px de separación de la retícula y quedaba pegado al texto. */
.emp-seal { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: clamp(28px, 4vw, 48px); align-items: center; }
@media (max-width: 700px) { .emp-seal { grid-template-columns: 1fr; } }
.emp-seal-mark {
  box-sizing: border-box;
  width: 200px; height: 200px;
  border-radius: 50%;
  background: var(--soma-yellow-500);
  color: var(--soma-black-900);
  display: grid;
  place-content: center;
  text-align: center;
  font: 800 12.5px/1.32 var(--font-display);
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 24px;
}

/* El blog de la sección usa el mismo esquema y los mismos estilos que el blog
   de pacientes (índice de temáticas → página de temática → artículo), así que
   no tiene piel propia. Ver src/empresas/blog.mjs. */

.emp-article { max-width: 760px; margin: 0 auto; }
.emp-article h2 { font: 800 clamp(1.5rem, 2.6vw, 2rem)/1.25 var(--font-display); margin: 48px 0 18px; text-wrap: pretty; }
.emp-article h3 { font: 800 19px/1.35 var(--font-display); margin: 32px 0 12px; }
.emp-article p { font: 400 17px/1.75 var(--font-body); color: var(--text-on-light-secondary); margin: 0 0 18px; }
.emp-article p strong { color: var(--text-on-light); }
.emp-article ul, .emp-article ol { font: 400 17px/1.75 var(--font-body); color: var(--text-on-light-secondary); margin: 0 0 18px; padding-left: 24px; }
.emp-article li { margin-bottom: 8px; }
.emp-article li strong { color: var(--text-on-light); }
.emp-article blockquote {
  margin: 32px 0;
  padding: 24px 28px;
  background: var(--surface-paper);
  border-left: 3px solid var(--soma-yellow-500);
  border-radius: 0 10px 10px 0;
  font: 500 17.5px/1.65 var(--font-body);
  color: var(--text-on-light);
}
.emp-article table { width: 100%; border-collapse: collapse; margin: 0 0 24px; font: 400 15px/1.55 var(--font-body); }
.emp-article th, .emp-article td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--border-hairline); vertical-align: top; }
.emp-article th { font-weight: 700; color: var(--soma-black-900); border-bottom: 2px solid var(--soma-black-900); white-space: nowrap; }
.emp-article td { color: var(--text-on-light-secondary); }
.emp-scroll { overflow-x: auto; margin: 0 0 24px; }

/* ── Aparición suave: la misma animación que el resto del sitio ── */
@supports (animation-timeline: view()) {
  .emp-reveal { animation: soma-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 32%; }
}
@media (prefers-reduced-motion: reduce) {
  .emp-reveal { animation: none; }
  .emp-btn:hover, .emp-card:hover { transform: none; box-shadow: none; }
}