/* ============================================================
   エコスマほけん CV導線（記事内ミニCV／控えめ装飾パネル）
   - .es-cv : 記事本文に挿入するミニCV（ショートコード [es_cv]）
   サイト共通の画像ボタンを、控えめなティール装飾パネルに収める。
   テーマCSSと干渉しないよう :where() で詳細度を抑制。
   ============================================================ */

:root {
  --es-accent:  #26c8b2;  /* ブランドティール（装飾アクセント） */
  --es-brand-d: #0c7f71;  /* 信頼バッジのチェック色 */
  --es-ink:     #16302b;
  --es-muted:   #5b6f6a;
}

/* スコープ内だけ box-sizing を統一（テーマには影響させない） */
:where(.es-cv, .es-cv *) { box-sizing: border-box; }

/* テーマ(.content)の本文スタイル流入を防ぐ最小リセット（ul/li/p は使わず div/span で構成） */
.es-cv a { color: inherit; text-decoration: none; }
.es-cv img { vertical-align: bottom; border: 0; max-width: 100%; height: auto; }

/* コンテナ（控えめな装飾パネル） */
.es-cv {
  margin: 26px 0;
  padding: 22px 18px;
  text-align: center;
  color: var(--es-ink);
  font-family: inherit;
  background: linear-gradient(180deg, #f7fdfb, #edf8f4);
  border: 1px solid #d8efe9;
  border-radius: 16px;
  box-shadow: 0 4px 18px rgba(16, 40, 36, .05);
}

/* キャンペーン（任意・細い1行） */
.es-cv__camp { margin: 0 0 12px; font-size: 12.5px; font-weight: 700; letter-spacing: .01em; color: #8a6a2a; }

/* 大バナー（任意） */
.es-cv__bnr { display: block; line-height: 0; margin: 0 auto 14px; max-width: 560px; border-radius: 10px; overflow: hidden; }
.es-cv__bnr img { display: block; width: 100%; height: auto; }

/* 見出し（装飾：両脇に細いアクセント線） */
.es-cv__lead {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  margin: 0 0 16px;
  font-size: 15.5px; font-weight: 800; line-height: 1.4; color: var(--es-ink);
}
.es-cv__lead::before, .es-cv__lead::after {
  content: ""; flex: none; width: 22px; height: 2px; border-radius: 2px;
  background: var(--es-accent); opacity: .9;
}

/* 画像ボタン（中央寄せ。SPは枠いっぱいに広がって大きくなりすぎないよう幅を抑える＝確実に効く値） */
.es-cv__btns { display: grid; gap: 12px; max-width: 200px; margin: 0 auto; }
@media (min-width: 520px) { .es-cv__btns { grid-template-columns: 1fr 1fr; max-width: 520px; } }
.es-cv__btn {
  display: block; border-radius: 8px;
  transition: filter .2s ease;
}
.es-cv__btn:hover { filter: brightness(1.03); } /* 立体ボタンのため上下の動き(translateY)は無し・明度のみ */
.es-cv__btnImg { display: block; width: 100%; height: auto; }
.es-cv__btn:focus-visible { outline: 3px solid #16302b; outline-offset: 3px; }

/* 信頼バッジ（任意・div/span でテーマ干渉を回避） */
.es-cv__trust {
  display: flex; flex-wrap: wrap; gap: 6px 16px; justify-content: center; align-items: center;
  margin: 14px 0 0; padding: 0;
  font-size: 12px; font-weight: 700; color: var(--es-muted);
}
.es-cv__trustItem { display: inline-flex; align-items: center; gap: 5px; }
.es-cv__trustItem::before {
  content: ""; width: 15px; height: 15px; flex: none; border-radius: 50%;
  background: var(--es-brand-d) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center / 10px no-repeat;
}

/* モーション軽減設定を尊重 */
@media (prefers-reduced-motion: reduce) {
  .es-cv__btn { transition: none; }
}