/* 部落格頁面專用樣式（2025-05-22 02:10 PM CST） */

/* 提高按鈕樣式的選擇器優先級，確保覆蓋 Bootstrap和CMS樣式 */
.container a.btn.btn-custom, a.btn.btn-custom { 
    background: linear-gradient(45deg, #ff6f61, #ff9a76); 
    color: white; 
    border-radius: 25px; 
    padding: 10px 20px; 
    transition: all 0.3s ease; 
    box-sizing: border-box; 
    border: none; 
    text-decoration: none; /* 確保鏈接無下劃線 */
}
.container a.btn.btn-custom:hover, a.btn.btn-custom:hover { 
    transform: translateY(-3px); 
    box-shadow: 0 5px 15px rgba(255, 111, 97, 0.4); 
}

/* 卡片樣式 */
.card { 
    border: none; 
    border-radius: 15px; 
    overflow: hidden; 
    background: #fff; 
    box-shadow: 0 4px 10px rgba(0,0,0,0.1); 
    transition: transform 0.3s ease; 
    box-sizing: border-box; 
}
.card:hover { 
    transform: scale(1.03); 
}
.card-img-top { 
    height: 200px; 
    object-fit: cover; 
    width: 100%; 
}

/* 分隔線樣式 */
.section-divider { 
    border-top: 2px dashed #ff6f61; 
    margin: 40px 0; 
}

/* 媒體查詢：針對移動裝置（螢幕寬度小於 768px） */
@media (max-width: 768px) {
    .container a.btn.btn-custom, a.btn.btn-custom { 
        padding: 8px 16px; 
        border-radius: 20px; 
    }
    .container a.btn.btn-custom:hover, a.btn.btn-custom:hover { 
        transform: translateY(-2px); 
        box-shadow: 0 3px 10px rgba(255, 111, 97, 0.3); 
    }
    .card { 
        border-radius: 10px; 
        box-shadow: 0 2px 5px rgba(0,0,0,0.1); 
    }
    .card:hover { 
        transform: scale(1.01); 
    }
    .card-img-top { 
        height: 150px; 
    }
    .section-divider { 
        margin: 20px 0; 
    }
}

/* 針對更小的螢幕（小於 576px） */
@media (max-width: 576px) {
    .container a.btn.btn-custom, a.btn.btn-custom { 
        padding: 6px 12px; 
        font-size: 14px; 
    }
    .card-img-top { 
        height: 120px; 
    }
}
/* 部落格頁面專用樣式結束 */