/* ==========================================================================
   SOBRE MÍ — bio, números, herramientas
   ========================================================================== */
/* ---------- Números ---------- */
.stats__grid { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--line); }
.stat { padding: 2.4rem 1.4rem 2.4rem 0; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: .6rem; }
.stat + .stat { padding-left: 1.4rem; }
.stat:last-child { border-right: 0; }
.stat__n { font-family: var(--f-display); font-weight: 600; font-size: clamp(3.4rem, 7vw, 7rem); letter-spacing: -.05em; line-height: .9; color: var(--acid); }
.stat__n b { font-weight: inherit; }
.stat__l { font-family: var(--f-mono); font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--smoke); }
/* ---------- Sobre mí ---------- */
.about__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(40px, 7vw, 120px); align-items: start; }
.about__photo { position: sticky; top: 14vh; }
.about__frame { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--radius); background: var(--acid); }
.about__frame img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.25) brightness(1.05); mix-blend-mode: multiply; transform-origin: center 40%; }
.about__frame::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, color-mix(in srgb, var(--ink) 55%, transparent)); }
.about__photo figcaption { color: var(--smoke); margin-top: 1rem; font-size: .72rem; }
.about__bio { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.4rem, 2.4vw, 2.3rem); letter-spacing: -.02em; line-height: 1.18; margin: 2.4rem 0 3rem; }
.facts > div { display: grid; grid-template-columns: 160px 1fr; gap: 1rem; padding: 1rem 0; border-top: 1px solid var(--line); }
.facts dt { font-family: var(--f-mono); font-size: .75rem; color: var(--smoke); text-transform: uppercase; letter-spacing: .06em; padding-top: .2em; }
/* ---------- Herramientas ---------- */
.tools { padding: clamp(80px, 12vh, 140px) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tools__label { padding: 0 var(--gutter); }
.tools .marquee__track span { font-size: clamp(3rem, 8vw, 7.5rem); padding: .1em 0; }
@media (max-width: 1100px) {
  .stats__grid { grid-template-columns: repeat(3, 1fr); }
  .stat:nth-child(3) { border-right: 0; }
  .stat:nth-child(n+4) { border-top: 1px solid var(--line); }
  .stat:nth-child(4) { padding-left: 0; }
}
@media (max-width: 900px) {
  .about__grid { grid-template-columns: 1fr; }
  .about__photo { position: relative; top: 0; max-width: 420px; }
  .facts > div { grid-template-columns: 1fr; gap: .2rem; }
}
@media (max-width: 600px) {
  .stats__grid { grid-template-columns: 1fr 1fr; }
  .stat, .stat + .stat { padding: 1.8rem 1rem 1.8rem 0; border-right: 0; border-top: 1px solid var(--line); }
  .stat:nth-child(odd) { border-right: 1px solid var(--line); }
  .stat:nth-child(even) { padding-left: 1rem; }
}