/*
Theme Name: イベキュウ
Theme URI: https://evekyu.example.com/
Author: イベキュウ
Author URI: https://evekyu.example.com/
Description: イベント救護サービス「イベキュウ」公式WordPressテーマ。イベント会社向けBtoBランディングページ。セマンティックHTML＋Tailwind CSSでSEO/AIO/LLMOに最適化。白基調・ブルー系（メイン）＋レッド系（アクセント）。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: evekyu
Tags: landing-page, business, custom-menu, featured-images, translation-ready
*/

/* ------------------------------------------------------------------
   スタイルはTailwind CSS（CDN）で構築しています。
   ここには、Tailwindだけでは書きにくい最小限の独自スタイルのみを記述。
   ブランドカラーは functions.php の tailwind.config で定義:
     brand(ミントターコイズ #00A896) / accent(スマートブルー #015CAD)
------------------------------------------------------------------ */

:root {
  --evekyu-brand: #00A896;      /* ミントターコイズ（メイン） */
  --evekyu-brand-dark: #028090;
  --evekyu-accent: #015CAD;     /* ブルー #015CAD（アクセント／CTA） */
  --evekyu-accent-dark: #013F78;
  --evekyu-alt: #F4F9F9;        /* セクション交互背景 */
}

/* フッターのロゴ画像 */
.evk-footer-logo { height: 40px; width: auto; max-width: 200px; object-fit: contain; }

html { scroll-behavior: smooth; font-size: clamp(16px, 0.4vw + 12.5px, 18px); } /* 画面幅で本文サイズが伸縮（狭いと縮小→下限16px。改行はレスポンシブに任せる） */
body { -webkit-font-smoothing: antialiased; color: #1E293B; touch-action: manipulation; } /* 本文の基本色。touch-action: ダブルタップズーム無効（ピンチは可） */

/* 本文の文字色を #1E293B（Dark Slate）に統一 */
.text-slate-500 { color: #1E293B !important; }
.text-slate-600 { color: #1E293B !important; }
.text-slate-700 { color: #1E293B !important; }
.text-slate-800 { color: #1E293B !important; }
.text-slate-400 { color: #475569 !important; } /* ごく小さな注記のみ、やや薄めのスレート */

/* アンカー移動時、固定ヘッダー分のオフセット */
:target { scroll-margin-top: 5rem; }
[id] { scroll-margin-top: 5rem; }

/* カスタムロゴ（左上）の表示サイズ。ロゴ画像の縦横比は保ったまま高さで制御 */
.custom-logo-link { display: inline-block; line-height: 0; }
.custom-logo { height: 44px; width: auto; max-width: 220px; object-fit: contain; }
@media (min-width: 768px) {
  .custom-logo { height: 48px; }
}
@media (max-width: 767px) {
  .custom-logo { height: 38px; max-width: 46vw; }
}

/* ヘッダーの右側ナビ：カーソルを合わせると拡大＋下線がのびる */
.evk-navlink {
  position: relative;
  display: inline-block;
  color: #475569;
  transition: transform 0.2s ease, color 0.2s ease;
  transform-origin: center bottom;
}
.evk-navlink:hover {
  transform: scale(1.16);
  color: var(--evekyu-brand-dark);
}
.evk-navlink::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--evekyu-brand);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.25s ease;
}
.evk-navlink:hover::after { transform: scaleX(1); }

/* スマホ：ハンバーガーボタン（開くとXに変化） */
.evk-burger {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #fff;
  cursor: pointer;
  touch-action: manipulation; /* ダブルタップによるズームを無効化 */
  -webkit-tap-highlight-color: transparent;
}
.evk-burger span {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: #1E293B;
  transition: transform 0.25s ease, opacity 0.2s ease;
}
.evk-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.evk-burger.is-open span:nth-child(2) { opacity: 0; }
.evk-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* スマホ用ドロップダウンメニュー（ふわっと開閉） */
.evk-mobile-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 30;
  border-top: 1px solid #f1f5f9;
  background: #fff;
  box-shadow: 0 12px 20px rgba(15, 23, 42, 0.1);
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.34s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.28s ease;
}
.evk-mobile-menu.is-open {
  max-height: 24rem;
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .evk-mobile-menu { transition: none; }
}

/* スクロールで下からふわっと表示（JS有効時のみ・prefers-reduced-motion配慮） */
.evk-js .evk-reveal {
  opacity: 0;
  transform: translateY(46px);
  transition: opacity 1.15s ease-out, transform 1.15s ease-out;
  will-change: opacity, transform;
}
.evk-js .evk-reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .evk-js .evk-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* 実績企業バナー（ロゴが左へ流れるマーキー） */
.evk-marquee { overflow: hidden; width: 100%; }
.evk-marquee__track {
  display: flex;
  width: max-content;
  gap: 2.5rem;
  padding: 0 1.25rem;
  animation: evk-scroll 32s linear infinite;
}
.evk-marquee:hover .evk-marquee__track { animation-play-state: paused; }
.evk-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  min-width: 150px;
  padding: 0 1.25rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #94a3b8;
  font-weight: 700;
  font-size: 15px;
  white-space: nowrap;
  filter: grayscale(100%);
}
.evk-logo__img {
  max-height: 40px;
  max-width: 140px;
  width: auto;
  object-fit: contain;
}
@keyframes evk-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .evk-marquee__track { animation: none; }
}

/* スクロール追従の「無料簡単見積もり」タブ（右側・やや下寄りに固定） */
.evk-fab {
  position: fixed;
  right: 0;
  top: auto;
  bottom: 88px;
  transform: none;
  z-index: 50;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  padding: 1rem 0.6rem;
  background: var(--evekyu-accent);
  color: #fff;
  text-decoration: none;
  border-radius: 8px 0 0 8px;
  box-shadow: -4px 4px 16px rgba(0, 0, 0, 0.18);
  transition: background 0.2s ease, padding 0.2s ease;
}
.evk-fab:hover { background: #013F78; padding-right: 0.9rem; }
.evk-fab__text {
  display: flex;
  flex-direction: row-reverse;
  gap: 0.1rem;
}
.evk-fab__col {
  writing-mode: vertical-rl;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.1em;
}
.evk-fab__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.25);
  font-size: 14px;
}
@media (max-width: 767px) {
  .evk-fab { padding: 0.85rem 0.4rem; bottom: 72px; }
  .evk-fab__col { font-size: 0.8rem; }
}

