/* ===== Google Fonts ===== */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;700;900&display=swap');

/* ===== Base ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 14px; }
body { font-family: 'Noto Sans JP', sans-serif; color: #1e293b; }
.font-oswald { font-family: 'Oswald', sans-serif; }

/* ===== Reveal Animation ===== */
/* WordPress環境でJSが遅れて読み込まれる場合に備え、
   js-reveal-readyクラスが追加された後にのみ非表示にする */
body.js-reveal-ready .reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
body.js-reveal-ready .reveal.active {
  opacity: 1;
  transform: translateY(0);
}
/* JS未読み込み時は常に表示 */
.reveal {
  opacity: 1;
  transform: none;
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

/* ===== Navbar ===== */
#navbar {
  position: fixed;
  top: 0; left: 0; width: 100%;
  z-index: 50;
  transition: all 0.3s ease;
  padding: 1.25rem 0;
}
#navbar.scrolled {
  background: #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  padding: 0.75rem 0;
}
#navbar.always-white {
  background: #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  padding: 0.75rem 0;
}
/* ナビゲーション: スクロール後・常時白背景時の文字色 */
#navbar.scrolled .nav-link,
#navbar.always-white .nav-link {
  color: #1e293b !important;
}
#navbar.scrolled .nav-link:hover,
#navbar.always-white .nav-link:hover {
  color: #dc2626 !important;
}
#navbar.scrolled #nav-sub,
#navbar.always-white #nav-sub {
  color: #64748b !important;
}
#navbar.scrolled #nav-main,
#navbar.always-white #nav-main {
  color: #0c1a2e !important;
}
#navbar.scrolled #menu-open,
#navbar.always-white #menu-open {
  color: #1e293b !important;
}
#navbar.scrolled .contact-btn,
#navbar.always-white .contact-btn {
  background: #dc2626 !important;
  color: #fff !important;
}

/* ===== Mobile Menu ===== */
#mobile-menu {
  position: fixed;
  inset: 0;
  background: #0c1a2e;
  z-index: 60;
  transform: translateX(100%);
  transition: transform 0.5s ease;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}
#mobile-menu.open { transform: translateX(0); }

