/* ============================================================
   HERO — NOSOTROS (centered)
   ============================================================ */
.hero{padding:100px 0 56px;text-align:center}
.h-g{max-width:700px;margin:0 auto}
.h-sub{max-width:580px;margin-left:auto;margin-right:auto}

/* ============================================================
   MANIFIESTO
   ============================================================ */
.mnf{max-width:750px;margin:0 auto;text-align:center}
.mnf blockquote{font-size:clamp(18px,3.5vw,28px);font-weight:600;line-height:1.45;letter-spacing:-.5px;margin-bottom:20px;position:relative;padding:0 16px}
.mnf blockquote .hl{color:var(--mint)}
.mnf cite{font-style:normal;font-family:var(--m);font-size:11px;color:var(--muted);letter-spacing:1px}

/* ============================================================
   VALUES GRID
   ============================================================ */
.vl-g{display:grid;grid-template-columns:1fr;gap:14px}
.vl{padding:24px;text-align:center}
.vl .ic{font-size:28px;margin-bottom:10px}
.vl h3{font-size:16px;font-weight:600;margin-bottom:6px}
.vl p{font-size:13px;color:var(--muted);line-height:1.6}

/* ============================================================
   VISION / MISSION
   ============================================================ */
.vm-g{display:grid;grid-template-columns:1fr;gap:14px}
.vm{padding:28px;border-radius:14px;position:relative;overflow:hidden}
.vm::before{content:'';position:absolute;top:0;left:0;width:4px;height:100%;border-radius:2px}
.vm--vis::before{background:var(--mint)}
.vm--mis::before{background:var(--purple)}
.vm .tg{margin-bottom:8px}
.vm h3{font-size:clamp(18px,3vw,24px);font-weight:700;letter-spacing:-.5px;margin-bottom:8px}
.vm p{font-size:14px;color:var(--muted);line-height:1.7}

/* ============================================================
   TEAM GRID
   ============================================================ */
.tm-g{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.tm{padding:24px;text-align:center}
.tm-av{width:72px;height:72px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 14px;border:2px solid var(--bdr)}
.tm h4{font-size:14px;font-weight:600;margin-bottom:2px}
.tm .role{font-family:var(--m);font-size:10px;color:var(--mint);letter-spacing:.5px;text-transform:uppercase;margin-bottom:6px}
.tm p{font-size:12px;color:var(--muted);line-height:1.5}

/* ============================================================
   TIMELINE HISTORY
   ============================================================ */
.hy-g{display:flex;flex-direction:column;gap:0;max-width:600px;margin:0 auto;position:relative;padding-left:20px}
.hy-g::before{content:'';position:absolute;left:6px;top:24px;bottom:24px;width:2px;background:var(--bdr)}
.hy-i{position:relative;padding:18px 0 18px 24px}
.hy-dt{position:absolute;left:-20px;top:24px;width:12px;height:12px;border-radius:50%;background:var(--mint);border:2px solid var(--bg);z-index:1}
.hy-i .yr{font-family:var(--m);font-size:11px;color:var(--mint);letter-spacing:.5px;margin-bottom:4px}
.hy-i h3{font-size:15px;font-weight:600;margin-bottom:4px}
.hy-i p{font-size:13px;color:var(--muted);line-height:1.6}

/* ============================================================
   TECH STACK
   ============================================================ */
.ts-g{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ts{padding:18px;text-align:center}
.ts .ic{font-size:22px;margin-bottom:6px}
.ts h4{font-size:12px;font-weight:600;margin-bottom:2px}
.ts p{font-size:10px;color:var(--muted);line-height:1.4}

/* ============================================================
   RESPONSIVE (page-specific)
   ============================================================ */
@media(min-width:600px){
  .hero{padding:110px 0 70px}
  .vl-g{grid-template-columns:repeat(3,1fr);gap:16px}
  .vm-g{grid-template-columns:repeat(2,1fr);gap:16px}
  .tm-g{grid-template-columns:repeat(3,1fr);gap:16px}
  .ts-g{grid-template-columns:repeat(4,1fr);gap:12px}
  .hy-g{padding-left:36px}
  .hy-g::before{left:12px}
  .hy-dt{left:-30px}
}
@media(min-width:960px){
  .hero{padding:140px 0 80px}
  .tm-g{grid-template-columns:repeat(4,1fr)}
}