/* ====== フェードイン共通 ====== */
@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

.fade-in { opacity: 0; animation: fadeInUp 1s forwards; }
.fade-delay-1 { animation-delay: 0.3s; }
.fade-delay-2 { animation-delay: 0.6s; }
.fade-delay-3 { animation-delay: 0.9s; }
.fade-delay-4 { animation-delay: 1.2s; }
.fade-delay-5 { animation-delay: 1.5s; }
.fade-delay-6 { animation-delay: 1.8s; }
.fade-delay-7 { animation-delay: 2.1s; }

/* ====== セクション全体 ====== */
.services-section {
  max-width: 1200px;
  margin: 80px auto 100px;
  padding: 0 20px;
  text-align: center;
  color: #fff;
}

/* ====== タイトル ====== */
.services-title {
  display: inline-block;
  background: #fff;
  color: #000;
  padding: 20px 30px;
  border-radius: 12px;
  font-size: clamp(28px, 4vw, 40px);
  font-weight: bold;
  margin-bottom: 60px;
}

/* ====== サービスカード ====== */
.service-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-bottom: 50px;
}

.service-card {
  background: rgba(255,255,255,0.15);
  padding: 25px 20px;
  border-radius: 12px;
  text-align: center;
}

.service-card h3 {
  font-size: clamp(20px, 2.5vw, 28px);
  margin-bottom: 12px;
  font-weight: bold;
  color: #fff;
}

.service-card p {
  font-size: clamp(14px, 1.5vw, 18px);
  line-height: 1.6;
  color: #fff;
}

/* ====== パートナー ====== */
.partner-section a {
  display: inline-block;
  background: #ff7a00;
  color: #fff;
  padding: 14px 36px;
  font-size: clamp(16px, 2vw, 22px);
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  transition: background 0.3s;
}

.partner-section a:hover {
  background: #e66a00;
}