/* ===== Hero Animations ===== */
@keyframes subtleZoom {
  from { transform: scale(1); }
  to { transform: scale(1.1); }
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInRight {
  from { opacity: 0; transform: translateX(-40px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes fadeInLeft {
  from { opacity: 0; transform: translateX(40px); }
  to { opacity: 1; transform: translateX(0); }
}
.animate-subtleZoom { animation: subtleZoom 10s ease-in-out infinite alternate; }
.animate-fadeInUp { animation: fadeInUp 0.8s ease forwards; }
.animate-fadeInRight { animation: fadeInRight 0.8s ease forwards; }
.animate-fadeInLeft { animation: fadeInLeft 0.8s ease forwards; }
.delay-200 { animation-delay: 0.2s; opacity: 0; }
.delay-400 { animation-delay: 0.4s; opacity: 0; }
.delay-600 { animation-delay: 0.6s; opacity: 0; }
.delay-800 { animation-delay: 0.8s; opacity: 0; }

/* ===== Page Header ===== */
.page-header-bg {
  transition: transform 10s ease;
}
.page-header-wrap:hover .page-header-bg {
  transform: scale(1.1);
}

/* ===== Form Focus ===== */
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: #dc2626 !important;
}

/* ===== Grayscale Hover ===== */
.grayscale-hover img {
  filter: grayscale(1);
  transition: filter 0.7s ease, transform 0.7s ease;
}
.grayscale-hover:hover img {
  filter: grayscale(0);
  transform: scale(1.05);
}

/* ===== Table Hover ===== */
.table-hover-row:hover th { background-color: #eff6ff; }
.table-hover-row:hover td { color: #dc2626; }

/* ===== Underline Decoration ===== */
.decoration-red { text-decoration: underline; text-decoration-color: #dc2626; text-decoration-thickness: 6px; text-underline-offset: 12px; }

/* ===== Scrollbar ===== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }

/* ===== Contact Form 7 スタイル上書き ===== */

/* フォーム全体 */
.wpcf7 form {
  margin: 0;
}

/* グリッドレイアウト */
.wpcf7 .cf7-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  margin-bottom: 2.5rem;
}
@media (min-width: 768px) {
  .wpcf7 .cf7-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* 各フィールド */
.wpcf7 .cf7-field {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 0;
}

/* ラベル */
.wpcf7 .cf7-field label,
.wpcf7 label {
  font-size: 0.75rem;
  font-weight: 700;
  color: #64748b;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0;
}

/* REQUIREDバッジ */
.wpcf7 .cf7-required {
  background: #dc2626;
  color: #fff;
  font-size: 8px;
  padding: 2px 6px;
  border-radius: 2px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

/* テキスト入力・メール・電話 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 select {
  width: 100%;
  padding: 1rem 1.25rem;
  background: rgba(240, 249, 255, 0.3);
  border: 1px solid #bae6fd;
  color: #1e293b;
  font-size: 1rem;
  font-family: 'Noto Sans JP', sans-serif;
  transition: border-color 0.2s, box-shadow 0.2s;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 input[type="url"]:focus,
.wpcf7 input[type="number"]:focus,
.wpcf7 select:focus {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.08);
}

/* テキストエリア */
.wpcf7 textarea {
  width: 100%;
  padding: 1rem 1.25rem;
  background: rgba(240, 249, 255, 0.3);
  border: 1px solid #bae6fd;
  color: #1e293b;
  font-size: 1rem;
  font-family: 'Noto Sans JP', sans-serif;
  transition: border-color 0.2s, box-shadow 0.2s;
  border-radius: 0;
  outline: none;
  resize: vertical;
  min-height: 160px;
}
.wpcf7 textarea:focus {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.08);
}

/* プライバシー同意チェックボックス */
.wpcf7 .cf7-privacy {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
  color: #64748b;
}
.wpcf7 .cf7-privacy input[type="checkbox"] {
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid #bae6fd;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
}
.wpcf7 .cf7-privacy-link {
  text-decoration: underline;
  font-weight: 700;
  color: #0284c7;
  transition: color 0.2s;
}
.wpcf7 .cf7-privacy-link:hover {
  color: #dc2626;
}
/* acceptanceタグのラベル調整 */
.wpcf7 .wpcf7-acceptance label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  font-size: 0.875rem;
  color: #64748b;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
  padding-top: 1.5rem;
}
.wpcf7 .wpcf7-acceptance input[type="checkbox"] {
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid #bae6fd;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  margin: 0;
}

/* 送信ボタン */
.wpcf7 input[type="submit"],
.wpcf7 .wpcf7-submit {
  display: block;
  width: 100%;
  padding: 1.25rem 6rem;
  background: #dc2626;
  color: #fff;
  font-weight: 700;
  font-family: 'Noto Sans JP', sans-serif;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  transition: background 0.2s, transform 0.1s;
  box-shadow: 0 20px 25px -5px rgba(127, 29, 29, 0.2);
  border-radius: 0;
  font-size: 1rem;
  -webkit-appearance: none;
  appearance: none;
}
@media (min-width: 768px) {
  .wpcf7 input[type="submit"],
  .wpcf7 .wpcf7-submit {
    width: auto;
    margin: 0 auto;
  }
}
.wpcf7 input[type="submit"]:hover,
.wpcf7 .wpcf7-submit:hover {
  background: #0284c7;
}
.wpcf7 input[type="submit"]:active,
.wpcf7 .wpcf7-submit:active {
  transform: scale(0.97);
}

/* 送信中スピナー */
.wpcf7 .wpcf7-spinner {
  margin-left: 1rem;
  vertical-align: middle;
}

/* バリデーションエラー */
.wpcf7 .wpcf7-not-valid-tip {
  color: #dc2626;
  font-size: 0.75rem;
  font-weight: 700;
  margin-top: 0.5rem;
  display: block;
}
.wpcf7 .wpcf7-not-valid {
  border-color: #dc2626 !important;
}

/* 送信完了メッセージ */
.wpcf7 .wpcf7-response-output {
  margin-top: 1.5rem;
  padding: 1rem 1.5rem;
  border-radius: 0;
  font-weight: 700;
  font-size: 0.875rem;
  text-align: center;
  border: none !important;
}
.wpcf7 .wpcf7-mail-sent-ok {
  background: #f0fdf4;
  color: #166534;
  border-left: 4px solid #16a34a !important;
}
.wpcf7 .wpcf7-mail-sent-ng,
.wpcf7 .wpcf7-spam-blocked {
  background: #fef2f2;
  color: #991b1b;
  border-left: 4px solid #dc2626 !important;
}
.wpcf7 .wpcf7-validation-errors {
  background: #fffbeb;
  color: #92400e;
  border-left: 4px solid #f59e0b !important;
}

