/* ============================================
   REDISEÑO 2026 — SOBRE MÍ (sobre-mi.html)
   Presentación con polaroid, cita grande, barras honestas
   de tiempo, herramientas y CTA.
   ============================================ */
.hand{font-family:"Caveat",cursive;font-weight:600}
.ahero{padding-block:56px 64px;border-bottom:1px solid var(--ink);display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:center}
.ahero .kick{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--acc);font-weight:500}
.ahero h1{font-family:"Unbounded","Space Grotesk",sans-serif;font-weight:700;font-size:clamp(30px,4.6vw,56px);line-height:1.1;letter-spacing:-.01em;margin:18px 0 8px}
.ahero .sub{font-size:13.5px;text-transform:uppercase;letter-spacing:.2em;color:var(--muted);display:block;margin-bottom:22px}
.ahero p{color:var(--muted);font-size:16.5px;max-width:52ch;text-wrap:pretty}
.ahero p+p{margin-top:14px}
.ahero p .hl{color:var(--ink);font-weight:600}
.ahero .cta{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.aside-pol{justify-self:center;display:flex;flex-direction:column;gap:22px;align-items:center}
.apol{background:#fff;color:#101010;border:1px solid #d9d9d9;padding:12px 12px 14px;box-shadow:0 20px 44px -18px rgba(0,0,0,.45);width:min(64vw,320px);rotate:-3deg;position:relative}
.apol::before{content:"";position:absolute;top:-14px;left:50%;translate:-50% 0;width:96px;height:28px;background:rgba(240,235,215,.8);border:1px solid rgba(190,180,150,.5);rotate:-2deg}
.apol img{width:100%;border:1px solid #e4e4e4}
.apol .cap{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:10px}
.apol .cap b{font-size:13.5px}
.apol .cap span{font-family:"Caveat",cursive;font-weight:600;font-size:19px;color:#4a463c;rotate:-1deg}
.stat50{border:1px solid var(--ink);padding:16px 22px;display:flex;align-items:center;gap:16px;rotate:1deg;background:var(--bg)}
.stat50 b{font-family:"Unbounded","Space Grotesk",sans-serif;font-weight:700;font-size:34px;color:var(--acc);line-height:1}
.stat50 span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);line-height:1.4}
/* Cita */
.aquote{background:var(--band);color:var(--band-ink);padding-block:76px;text-align:center}
.aquote .idx{color:var(--acc);font-size:13px;text-transform:uppercase;letter-spacing:.08em;font-weight:500}
.aquote blockquote{font-family:"Unbounded","Space Grotesk",sans-serif;font-weight:700;font-size:clamp(22px,3.6vw,42px);line-height:1.25;max-width:22ch;margin:18px auto 0}
/* Barras honestas */
.invest{display:grid;gap:22px;max-width:640px}
.invest .row .lab{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.invest .row .lab svg{color:var(--acc);flex:none}
.invest .ibar{height:8px;background:var(--hov);border:1px solid var(--line);overflow:hidden}
.invest .ibar i{display:block;height:100%;background:var(--acc);width:0;transition:width 1.1s cubic-bezier(.2,.7,.2,1)}
.rv.in .invest .ibar i{width:var(--w)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start}
.stack .grp{margin-bottom:22px}
.stack .glab{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);display:block;margin-bottom:10px}
.stack .chips{display:flex;gap:8px;flex-wrap:wrap}
.stack .chips span{border:1px solid var(--line2);color:var(--ink);font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;padding:7px 13px}
.stack .chips.soft span{color:var(--muted);border-style:dashed}
/* CTA */
.acta{text-align:center;padding-block:88px}
.acta .idx{font-size:13px;color:var(--acc);font-weight:500;text-transform:uppercase;letter-spacing:.08em}
.acta h2{font-family:"Unbounded","Space Grotesk",sans-serif;font-weight:700;font-size:clamp(24px,4vw,46px);margin:16px 0 14px;line-height:1.15}
.acta p{color:var(--muted);max-width:46ch;margin:0 auto 30px;text-wrap:pretty}
.acta .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.acta .li{display:inline-block;margin-top:24px;font-size:13.5px;color:var(--muted)}
.acta .li:hover{color:var(--ink)}
@media(max-width:920px){.ahero{grid-template-columns:1fr}.two{grid-template-columns:1fr}}