/* Pinecore — estilos propios de sobre-nosotros.html. Requiere base.css */

/* hero */
.hero{padding:76px 0 60px;position:relative;overflow:hidden;}
.hero-content{position:relative;z-index:1;text-align:center;max-width:700px;margin:0 auto;}
.pill{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--card);padding:7px 16px;border-radius:30px;font-size:13px;color:var(--text-soft);margin-bottom:26px;}
.pill .lit{width:6px;height:6px;border-radius:50%;background:var(--pine);box-shadow:0 0 8px var(--pine);}
.hero h1{font-size:48px;font-weight:600;line-height:1.1;letter-spacing:-0.01em;margin-bottom:20px;}
.hero h1 .grad{background:linear-gradient(90deg,#0B4FC4,#4C86F5);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero p.lead{color:var(--text-soft);font-size:17px;max-width:560px;margin:0 auto;}

.section{padding:70px 0;}
.sec-head{max-width:600px;margin:0 auto 50px;text-align:center;}
.sec-eyebrow{font-size:13px;font-weight:600;color:var(--blue);margin-bottom:14px;display:block;}
.sec-head h2{font-size:32px;font-weight:600;margin-bottom:14px;line-height:1.18;}
.sec-head p{color:var(--text-soft);font-size:16px;}

/* team */
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.team-card{
  border:1px solid var(--line);background:var(--bg-soft);border-radius:16px;padding:40px;
  display:flex;flex-direction:column;
}
.avatar{
  width:76px;height:76px;border-radius:50%;
  background:linear-gradient(135deg,var(--blue),#4C86F5);
  color:#fff;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:26px;
  display:flex;align-items:center;justify-content:center;margin-bottom:24px;
  box-shadow:0 14px 30px -14px rgba(11,79,196,.55);
}
.team-card h3{font-size:21px;font-weight:600;margin-bottom:4px;}
.team-card .role{font-size:13.5px;color:var(--blue);font-weight:600;margin-bottom:18px;}
.team-card p.bio{font-size:14.5px;color:var(--text-soft);margin-bottom:22px;flex:1;}
.team-card .tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px;}
.team-card .tag{font-size:12px;background:var(--blue-soft);color:var(--blue);padding:5px 11px;border-radius:20px;font-weight:600;}
.li-btn{
  display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;
  padding:10px 18px;border-radius:7px;font-size:13.5px;font-weight:600;align-self:flex-start;
  transition:all .18s ease;
}
.li-btn:hover{border-color:var(--blue);color:var(--blue);}
.li-btn svg{flex-shrink:0;}

/* how we work together */
.duo{display:grid;grid-template-columns:repeat(3,1fr);gap:0;position:relative;}
.duo::before{
  content:"";position:absolute;top:23px;left:16.6%;right:16.6%;height:1px;
  background:repeating-linear-gradient(90deg, var(--blue) 0 8px, transparent 8px 16px);
}
.duo-step{text-align:center;padding:0 24px;position:relative;}
.duo-node{
  width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid var(--blue);
  display:flex;align-items:center;justify-content:center;margin:0 auto 20px;position:relative;z-index:2;color:var(--blue);font-weight:700;font-size:18px;
}
.duo-step h3{font-size:16.5px;font-weight:600;margin-bottom:10px;}
.duo-step p{font-size:13.5px;color:var(--text-soft);max-width:230px;margin:0 auto;}

/* values */
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden;}
.value{background:#fff;padding:30px;}
.value-icon{width:40px;height:40px;border-radius:10px;background:var(--blue-soft);color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:16px;}
.value h3{font-size:16px;font-weight:600;margin-bottom:8px;}
.value p{font-size:13.5px;color:var(--text-soft);}

.cta{border-radius:20px;padding:64px 50px;text-align:center;position:relative;overflow:hidden;background:var(--bg-soft);border:1px solid var(--line);}
.cta-content{position:relative;z-index:1;}
.cta h2{font-size:32px;font-weight:600;margin-bottom:14px;}
.cta p{color:var(--text-soft);font-size:15.5px;margin-bottom:28px;max-width:460px;margin-left:auto;margin-right:auto;}
.cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

@media(max-width:900px){
  .hero h1{font-size:32px;}
  .team-grid{grid-template-columns:1fr;}
  .duo{grid-template-columns:1fr;gap:32px;}
  .duo::before{display:none;}
  .values-grid{grid-template-columns:1fr;}
  .section{padding:50px 0;}
  .team-card{padding:28px;}
}
