.about { overflow: hidden; }
.about > .section__inner > .reveal { max-width: 1020px; }
.about__body { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: clamp(32px, 5vw, 72px); margin-top: 42px; }
.about__body .details-section__copy p:last-child { margin-bottom: 0; }
.about-portrait { width: min(100%, 400px); margin: 0 auto; padding: 40px 42px 66px; perspective: 1000px; }
.about-portrait__float { animation: portraitFloat 7s ease-in-out infinite; transform-style: preserve-3d; }
.about-portrait__stage { position: relative; width: 100%; aspect-ratio: 1; transform-style: preserve-3d; transform: rotateX(calc(4deg + var(--portrait-x, 0deg))) rotateY(calc(-7deg + var(--portrait-y, 0deg))) rotateZ(-3deg); }
.about-portrait__halo { position: absolute; inset: -28%; border-radius: 50%; background: radial-gradient(ellipse at 20% 45%, rgba(247,156,53,.18), transparent 58%), radial-gradient(ellipse at 80% 60%, rgba(181,137,255,.22), transparent 62%); filter: blur(20px); transform: translateZ(-45px); }
.about-portrait__plane { position: absolute; inset: -9px; border: 1px solid rgba(181,137,255,.45); border-radius: 28px; pointer-events: none; }
.about-portrait__plane--back { background: linear-gradient(135deg, rgba(121,183,255,.12), rgba(181,137,255,.04)); transform: translate3d(13px, -8px, -28px) rotate(9deg); }
.about-portrait__plane--front { border-color: rgba(247,156,53,.6); transform: translate3d(-10px, 8px, -10px) rotate(-4deg); }
.about-portrait__photo { position: relative; padding: 3px; border-radius: 24px; background: linear-gradient(135deg, var(--orange), rgba(181,137,255,.4) 48%, var(--blue)); box-shadow: 0 25px 55px rgba(0,0,0,.5); transform: translateZ(24px); }
.about-portrait__photo img { width: 100%; height: auto; border-radius: 21px; }
.about-portrait__orbit { position: absolute; inset: -28px -38px; border: 1px solid rgba(121,183,255,.3); border-left-color: rgba(247,156,53,.75); border-radius: 50%; transform: translateZ(-15px) rotate(-26deg); animation: portraitOrbit 24s linear infinite; }
.about-portrait__orbit span { position: absolute; left: 50%; top: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--orange-2); box-shadow: 0 0 16px var(--orange); }
.about-portrait__star { position: absolute; color: var(--orange-2); text-shadow: 0 0 20px rgba(247,156,53,.8); transform: translateZ(52px); pointer-events: none; }
.about-portrait__star--one { top: -25px; right: -19px; font-size: 33px; }
.about-portrait__star--two { bottom: 10px; left: -28px; font-size: 21px; color: var(--blue); }
.about-portrait__caption { position: absolute; left: 12px; right: -10px; bottom: -38px; display: grid; gap: 5px; padding: 15px 18px; border: 1px solid rgba(181,137,255,.3); border-left: 2px solid var(--orange); border-radius: 12px; background: linear-gradient(120deg, rgba(13,20,33,.97), rgba(13,20,33,.9)); box-shadow: 0 12px 25px rgba(0,0,0,.3); transform: translateZ(50px) rotate(3deg); }
.about-portrait__caption strong { font-size: 22px; font-weight: 600; }
.about-portrait__caption span { color: #b7c3d5; font-size: 13px; line-height: 1.5; }
.about-portrait:not(.is-in-view) .about-portrait__float,
.about-portrait:not(.is-in-view) .about-portrait__orbit { animation-play-state: paused; }
@keyframes portraitFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes portraitOrbit { to { transform: translateZ(-15px) rotate(334deg); } }
@media (max-width: 900px) {
  .about__body { grid-template-columns: 1fr; gap: 28px; margin-top: 28px; }
  .about-portrait { width: min(100%, 370px); }
}
@media (max-width: 480px) {
  .about-portrait { padding: 32px 30px 60px; }
  .about-portrait__orbit { inset: -20px -25px; }
  .about-portrait__caption { padding: 12px; left: 0; right: -6px; }
  .about-portrait__caption strong { font-size: 20px; }
  .about-portrait__caption span { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .about-portrait__float, .about-portrait__orbit { animation: none; }
  .about-portrait__stage { transform: rotateZ(-3deg); }
}