/* ═══════════════════════════════════════════════════════════════════════
   ic-about.css — Página "Quiénes somos" (/quienes-somos)
   Namespaced bajo .ic-about. Usa los tokens vivos --ict-* de ic-tournament.css.
   Reutiliza .wrap, .page-hero, .section-tag, .grad, .lead, .divider, .btn-lg,
   .final-cta, .cta-row y el reveal global (.reveal → .show).
   ═══════════════════════════════════════════════════════════════════════ */

.ic-about{
  --ab-serif:'Fraunces', Georgia, 'Times New Roman', serif;
  --ab-mono:'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --ab-ease:cubic-bezier(.19,1,.22,1);
  --ab-bg-3:#0f0f16;
}
.ic-about *{box-sizing:border-box;}

/* ---- eyebrow con guion (variante del section-tag) ---- */
.ic-about .ab-eyebrow{
  font-family:var(--ab-mono); font-size:11.5px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--ict-gold); display:inline-flex; align-items:center; gap:.7em;
}
.ic-about .ab-eyebrow::before{content:""; width:22px; height:1px; background:linear-gradient(90deg,var(--ict-gold),transparent);}
.ic-about .ab-idx{font-family:var(--ab-mono); font-size:11.5px; letter-spacing:.14em; color:var(--ict-faint);}

/* ---- HERO meta ---- */
.ic-about .ab-hero-meta{
  display:flex; flex-wrap:wrap; gap:14px 34px; margin-top:38px;
  font-family:var(--ab-mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ict-faint);
}
.ic-about .ab-hero-meta span{display:inline-flex; align-items:center; gap:9px;}
.ic-about .ab-hero-meta span::before{content:""; width:5px; height:5px; background:var(--ict-gold); border-radius:50%; box-shadow:0 0 8px var(--ict-gold);}

/* ---- columna statement (título + anotación) ---- */
.ic-about .ab-stmt{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(28px,5vw,84px); align-items:start;}
.ic-about .ab-stmt-l .ab-eyebrow{margin-bottom:22px;}
.ic-about .ab-stmt-l h2{font-family:var(--ab-serif); font-weight:400; line-height:1.08; letter-spacing:-.015em; font-size:clamp(28px,3.4vw,46px);}
.ic-about .ab-stmt-r{color:var(--ict-muted); display:flex; flex-direction:column; gap:18px; padding-top:6px; max-width:52ch;}
.ic-about .ab-stmt-r strong{color:var(--ict-text); font-weight:600;}

/* ---- Problema (pull quote) ---- */
.ic-about .ab-quote{
  font-family:var(--ab-serif); font-weight:400; font-size:clamp(28px,4.2vw,54px); line-height:1.14; letter-spacing:-.02em;
  max-width:22ch; margin:0;
}
.ic-about .ab-quote small{
  display:block; font-size:.42em; font-family:'Inter',sans-serif; color:var(--ict-muted);
  letter-spacing:0; line-height:1.65; max-width:46ch; margin-top:32px; font-style:normal;
}

/* ---- Lo que NO somos ---- */
.ic-about .ab-nots{list-style:none; display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 0; padding:0;}
.ic-about .ab-nots li{
  font-family:var(--ab-mono); font-size:12px; letter-spacing:.05em; color:var(--ict-faint);
  border:1px solid var(--ict-line-soft); border-radius:999px; padding:8px 15px;
  text-decoration:line-through; text-decoration-color:rgba(212,175,55,.55); text-decoration-thickness:1px;
}
.ic-about .ab-is{margin-top:26px; font-size:clamp(17px,1.5vw,20px); color:var(--ict-text); max-width:52ch; line-height:1.5;}
.ic-about .ab-is b{color:var(--ict-gold-2); font-weight:600;}

/* ---- Competencias ---- */
.ic-about .ab-comps{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1px; margin-top:44px;
  background:var(--ict-line-soft); border:1px solid var(--ict-line-soft); border-radius:14px; overflow:hidden;
}
.ic-about .ab-comps div{
  background:var(--ict-bg); padding:16px 18px; font-size:13.5px; color:var(--ict-muted);
  display:flex; align-items:center; gap:11px; transition:background .25s, color .25s;
}
.ic-about .ab-comps div:hover{background:var(--ict-bg-2); color:var(--ict-text);}
.ic-about .ab-comps div::before{content:""; width:6px; height:6px; flex:none; border:1px solid var(--ict-gold); border-radius:2px; transform:rotate(45deg);}

/* ---- Perfil (artefacto central) ---- */
.ic-about .ab-profile{background:var(--ict-bg-2); border-block:1px solid var(--ict-line-soft);}
.ic-about .ab-profile-grid{display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(30px,5vw,72px); align-items:center;}
.ic-about .ab-profile-copy h2{font-family:var(--ab-serif); font-weight:400; line-height:1.08; letter-spacing:-.015em; font-size:clamp(26px,3.2vw,44px); margin:20px 0 0;}
.ic-about .ab-profile-copy p{color:var(--ict-muted); margin-top:22px; max-width:52ch;}
.ic-about .ab-receivers{display:flex; flex-wrap:wrap; gap:8px; margin-top:26px;}
.ic-about .ab-receivers span{
  font-family:var(--ab-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ict-muted);
  border:1px solid var(--ict-line-soft); border-radius:6px; padding:6px 11px;
}