/* 医療従事者ページ：スクロール追従の「LINEから登録」バナー（PC・右下の写真付きカード） */
.evk-line-banner {
  position: fixed;
  right: 16px;
  bottom: 24px;
  z-index: 50;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  max-width: 380px;
  padding: 0.85rem 1rem;
  background: #06c755;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  /* 初期は非表示。下にスクロールすると .is-visible が付いて出現 */
  opacity: 0;
  visibility: hidden;
  transform: translateY(24px);
  transition: opacity 0.35s ease, transform 0.35s ease, visibility 0.35s ease;
}
.evk-line-banner.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.evk-line-banner__body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.evk-line-banner__catch {
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.45;
  color: #fff;
}
.evk-line-banner__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.6rem 1.2rem;
  background: #fff;
  color: #06c755;
  font-weight: 700;
  font-size: 0.98rem;
  border-radius: 9999px;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.evk-line-banner__btn:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15); }
.evk-line-banner__icon { width: 28px; height: 28px; object-fit: contain; }
.evk-line-banner__photo {
  width: 76px;
  height: 76px;
  flex-shrink: 0;
  object-fit: contain;
}
@media (max-width: 767px) {
  .evk-line-banner { display: none; }
}

/* 入力内容の確認画面（フォーム共通） */
.evk-confirming > :not(.evk-confirm) { display: none !important; }
.evk-confirm__title { font-size: 1.125rem; font-weight: 700; color: #00A896; text-align: center; }
.evk-confirm__lead { margin-top: 0.5rem; font-size: 0.875rem; color: #64748b; }
.evk-confirm__list { margin-top: 1rem; border-top: 1px solid #e2e8f0; }
.evk-confirm__row { display: flex; gap: 1rem; border-bottom: 1px solid #e2e8f0; padding: 0.75rem 0.25rem; }
.evk-confirm__k { flex: 0 0 38%; font-weight: 700; color: #028090; font-size: 0.875rem; }
.evk-confirm__v { flex: 1; font-size: 0.875rem; color: #1E293B; white-space: pre-line; word-break: break-word; }
.evk-confirm__btns { margin-top: 1.5rem; display: flex; gap: 0.75rem; }
.evk-confirm__back { flex: 0 0 auto; border-radius: 9999px; border: 1px solid #cbd5e1; background: #fff; padding: 0.7rem 1.4rem; font-size: 0.875rem; font-weight: 600; color: #475569; cursor: pointer; }
.evk-confirm__send { flex: 1; border-radius: 9999px; border: none; background: #015CAD; padding: 0.7rem 1.4rem; font-size: 0.95rem; font-weight: 700; color: #fff; cursor: pointer; }
.evk-confirm__send:hover { background: #013F78; }

/* 利用規約など固定ページ本文（エディタ入力）の表示スタイル */
.evk-terms-content { color: #1E293B; }
.evk-terms-content h2, .evk-terms-content h3 { margin-top: 2rem; font-size: 1.125rem; font-weight: 700; color: #028090; }
.evk-terms-content p { margin-top: 0.75rem; line-height: 2; }
.evk-terms-content ul, .evk-terms-content ol { margin-top: 0.75rem; padding-left: 1.5rem; line-height: 2; }
.evk-terms-content ul { list-style: disc; }
.evk-terms-content ol { list-style: decimal; }
.evk-terms-content a { color: #00A896; text-decoration: underline; }
.evk-terms-content strong { font-weight: 700; color: #0f172a; }

/* セクションタイトルの下に入る横線（文字幅と同じ長さ・右下バナーと同色） */
.evk-title {
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.evk-title::after {
  content: "";
  display: block;
  height: 3px;
  margin-top: 0.75rem;
  background: var(--evekyu-brand);
  border-radius: 9999px;
}

/* スマホ用：下部固定の2ボタンバー（PCでは非表示。スマホでは縦タブFABを隠す） */
.evk-mobilebar { display: none; }
@media (max-width: 767px) {
  .evk-fab { display: none; }
  .evk-mobilebar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 55;
    display: flex;
    gap: 0;
    padding: 0;
    box-shadow: 0 -2px 12px rgba(15, 23, 42, 0.12);
  }
  .evk-mobilebar__item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    min-height: 62px;
    padding: 0.5rem 0.25rem;
    border-radius: 0;
    text-align: center;
    line-height: 1.15;
    font-weight: 700;
    text-decoration: none;
  }
  .evk-mobilebar__icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
  }
  .evk-mobilebar__label {
    font-size: 0.9rem;
    white-space: nowrap;
  }
  /* 左：電話（薄いグリーン） */
  .evk-mobilebar__item--tel {
    background: #d7f0ea;
    color: var(--evekyu-brand-dark);
  }
  .evk-mobilebar__item--tel:active { background: #c4e8df; }
  .evk-mobilebar__item--tel .evk-mobilebar__label { font-size: 0.78rem; letter-spacing: 0; }
  /* 中央：お問合せ（濃いグリーン） */
  .evk-mobilebar__item--contact {
    background: var(--evekyu-brand-dark);
    color: #fff;
  }
  .evk-mobilebar__item--contact:active { background: var(--evekyu-brand); }
  /* 右：依頼申込（青） */
  .evk-mobilebar__item--apply {
    background: var(--evekyu-accent);
    color: #fff;
  }
  .evk-mobilebar__item--apply:active { background: #013F78; }
  /* 下部バーがあるページだけ、バーに隠れないよう余白を確保（バー非表示ページは隙間を作らない） */
  body.evk-has-mobilebar { padding-bottom: 70px; }
}

/* 対応現場カードの詳細モーダル（ふわっと開く・画面の約8割） */
.evk-modal {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.evk-modal.is-open { opacity: 1; visibility: visible; }
.evk-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(2px);
}
.evk-modal__panel {
  position: relative;
  width: 92vw;
  max-width: 1100px;
  max-height: 85vh;
  overflow-y: auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.25);
  transform: scale(0.94) translateY(8px);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.evk-modal.is-open .evk-modal__panel { transform: scale(1) translateY(0); }
@media (min-width: 768px) {
  .evk-modal__panel { width: 80vw; }
}
.evk-modal__img {
  display: block;
  width: 100%;
  max-height: 42vh;
  object-fit: cover;
  border-radius: 12px 12px 0 0;
}
.evk-modal__body { padding: 1.5rem; }
@media (min-width: 768px) {
  .evk-modal__body { padding: 2.5rem; }
}
.evk-modal__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  border: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.92);
  color: #1E293B;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
/* モーダル表示中も背景スクロールを許可（body固定はしない） */
@media (prefers-reduced-motion: reduce) {
  .evk-modal,
  .evk-modal__panel { transition: none; }
}

/* よくある質問（アコーディオン：なめらか開閉／Qマーク／＋→×回転） */
.evk-faq__q {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.7rem 1.1rem;
  background: none;
  border: 0;
  cursor: pointer;
  touch-action: manipulation;
  text-align: left;
  font-size: 0.9rem;
  font-weight: 700;
  color: #0f172a;
  font-family: inherit;
}
.evk-faq__qmark {
  flex: 0 0 auto;
  color: var(--evekyu-brand);
  font-weight: 900;
  font-size: 1.5rem;
  line-height: 1;
}
@media (min-width: 768px) {
  .evk-faq__qmark { font-size: 1.9rem; }
}
.evk-faq__qtext { flex: 1; }
.evk-faq__icon {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.evk-faq__icon::before,
.evk-faq__icon::after {
  content: "";
  position: absolute;
  background: #94a3b8;
  border-radius: 2px;
}
.evk-faq__icon::before { left: 0; top: 50%; width: 100%; height: 2px; transform: translateY(-50%); }
.evk-faq__icon::after { top: 0; left: 50%; width: 2px; height: 100%; transform: translateX(-50%); }
.evk-faq.is-open .evk-faq__icon { transform: rotate(135deg); }
.evk-faq__a {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.evk-faq.is-open .evk-faq__a { grid-template-rows: 1fr; }
.evk-faq__a-inner { overflow: hidden; }
.evk-faq__a-inner p {
  margin: 0;
  padding: 0 1.1rem 1rem 2.6rem;
  font-size: 0.875rem;
  line-height: 1.8;
  color: #475569;
}
@media (prefers-reduced-motion: reduce) {
  .evk-faq__icon,
  .evk-faq__a { transition: none; }
}

/* =====================================================================
   医療従事者ページ：ヒーロー写真
   - スマホ：くり抜きなし・全幅表示（文言の下）
   - PC：左半分に写真を配置。縦は上下に緑背景を残す高さで中央。
         斜め線は使わず、右端をグラデーションで背景色へ自然にフェード（テキストに少し重なる）
   ===================================================================== */
.evk-med-hero-img { display: none; }
.evk-med-hero-mobile { display: block; width: 100%; height: auto; }

@media (min-width: 1024px) {
  .evk-med-hero-img {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 58%;
    height: 28rem;
    object-fit: cover;
    z-index: 0;
    /* 右へ向かって透明になり、背景の薄いグリーンへ自然に溶け込む */
    -webkit-mask-image: linear-gradient(to right, #000 45%, rgba(0, 0, 0, 0) 100%);
            mask-image: linear-gradient(to right, #000 45%, rgba(0, 0, 0, 0) 100%);
  }
}

/* =====================================================================
   医療従事者ページ：ヒーローの歪な丸（ブロブ）画像＋ゆっくり動く装飾＋スライドショー
   ===================================================================== */
.evk-blob { display: block; }
/* 画像フレーム：歪な丸＋ゆっくり形が変化 */
.evk-blob__frame {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  border-radius: 46% 54% 57% 43% / 54% 45% 55% 46%;
  box-shadow: 0 22px 50px -22px rgba(2, 128, 144, 0.55);
  animation: evk-blob-morph 16s ease-in-out infinite;
}
/* スライドショーの各画像（ゆっくりフェードで切替） */
.evk-blob__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.4s ease;
}
.evk-blob__img.is-active { opacity: 1; }
/* 円のまわりの太めの薄いグリーンの縁 */
.evk-blob__back {
  position: absolute;
  inset: -10%;
  z-index: 0;
  border-radius: 52% 48% 55% 45% / 50% 55% 45% 50%;
  background: rgba(0, 168, 150, 0.16);
  animation: evk-blob-morph 20s ease-in-out infinite;
}
/* 縁のまわりに散らばるカラフルな装飾ブロブ（ふわふわ動く） */
.evk-deco {
  position: absolute;
  z-index: 2;
  border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%;
  box-shadow: 0 8px 20px -8px rgba(15, 23, 42, 0.25);
}
.evk-deco--teal  { width: 22%; height: 22%; top: 4%;    left: -5%;  background: radial-gradient(circle at 35% 30%, #b6efdc, #62c3aa); animation: evk-float 7s ease-in-out infinite; }
.evk-deco--lav   { width: 14%; height: 14%; top: -5%;   right: 20%; background: radial-gradient(circle at 35% 30%, #ddccf5, #b79fe6); animation: evk-float 9s ease-in-out infinite 0.6s; }
.evk-deco--pink  { width: 27%; height: 27%; bottom: -3%; right: -6%; background: radial-gradient(circle at 35% 30%, #f9cede, #f2a7c1); animation: evk-float 8s ease-in-out infinite 0.3s; }
.evk-deco--peach { width: 17%; height: 17%; bottom: 16%; right: 6%;  background: radial-gradient(circle at 35% 30%, #ffdcc6, #ffbf9f); animation: evk-float 10s ease-in-out infinite 1s; }
@keyframes evk-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes evk-blob-morph {
  0%, 100% { border-radius: 46% 54% 57% 43% / 54% 45% 55% 46%; }
  50%      { border-radius: 60% 40% 42% 58% / 45% 58% 42% 55%; }
}
@media (prefers-reduced-motion: reduce) {
  .evk-blob__frame, .evk-blob__back, .evk-deco { animation: none; }
  .evk-blob__img { transition: none; }
}

/* =====================================================================
   医療ページ：ヘッダー（トップは青＝ヒーローと同色／スクロールで白）
   ===================================================================== */
.evk-header--hero { transition: background-color 0.3s ease, box-shadow 0.3s ease; }
.evk-header--hero:not(.is-scrolled) {
  background: #1fbaa1;              /* ヒーロー最上部と同じグリーン */
  border-color: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
          backdrop-filter: none;
}
/* トップ（青）のときは文字・ロゴ・タグラインを白に */
.evk-header--hero:not(.is-scrolled) .evk-logo-text { color: #fff !important; }
.evk-header--hero:not(.is-scrolled) .evk-logo-text .bg-brand { background: rgba(255, 255, 255, 0.25); }
.evk-header--hero:not(.is-scrolled) .evk-tagline { color: #fff !important; border-color: rgba(255, 255, 255, 0.4); }
/* トップ（青）のときは「法人の…」ボタンを白地・青文字に */
.evk-header--hero:not(.is-scrolled) .evk-hero-cta { background: #fff !important; color: #028090 !important; }

/* =====================================================================
   汎用の固定ページ本文（page.php の .evk-page-content）
   ブロックエディタで入力した見出し・リスト・段落を読みやすく整えます。
   ===================================================================== */
.evk-page-content { line-height: 1.9; }
.evk-page-content > :first-child { margin-top: 0; }
.evk-page-content h2 {
  margin: 2.4rem 0 0.9rem;
  padding-left: 0.7rem;
  border-left: 4px solid var(--evekyu-brand);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--evekyu-brand-dark);
}
.evk-page-content h3 {
  margin: 1.8rem 0 0.6rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
}
.evk-page-content p { margin: 0.9rem 0; }
.evk-page-content ul,
.evk-page-content ol { margin: 0.9rem 0; padding-left: 1.4rem; }
.evk-page-content ul { list-style: disc; }
.evk-page-content ol { list-style: decimal; }
.evk-page-content li { margin: 0.35rem 0; }
.evk-page-content a { color: var(--evekyu-accent); text-decoration: underline; }
.evk-page-content strong { font-weight: 700; color: #0f172a; }
.evk-page-content hr { margin: 2rem 0; border: 0; border-top: 1px solid #e2e8f0; }

/* =====================================================================
   導入事例：スマホは1枚ずつ（ボタンで切替）／md以上はグリッド
   ===================================================================== */
.evk-cscar__track { transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); will-change: transform; }
.evk-cscar__dot { width: 8px; height: 8px; border-radius: 9999px; background: #cbd5e1; transition: background 0.2s ease, transform 0.2s ease; }
.evk-cscar__dot.is-active { background: var(--evekyu-brand); transform: scale(1.35); }
@media (min-width: 768px) {
  .evk-cscar__track { transform: none !important; transition: none; }
}
@media (prefers-reduced-motion: reduce) {
  .evk-cscar__track { transition: none; }
}

/* =====================================================================
   イベキュウとは？：3ボックス
   スマホ＝画像とテキストを左右1:1（box2のみ画像左で交互）／PC＝縦積み中央
   ===================================================================== */
@media (max-width: 767px) {
  .evk-abox {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 1rem;
    row-gap: 0.25rem;
    align-items: center;
  }
  .evk-abox__title { grid-column: 1; grid-row: 1; align-self: end; }
  .evk-abox__desc  { grid-column: 1; grid-row: 2; align-self: start; }
  .evk-abox__img   { grid-column: 2; grid-row: 1 / span 2; }
  /* 交互：画像を左に（タイトル・説明を右に） */
  .evk-abox--left .evk-abox__title,
  .evk-abox--left .evk-abox__desc { grid-column: 2; }
  .evk-abox--left .evk-abox__img  { grid-column: 1; }
}

/* 料金表：スマホの「横スクロールできます」案内（矢印がゆれる） */
.evk-scrollhint svg { animation: evk-hint 1.3s ease-in-out infinite; }
@keyframes evk-hint { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(5px); } }
@media (prefers-reduced-motion: reduce) { .evk-scrollhint svg { animation: none; } }
