/* css/style.css */

/* 1. Navbar 設定 */
.navbar {
    min-height: 70px;
    background-color: #ffffff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.nav-link {
    font-weight: 700; /* 修正原本 700x 的語法錯誤 */
}

/* 2. 全域設定 */
body {
    padding-top: 70px;
    background-color: #FBF6E9;
    font-family: "M PLUS Rounded 1c", "Noto Sans TC", "Microsoft JhengHei", sans-serif;
    font-size: 24px;
    color: #484641;
}

h3 {
    font-size: 38px;
    font-weight: 800;
}

/* 3. 顏色類別 */
.text-orange { color: #E37C22; }
.text-red { color: #B91212; }
.text-green { color: #485E2B; }

/* 4. 背景圖設定 (注意路徑為 ../images/...) */
.background-rignt {
    position: relative;
    padding: 60px 0;
    background-image: url('../images/BK2R.png');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 25% auto;
    background-color: #FBF6E9;
}

.background-left {
    position: relative;
    padding: 60px 0;
    background-image: url('../images/BK2L.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 25% auto;
    background-color: #F4EDDC;
}

/* 5. 組件樣式 */
.navbar-collapse { align-items: center; }

.banner-container { width: 100%; overflow: hidden; }
.banner-container img { width: 100%; height: auto; display: block; }

.border-secondary-orange { border-color: #E37C22 !important; border-width: 1px !important; }
.border-secondary-green { border-color: #485E2B !important; border-width: 1px !important; }

.fw-bold.text-orange { color: #E37C22; }

.faq-item { padding-bottom: 20px; }
.ps-5 { padding-left: 4.2rem !important; }
.faq-item:last-child { border-bottom: none; }

.store-link img {
    height: 50px;
    width: auto;
    transition: transform 0.2s;
}
.store-link:hover { transform: scale(1.05); }

/* 6. 動畫效果 */
.fade-in-section {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}
.fade-in-section.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* 7. 響應式設定 */
@media (max-width: 991.98px) {
    .navbar-collapse {
        background-color: #ffffff;
        padding: 10px 20px;
        border-top: 1px solid #eee;
    }
}

@media (max-width: 767px) {
	body {
        font-size: 18px; /* 手機版將字體縮小到 18px */
    }
    
    h3 {
        font-size: 24px; /* 標題也隨之縮小，視覺更協調 */
    }
    .store-link img { height: 40px; }
}