/* 写真の種類と、初回だけの控えめな表示演出。 */
.detail-scenes { background: #f0f1e8; }
.scene-heading { display: flex; justify-content: space-between; align-items: end; gap: 32px; margin-bottom: 44px; }
.scene-heading > p { color: #566152; line-height: 2; }
.scene-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.scene-card { display: block; color: inherit; text-decoration: none; min-width: 0; }
.scene-image { overflow: hidden; aspect-ratio: 4 / 3; border-radius: 3px; background: #dce1d4; }
.scene-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.scene-caption { display: flex; align-items: start; gap: 14px; padding-top: 22px; }
.scene-number { font: 15px Georgia, serif; color: #8b7759; padding-top: 5px; }
.scene-caption h3 { font-size: 19px; font-weight: 500; margin: 0 0 8px; }
.scene-caption p { font-size: 13px; line-height: 1.8; margin: 0; }
.scene-arrow { margin-left: auto; font-size: 22px; color: #53694e; transition: transform .25s; }
.scene-note { margin-top: 24px; }
.scene-card:hover .scene-image img, .scene-card:focus-visible .scene-image img { transform: scale(1.045); }
.scene-card:hover .scene-arrow { transform: translate(3px, -3px); }
.split-photo, .company-photo { overflow: hidden; }
@keyframes detail-arrival {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes photo-settle {
  from { transform: scale(1.045); }
  to { transform: scale(1); }
}
.service-grid.is-visible > a, .strengths-layout.is-visible .strength-item {
  animation: detail-arrival .65s both;
}
.service-grid.is-visible > a:nth-child(2), .strengths-layout.is-visible .strength-item:nth-child(2) { animation-delay: .08s; }
.service-grid.is-visible > a:nth-child(3), .strengths-layout.is-visible .strength-item:nth-child(3) { animation-delay: .16s; }
.service-grid.is-visible > a:nth-child(4), .strengths-layout.is-visible .strength-item:nth-child(4) { animation-delay: .24s; }
.strengths-layout.is-visible .strength-item:nth-child(5) { animation-delay: .32s; }
.strengths-layout.is-visible .strength-item:nth-child(6) { animation-delay: .4s; }
.split-photo.is-visible img, .company-photo.is-visible img { animation: photo-settle 1.2s ease-out both; }
.strengths-layout.is-visible .character-message { animation: detail-arrival .7s .1s both; }
@media (max-width: 760px) {
  .scene-heading { display: block; margin-bottom: 28px; }
  .scene-heading > p { margin-top: 20px; }
  .scene-grid { grid-template-columns: 1fr; gap: 34px; }
  .scene-image { aspect-ratio: 16 / 10; }
  .scene-caption { padding-top: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .service-grid.is-visible > a, .strengths-layout.is-visible .strength-item,
  .split-photo.is-visible img, .company-photo.is-visible img, .strengths-layout.is-visible .character-message { animation: none; }
  .scene-image img, .scene-arrow { transition: none; }
  .scene-card:hover .scene-image img, .scene-card:focus-visible .scene-image img, .scene-card:hover .scene-arrow { transform: none; }
}
@media print {
  .scene-card { opacity: 1 !important; transform: none !important; }
}