/* =============================================================================
   ABOUT component — default theme
   ============================================================================= */

.page-about {
  min-height: 60vh;
}

.about-bio { font-size: 1.05rem; color: #444; margin-bottom: 40px; }
.section-heading { margin-bottom: 24px; }

/* ── Skill pill — shared base ────────────────────────────────────────────── */
.skill-core-card,
.skill-tag {
  display: inline-flex;
  align-items: center;
  padding: 9px 22px;
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 700;
  white-space: nowrap;
  letter-spacing: 0.01em;
  transition: opacity 0.15s;
}
.skill-core-card:hover,
.skill-tag:hover { opacity: 0.85; }

/* ── Core Skills — group colour ─────────────────────────────────────────── */
.skills-core-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
  margin-bottom: 36px;
}
.skill-core-card {
  background: #1a1a2e;
  color: #fff;
}

/* ── Additional Skills ───────────────────────────────────────────────────── */
.skills-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
  margin-bottom: 24px;
}
.skill-tag {
  background: #e8f0fb;
  color: #0f3460;
}

/* ── Soft Skills — italic variant ────────────────────────────────────────── */
.skill-soft-tags .skill-tag {
  background: #f0eafa;
  color: #4a2f7a;
  font-style: italic;
  font-weight: 600;
}

/* ── Tools Stack — monospace variant ────────────────────────────────────── */
.skill-tool-tags .skill-tag {
  background: #f0f0f0;
  color: #333;
  font-family: ui-monospace, 'SF Mono', 'Cascadia Code', monospace;
  font-size: 0.83rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* ── Resume button row ──────────────────────────────────────────────────── */
.about-resume-row {
  display: flex;
  justify-content: center;
  margin: 24px 0 36px;
}
.about-resume-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 44px;
  border-radius: 24px;
  font-size: 0.95rem;
  font-weight: 700;
  text-decoration: none !important;
  letter-spacing: 0.02em;
  background: #1a1a2e;
  color: #fff !important;
  border: 2px solid #1a1a2e;
  transition: background 0.18s, transform 0.12s;
  box-shadow: 0 2px 10px rgba(0,0,0,0.12);
}
.about-resume-btn:hover {
  background: #0f3460;
  border-color: #0f3460;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}
.about-resume-btn:active {
  transform: translateY(0);
}