/* ============================================
   ABOUT SECTION
   Biography and introduction section
   ============================================ */

.about {
  /* Layout */
  position: relative;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  
  /* Typography */
  text-align: left;
  line-height: 1.6;
  
  /* Visual */
  background: var(--gradient-bg-base);
}


/* ============================================
   SECTION HEADING
   ============================================ */

.about h2 {
  text-align: center;
  font-size: clamp(2rem, 4vw, 2.5rem);
  color: var(--heading-secondary-gradient);
  margin-bottom: 2.5rem;
}


/* ============================================
   SECTION CONTENT
   ============================================ */

.about p {
  margin-top: 4.375rem;
  max-width: 65ch; /* Optimal reading width */
  margin-left: auto;
  margin-right: auto;
}


/* ============================================
   RESPONSIVE DESIGN
   Mobile about section adjustments
   ============================================ */

@media (max-width: 48rem) {
  .about h2 {
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    margin-bottom: 1.5rem;
  }

  .about p {
    margin-top: 2.5rem;
    padding: 0 1rem;
  }
}