/* About page — Figma 2272:1249 (1920 frame, 1290 container) */

/* ---------- Portrait + bio ---------- */
.about-bio { overflow: clip; }
.about-bio__glow { top: -20rem; left: -52rem; opacity: 0.6; }          /* 2182px glow top-left */
.about-bio__glow--right { top: -6rem; right: -36rem; opacity: 0.5; }   /* 1042px glow right of the bio */
.about-bio__waves { --waves-width: 78rem; right: -30rem; bottom: -12rem; opacity: 0.45; }

.about-bio__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(2rem, 1rem + 4vw, 7.0625rem);   /* 113 at 1920 */
}

.about-bio__media {
  flex: 1 1 0%;
  max-width: 32.25rem;                       /* 516 */
}
.about-bio__img { aspect-ratio: 516 / 716; }

.about-bio__content {
  --flow-space: 1.875rem;                    /* 30 between paragraphs */
  flex: 1 1 0%;
  max-width: 38.6875rem;                     /* 619 */
  font-size: var(--fs-base);
  line-height: var(--lh-body);               /* 18 / 30 */
  color: var(--c-text);
}
.about-bio__content .heading-3 { margin-bottom: -0.4375rem; }  /* heading → first paragraph = 23 */

.about-bio__link { color: var(--c-white); text-decoration: underline; text-underline-offset: 0.2em; }
.about-bio__link:hover,
.about-bio__link:focus-visible { color: var(--c-gold); }

/* ---------- Feature items (3-up grid) ---------- */
.about-features {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  grid-column-gap: clamp(1.5rem, 0.5rem + 2.5vw, 4rem);      /* 64 */
  grid-row-gap: 2rem;
  align-items: start;
  justify-items: stretch;
  margin: clamp(3rem, 2rem + 3vw, 6.25rem) 0 0;             /* 100 below the portrait */
  padding: 0 0 0 1rem;                                       /* Figma row starts 16px inside the container */
  list-style: none;
}

.about-feature {
  display: flex;
  align-items: flex-start;
  gap: 1.75rem;                                              /* 28: icon 60 wide + gap → text at +89 */
}

.about-feature__icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.875rem;                                           /* 62 */
  height: 3.75rem;                                           /* 60 */
  margin-top: 0.625rem;
  color: var(--c-gold);
}
.about-feature__icon svg { width: 100%; height: 100%; }

.about-feature__body { max-width: 18rem; }                   /* 288 */

.about-feature__title {
  font-size: var(--fs-md);
  font-weight: 500;
  line-height: 1.545;                                        /* 22 / 34 */
  letter-spacing: var(--ls-sub);
  color: var(--c-white);
}

.about-feature__text {
  margin-top: 1.4375rem;                                     /* 23 */
  font-size: var(--fs-base);
  line-height: var(--lh-body);
  color: var(--c-text);
}

/* ---------- Responsive ---------- */
@media (max-width: 1280px) {
  .about-features { padding-left: 0; }
}

@media (max-width: 991px) {
  .about-bio__row { flex-direction: column; align-items: stretch; margin-inline: auto; max-width: 40rem; }
  .about-bio__media,
  .about-bio__content { flex: none; max-width: none; }
  .about-features { grid-template-columns: 1fr 1fr; }
  .about-feature__body { max-width: none; }
}

@media (max-width: 767px) {
  .about-features { grid-template-columns: 1fr; }
  .about-feature__text { margin-top: 0.75rem; }
}

@media (max-width: 479px) {
  .about-feature { gap: 1.25rem; }
  .about-feature__icon { width: 3rem; height: 3rem; margin-top: 0.25rem; }
}