/* ============================================================
   EN POINTE CASTING — About Page Styles (v2)
   Minimal: one image, one bio, breathing room only
   ============================================================ */

/* ----------------------------------------------------------
   PAGE HEADER — spare, centered
   ---------------------------------------------------------- */
.a-header {
  padding: calc(var(--nav-h) + 0.5rem) 0 0.25rem;
  text-align: left;
}

.a-header__eyebrow {
  margin-bottom: var(--sp-sm);
  display: block;
  font-size: clamp(0.95rem, 2.2vw, 1.4rem);
  font-weight: 700;
  letter-spacing: 0.12em;
}

.a-header .container--narrow {
  margin-left: 0;
}

.a-bio {
  padding: 0.25rem 0 var(--sp-lg);
  border-top: 1px solid var(--cream-dark);
}

.a-header__title {
  font-family: var(--display);
  font-size: clamp(2.2rem, 6vw, 4.8rem);   /* scaled down from 6.5rem */
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--taupe-dark);
  line-height: 1.0;
}

/* ----------------------------------------------------------
   BIO SECTION — single image + text, side by side
   ---------------------------------------------------------- */
.a-bio {
  padding: var(--sp-xl) 0;
  border-top: 1px solid var(--cream-dark);
}

.a-bio__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-xl);
  align-items: start;
}

/* Photo */
.a-bio__photo-wrap {
  position: relative;
}

.a-bio__photo {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center top;
  filter: sepia(0.08) saturate(0.85);
  display: block;
}

/* Offset rule accent */
.a-bio__photo-rule {
  position: absolute;
  bottom: -16px;
  left: 16px;
  width: 48px;
  height: 1px;
  background-color: var(--amber);
}

/* Text */
.a-bio__text {
  padding-top: 0;
}

.a-bio__text .t-label {
  display: block;
  margin-bottom: var(--sp-sm);
}

.a-bio__name {
  font-family: var(--editorial);      /* Playfair Display — warm editorial serif */
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  font-weight: 700;
  font-style: italic;
  color: var(--taupe-dark);
  line-height: 1.15;
  margin-bottom: var(--sp-xs);
}

.a-bio__role {
  font-family: var(--sans);           /* DM Sans */
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--amber);
  margin-bottom: 0.5rem;
  display: block;
}

.a-bio__copy {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  margin-bottom: var(--sp-md);
}

.a-bio__copy p {
  font-family: var(--sans);           /* DM Sans */
  font-size: 0.92rem;
  font-weight: 300;
  line-height: 1.9;
  color: var(--taupe);
}

.a-bio__copy em {
  font-family: var(--editorial);      /* Playfair for emphasis */
  font-style: italic;
  color: var(--taupe-dark);
}

.a-bio__sig {
  font-family: var(--editorial);      /* Playfair — warm italic signature */
  font-size: 1.6rem;
  font-style: italic;
  font-weight: 400;
  color: var(--taupe-light);
  margin-top: var(--sp-md);
  letter-spacing: 0.04em;
}

/* ----------------------------------------------------------
   RESPONSIVE
   ---------------------------------------------------------- */
@media (max-width: 768px) {
  .a-bio__grid {
    grid-template-columns: 1fr;
    gap: var(--sp-lg);
  }

  .a-bio__photo {
    max-width: 380px;
    aspect-ratio: 4 / 5;
  }

  .a-bio__photo-rule {
    display: none;
  }

  .a-header {
    padding-top: calc(var(--nav-h) + var(--sp-lg));
    text-align: left;
  }
}

@media (max-width: 480px) {
  .a-bio__photo { max-width: 100%; }
}
