.about-grid { display: grid; grid-template-columns: 1fr 280px; gap: 4rem; align-items: start; }

.about-text p { color: var(--slate-light); margin-bottom: 1rem; }
.about-text p:last-of-type { margin-bottom: 0; }
.about-text strong { color: var(--white); }

.skills-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 1.5rem; }
.skills-list li {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.85rem; color: var(--slate-light); font-family: var(--font-display);
}
.skills-list li::before { content: '▸'; color: var(--blue); flex-shrink: 0; }

.avatar-box { position: relative; }
.avatar-img {
  width: 100%; aspect-ratio: 1; border-radius: 8px;
  background: var(--card-bg); border: 2px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 5rem; overflow: hidden;
}
.avatar-img img { width: 100%; height: 100%; object-fit: cover; }
.avatar-box::after {
  content: ''; position: absolute; top: 12px; left: 12px;
  width: 100%; aspect-ratio: 1;
  border: 2px solid var(--blue); border-radius: 8px;
  z-index: -1; transition: all 0.3s;
}
.avatar-box:hover::after { top: 8px; left: 8px; }

@media (max-width: 720px) {
  .about-grid { grid-template-columns: 1fr; }
  .avatar-box { max-width: 220px; margin: 0 auto; }
}