/* about.css
   --------------------------------------------------
   Bootstrap-first polish for the About page
   (No custom grids / no layout replacements)
   -------------------------------------------------- */

/* Surfaces */
.about-callout{
  background: rgba(255,255,255,.28);
  border: 1px solid var(--ks-border);
  color: var(--ks-ink);
}
.about-card{
  background: rgba(255,255,255,.22);
  border: 1px solid var(--ks-border);
  color: var(--ks-ink);
}

/* Keep long bio text readable */
.about-prose p{
  margin-bottom: 1.1rem;
}
.about-prose p:last-child{
  margin-bottom: 0;
}

.about-prose{
  max-width: 68ch;
  margin: 0 auto;
}

.about-prose p,
.about-prose li{
  font-size: clamp(1.06rem, 0.26vw + 1rem, 1.16rem);
  line-height: 1.82;
  color: #1a202d;
  font-weight: 500;
  text-wrap: pretty;
}

.about-callout p{
  font-weight: 500;
}

.about-page section > .row > .col-12.col-lg-7 > p{
  font-weight: 500;
}

.about-quote{
  margin: .14rem 0 0;
  padding: .68rem .9rem;
  border-left: 4px solid var(--brand-navy);
  background: rgba(26,32,45,.06);
  color: #0b1220;
  font-style: italic;
  font-size: 1.03rem;
  line-height: 1.68;
  font-weight: 500;
}

/* Images: subtle border (no color shift) */
.about-page img{
  border: 1px solid rgba(26,32,45,.10);
}

/* Mobile tweaks */
@media (max-width: 420px){
  .about-page p{ font-size: 1rem; }
}