/* Styles propres à nosotros.html. Réutilise .about-band/.about-grid/
   .about-photo/.about-facts de index.css (déjà utilisées sur la bande
   "about" de la homepage) comme base visuelle pour la section historia,
   voir docs/spec-nosotros-page.md. Header, footer et tokens partagés dans
   base.css. */

/* ===== VALORES (4 cartes) ===== */
.values-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:24px; padding:90px 0; }
.value-card{ border-top:2px solid var(--eco-deep); padding-top:22px; }
.value-card .num{
  font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--eco-deep);
  letter-spacing:0.08em; display:block; margin-bottom:14px;
}
.value-card h3{
  font-family:'Big Shoulders Display', sans-serif; font-weight:800; text-transform:uppercase;
  font-size:21px; color:var(--ink); margin-bottom:10px; line-height:1.1;
}
.value-card p{ font-size:14px; color:#4B564F; }

/* ===== PERFIL (Ángel) — réutilise .about-grid en inversé, fond clair ===== */
.profile-section{ padding:20px 0 100px; }
.profile-grid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:70px; align-items:center; }
.profile-grid .about-photo{ order:2; }
.profile-grid .about-photo::after{ outline-color:var(--paper); border-color:var(--line); }
.profile-body{ order:1; }
.profile-body .eyebrow{ color:var(--eco-deep); margin-bottom:14px; }
.profile-body h2{ font-size:clamp(28px, 3.2vw, 42px); color:var(--ink); margin-bottom:20px; }
.profile-body p{ font-size:15px; color:#4B564F; max-width:480px; margin-bottom:16px; }

/* ===== EQUIPO ===== */
.team-section{ background:var(--stone); padding:90px 0; }
.team-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.team-photo{ aspect-ratio:16/10; overflow:hidden; }
.team-photo img{ width:100%; height:100%; object-fit:cover; }
.team-body .eyebrow{ color:var(--eco-deep); margin-bottom:14px; }
.team-body h2{ font-size:clamp(28px, 3.2vw, 40px); color:var(--ink); margin-bottom:18px; }
.team-body p{ font-size:15px; color:#4B564F; max-width:460px; margin-bottom:26px; }
.team-stats{ display:flex; gap:36px; flex-wrap:wrap; }
.team-stats div .num{ font-family:'Big Shoulders Display', sans-serif; font-weight:900; font-size:40px; color:var(--ink); line-height:1; }
.team-stats div .lbl{ font-family:'IBM Plex Mono', monospace; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:#7A8078; margin-top:6px; }

@media (max-width: 900px){
  .values-grid{ grid-template-columns:1fr 1fr; padding:60px 0; }
  .profile-grid{ grid-template-columns:1fr; gap:36px; }
  .profile-grid .about-photo{ order:1; }
  .profile-body{ order:2; }
  .team-grid{ grid-template-columns:1fr; gap:32px; }
}
@media (max-width: 620px){
  .values-grid{ grid-template-columns:1fr; }
}
