/* About page. Desktop measured at 1440px, mobile at 390px (same conventions as site.css). */

/* ---------- Founder ---------- */
.ab-kendra { border-radius: 36px; object-fit: cover; }
.ab-baby-script { z-index: 1; }
.ab-story__title { margin-top: 15px; max-width: 320px; }
.ab-story__p1 { margin-top: 15px; }
.ab-story__p2 { margin-top: 30px; }
.ab-video { z-index: 1; }
.ab-dome { z-index: 2; }

/* ---------- Team ---------- */
.sec--ab-team-head { overflow-x: clip; overflow-y: visible; z-index: 2; }
.ab-clover { z-index: 3; }
.ab-team-grid { padding-top: 33px; }
.team-card .team-card__loc { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; font-size: 13px; line-height: 17px; }
.team-card a.team-card__loc:hover { color: var(--brown); }
.team-card .pin { width: 10px; height: 14px; fill: var(--blue); }
.team-card .btn.ab-bio { margin-top: 27px; width: 170px; height: 42px; font-size: 16.9px; }

/* ---------- Well-being ---------- */
.ab-angle__title { max-width: 480px; }
.ab-angle__p { margin-top: 18px; max-width: 520px; }

/* ---------- Different ---------- */
.ab-diff__title { max-width: 460px; }
.ab-diff__list li { display: flex; align-items: flex-start; gap: 38px; }
.ab-diff__list li + li { margin-top: 54px; }
.ab-diff__list li:nth-child(3) { margin-top: 56px; }
.ab-diff__list li:nth-child(4) { margin-top: 66px; }
.ab-diff__list img { flex: none; width: 87px; height: 87px; object-fit: contain; }
.ab-diff__list p { max-width: 420px; font-size: 22.5px; line-height: 29.25px; }
.ab-diff__list p.ab-diff__tall { line-height: 36px; }

/* ---------- Welcome ---------- */
.ab-mono { z-index: 2; }
.ab-welcome__title { max-width: 430px; }
.ab-welcome__p { margin-top: 36px; max-width: 490px; }
.btn.ab-welcome__btn { margin-top: 23px; width: 322px; height: 42px; font-size: 16.9px; }

/* ---------- Mobile ---------- */
@media (max-width: 1023px) {
  .sec--ab-hero .stage { padding-bottom: 52px; }
  .ab-kendra { height: 332px; border-radius: 30px; }
  .ab-story__title { margin-top: 11px; max-width: none; }
  .ab-story__p1 { margin-top: 10px; }
  .ab-story__p2 { margin-top: 28px; }
  .sec--ab-video .stage { padding-bottom: 49px; }
  .ab-video { height: 186px; }

  .sec--ab-team-head .stage { padding-bottom: 30px; }
  .ab-team-grid { padding: 0 0 20px; }
  .team-card h3 { margin-top: 26px; }
  .team-card p { margin-top: 13px; }
  .team-card .team-card__loc { margin-top: 15px; }
  .team-card .btn.ab-bio { margin-top: 22px; width: 219px; height: 45px; font-size: 15.8px; }
  .ab-ticker { height: 76px; }

  .sec--ab-angle .stage { padding-bottom: 58px; }
  .ab-angle__title { max-width: 290px; }
  .ab-angle__p { margin-top: 12px; }

  .ab-diff__title { margin-left: 30px; width: 280px; }
  .ab-diff__list { margin-left: 30px; width: 335px; }
  .ab-diff__list li { gap: 10px; }
  .ab-diff__list li + li, .ab-diff__list li:nth-child(3), .ab-diff__list li:nth-child(4) { margin-top: 20px; }
  .ab-diff__list img { width: 57px; height: 57px; }
  .ab-diff__list p { max-width: 265px; font-size: 19px; line-height: 24.7px; }
  .ab-diff__list p.ab-diff__tall { line-height: 30.4px; }

  .sec--ab-welcome .stage { padding-bottom: 50px; }
  .ab-slides { position: relative; margin: 0 0 0 calc((100% - var(--zw, 390px)) / 2); width: var(--zw, 100%); height: 304px; }
  .ab-welcome__title { max-width: 260px; }
  .ab-welcome__p { margin-top: 16px; }
  .btn.ab-welcome__btn { margin-top: 25px; width: 257px; height: 45px; font-size: 15.8px; }
}