/* ============================================================
   ABOUT
   ============================================================ */

.about{
  display: grid;
  grid-template-columns: minmax(240px, 340px) 1fr;
  gap: 3rem;
  align-items: start;
}
.about__portrait img{
  border-radius: 6px;
  border: 1px solid var(--panel-line);
}
.about__body h1{
  font-size: clamp(1.8rem, 3vw, 2.4rem);
}
.about__role{
  font-family: var(--font-mono);
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  color: var(--accent-2);
  text-transform: uppercase;
  margin-top: 0.4rem;
}
.about__body p{
  text-align: justify;
  color: var(--paper);
  font-size: 1rem;
}
@media (max-width: 700px){
  .about, .contact{ grid-template-columns: 1fr; gap: 1.5rem; }
  .about__body p{ text-align: left; }
}