/* ══════════════════════════════════════════════════════════
   DATAMATIUM — conocenos.css v2
══════════════════════════════════════════════════════════ */

/* ── SPLIT SECTIONS (Misión / Visión) ── */
.about-section {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
  padding: 72px 0;
  border-bottom: 1px solid var(--border);
}

.about-section.reverse { direction: rtl; }
.about-section.reverse > * { direction: ltr; }

.about-text { max-width: 520px; }

.about-text h2 {
  font-family: 'Rajdhani', sans-serif;
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 18px;
  letter-spacing: -0.01em;
  line-height: 1.1;
  position: relative;
  padding-left: 20px;
}

.about-text h2::before {
  content: '';
  position: absolute;
  left: 0; top: 6px;
  width: 4px;
  height: calc(100% - 12px);
  background: var(--accent);
  border-radius: 2px;
}

.about-text p {
  font-size: 15.5px;
  color: var(--text-soft);
  line-height: 1.78;
}

.about-img {
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: var(--surface-2);
  box-shadow: var(--shadow-lg);
  position: relative;
}

.about-img img {
  width: 100%; height: auto;
  object-fit: cover;
  display: block;
  transition: transform 0.5s var(--ease);
}
.about-img:hover img { transform: scale(1.04); }

.about-img.no-img {
  display: flex; align-items: center; justify-content: center;
  min-height: 240px;
}

/* Image fallback */
.img-fallback { display: none; font-size: 14px; color: var(--text-muted); font-weight: 500; }
.no-img .img-fallback { display: block; padding: 40px; text-align: center; }

/* ── VALORES ── */
.valores-section {
  width: 100%;
  padding: 72px 0;
  border-bottom: 1px solid var(--border);
}

.about-card {
  transition: transform 0.28s var(--ease), box-shadow 0.28s, border-color 0.28s;
  position: relative;
  overflow: hidden;
}

.about-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--accent), var(--sky));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease);
}

.about-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg);
  border-color: transparent;
}
.about-card:hover::after { transform: scaleX(1); }

.card-icon {
  font-size: 32px;
  margin-bottom: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  background: var(--off-white);
  border-radius: 14px;
}

.about-card h3 {
  font-family: 'Rajdhani', sans-serif;
  font-size: 21px; font-weight: 700;
  color: var(--navy); margin-bottom: 10px;
}

.about-card p {
  font-size: 13.5px;
  color: var(--text-soft);
  line-height: 1.68;
}

/* Wide image */
.section-img {
  width: 100%;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--surface-2);
  box-shadow: var(--shadow-md);
  margin-top: 36px;
  position: relative;
}
.section-img.wide { aspect-ratio: 21/6; min-height: 120px; }
.section-img img  { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s; }
.section-img:hover img { transform: scale(1.02); }
.section-img.no-img { display: flex; align-items: center; justify-content: center; }

/* ── EQUIPO ── */
.equipo-section { width: 100%; padding: 72px 0 0; }

.equipo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.miembro-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: transform 0.3s var(--ease), box-shadow 0.3s;
}
.miembro-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}

.miembro-photo {
  aspect-ratio: 4/3;
  background: var(--surface-2);
  overflow: hidden;
  position: relative;
}
.miembro-photo img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform 0.5s var(--ease);
}
.miembro-card:hover .miembro-photo img { transform: scale(1.06); }
.miembro-photo.no-img { display: flex; align-items: center; justify-content: center; font-size: 52px; }

.miembro-info {
  padding: 20px 22px 24px;
  border-top: 3px solid var(--accent);
}

.miembro-name {
  font-family: 'Rajdhani', sans-serif;
  font-size: 20px; font-weight: 700;
  color: var(--navy); margin-bottom: 4px;
  letter-spacing: 0.02em;
}

.miembro-role {
  display: inline-block;
  font-size: 10.5px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 10px;
}

.miembro-info p {
  font-size: 13px;
  color: var(--text-soft);
  line-height: 1.6;
}

/* ══ RESPONSIVE ══ */
@media (max-width: 960px) {
  .about-section { grid-template-columns: 1fr; gap: 36px; padding: 48px 0; }
  .about-section.reverse { direction: ltr; }
  .about-text { max-width: 100%; }
  .equipo-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .about-section { gap: 24px; padding: 36px 0; }
  .valores-section { padding: 48px 0; }
  .grid-cards { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .card-icon { width: 46px; height: 46px; font-size: 22px; }
  .about-card h3 { font-size: 18px; }
  .equipo-section { padding: 48px 0 0; }
  .equipo-grid { grid-template-columns: 1fr; gap: 16px; }
  .section-img.wide { aspect-ratio: 16/7; }
}