/* Final compositing pass: the portrait field dissolves into the site's black. */
html, body { background: #000; }
.about-identity,
.identity-layout,
.identity-image { background: #000; }
.identity-image::after {
  background:
    linear-gradient(90deg, rgba(0,0,0,0) 22%, #000 98%),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,0) 48%);
}
.identity-signal {
  left: 8%;
  right: 28%;
  z-index: 6;
  animation-fill-mode: both;
  backface-visibility: hidden;
}
.about-identity {
  /* The whole composition, rather than the portrait, dissolves into page black at camera-left. */
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 15%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 15%, #000 100%);
}
.identity-data dt { color: #ffffff; font-size: 12px; font-weight: 500; }
.identity-data dd { color: #f0f0f0; font-size: 11px; line-height: 1.6; }

/* Keep the full bio comfortably readable at desktop and mobile sizes. */
.identity-bio p { margin-bottom: 20px; color: #d7d7d7; font-size: 14px; line-height: 1.78; letter-spacing: -.02em; }
.identity-bio p:first-child { color: #f0f0f0; }

/* Softer editorial sans system — no serif styling. */
.identity-copy,
.identity-axis,
.identity-role,
.identity-kicker,
.identity-lead,
.identity-bio p,
.identity-data dt,
.identity-data dd { font-family: Inter, Arial, sans-serif; }
.identity-copy h1 {
  font-family: Inter, Arial, sans-serif;
  font-weight: 400;
  letter-spacing: -.065em;
}
@media (max-width: 800px) {
  .identity-bio p { font-size: 13px; line-height: 1.78; }
  .identity-data dt { font-size: 12px; }
  .identity-data dd { font-size: 11px; }
}