/* AONOMA RECRUIT typography refinement
   Keep the architectural/editorial mood, but reduce the heavy black feel of Japanese headings. */

.aonoma-recruit h1.font-sansjp,
.aonoma-recruit h2.font-sansjp,
.aonoma-recruit-detail h1,
.aonoma-recruit-detail h2 {
  font-weight: 500 !important;
  letter-spacing: -0.02em;
  font-synthesis-weight: none;
}

.aonoma-recruit .aonoma-opening-editorial h2,
.aonoma-recruit #aonoma-people h2,
.aonoma-recruit #aonoma-projects h2,
.aonoma-recruit-detail [class*="text-"][class*="font-semibold"] h1,
.aonoma-recruit-detail [class*="text-"][class*="font-semibold"] h2 {
  font-weight: 500 !important;
}

.aonoma-recruit h3,
.aonoma-recruit-detail h3 {
  font-weight: 500 !important;
}

.aonoma-recruit .font-black,
.aonoma-recruit-detail .font-black {
  font-weight: 650 !important;
}

.aonoma-recruit .font-semibold,
.aonoma-recruit-detail .font-semibold {
  font-weight: 500 !important;
}

.aonoma-recruit .font-bold,
.aonoma-recruit-detail .font-bold {
  font-weight: 600 !important;
}

.aonoma-recruit .aonoma-opening-editorial h2 {
  line-height: 1.5;
}

.aonoma-recruit #aonoma-people h2,
.aonoma-recruit #aonoma-projects h2,
.aonoma-recruit-detail h1,
.aonoma-recruit-detail h2 {
  line-height: 1.28;
}

/* PEOPLE main card — the photo itself opens like a single diagonal page.
   The reveal is intentionally slow enough to be visible: the whole image sheet
   rotates from the right/top edge and settles as one flat photograph. */
.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal {
  position: relative;
  isolation: isolate;
  perspective: 1400px;
  transform-style: preserve-3d;
}

.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal::before,
.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal::after {
  display: none !important;
}

.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child {
  perspective: 1400px;
  transform-style: preserve-3d;
}

.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child figure {
  position: relative;
  z-index: 1;
  transform-origin: 100% 0;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  opacity: 0;
  animation: aonoma-photo-page-open 2800ms cubic-bezier(0.18, 0.74, 0.22, 1) 260ms both;
  will-change: transform, opacity, clip-path, filter;
}

.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child figure::before {
  content: "";
  position: absolute;
  inset: -18%;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(
    112deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.08) 28%,
    rgba(255, 255, 255, 0.66) 45%,
    rgba(184, 211, 224, 0.38) 55%,
    rgba(255, 255, 255, 0) 73%
  );
  opacity: 0;
  transform: translate3d(38%, -10%, 0) rotate(9deg);
  animation: aonoma-photo-page-light 2800ms cubic-bezier(0.18, 0.74, 0.22, 1) 260ms both;
  mix-blend-mode: screen;
}

.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child figure::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(116deg, rgba(7, 17, 28, 0.28) 0%, rgba(7, 17, 28, 0.02) 42%, rgba(255, 255, 255, 0.16) 70%, rgba(7, 17, 28, 0.2) 100%);
  opacity: 0;
  animation: aonoma-photo-page-shadow 2800ms cubic-bezier(0.18, 0.74, 0.22, 1) 260ms both;
}

.aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child > div {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  animation: aonoma-photo-label-in 520ms cubic-bezier(0.18, 0.74, 0.22, 1) 2300ms both;
}

@keyframes aonoma-photo-page-open {
  0% {
    opacity: 0;
    clip-path: polygon(98% 0, 100% 0, 100% 100%, 94% 100%);
    filter: blur(2px) saturate(0.9) contrast(0.95);
    transform: rotateY(-82deg) rotateZ(3deg) translate3d(44px, -14px, 0) scale(0.98);
  }
  18% {
    opacity: 1;
  }
  48% {
    clip-path: polygon(52% 0, 100% 0, 100% 100%, 40% 100%);
    filter: blur(1px) saturate(0.96) contrast(0.98);
    transform: rotateY(-42deg) rotateZ(1.7deg) translate3d(18px, -5px, 0) scale(0.992);
  }
  78% {
    clip-path: polygon(6% 0, 100% 0, 100% 100%, 2% 100%);
    filter: blur(0.2px) saturate(1) contrast(1);
    transform: rotateY(-8deg) rotateZ(0.35deg) translate3d(2px, -1px, 0) scale(0.999);
  }
  100% {
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    filter: blur(0) saturate(1) contrast(1);
    transform: rotateY(0deg) rotateZ(0deg) translate3d(0, 0, 0) scale(1);
  }
}

@keyframes aonoma-photo-page-light {
  0% {
    opacity: 0;
    transform: translate3d(42%, -10%, 0) rotate(9deg);
  }
  34% {
    opacity: 0.72;
  }
  72% {
    opacity: 0.34;
  }
  100% {
    opacity: 0;
    transform: translate3d(-28%, 5%, 0) rotate(9deg);
  }
}

@keyframes aonoma-photo-page-shadow {
  0% {
    opacity: 0.5;
  }
  58% {
    opacity: 0.26;
  }
  100% {
    opacity: 0;
  }
}

@keyframes aonoma-photo-label-in {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (max-width: 767px) {
  .aonoma-recruit h1.font-sansjp,
  .aonoma-recruit h2.font-sansjp,
  .aonoma-recruit-detail h1,
  .aonoma-recruit-detail h2 {
    font-weight: 500 !important;
    letter-spacing: -0.015em;
  }

  .aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child figure {
    animation-duration: 2400ms;
  }
}

@media (prefers-reduced-motion: reduce) {
  .aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child figure,
  .aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child figure::before,
  .aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child figure::after,
  .aonoma-recruit #aonoma-people article.aonoma-scroll-reveal > div:first-child > div {
    animation: none !important;
    clip-path: none !important;
    filter: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}
