/* ============================================
   s-cta-cover-01 - CTA カバーセクション
   カウンセリング背景写真 + 固定スクロール(parallax) + 暗オーバーレイ
   wp_block「ご相談CTA」を core/cover で構成（[wp_pattern slug="cta-contact"]）
   ============================================ */

.s-cta-cover-01.wp-block-cover {
  padding: var(--section-py) var(--container-padding);
  color: var(--color-white);
}

.s-cta-cover-01 .wp-block-cover__inner-container {
  width: 100%;
}

.s-cta-cover-01__inner {
  max-width: var(--content-width-lg);
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
}

.s-cta-cover-01__label {
  font-size: var(--font-size-2-xs);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-widest);
  text-transform: uppercase;
  color: var(--color-primary-light);
}

.s-cta-cover-01__title {
  font-size: var(--font-size-4-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
}

.s-cta-cover-01__lead {
  font-size: var(--font-size-sm);
  line-height: var(--line-height-loose);
  color: var(--color-white);
  opacity: 0.9;
  margin-bottom: var(--space-xl);
}

/* 予約導線（施術MV s-hero-03 と同型: アイコン＋メイン＋サブ。縦並び・1行表示） */
.s-cta-cover-01__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
  width: 100%;
  max-width: var(--content-width-sm);
  margin-inline: auto;
  margin-top: var(--space-md);
}

.s-cta-cover-01__btn {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3-xs);
  padding: var(--space-lg) var(--space-xl);
  border-radius: var(--radius-md);
  text-decoration: none;
  text-align: center;
  transition: opacity var(--transition-normal);
}

.s-cta-cover-01__btn:hover {
  opacity: 0.85;
}

.s-cta-cover-01__btn-main {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: inherit;
}

.s-cta-cover-01__btn-icon {
  width: var(--font-size-2-xl);
  height: auto;
  display: block;
}

.s-cta-cover-01__btn-sub {
  font-size: var(--font-size-2-xs);
  line-height: var(--line-height-compact);
  opacity: 0.85;
  color: inherit;
}

.s-cta-cover-01__btn--booking {
  background: var(--color-primary);
  color: var(--color-white);
}

.s-cta-cover-01__btn--phone {
  background: transparent;
  color: var(--color-white);
  border: 1px solid var(--color-white);
}

.s-cta-cover-01__btn--line {
  background: var(--color-cta-line);
  color: var(--color-white);
}

/* 電話は美容診療・保険診療の2系統。番号の後ろに区分ラベルを添える。 */
.s-cta-cover-01__btn-note {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-normal);
  margin-inline-start: var(--space-4-xs);
}
