/* ページヘッダーを非表示にする設定はそのまま */
.page-header {
    display: none;
}

/* --- ボタンの共通スタイル --- */
.btn.cta-red,
.btn.cta-red-min,
.btn.cta-orange,
.btn.cta-orange-min {
    text-align: center;
    font-weight: bold;
    position: relative;
    margin: 0.8rem 0;
    border-radius: 0.4rem;
    max-width: 100%;
    cursor: pointer;
    color: #fff; /* テキストカラーは白で統一 */
    /* トランジションを追加して、ホバー時の変化を滑らかに */
    transition: all 0.3s ease-in-out;
}

/* --- 暖色系ボタン（メイン） --- */
/* 元のcta-redを、より暖かく深みのあるオレンジレッド系に */
.btn.cta-red,
.btn.cta-red-min {
    /* 落ち着いたオレンジからテラコッタへのグラデーション */
    background: linear-gradient(90deg, #FF7043 0%, #E64A19 100%);
    /* グラデーションに合わせたシャドウ */
    box-shadow: 0 0.4rem 0 #BF360C;
}

/* --- 暖色系ボタン（アクセント） --- */
/* 元のcta-orangeを、明るく活気のあるオレンジ系に */
.btn.cta-orange,
.btn.cta-orange-min {
    /* 明るいオレンジから少し赤みのあるオレンジへのグラデーション */
    background: linear-gradient(90deg, #FFAB40 0%, #FF6F00 100%);
    /* グラデーションに合わせたシャドウ */
    box-shadow: 0 0.4rem 0 #E65100;
}

/* --- ボタンのサイズ調整（変更なし） --- */
.btn.cta-red,
.btn.cta-orange {
    font-size: 1.8rem;
    padding: 1.8rem 1.2rem;
}

.btn.cta-red-min,
.btn.cta-orange-min {
    font-size: 1.4rem;
    padding: 0.8rem 1.2rem;
}

/* --- ホバー時の効果を追加（オプション） --- */
/* ボタンが押されたような視覚効果 */
.btn.cta-red:active,
.btn.cta-red-min:active,
.btn.cta-orange:active,
.btn.cta-orange-min:active {
    transform: translateY(0.2rem); /* 少し下に移動 */
    box-shadow: 0 0.2rem 0 rgba(0, 0, 0, 0.2); /* シャドウを小さく */
}