/* Sobre mí — boceto pág. 6 */
.about-hero { display: grid; gap: var(--sp-8); grid-template-columns: minmax(0, 1fr); align-items: center; padding-block: var(--sp-4) var(--sp-10); }
@media (min-width: 900px) { .about-hero { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); } }
.about-desk {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  border-radius: var(--r-xl);
  background:
    radial-gradient(60% 60% at 50% 45%, var(--c-brand-50), transparent 70%),
    repeating-linear-gradient(135deg, transparent 0 14px, rgba(20, 20, 20, 0.03) 14px 15px),
    var(--c-surface);
  border: var(--border);
}
.about-desk img { width: 62%; max-width: 360px; height: auto; filter: drop-shadow(0 16px 26px rgba(20, 20, 20, 0.18)); }
.about-hero__title { margin: 0 0 var(--sp-2); font-size: var(--fs-3xl); font-weight: var(--fw-semibold); }
.about-hero__sub { font-size: var(--fs-lg); color: var(--c-ink); font-weight: var(--fw-medium); }
.about-rule { width: 56px; border-top: 2px solid var(--c-ink); margin: var(--sp-4) 0; }
.about-features { display: grid; gap: var(--sp-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); margin-top: var(--sp-6); }
.about-features li { display: flex; gap: var(--sp-3); align-items: flex-start; font-size: var(--fs-sm); }
.about-features__icon { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: var(--r-sm); border: var(--border-strong); background: var(--c-surface); }
.about-grid { display: grid; gap: var(--sp-4); grid-template-columns: minmax(0, 1fr); margin-bottom: var(--sp-4); }
@media (min-width: 1024px) { .about-grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 2fr); } }
.about-tools { display: grid; gap: var(--sp-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }
.about-tools li { display: flex; gap: var(--sp-3); align-items: center; font-size: var(--fs-sm); }
.about-tools__abbr { display: grid; place-items: center; flex: 0 0 auto; width: 52px; height: 52px; border-radius: var(--r-sm); border: 2px solid var(--c-ink); font-size: var(--fs-xl); font-weight: var(--fw-bold); }
.about-cta { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; padding: var(--sp-5) var(--sp-6); }
.admin-form { display: grid; gap: var(--sp-4); }
