/* ============================================================
   about.css — About Amanda
   ============================================================ */
.about-hero { padding: calc(var(--nav-height) + 3rem) 0 clamp(3rem, 6vw, 5rem); background: var(--color-warm-white); border-bottom: 1px solid var(--color-rule); overflow: hidden; }
.about-hero__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(2.5rem, 7vw, 7rem); align-items: center; }
.about-hero__portrait { margin: 0; }
.about-hero__name { font-size: clamp(3rem, 7vw, 6rem); line-height: 0.95; margin: 0.6rem 0 0.6rem; }
.about-hero__role { font-size: 1.1rem; font-weight: 500; color: var(--color-earth); margin-bottom: 1.4rem; }
.about-hero__lead { max-width: 34rem; margin-bottom: 2rem; }
.about-hero__ways { display: flex; gap: 0.8rem; flex-wrap: wrap; margin-bottom: 1.4rem; }
.about-hero__license { font-size: 0.85rem; color: var(--color-ink-70); } /* ink-70: the licence line reads over the placeholder mark in every sky (axe) */
.about-hero__social { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.2rem; font-size: 0.9rem; color: var(--color-ink-70); }
.about-hero__social:has(.social-row:empty) { display: none; }


.about-how { background: var(--color-cream); }
.about-how__title { margin-bottom: 2rem; }
.about-how__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.about-how__item { padding: 0.5rem clamp(1.25rem, 3vw, 2.5rem); border-left: 1px solid var(--color-rule); }
.about-how__item:first-child { padding-left: 0; border-left: 0; }
.about-how__item h3 { font-size: clamp(1.8rem, 2.6vw, 2.3rem); margin-bottom: 0.6rem; color: var(--color-sage); }
.about-how__item:nth-child(2) h3 { color: var(--color-brand); }
.about-how__item:nth-child(3) h3 { color: var(--color-ocean); }
.about-how__item:nth-child(4) h3 { color: var(--color-earth); }
.about-how__item p a { color: var(--color-brand); border-bottom: 1px solid currentColor; }
@media (max-width: 1100px) and (min-width: 901px) { .about-how__grid { grid-template-columns: 1fr 1fr; row-gap: 1.5rem; } .about-how__item:nth-child(3) { padding-left: 0; border-left: 0; } }
.about-how__item p { font-size: 1.08rem; }

.about-areas .contact-areas__grid { margin-top: 1.75rem; }

@media (max-width: 900px) {
  .about-hero__grid { grid-template-columns: 1fr; }
  .about-hero__portrait { max-width: 22rem; margin: 1.5rem auto 1rem; width: calc(100% - 3rem); }
  .about-how__grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .about-how__item { padding: 1.25rem 0 0; border-left: 0; border-top: 1px solid var(--color-rule); }
  .about-how__item:first-child { padding-top: 0; border-top: 0; }
}

/* In her own words: questions people ask, answered by Amanda */
.about-ask { background: var(--color-warm-white, #faf8f3); }
.about-ask__grid { display: grid; grid-template-columns: 0.75fr 1.25fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.about-ask__head { position: sticky; top: calc(var(--nav-now) + 2rem); }
.about-ask__list { margin: 0; display: grid; gap: 0; }
.about-ask__qa { padding: 1.6rem 0 1.7rem; border-top: 1px solid var(--color-line, rgba(0,0,0,0.12)); }
.about-ask__qa:last-child { border-bottom: 1px solid var(--color-line, rgba(0,0,0,0.12)); }
.about-ask__qa dt { font-family: var(--font-display); font-style: italic; font-size: clamp(1.35rem, 2.2vw, 1.7rem); line-height: 1.2; color: var(--color-ink); }
.about-ask__qa dd { margin: 0.7rem 0 0; font-size: 1.08rem; max-width: 40rem; color: var(--color-ink-70); }
@media (max-width: 760px) { .about-ask__grid { grid-template-columns: 1fr; } .about-ask__head { position: static; } }

/* Her market centers, in their own colours, under her title */
.about-hero__mcs { display: flex; align-items: center; gap: 1.6rem; margin: -0.6rem 0 1.6rem; }
.about-hero__mcs img { height: 46px; width: auto; }
.about-hero__mcs img + img { height: 34px; }

/* Her sign-off, set large */
.about-quote { padding: clamp(3.5rem, 8vw, 6rem) 0; background: var(--color-brand-deep, #12302f); color: #f6efdc; text-align: center; }
.about-quote__inner { margin: 0 auto; }
.about-quote blockquote { margin: 0; }
.about-quote blockquote p { font-family: var(--font-display); font-style: italic; font-weight: 400; font-size: clamp(2rem, 4.6vw, 3.6rem); line-height: 1.12; max-width: 20ch; margin: 0 auto; }
.about-quote figcaption { margin-top: 1.4rem; font-size: 0.9rem; color: rgba(246,239,220,0.7); }