/**
 * REFORMAS YAMYLU — Presentación corporativa
 * Extensión editorial de la sección Nosotros — mismo fondo Night,
 * sin marca de agua ni numeración propia. Bloque puente, no sección completa.
 */

.presentacion {
  position: relative;
  background-color: var(--color-night);
  padding-bottom: var(--space-2xl);
}

/* Línea dorada — mismo patrón que .nosotros__divider, hereda la continuidad visual */
.presentacion__divider {
  max-width: var(--max-content);
  margin: 0 auto;
  padding: 0 80px;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent 0%,
    rgba(201, 164, 74, 0.15) 20%,
    rgba(201, 164, 74, 0.15) 80%,
    transparent 100%
  );
}

.presentacion__inner {
  max-width: var(--max-text);
  margin: 0 auto;
  padding: var(--space-2xl) 80px 0;
  text-align: center;
}

.presentacion__headline {
  font-family: var(--font-display);
  font-size: clamp(24px, 2.8vw, 34px);
  font-weight: 300;
  line-height: 1.2;
  color: var(--color-white);
  margin: 0 0 var(--space-sm);
}

.presentacion__headline em {
  font-style: italic;
  font-weight: 400;
  color: var(--color-gold);
}

.presentacion__text {
  font-family: var(--font-body);
  font-size: clamp(14px, 1.5vw, 16px);
  font-weight: 400;
  line-height: 1.7;
  color: var(--color-silver);
  margin: 0 0 var(--space-md);
}

/* Misión / Visión — Sprint 019, feedback del cliente.
   Mismo bloque editorial, sin sección nueva ni ruptura del diseño. */
.presentacion__pillars {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-lg);
  margin: 0 0 var(--space-lg);
  text-align: left;
}

.presentacion__pillar-label {
  display: block;
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(15px, 1.6vw, 18px);
  color: var(--color-gold);
  margin: 0 0 8px;
}

.presentacion__pillar-text {
  font-family: var(--font-body);
  font-size: clamp(13px, 1.4vw, 15px);
  font-weight: 400;
  line-height: 1.7;
  color: var(--color-silver);
  margin: 0;
}

.presentacion__cta {
  justify-content: center;
}

/* ═══════════════════════════════════════════
   RESPONSIVE — TABLET
═══════════════════════════════════════════ */

@media (max-width: 1023px) {
  .presentacion__divider {
    padding: 0 48px;
  }

  .presentacion__inner {
    padding: var(--space-xl) 48px 0;
  }
}

/* ═══════════════════════════════════════════
   RESPONSIVE — MOBILE
═══════════════════════════════════════════ */

@media (max-width: 767px) {
  .presentacion {
    padding-bottom: var(--space-xl);
  }

  .presentacion__divider {
    padding: 0 24px;
  }

  .presentacion__inner {
    padding: var(--space-lg) 24px 0;
  }

  .presentacion__pillars {
    grid-template-columns: 1fr;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
  }
}