/* ─── About ────────────────────────────────────────────────────
   Founder-led and short; text as approved by Amy. */

.page-about .nav-mark { opacity: 1; }
.page-about .nav:not(.is-solid) .nav-mark,
.page-about .nav:not(.is-solid) .nav-login { text-shadow: 0 0 18px var(--paper), 0 0 6px var(--paper); }
.page-about .nav.is-solid { background: var(--paper); }

.ab-open {
  position: relative; isolation: isolate; overflow: hidden; text-align: center;
  padding: clamp(130px, 22vh, 210px) var(--gutter) clamp(150px, 26vh, 250px);
}
.ab-scene {
  position: absolute; inset: auto 0 0 0; height: 70%; z-index: -1;
  background: url("/assets/scenes/arrival/mobile.webp") center 75% / cover no-repeat;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.55) 40%, #000 75%, transparent 100%);
          mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.55) 40%, #000 75%, transparent 100%);
  opacity: .8;
}
@media (min-width: 768px) { .ab-scene { background-image: url("/assets/scenes/arrival/desktop.webp"); background-position: center 70%; } }
.ab-eyebrow { display: block; margin-bottom: 22px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--driftwood); }
.ab-open h1 {
  font-family: var(--serif); font-weight: normal;
  font-size: clamp(40px, 5.6vw, 86px); line-height: 1.02; letter-spacing: -0.03em; color: var(--charcoal);
  max-width: 980px; margin: 0 auto; text-wrap: balance;
}
.ab-lead {
  position: relative; max-width: 560px; margin: clamp(22px, 3.6vh, 32px) auto 0; text-wrap: balance;
  font-family: var(--serif); font-style: italic; font-size: clamp(19px, 1.9vw, 24px); line-height: 1.45; color: var(--deep);
}
.ab-lead::before {
  content: ""; position: absolute; inset: -22px -60px; z-index: -1;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--paper) 92%, transparent) 45%, color-mix(in srgb, var(--paper) 0%, transparent));
}

.ab-story { max-width: 640px; margin: 0 auto; padding: clamp(40px, 7vh, 80px) var(--gutter) clamp(70px, 12vh, 120px); }
.ab-story p {
  font-family: var(--serif); font-size: clamp(19px, 1.65vw, 22px); line-height: 1.65; color: var(--charcoal);
}
.ab-story p + p { margin-top: 1.1em; }
.ab-story .ab-key {
  margin: 1.4em 0; font-size: clamp(24px, 2.4vw, 32px); line-height: 1.3; letter-spacing: -0.01em;
}
.ab-story .ab-key strong { font-weight: normal; font-style: italic; }
.ab-sign { margin-top: clamp(36px, 6vh, 56px); padding-top: 22px; border-top: 1px solid var(--sand); }
.ab-story .ab-name { font-family: var(--serif); font-size: 22px; line-height: 1.3; color: var(--charcoal); }
.ab-story .ab-meta { margin-top: 4px; font-family: var(--sans); font-size: 14px; line-height: 1.5; color: var(--driftwood); }

.ab-end { text-align: center; padding: 0 var(--gutter) clamp(100px, 16vh, 160px); }
.ab-cta { display: inline-block; font-size: 15px; color: var(--paper); background: var(--charcoal); border-radius: 999px; padding: 14px 28px; }
.ab-cta:hover { background: #3a332d; }

@media (max-width: 600px) {
  .ab-open { padding-top: 120px; padding-bottom: 150px; }
}
