/* about.css */
/* ════ ABOUT PAGE ════ */
.about-hero{background:linear-gradient(150deg,var(--deep),var(--ocean));padding:calc(var(--nav-h) + 4.5rem) 0 5.5rem;text-align:center}
.about-hero h1{font-family:var(--ff-display);font-size:clamp(2.5rem,5vw,3.9rem);color:#fff;font-weight:700;margin-bottom:1rem}
.about-story{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.about-story-img{border-radius:var(--radius-lg);height:440px;background:linear-gradient(135deg,var(--ocean),var(--teal));display:flex;align-items:center;justify-content:center;font-size:8rem;box-shadow:var(--shadow-lg)}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:3rem}
.team-card{text-align:center;padding:1.5rem;border-radius:var(--radius);background:var(--white);border:1px solid var(--gray-2);transition:var(--transition)}
.team-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}
.team-avatar{width:84px;height:84px;border-radius:50%;background:linear-gradient(135deg,var(--sea),var(--teal));display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.9rem;font-weight:700;margin:0 auto 1rem;box-shadow:0 8px 24px rgba(26,143,168,.3)}
.team-name{font-family:var(--ff-display);font-size:1.15rem;font-weight:700;color:var(--ink);margin-bottom:.3rem}
.team-role{font-size:.78rem;font-weight:700;color:var(--sea);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.5px}
.team-bio{font-size:.84rem;color:var(--gray-4);line-height:1.6}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3rem}
.value-card{background:var(--white);border-radius:var(--radius-lg);padding:2.2rem;border:1px solid var(--gray-2);transition:var(--transition)}
.value-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);border-color:var(--foam)}
.value-ico{font-size:2.2rem;margin-bottom:1rem}
.value-title{font-family:var(--ff-display);font-size:1.25rem;font-weight:700;color:var(--ink);margin-bottom:.5rem}
.value-text{font-size:.87rem;color:var(--gray-4);line-height:1.72}
.awards-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:3rem;padding:2.5rem;background:var(--sand);border-radius:var(--radius-lg)}
.award{text-align:center}.award-ico{font-size:2rem;margin-bottom:.5rem}
.award-title{font-weight:700;color:var(--ink);font-size:.9rem}
.award-body{font-size:.77rem;color:var(--gray-4);margin-top:.2rem}


/* ══════════════════════════════════════════════════════
   REDISEÑO RESPONSIVO — Nosotros
   ══════════════════════════════════════════════════════ */
.team-card{transition:.3s}
.team-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.value-card{transition:.3s}
.value-card:hover{transform:translateY(-5px)}

@media(max-width:1024px){
  .about-story{grid-template-columns:1fr;gap:2.2rem}
  .about-story-img{max-height:340px;overflow:hidden;border-radius:20px}
  .team-grid{grid-template-columns:repeat(2,1fr);gap:1.4rem}
  .values-grid{grid-template-columns:1fr 1fr;gap:1.4rem}
  .awards-strip{grid-template-columns:1fr 1fr;gap:1.2rem;padding:1.8rem}
}
@media(max-width:760px){
  .about-hero{padding-top:calc(var(--nav-h) + 2rem)}
  .about-hero h1{font-size:clamp(2rem,9vw,2.6rem)}
  .about-story{padding:0 .3rem}
  .values-grid{grid-template-columns:1fr;gap:1rem}
  .team-grid{grid-template-columns:1fr 1fr;gap:.9rem}
  .team-card{padding:1.2rem .9rem}
  .team-avatar{width:70px;height:70px}
  .awards-strip{grid-template-columns:1fr 1fr;gap:.9rem;padding:1.3rem}
  .award{text-align:center}
}
@media(max-width:400px){
  .team-grid{grid-template-columns:1fr}
}
