/* ==========================================================================
   Renddi · Sobre Renddi
   Origen (rd-origin) · Persona (rd-person) · Equipo en red (rd-network)
   Requiere: tokens.css, base.css, home.css, service.css, method.css, sector.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Por qué existimos: texto + cita destacada
   -------------------------------------------------------------------------- */
.rd-origin {
  padding-top: var(--rd-space-7);
}

.rd-origin__inner {
  display: grid;
  gap: var(--rd-space-7);
}

.rd-origin__text p:not(.rd-eyebrow) {
  margin-top: var(--rd-space-4);
  color: var(--rd-text-muted-on-dark);
}

.rd-origin__text .rd-section__title {
  max-width: 22ch;
}

.rd-origin__quote {
  margin: 0;
  padding: var(--rd-space-6) var(--rd-space-5);
  background-color: var(--rd-surface);
  border: 1px solid var(--rd-border);
  border-left: 3px solid var(--rd-burnt-orange);
  border-radius: var(--rd-radius-m);
}

.rd-origin__quote p {
  font-size: var(--rd-text-xl);
  font-weight: var(--rd-weight-bold);
  line-height: var(--rd-leading-snug);
  letter-spacing: var(--rd-tracking-heading);
}

.rd-origin__quote footer {
  margin-top: var(--rd-space-4);
  color: var(--rd-pixel-teal);
  font-size: var(--rd-text-xs);
  font-weight: var(--rd-weight-bold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@media (min-width: 60rem) {
  .rd-origin__inner {
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
    column-gap: var(--rd-space-9);
    align-items: center;
  }
}

/* --------------------------------------------------------------------------
   2. Quién está detrás: tarjeta con imagen
   -------------------------------------------------------------------------- */
.rd-person {
  padding-top: 0;
}

.rd-person__card {
  display: grid;
  overflow: hidden;
  background-color: var(--rd-surface);
  border: 1px solid var(--rd-border);
  border-radius: var(--rd-radius-m);
}

.rd-person__media {
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.rd-person__media picture {
  height: 100%;
}

.rd-person__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 15%;
}

.rd-person__body {
  padding: var(--rd-space-6) var(--rd-space-5);
}

.rd-person__body .rd-eyebrow {
  margin-bottom: var(--rd-space-3);
}

.rd-person__name {
  font-size: var(--rd-text-2xl);
}

.rd-person__role {
  margin-top: var(--rd-space-1);
  margin-bottom: var(--rd-space-5);
  color: var(--rd-pixel-teal);
  font-weight: var(--rd-weight-medium);
}

.rd-person__body > p:not(.rd-eyebrow):not(.rd-person__role) + p {
  margin-top: var(--rd-space-4);
}

.rd-person__body > p:not(.rd-eyebrow):not(.rd-person__role) {
  color: var(--rd-text-muted-on-dark);
}

.rd-person__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--rd-space-3) var(--rd-space-5);
  margin-top: var(--rd-space-6);
}

@media (min-width: 60rem) {
  .rd-person__card {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    align-items: stretch;
  }

  .rd-person__media {
    aspect-ratio: auto;
  }

  .rd-person__body {
    padding: var(--rd-space-8) var(--rd-space-7);
  }
}

/* --------------------------------------------------------------------------
   3. Equipo en red y notas con enlace
   -------------------------------------------------------------------------- */
.rd-network {
  padding-top: 0;
}

@media (min-width: 60rem) {
  .rd-network__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.rd-network__note {
  margin-top: var(--rd-space-6);
  color: var(--rd-text-muted-on-dark);
  font-size: var(--rd-text-s);
}

.rd-network__note a {
  font-weight: var(--rd-weight-medium);
}

.rd-results {
  padding-top: 0;
}