.ic-about .ab-card{
  background:linear-gradient(180deg,var(--ab-bg-3),#0a0a10);
  border:1px solid var(--ict-line); border-radius:18px; padding:26px; position:relative; overflow:hidden;
  box-shadow:0 40px 90px -50px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.04);
}
.ic-about .ab-card::before{content:""; position:absolute; inset:0; background:radial-gradient(120% 60% at 90% -10%, rgba(212,175,55,.12), transparent 55%); pointer-events:none;}
.ic-about .ab-card-tag{position:absolute; top:14px; right:16px; font-family:var(--ab-mono); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--ict-faint);}
.ic-about .ab-card-head{display:flex; align-items:center; gap:16px; position:relative;}
.ic-about .ab-ava{width:56px; height:56px; flex:none; border-radius:14px; display:grid; place-items:center; font-family:var(--ab-serif); font-size:24px; color:#1a1406; background:linear-gradient(145deg,var(--ict-gold-2),var(--ict-gold-deep));}
.ic-about .ab-card-head h4{font-family:var(--ab-serif); font-size:21px; font-weight:500; line-height:1.1; margin:0;}
.ic-about .ab-handle{font-family:var(--ab-mono); font-size:12px; color:var(--ict-muted); letter-spacing:.04em;}
.ic-about .ab-verified{display:inline-flex; align-items:center; gap:6px; margin-top:6px; font-family:var(--ab-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ict-green);}
.ic-about .ab-verified svg{width:13px; height:13px;}
.ic-about .ab-metrics{margin-top:24px; display:flex; flex-direction:column; gap:15px; position:relative;}
.ic-about .ab-metric{display:grid; grid-template-columns:1fr auto; gap:6px 12px; align-items:center;}
.ic-about .ab-metric .k{font-size:12.5px; color:var(--ict-muted);}
.ic-about .ab-metric .v{font-family:var(--ab-mono); font-size:12.5px; color:var(--ict-text); font-variant-numeric:tabular-nums;}
.ic-about .ab-bar{grid-column:1/-1; height:5px; border-radius:99px; background:rgba(255,255,255,.06); overflow:hidden;}
.ic-about .ab-bar i{display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,var(--ict-gold-deep),var(--ict-gold-2)); width:var(--w,60%);}
.ic-about .ab-card-foot{margin-top:24px; padding-top:18px; border-top:1px solid var(--ict-line-soft); display:flex; justify-content:space-between; align-items:center; gap:12px; position:relative;}
.ic-about .ab-specs{display:flex; flex-wrap:wrap; gap:6px;}
.ic-about .ab-specs span{font-family:var(--ab-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--ict-gold); border:1px solid var(--ict-line); border-radius:5px; padding:4px 8px;}
.ic-about .ab-hashline{font-family:var(--ab-mono); font-size:10px; color:var(--ict-faint); letter-spacing:.05em;}

/* ---- Filosofía ---- */
.ic-about .ab-principle-lead{font-family:var(--ab-serif); font-weight:400; font-size:clamp(26px,3.4vw,44px); line-height:1.16; letter-spacing:-.015em; max-width:16ch; margin-top:22px;}
.ic-about .ab-principle-lead em{color:var(--ict-gold-2); font-style:italic;}
.ic-about .ab-prins{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; margin-top:52px; background:var(--ict-line-soft); border:1px solid var(--ict-line-soft); border-radius:16px; overflow:hidden;}
.ic-about .ab-prin{background:var(--ict-bg); padding:30px 28px; transition:background .3s;}
.ic-about .ab-prin:hover{background:var(--ict-bg-2);}
.ic-about .ab-prin .ab-idx{display:block; margin-bottom:16px;}
.ic-about .ab-prin h3{font-family:var(--ab-serif); font-weight:500; font-size:20px; margin:0;}
.ic-about .ab-prin p{color:var(--ict-muted); font-size:14.5px; margin-top:10px; max-width:42ch;}

/* ---- Estado / construido en público ---- */
.ic-about .ab-status{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:44px; background:var(--ict-line-soft); border:1px solid var(--ict-line-soft); border-radius:16px; overflow:hidden;}
.ic-about .ab-st{background:var(--ict-bg); padding:26px 24px;}
.ic-about .ab-st .ab-dot{display:inline-flex; align-items:center; gap:9px; font-family:var(--ab-mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;}
.ic-about .ab-st .ab-dot::before{content:""; width:7px; height:7px; border-radius:50%;}
.ic-about .ab-st.is-live .ab-dot{color:var(--ict-green);} .ic-about .ab-st.is-live .ab-dot::before{background:var(--ict-green); box-shadow:0 0 9px var(--ict-green);}
.ic-about .ab-st.is-dev  .ab-dot{color:#d98f4e;}          .ic-about .ab-st.is-dev  .ab-dot::before{background:#d98f4e;}
.ic-about .ab-st.is-next .ab-dot{color:#7aa2d9;}          .ic-about .ab-st.is-next .ab-dot::before{background:#7aa2d9;}
.ic-about .ab-st h3{font-family:var(--ab-serif); font-weight:500; font-size:19px; margin:16px 0 8px;}
.ic-about .ab-st p{font-size:13.5px; color:var(--ict-muted); margin:0; max-width:34ch;}

/* ═══════════════════════ RESPONSIVE ═══════════════════════ */
@media (max-width:920px){
  .ic-about .ab-profile-grid{grid-template-columns:1fr; gap:34px;}
}
@media (max-width:860px){
  .ic-about .ab-stmt{grid-template-columns:1fr; gap:26px;}
}
@media (max-width:720px){
  .ic-about .ab-prins{grid-template-columns:1fr;}
  .ic-about .ab-status{grid-template-columns:1fr;}
}