/* ==========================================================================
   BLACK VERSIONS — pages/nosotros.css
   Solo lo especifico de /nosotros/. Hero centrado, tarjetas, lista compacta
   de servicios y CTA son componentes compartidos.
   ========================================================================== */

/* ==========================================================================
   1. HERO
   ========================================================================== */

.about-hero .starburst {
  top: 14%;
  right: var(--burst-right);
}

/* ==========================================================================
   2. QUIENES SOMOS
   ========================================================================== */

.about .about-media {
  position: relative;
}

@media (min-width: 901px) {
  .about .about-media {
    position: sticky;
    top: calc(var(--nav-h) + 36px);
  }
}

.about .about-content h2 {
  max-width: 18ch;
  margin-bottom: 26px;
  line-height: 1.12;
}

/* Los eyebrow tambien son <p>: se excluyen de las reglas de parrafo */
.about .about-content > p:not(.eyebrow) {
  max-width: 62ch;
  margin-bottom: 18px;
  font-size: var(--fs-p-md);
}

.about .about-legal {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid var(--b-08);
  font-size: 0.8rem;
  color: var(--text-xlow);
}

/* ==========================================================================
   3. NUESTRO ENFOQUE
   ========================================================================== */

.principles h2 {
  max-width: 20ch;
  margin-bottom: var(--gap-md);
}

.principles .service-card p {
  padding-bottom: 0;
}

/* ==========================================================================
   4. QUE OFRECEMOS
   ========================================================================== */

.offer h2 {
  max-width: 20ch;
  margin-bottom: var(--gap-md);
}

.offer .link-underline {
  margin-top: var(--gap-md);
}

/* ==========================================================================
   5. CTA
   ========================================================================== */

.about-cta {
  border-top: 1px solid var(--b-06);
}