/* 配色変数（必要なければ色コードを直書きしてOK） */
:root { --teal:#6bb5a7; }

/* 1) まずは全ボタンの共通：上下左右中央寄せ＆幅自動 */
a.btn, a.button, .wp-block-button__link,
button, input[type="submit"], input[type="button"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.3 !important;
  height: auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

/* 2) スマホでTCDが幅100%/枠なしを強制するのを打ち消し */
@media (max-width: 767px) {
  a.btn, a.button, .wp-block-button, .wp-block-button__link {
    width: auto !important;            /* ← 画面いっぱいを解除 */
    max-width: 100% !important;
  }
  /* アウトライン系の枠が消える問題の対処（明示的に枠を指定） */
  .wp-block-button.is-style-outline .wp-block-button__link,
  a.btn--outline, .cta-outline, .is-style-outline .wp-block-button__link {
    border: 1px solid var(--teal) !important;
    background: transparent !important;
    color: var(--teal) !important;
    border-radius: 9999px !important;
  }
}

/* 3) pillタイプの見た目（必要ならクラスを付けなくても効くように） */
a.btn, a.button, .wp-block-button__link {
  padding: 14px 28px !important;
  border-radius: 9999px !important;
}

/* 4) あなたの2つのCTA用（塗り／アウトライン） */
.cta-primary{ background: var(--teal) !important; color:#fff !important; border:none !important; }
.cta-outline{ background: transparent !important; color: var(--teal) !important; border:1px solid var(--teal) !important; }

/* 5) グループブロックが子ボタンに幅100%をかける保険 */
.wp-block-buttons .wp-block-button { width:auto !important; }

/* 6) 強い行高に負けるときの最終手段 */
a.btn, a.button, .wp-block-button__link { line-height: normal !important; }
/* ボタン枠が消える問題を強制上書き */
.cta-outline,
.wp-block-button.is-style-outline .wp-block-button__link {
  border: 1px solid #6bb5a7 !important;
  background: transparent !important;
  color: #6bb5a7 !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.3 !important;
}
/* まず、段落内リンクの装飾がボタンにかからないように打ち消し */
p a.cta-pill {
  border: none !important;
  border-bottom: none !important;
  text-decoration: none !important;
}

/* ボタン本体（上下左右ど真ん中・pill化） */
.cta-wrap .cta-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 28px !important;
  line-height: 1.3 !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
}

/* 配色（塗り／アウトライン） */
.cta-wrap .cta-primary {
  background: #6bb5a7 !important;
  color: #fff !important;
  border: 1px solid #6bb5a7 !important;
}
.cta-wrap .cta-outline {
  background: transparent !important;
  color: #6bb5a7 !important;
  border: 1px solid #6bb5a7 !important;
}

/* スマホ側でwidth:100%を強制される対策 */
@media (max-width: 767px) {
  .cta-wrap .cta-pill { width: auto !important; max-width: 100% !important; }
}