[data-section] {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

[data-section].visible {
  opacity: 1;
  transform: translateY(0);
}

/* ========================================
   レスポンシブ対応
   ======================================== */

/* スマートフォン（480px以下） */
@media (max-width: 480px) {
  [data-section] {
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
  }

  [data-section].visible {
    transform: translateY(0);
  }
}