/* CTA全体の空気感：境界線を排し、極薄グラデで浮かせる */
.cta-container {
margin-top: 3em !important; 
    margin-bottom: 5em;
    padding: 4em 2em;
    background: linear-gradient(
        to bottom, 
        transparent, 
        rgba(255, 255, 255, 0.015) 15%, /* さらに薄く、溶け込むように */
        rgba(255, 255, 255, 0.015) 85%, 
        transparent
    );
    text-align: center;
    border: none; /* ボーダーは一切なし */
}

/* ラベル：静かに、でも確実に存在を示す */
.cta-label {
    display: block;
    font-size: 10px;
    color: #555; /* 明度を落として背景に馴染ませる */
    letter-spacing: 0.25em; /* 文字間を広く取り、記号的に */
    margin-bottom: 3em;
}

/* 画像：彩度と明度を落とし、ホバーで復元 */
.cta-image img {
    max-width: 100%;
    height: auto;
    border-radius: 2px; /* 角丸を最小限に */
    filter: saturate(0.5) brightness(0.8); /* ストイックな色調に */
    transition: all 0.5s ease;
}

.cta-image a:hover img {
    filter: saturate(1) brightness(1); /* ホバーで愛（このはちゃんの色）が蘇る */
}

/* テキストエリア：縦組みで読ませる設計 */
.cta-content {
    max-width: 600px;
    margin: 3em auto 0;
}

.cta-title {
    font-size: 1.5rem; /* 少し大きく */
    color: #ccc;
    margin-bottom: 1.2em;
    font-weight: 500;
}

.cta-text {
    font-size: 0.95rem;
    color: #888;
    line-height: 1.9; /* 行間を広く取り、読みやすく */
    margin-bottom: 3em;
    text-align: left; /* 本文は左寄せで読了感を優先 */
}

/* ボタン：サーモンピンクのテキストが映えるゴーストスタイル */
.cta-button {
    display: inline-block;
    width: 100%;
    max-width: 380px; /* 少しワイドに */
    padding: 1.2em;
    border: 1px solid #444; /* 枠線は静かに */
    color: #fa8072; /* ここをサーモンピンクに！大人の色気。 */
    text-decoration: none;
    font-size: 0.95rem;
    letter-spacing: 0.15em;
    border-radius: 2px;
    transition: all 0.3s ease;
    background: transparent;
}

.cta-button:hover {
    border-color: #fa8072; /* ホバーで枠線もピンクに */
    background: rgba(250, 128, 114, 0.08); /* ほんのり背景色を灯す */
    color: #fa8072; /* 色は維持 */
}

/* 既存のスタイルに「打ち消し」を追加 */
.cta-title {
    font-size: 1.5rem;
    color: #ccc;
    margin-bottom: 1.2em;
    font-weight: 500;
    
    /* 強制的に線を消し、Cocoon等のデフォルトパディングをリセット */
    border: none !important; 
    padding: 0 !important;
    background: none !important; /* 背景色がついている場合も考慮 */
}

/* ついでに、h3の前に出るアイコン（擬似要素）も消しておくと安全です */
.cta-title::before,
.cta-title::after {
    display: none !important;
    content: none !important;
}

.cta-container {
    /* 著者情報エリアとの間に「静寂（空間）」を確保 */
    margin-top: 6em !important; 
    margin-bottom: 4em;
    padding: 4em 2em;
    /* ...グラデーション等の設定... */
}