:root {
    --text-color: #FFFFFF;
    /* Navbar 實際高度（桌機約 76px） */
    --nav-h: 76px;
    /* 1920x1080 比例換算：
       - Logo 與上方 Navbar 下緣距離 124px → 124 / 1080 = 11.4815% (11.48vh)
       - Logo 寬度 336.08px → 336.08 / 1920 = 17.504% (17.5vw)
       - Logo 高度 264.25px → 264.25 / 1080 = 24.468% (24.47vh)
       - Logo 與 Slogan 間距 55px → 55 / 1080 = 5.093% (5.09vh / 2.86vw)
       - Slogan 寬度 449.53px → 449.53 / 1920 = 23.413% (23.41vw)
       - Slogan 高度 184.47px → 184.47 / 1080 = 17.081% (17.08vh)
       - Slogan 與星星光芒頂端距離 40px → 40 / 1080 = 3.704% (3.70vh)
       - 星星光芒底圖區高度 336.28px → 336.28 / 1080 = 31.137% (31.14vh)
       總和：76 + 124 + 264.25 + 55 + 184.47 + 40 + 336.28 = 1080px (100%)
    */
    --kv-logo-offset: 11.48vh;
}

.grecaptcha-badge { 
            visibility: hidden !important;
            opacity: 0 !important;
        }

body {
    margin: 0;
    padding: 0;
    overflow-x: hidden; 
    font-family: 'Noto Serif TC', serif;
    background-color: #000;
}

/* --- Nav (導覽列) --- */
.nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.95);
    border-bottom: 1px solid rgba(199, 137, 103, 0.25);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.06);
    z-index: 1000;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.nav__container {
    max-width: 100%;
    margin: 0 auto;
    padding: 16px 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.nav__logo-link {
    display: flex;
    align-items: center;
}

.nav__logo {
    height: 40px;
    width: auto;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.nav__logo-link:hover .nav__logo {
    transform: scale(1.03);
}

.nav__list {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav__item {
    display: flex;
}

.nav__item:not(:last-child) {
    border-right: 1px solid #e2d9cf;
}

.nav__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 14px;
    padding: 0 24px;
    color: #3a2a1f;
    text-decoration: none;
    transition: color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
}

.nav__item:last-child .nav__link {
    padding-right: 0;
}

.nav__link:hover {
    color: #c78967;
}

.nav__link:hover .nav__icon {
    transform: translateY(-3px);
}

.nav__icon {
    width: 22px;
    height: 22px;
    margin-bottom: 4px;
    color: #c78967;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.nav__text {
    line-height: 1.2;
    font-weight: 600;
}

/* --- Hero Section Styles (1920x1080 精準比例規範) --- */
.hero-container {
    position: relative;
    width: 100%;
    /* Hero 區高度綁定可視高度：100vh / 100dvh，避免手機網址列遮擋 */
    height: 100vh;
    height: 100dvh;
    min-height: 100vh;
    min-height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    /* 背景圖樣式規範：貼齊底部置中，確保 1920x1080 下方光芒與線條完整呈現 */
    background-size: cover;
    background-position: center bottom;
    overflow: hidden;
}

.hero-bg-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.hero-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* 關鍵：貼齊底部置中，確保 1920x1080 下方光芒與線條完整呈現，不被瀏覽器可視高度裁切 */
    object-position: center bottom;
    background-size: cover;
    background-position: center bottom;
}

/* KV Logo + Slogan 容器：
   限制在 Navbar 下緣 與 底圖星星頂端 之間的空間，
   確保在任何螢幕長寬比下 Slogan 絕不與星星光芒重疊 */
.hero-kv {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: var(--nav-h);
    /* 星星光芒頂端位置：在寬螢幕時依寬度等比為 100vw * (336.28 / 1920)，在直立螢幕時為 31.14vh */
    bottom: max(31.14vh, calc(100vw * 336.28 / 1920));
    width: 100%;
    max-width: 1920px;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /* Logo 距 Navbar 下緣 124px（1080p 基準為 124px / 11.48vh，具備彈性 clamp 避免擠壓） */
    padding-top: clamp(24px, 11.48vh, 124px);
    padding-bottom: clamp(16px, 3.7vh, 40px);
    padding-left: 1rem;
    padding-right: 1rem;
    box-sizing: border-box;
}

.hero-kv-logo {
    display: block;
    /* 1920x1080 基準寬 336.08px，設定 clamp 避免在 1366~1600 筆電螢幕過度縮小 */
    width: clamp(280px, 17.5vw, 336.08px);
    max-width: 336.08px;
    max-height: min(264.25px, 50%);
    height: auto;
    object-fit: contain;
    flex-shrink: 1;
}

.hero-kv-slogan {
    display: block;
    /* 1920x1080 基準寬 449.53px，設定 clamp 避免在 1366~1600 筆電螢幕過度縮小 */
    width: clamp(380px, 23.41vw, 449.53px);
    max-width: 449.53px;
    max-height: min(184.47px, 36%);
    height: auto;
    /* Logo 與 Slogan 間距 55px */
    margin-top: clamp(18px, 2.86vw, 55px);
    object-fit: contain;
    flex-shrink: 1;
}

/* 平板 / 中型視窗 (<= 1024px) */
@media (max-width: 1024px) {
    .hero-kv {
        bottom: 31.14vh;
        padding-top: clamp(40px, 8vh, 90px);
    }

    .hero-kv-logo {
        width: clamp(240px, 34vw, 320px);
        max-width: 320px;
        max-height: 48%;
    }

    .hero-kv-slogan {
        width: clamp(340px, 46vw, 440px);
        max-width: 440px;
        max-height: 34%;
        margin-top: clamp(16px, 3vw, 36px);
    }
}

/* 手機版視窗 (<= 768px) */
@media (max-width: 768px) {
    :root {
        --nav-h: 56px;
    }

    .hero-kv {
        bottom: 31.14vh;
        /* 手機版頂部留白調適，讓內容自然下移 */
        padding-top: clamp(44px, 8vh, 72px);
    }

    .hero-kv-logo {
        width: clamp(210px, 62vw, 290px);
        max-width: 290px;
        max-height: 46%;
    }

    .hero-kv-slogan {
        width: clamp(290px, 85vw, 390px);
        max-width: 390px;
        max-height: 32%;
        margin-top: clamp(16px, 3vh, 26px);
    }
}

/* 超矮螢幕保護 */
@media (max-height: 600px) {
    .hero-kv {
        padding-top: 10px;
        padding-bottom: 6px;
    }
    .hero-kv-logo {
        max-height: 40%;
        width: auto;
    }
    .hero-kv-slogan {
        max-height: 28%;
        width: auto;
        margin-top: 6px;
    }
}

/* =========================================
   全域容器規範 (Global Container Rules)
   ========================================= */
.container-1200 {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 5%;
    padding-right: 5%;
    box-sizing: border-box;
}

@media (min-width: 1334px) {
    .container-1200 {
        max-width: 1200px;
        padding-left: 0;
        padding-right: 0;
    }
}

/* =========================================
   Section 00-01 排版規格
   ========================================= */
/* =========================================
   Swiper 全域觸控流暢滑動與防止殘影優化 (GPU 加速)
   ========================================= */
.swiper {
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch;
}

.swiper-slide {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0);
    will-change: transform;
}

.section-00-01 {
    position: relative;
    width: 100%;
    background-color: #FAF5ED;
    background-image: url('img/bg_papper.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: repeat-y;
    overflow: hidden;
    color: #4A382D;
    /* 確保高度足夠容納 deco-mrt (1511px) 與 deco-building (960px) 交疊 -289px 後的完整畫面 (2182px) */
    min-height: calc(100vw * 2182 / 1920);
}

/* 裝飾背景圖層容器 */
.deco-bg-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
    z-index: 1;
}

/* 圖片：00-01_deco-mrt (捷運路線示意圖) */
.deco-mrt {
    width: 100%;
    max-width: 1920px;
    height: auto;
    display: block;
}

/* 圖片：00-01_deco-buliding (兩圖交疊間距設為 -289px) */
.deco-building {
    width: 100%;
    max-width: 1920px;
    height: auto;
    display: block;
    margin-top: -289px; /* 垂直方向 overlap -289px */
    opacity: 1;
}

/* 英標圖片：00-01_title-en1
   規格：距離上方 189px (189 / 1920 = 9.84375vw) */
.section-title-en-wrapper {
    position: absolute;
    top: clamp(60px, 9.84vw, 189px);
    left: 0;
    z-index: 5;
    pointer-events: none;
    max-width: 876px;
    width: clamp(320px, 45.6vw, 876px);
    opacity: 1;
}

.section-title-en-wrapper picture,
.section-title-en {
    width: 100%;
    height: auto;
    display: block;
}

/* 內容文字區塊 (套用全域 1200px 容器規範)
   規格：
   - 00-01_title-en1 頂端 189px + 自身高度 133px = 底端 322px
   - 00-01_title-en1 與「北桃大玄關」主標題間距調整為 120px
   - 故 主標題頂端位置 = 322px + 120px = 442px (442 / 1920 = 23.02vw) */
.section-content-00-01 {
    position: relative;
    z-index: 10;
    padding-top: clamp(190px, 23.02vw, 442px);
    padding-bottom: clamp(140px, 20vw, 360px);
}

.content-block-top {
    max-width: 620px;
}

.main-title-00-01 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(22px, 2vw, 34px);
    font-weight: 700;
    color: #7B1B07;
    letter-spacing: 2px;
    line-height: 1.4;
    margin: 0 0 20px 0;
}

/* 統一內文樣式 */
.body-text-00-01 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px);
    color: #4A382D;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0 0 20px 0;
    font-weight: 400;
}

/* 分割線位置：00-01_deco-mrt 橫線 (Y = 752.42px / 39.19vw)
   規格：放大內文 1 與 內文 2 之間距 (內文1底距橫線 ~180px，橫線至內文2頂 ~180px，合計約 360px) */
.mrt-divider-space {
    height: clamp(120px, 18.75vw, 360px);
    width: 100%;
}

.content-block-bottom {
    max-width: 620px;
}

.content-block-bottom .highlight-p {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px);
    color: #4A382D;
    line-height: 2.1;
    letter-spacing: 1px;
    margin-top: 24px;
    margin-bottom: 0;
    font-weight: 400;
}

/* 平板 / 中型螢幕 RWD */
/* =========================================
   平板 / 手機版 RWD (<= 1024px，包含 1011px 平板尺寸)
   由上而下依序為：
   1. 滿版英標 (00-01_title-en1_sm)
   2. 中文標題 + 統一內文
   3. 裝飾圖層區塊 (MRT + 建築插圖)
   ========================================= */
@media (max-width: 1024px) {
    /* 平板與手機版排版順序 */
    .section-00-01 {
        min-height: auto;
        display: flex;
        flex-direction: column;
    }

    /* 1. 英文標題滿版 */
    .section-title-en-wrapper {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        max-width: 100%;
        padding-top: 40px;
        order: 1;
    }

    .section-title-en-wrapper picture,
    .section-title-en {
        width: 100%;
        height: auto;
        display: block;
    }

    /* 2. 中文標題 ＋ 內文 */
    .section-content-00-01 {
        position: relative;
        padding-top: 32px;
        padding-bottom: 0;
        order: 2;
    }

    .main-title-00-01 {
        font-size: clamp(22px, 3.5vw, 28px);
        letter-spacing: 1.5px;
        margin-bottom: 20px;
    }

    .body-text-00-01 {
        font-size: clamp(15px, 1.8vw, 17px);
        line-height: 2.1;
        letter-spacing: 0.8px;
        margin-bottom: 20px;
    }

    /* 收合大分割線留白，內文1與內文2流暢銜接 */
    .mrt-divider-space {
        display: none;
    }

    .content-block-bottom .highlight-p {
        margin-top: 24px;
        font-size: clamp(15px, 1.8vw, 17px);
        line-height: 2.1;
    }

    /* 3. 裝飾圖層區塊：00-01_deco-mrt 與 00-01_deco-buliding 接在文字下方 */
    .deco-bg-wrapper {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        margin-top: 32px;
        order: 3;
        pointer-events: auto;
    }

    .deco-mrt {
        width: 100%;
        height: auto;
        display: block;
    }

    .deco-building {
        width: 100%;
        height: auto;
        display: block;
        margin-top: -15vw; /* 維持垂直交疊 */
    }
}

/* 手機版導航與小螢幕微調 (<= 768px) */
@media (max-width: 768px) {
    .nav__container {
        padding: 8px 5% !important;
        max-width: 100%;
    }

    .nav__logo-link {
        display: none;
    }

    .nav__list {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .nav__item {
        flex: 1 1 25%;
        min-width: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .nav__link,
    .nav__item:last-child .nav__link {
        width: 100%;
        padding: 6px 0 !important;
        font-size: 12px;
        flex-direction: column;
    }

    .nav__icon {
        width: 20px;
        height: 20px;
        margin-bottom: 2px;
    }

    .nav__text {
        font-size: 12px;
        white-space: nowrap;
    }

    .section-title-en-wrapper {
        padding-top: 30px;
    }

    .section-content-00-01 {
        padding-top: 24px;
    }

    .main-title-00-01 {
        font-size: 20px;
        margin-bottom: 16px;
    }

    .body-text-00-01 {
        font-size: 14.5px;
        margin-bottom: 16px;
    }

    .content-block-bottom .highlight-p {
        margin-top: 20px;
        font-size: 14.5px;
    }

    .deco-bg-wrapper {
        margin-top: 20px;
    }
}

/* =========================================
   Section 00-02 (三鶯線區塊) 排版樣式
   ========================================= */
.section-00-02 {
    position: relative;
    width: 100%;
    background-color: #FAF5ED;
    background-image: url('img/bg_papper.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: repeat-y;
    overflow: hidden;
    color: #4A382D;
    padding-bottom: 60px; /* 本區塊底部保持 60px 邊界 */
}

/* 1. 英文標題區 (100vw 滿版，突破 1200px 限制，與上方間距 100px) */
.section-00-02-title-en-wrapper {
    width: 100%;
    margin-top: 100px;
}

.section-00-02-title-en-wrapper picture,
.section-00-02-title-en {
    width: 100%;
    max-width: 100vw;
    height: auto;
    display: block;
}

/* 2. 文案區（遵循 1200px 容器） */
.section-00-02-content {
    margin-top: 60px;
}

/* 主副標（右側）：由 50% 處起始靠左對齊 */
.section-00-02-heading-group {
    margin-left: 50%;
}

.main-title-00-02 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 700;
    color: #7B1B07;
    letter-spacing: 2px;
    line-height: 1.4;
    margin: 0 0 12px 0;
}

.sub-title-00-02 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(15px, 1.1vw, 18px);
    font-weight: 600;
    color: #7B1B07;
    letter-spacing: 1.5px;
    margin: 0;
}

/* 內文（左側）：位於右側主副標下方，上下垂直間距 60px */
.section-00-02-body-group {
    margin-top: 60px;
    max-width: 560px;
}

.body-text-00-02 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px);
    color: #4A382D;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

/* 滿版分割線 (100vw，顏色 #801C05，高度 1px) */
.full-width-divider-line {
    width: 100vw;
    max-width: 100vw;
    height: 1px;
    background-color: #801C05;
    margin-left: calc(50% - 50vw);
    border: none;
    opacity: 0.85;
}

/* 上方滿版分割線：與下方卡片區間距 100px */
.divider-top {
    margin-top: 80px;
    margin-bottom: 100px;
}

/* 下方滿版分割線：與下方結尾文案間距 60px */
.divider-bottom {
    margin-bottom: 60px;
}

/* 4. 卡片區塊 (共 7 站) */
.station-cards-section {
    position: relative;
    width: 100%;
    margin-bottom: 100px;
}

/* 桌機版卡片結構 (>= 769px：3 行結構，中層裝飾線自然流動，上下等距 30px) */
.station-cards-desktop-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 4%;
    box-sizing: border-box;
}

.station-imgs-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    gap: 16px;
}

.station-img-col {
    flex: 1 1 0;
    max-width: 140px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.station-card-img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
}

.station-img-col:hover .station-card-img {
    transform: translateY(-6px);
}

/* 桌機裝飾線：距上方圖底 30px，距下方標題頂 30px (100% 絕對等距，解決任何解析度漂移問題) */
.station-cards-desktop-wrapper .deco-line-track {
    width: 100%;
    max-width: 1500px;
    height: 42px;
    margin: 30px auto;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}

.deco-line-svg {
    width: 100%;
    height: 42px;
    display: block;
}

.station-titles-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    gap: 16px;
}

.station-title-col {
    flex: 1 1 0;
    max-width: 140px;
    text-align: center;
    min-height: 65px;
}

.station-name-zh {
    font-family: 'Noto Serif TC', serif;
    font-size: 15px;
    font-weight: 700;
    color: #7B1B07;
    letter-spacing: 1px;
    margin: 0 0 6px 0;
}

.station-name-en {
    font-family: 'Noto Serif TC', serif;
    font-size: 10.5px;
    color: #8C6E53;
    line-height: 1.35;
    margin: 0;
    font-weight: 400;
}

/* 手機版卡片容器預設隱藏 (桌機版) */
.station-cards-mobile-wrapper {
    display: none;
}

/* 6. 底部結尾文案（遵循 1200px 容器） */
.section-00-02-footer {
    position: relative;
    z-index: 2;
}

.section-00-02-footer-text {
    max-width: 560px;
}

/* Section 00-02 平板尺寸調適 (769px ~ 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .section-00-02-title-en-wrapper {
        margin-top: 70px;
    }

    .section-00-02-content {
        margin-top: 40px;
    }

    .section-00-02-heading-group {
        margin-left: 35%;
    }

    .divider-top {
        margin-top: 60px;
        margin-bottom: 70px;
    }

    .station-cards-section {
        margin-bottom: 70px;
    }

    .station-cards-desktop-wrapper .deco-line-track {
        margin: 24px auto;
    }

    .station-name-zh {
        font-size: 13.5px;
    }

    .station-name-en {
        font-size: 9.5px;
    }
}

/* Section 00-02 手機版 RWD (<= 768px)：單個卡片置中滿版 + 輪播控制 */
@media (max-width: 768px) {
    .section-00-02 {
        padding-bottom: 50px;
    }

    .section-00-02-title-en-wrapper {
        margin-top: 50px;
    }

    .section-00-02-content {
        margin-top: 30px;
    }

    .section-00-02-heading-group {
        margin-left: 0; /* 手機版靠左對齊 */
    }

    .main-title-00-02 {
        font-size: 21px;
        margin-bottom: 8px;
    }

    .sub-title-00-02 {
        font-size: 14.5px;
    }

    .section-00-02-body-group {
        margin-top: 30px;
    }

    .divider-top {
        margin-top: 40px;
        margin-bottom: 50px;
    }

    .station-cards-section {
        margin-bottom: 50px;
        width: 100%;
        overflow: hidden;
    }

    /* 手機版：隱藏桌機結構，顯示手機版輪播結構 */
    .station-cards-desktop-wrapper {
        display: none !important;
    }

    .station-cards-mobile-wrapper {
        display: block !important;
        position: relative;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        overflow: hidden;
    }

    /* 手機版固定背景裝飾線 (固定不動、不參與輪播，距上圖 30px，距下文字 30px) */
    .station-mobile-deco-line {
        position: absolute;
        top: calc(220px * 1.5977 + 30px);
        left: 0;
        width: 100%;
        height: 42px;
        display: flex;
        justify-content: center;
        align-items: center;
        pointer-events: none;
        z-index: 1;
    }

    .station-mobile-deco-line .deco-line-svg {
        width: 100%;
        max-width: 100vw;
        height: 42px;
        display: block;
    }

    .station-swiper {
        width: 100% !important;
        margin: 0 auto !important;
        overflow: hidden !important;
        position: relative;
        z-index: 2;
        padding: 0 0 10px 0;
    }

    .station-swiper .swiper-wrapper {
        display: flex;
        align-items: center;
        box-sizing: border-box;
    }

    /* 單個卡片置中滿版 */
    .station-mobile-card {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        box-sizing: border-box;
        padding: 0 !important;
        margin: 0 !important;
    }

    .station-mobile-img-box {
        width: 220px;
        max-width: 75vw;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: flex-end;
    }

    .station-mobile-img-box .station-card-img {
        width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
    }

    /* 藍線固定佔位空間：30px (上間距) + 42px (藍線高) + 30px (下間距) = 102px */
    .station-mobile-spacer {
        width: 100%;
        height: 102px;
        flex-shrink: 0;
    }

    .station-mobile-title-box {
        text-align: center;
        margin: 0 auto;
        min-height: 60px;
    }

    .station-mobile-title-box .station-name-zh {
        font-size: 18px;
        letter-spacing: 1.5px;
        margin-bottom: 6px;
    }

    .station-mobile-title-box .station-name-en {
        font-size: 12.5px;
    }

    /* 手機版 Slide 輪播指示控制器 (Pagination) */
    .station-swiper-pagination {
        display: flex !important;
        justify-content: center;
        align-items: center;
        gap: 8px;
        position: relative !important;
        bottom: auto !important;
        margin-top: 24px;
        z-index: 10;
    }

    .station-swiper .swiper-slide {
        width: 100% !important;
        flex-shrink: 0 !important;
        box-sizing: border-box !important;
    }

    .station-swiper-pagination .swiper-pagination-bullet {
        background: #C78967 !important;
        opacity: 0.35 !important;
        width: 8px !important;
        height: 8px !important;
        margin: 0 !important;
        border-radius: 9999px !important;
        cursor: pointer;
        box-shadow: none !important;
        outline: none !important;
        border: none !important;
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
        transition: width 0.25s ease, background-color 0.25s ease, opacity 0.25s ease !important;
        flex-shrink: 0;
    }

    .station-swiper-pagination .swiper-pagination-bullet-active {
        background: #801C05 !important;
        opacity: 1 !important;
        width: 22px !important;
        border-radius: 9999px !important;
    }

    .divider-bottom {
        margin-bottom: 40px;
    }
}

/* =========================================
   Section 00-03 (2100坪藝文地標) 排版樣式
   ========================================= */
.section-00-03 {
    position: relative;
    width: 100%;
    background-color: #58160B;
    background-image: url('img/bg_red-papper.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: repeat-y;
    overflow: visible !important; /* 確保父層不裁切 */
    color: #FAF5ED;
    padding-top: 80px; /* 消除 margin collapse，確保上方無任何黑邊隙縫 */
    padding-bottom: 500px; /* 加大內文與手繪圖之間的視覺間距 */
    z-index: 10;
}

/* 1. 英文標題區 (100vw 滿版，與上方間距 80px，與下方文案間距 80px) */
.section-00-03-title-en-wrapper {
    width: 100%;
    margin-top: 0;
    margin-bottom: 80px;
}

.section-00-03-title-en-wrapper picture,
.section-00-03-title-en {
    width: 100%;
    max-width: 100vw;
    height: auto;
    display: block;
}

/* 2. 上半部文案（遵循 1200px 容器，靠左對齊，與下方滿版線間距 80px） */
.section-00-03-top-content {
    margin-bottom: 80px;
}

.section-00-03-heading-group {
    max-width: 600px;
}

.main-title-00-03 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: 2px;
    line-height: 1.5;
    margin: 0 0 20px 0;
}

.body-text-00-03-top {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px);
    color: #FAF5ED;
    opacity: 0.9;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

/* 3. 滿版分割線 (100vw，顏色 #C07D11，高度 1px) */
.full-width-gold-line {
    width: 100vw;
    max-width: 100vw;
    height: 1px;
    background-color: #C07D11;
    margin-left: calc(50% - 50vw);
    border: none;
    opacity: 0.85;
}

/* 4. 下半部文案（遵循 1200px 容器，區塊整體靠到最右邊貼齊 1200px，文字本體靠左） */
.section-00-03-bottom-content {
    display: flex;
    justify-content: flex-end;
    margin-top: 80px;
    margin-bottom: 0;
}

.section-00-03-body-group-right {
    width: fit-content;
    max-width: 100%;
    text-align: left;
}

.body-text-00-03 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px);
    color: #FAF5ED;
    opacity: 0.9;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

/* 5. 底部跨區交疊圖（定位在 00-03 底部，並用 translate(-50%, 25%) 向下交疊 1/4） */
.section-00-03-overlap-box {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 25%); /* 向下交疊 1/4 (25%) */
    width: 100%;
    max-width: 1467px;
    z-index: 20;
    pointer-events: none; /* 避免遮擋點擊 */
    display: flex;
    justify-content: center;
}

.section-00-03-overlap-img {
    width: 100%;
    max-width: 1467px;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* =========================================
   Section 00-04 (建築規劃與團隊) 排版樣式
   ========================================= */
.section-00-04 {
    position: relative;
    width: 100%;
    background-color: #FAF5ED;
    background-image: url('img/bg_papper.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: repeat-y;
    color: #4A382D;
    padding-top: clamp(160px, 12vw, 200px); /* 預留 1/4 突出的圖片高度 + 標題舒適間距 */
    padding-bottom: 100px;
    z-index: 5;
    overflow-x: clip; /* 避免延伸裝飾線產生水平捲軸 */
}

/* 1. 英文標題區 (100vw 滿版) */
.section-00-04-title-en-wrapper {
    width: 100%;
    margin-bottom: 60px;
}

.section-00-04-title-en-wrapper picture,
.section-00-04-title-en {
    width: 100%;
    max-width: 100vw;
    height: auto;
    display: block;
}

/* 2. 中文標題 (從 50% 起始靠左對齊) */
.section-00-04-heading-group {
    margin-left: 50%;
    margin-bottom: 40px;
}

.main-title-00-04 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 700;
    color: #7B1B07;
    letter-spacing: 2px;
    line-height: 1.4;
    margin: 0;
}

/* 3. 團隊資訊小標：線條由螢幕最左側延伸至文字結尾處 */
.team-info-container {
    width: 100%;
    margin-bottom: 60px;
}

.team-info-block {
    position: relative;
    display: inline-block;
    width: fit-content;
    max-width: 100%;
}

.team-info-row {
    display: flex;
    align-items: center;
    gap: clamp(24px, 4vw, 50px);
    padding: 8px 0; /* 緊貼文字，縮減線與文字之垂直距離 */
    position: relative;
}

/* 上、中、下三條裝飾線，由螢幕最左側延伸起始至文字結尾處 */
.team-info-row::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: -50vw; /* 突破 1200px 延伸至螢幕最左邊界 */
    height: 1px;
    background-color: #801C05;
    opacity: 0.85;
}

.team-info-row:last-child::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    left: -50vw;
    height: 1px;
    background-color: #801C05;
    opacity: 0.85;
}

.team-role {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(16px, 1.25vw, 19px); /* 字級加大 */
    font-weight: 700;
    color: #7B1B07;
    letter-spacing: 2px;
    white-space: nowrap;
}

.team-name {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(15.5px, 1.2vw, 18.5px); /* 字級加大 */
    font-weight: 600;
    color: #4A382D;
    letter-spacing: 1px;
    white-space: nowrap;
}

/* 4. 內文區塊 (從 50% 起始靠左對齊) */
.section-00-04-body-group {
    margin-left: 50%;
    max-width: 560px;
}

.body-text-00-04 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px);
    color: #4A382D;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

/* =========================================
   Section 00-04 公設圖片輪播 (Public Amenities Swiper)
   ========================================= */
.public-swiper-wrapper {
    width: 100%;
    max-width: 1200px;
    margin: 60px auto 0 auto;
    position: relative;
}

.public-swiper {
    width: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 8px; /* 添加微圓角，柔和視覺邊界 */
}

.public-swiper .swiper-slide {
    position: relative !important;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
}

.public-slide-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 8px;
}

/* 公設照右下警語 */
.public-slide-disclaimer {
    position: absolute;
    bottom: 14px;
    right: 18px;
    text-align: right;
    color: rgba(255, 255, 255, 0.9);
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(10.5px, 0.85vw, 13px);
    font-weight: 400;
    letter-spacing: 0.8px;
    line-height: 1.2;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.85), 0 0 8px rgba(0, 0, 0, 0.6);
    pointer-events: none;
    z-index: 5;
}

@media (max-width: 768px) {
    .public-slide-disclaimer {
        bottom: 8px;
        right: 10px;
        left: auto;
        font-size: 10.5px;
        letter-spacing: 0.5px;
    }
}

/* 輪播分頁指示點 (Pagination) */
.public-swiper-pagination {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 8px;
    position: relative !important;
    bottom: auto !important;
    margin-top: 24px;
    z-index: 10;
}

.public-swiper-pagination .swiper-pagination-bullet {
    background: #C78967 !important;
    opacity: 0.35 !important;
    width: 8px !important;
    height: 8px !important;
    margin: 0 !important;
    border-radius: 9999px !important;
    cursor: pointer;
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transition: width 0.25s ease, background-color 0.25s ease, opacity 0.25s ease !important;
    flex-shrink: 0;
}

.public-swiper-pagination .swiper-pagination-bullet-active {
    background: #801C05 !important;
    opacity: 1 !important;
    width: 22px !important;
    border-radius: 9999px !important;
}

/* =========================================
   Section 00-05 (貫穿大樹與業績卡片) 排版樣式
   ========================================= */
.section-00-05 {
    position: relative;
    width: 100%;
    background-color: #58160B;
    background-image: url('img/bg_red-papper.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: repeat-y;
    overflow: hidden; /* 確保邊界不外溢 */
    color: #FAF5ED;
    padding-top: 80px;
    padding-bottom: 80px;
    box-sizing: border-box;
    z-index: 10;
}

/* [底層 - z-index: 1] 英文橫線 */
.section-00-05-title-en-line-wrapper {
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;
    z-index: 1;
    pointer-events: none;
}

.section-00-05-title-en-line-wrapper picture,
.section-00-05-title-en-line {
    width: 100%;
    max-width: 100vw;
    height: auto;
    display: block;
}

/* [中層 - z-index: 5] 大樹軌道容器（右側三段垂直 100% 滿版無縫拼接，頂底 100% 絕對貼齊） */
.section-00-05-tree-wrapper {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    z-index: 5;
    pointer-events: none;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.tree-slice.tree-top {
    height: calc(100% * (2211 / 5519) + 2px);
    width: auto;
    display: block;
    flex-shrink: 0;
}

.tree-slice.tree-trunk {
    height: calc(100% * (2313 / 5519) + 2px);
    width: auto;
    display: block;
    flex-shrink: 0;
    margin-top: -2px;
}

.tree-slice.tree-bottom {
    height: calc(100% * (995 / 5519) + 2px);
    width: auto;
    display: block;
    flex-shrink: 0;
    margin-top: -2px;
}

/* [頂層 - z-index: 10] 英文標題文字 */
.section-00-05-title-en-word-wrapper {
    position: relative;
    width: 100%;
    z-index: 10;
    margin-top: 0;
    margin-bottom: 50px;
    pointer-events: none;
}

.section-00-05-title-en-word-wrapper picture,
.section-00-05-title-en-word {
    width: 100%;
    max-width: 100vw;
    height: auto;
    display: block;
}

/* 1. 頂注文案區 (遵循 1200px 容器，z-index: 10) */
.section-00-05-top-content {
    position: relative;
    z-index: 10;
    margin-bottom: 50px;
}

.section-00-05-heading-group {
    margin-left: 50%;
    margin-bottom: 30px;
}

.main-title-00-05 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: 2px;
    line-height: 1.5;
    margin: 0;
}

.section-00-05-top-body-group {
    margin-left: 50%;
    max-width: 540px;
}

.body-text-00-05 {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px);
    color: #FAF5ED;
    opacity: 0.9;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

/* 2. 上方與下方滿版分割線 */
.section-00-05-divider-top {
    position: relative;
    z-index: 1; /* 樹葉 z-index: 5 壓在此線上 */
    margin-bottom: 60px;
}

.section-00-05-divider-bottom {
    position: relative;
    z-index: 1; /* 樹根 z-index: 5 壓在此線上 */
    margin-top: 60px;
    margin-bottom: 50px;
}

/* 3. 業績卡片區塊 (3 組，遵循 1200px 容器，z-index: 10) */
.section-00-05-cases-content {
    position: relative;
    z-index: 10;
}

.cases-desktop-list {
    display: flex;
    flex-direction: column;
    gap: 60px;
    width: 100%;
}

.case-item {
    display: flex;
    align-items: center; /* 第一部分與第二部分垂直上下置中 */
    gap: 40px;
    width: 100%;
}

.case-part-left {
    display: flex;
    align-items: center; /* 與圖片上下置中 */
    justify-content: flex-start;
    gap: 24px;
    flex: 0 0 calc(50% - 20px);
    max-width: calc(50% - 20px);
    width: calc(50% - 20px);
}

.case-vertical-title {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(16px, 1.1vw, 20px);
    font-weight: 700;
    color: #FAF5ED;
    letter-spacing: 6px;
    padding: 0;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
}

.upright-char {
    display: inline-block;
    transform: none;
    text-combine-upright: all;
    margin: 2px 0;
    line-height: 1;
}

.case-img-box {
    flex: 1;
    width: 100%;
    max-width: 100%; /* 填滿左側 580px 可用空間 */
}

.case-img {
    width: 100%;
    height: auto;
    display: block;
}

.case-part-right {
    flex: 0 0 calc(50% - 20px);
    max-width: calc(50% - 20px);
    width: calc(50% - 20px);
    text-align: left;
    padding-right: 0; /* 貼齊 1200px 最右端 */
}

.case-en-subtitle {
    display: block;
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(13px, 0.9vw, 15px);
    color: #C07D11;
    letter-spacing: 1.5px;
    margin-bottom: 8px;
    font-weight: 600;
    text-transform: capitalize;
}

.case-cn-title {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(20px, 1.8vw, 26px);
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: 2px;
    margin: 0 0 20px 0;
    line-height: 1.4;
}

.case-body-text {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(13.5px, 0.92vw, 16px);
    color: #FAF5ED;
    opacity: 0.9;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

.cases-mobile-swiper-wrapper {
    display: none;
}

/* 4. 底部結尾文案 */
.section-00-05-bottom-content {
    position: relative;
    z-index: 10;
}

.section-00-05-bottom-body-group {
    max-width: 580px;
    text-align: left;
    margin-left: 0;
}

/* Section 平板尺寸調適 (<= 1024px) */
@media (max-width: 1024px) {
    .section-00-03 {
        padding-top: 60px;
        padding-bottom: 420px;
    }

    .section-00-03-title-en-wrapper {
        margin-top: 0;
        margin-bottom: 60px;
    }

    .section-00-03-top-content {
        margin-bottom: 60px;
    }

    .section-00-03-bottom-content {
        margin-top: 60px;
        margin-bottom: 0;
    }

    .section-00-04 {
        padding-top: 150px;
    }

    .section-00-04-heading-group {
        margin-left: 35%;
    }

    .section-00-04-body-group {
        margin-left: 35%;
    }

    .section-00-05-heading-group,
    .section-00-05-top-body-group {
        margin-left: 35%;
    }

    .case-part-right {
        flex: 0 0 55%;
        max-width: 55%;
    }
}

/* Section 手機版 RWD (<= 768px) */
@media (max-width: 768px) {
    .section-00-03 {
        padding-top: 50px;
        padding-bottom: 240px; /* 加大手繪圖與文案之間的距離 */
    }

    .section-00-03-title-en-wrapper {
        margin-top: 0;
        margin-bottom: 40px;
    }

    .section-00-03-top-content {
        margin-bottom: 40px;
    }

    .main-title-00-03 {
        font-size: 21px;
        margin-bottom: 14px;
    }

    .section-00-03-bottom-content {
        display: block;
        margin-top: 40px;
        margin-bottom: 0;
    }

    .section-00-03-body-group-right {
        max-width: 100%;
        margin-left: 0;
    }

    .section-00-04 {
        padding-top: 80px;
        padding-bottom: 60px;
    }

    .section-00-04-title-en-wrapper {
        margin-bottom: 40px;
    }

    .section-00-04-heading-group {
        margin-left: 0;
        margin-bottom: 30px;
    }

    .main-title-00-04 {
        font-size: 21px;
    }

    .team-info-container {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        margin-bottom: 40px;
    }

    .team-info-block {
        width: 100%;
        display: block;
        padding: 0 5%;
        box-sizing: border-box;
    }

    .team-info-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 8px 0;
        position: relative;
    }

    .team-info-row::before,
    .team-info-row:last-child::after {
        left: -5vw;
        right: -5vw;
        width: 110vw;
    }

    .team-role {
        font-size: 15.5px;
    }

    .team-name {
        font-size: 14.5px;
        white-space: normal;
    }

    .section-00-04-body-group {
        margin-left: 0;
    }

    /* Section 00-05 手機版 */
    .section-00-05 {
        padding-top: 50px;
        padding-bottom: 60px;
    }

    .section-00-05-title-en-line-wrapper {
        top: 50px;
        z-index: 1 !important; /* 底層：金色裝飾橫線 */
    }

    .section-00-05-tree-wrapper {
        z-index: 5 !important; /* 中層：大樹完全壓在金色橫線上方 */
        opacity: 1 !important; /* 保持大樹 100% 實體不透明，徹底蓋住下方線條 */
    }

    .section-00-05-title-en-word-wrapper {
        z-index: 10 !important; /* 頂層：英文文字浮於大樹上方 */
        margin-bottom: 40px;
    }

    .section-00-05-heading-group,
    .section-00-05-top-body-group {
        margin-left: 0;
    }

    .main-title-00-05 {
        font-size: 21px;
    }

    .section-00-05-top-content {
        margin-bottom: 40px;
    }

    .section-00-05-divider-top {
        margin-bottom: 40px;
    }

    .section-00-05-divider-bottom {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .cases-desktop-list {
        display: none;
    }

    .cases-mobile-swiper-wrapper {
        display: block;
        width: 100%;
        position: relative;
    }

    .cases-swiper {
        width: 100%;
        overflow: hidden;
    }

    .case-item-mobile {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .case-mobile-header {
        display: flex;
        align-items: center; /* 手機版與圖片上下置中 */
        gap: 16px;
        width: 100%;
    }

    .case-item-mobile .case-part-right {
        flex: 1 1 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        padding-right: 0 !important;
    }

    .case-item-mobile .case-body-text {
        width: 100% !important;
        max-width: 100% !important;
    }

    .cases-swiper .swiper-slide {
        width: 100% !important;
        flex-shrink: 0 !important;
        box-sizing: border-box !important;
    }

    .cases-swiper-pagination {
        display: flex !important;
        justify-content: center;
        align-items: center;
        gap: 8px;
        margin-top: 24px;
        position: relative !important;
    }

    .cases-swiper-pagination .swiper-pagination-bullet {
        background: #C78967 !important;
        opacity: 0.35 !important;
        width: 8px !important;
        height: 8px !important;
        margin: 0 !important;
        border-radius: 9999px !important;
        cursor: pointer;
        box-shadow: none !important;
        outline: none !important;
        border: none !important;
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
        transition: width 0.25s ease, background-color 0.25s ease, opacity 0.25s ease !important;
        flex-shrink: 0;
    }

    .cases-swiper-pagination .swiper-pagination-bullet-active {
        background: #FFFFFF !important;
        opacity: 1 !important;
        width: 22px !important;
        border-radius: 9999px !important;
    }

    .section-00-05-bottom-body-group {
        max-width: 100%;
    }
}

/* =========================================
   復刻舊版表單樣式 (Old Style Form Restoration)
   ========================================= */
.contact-section-old {
    padding: 80px 5%;
    background-color: #FAF5ED;
    background-image: url('img/bg_papper.jpg');
    background-size: cover;
    background-position: center;
    color: #333;
    display: flex;
    justify-content: center;
}

.contact-container-old {
    width: 100%;
    max-width: 800px; /* 限制最大寬度 */
}

/* 2. 標題樣式 (新版三行美學策展標題) */
.contact-header-group {
    text-align: center;
    margin-bottom: 2.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px; /* 三行字體距離更貼近 */
}

.contact-mobile-br {
    display: none;
}

.contact-top-divider {
    display: inline;
}

.contact-subtitle-top,
.contact-subtitle-en,
.contact-main-title {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(16px, 1.7vw, 32px);
    font-weight: 700; /* 字重一致 */
    letter-spacing: 1px; /* 字元間距 1px */
    line-height: 1.35;
    margin: 0;
    white-space: nowrap; /* 桌機文字保持單行 */
    text-align: center;
}

.contact-subtitle-top {
    color: #801C05;
}

.contact-subtitle-en {
    color: #801C05;
    opacity: 0.15; /* 15% 透明度，清晰大方 */
    font-family: 'Noto Serif TC', serif; /* 設定明體 */
}

.contact-main-title {
    color: #801C05;
}

@media (max-width: 768px) {
    .contact-mobile-br {
        display: block;
    }

    .contact-top-divider {
        display: none;
    }

    .contact-header-group {
        margin-bottom: 2rem;
        gap: 8px; /* 手機版適當間距 */
    }

    /* 手機版 第一、二行與第四行主標字體一樣大 */
    .contact-subtitle-top,
    .contact-main-title {
        font-size: clamp(20px, 5.5vw, 26px) !important;
        line-height: 1.45 !important;
        font-weight: 700 !important;
        white-space: normal !important;
    }

    .contact-subtitle-en {
        font-size: clamp(14px, 3.8vw, 17px) !important;
        letter-spacing: 1.5px !important;
        line-height: 1.4 !important;
        white-space: normal !important;
    }
}

/* 3. 輸入框樣式 (無黑線純淨白底 + 下拉箭頭舒適留白) */
.form-group {
    margin-bottom: 1.5rem;
}

.form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #212529;
}

.form-control-old {
    display: block;
    width: 100%;
    padding: 0.375rem 1rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: none; /* 拿掉填空匡黑線 */
    border-radius: 4px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    height: 48px;
    box-sizing: border-box;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

select.form-control-old {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666666' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 18px center; /* 箭頭離邊框保持 18px 舒適留白 */
    background-size: 11px 7px;
    padding-right: 44px; /* 留出足夠距離避免文字撞到箭頭 */
    cursor: pointer;
}

/* 輸入框 Focus 狀態 (柔和光暈) */
.form-control-old:focus {
    color: #212529;
    background-color: #fff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(199, 137, 103, 0.4);
}

/* 4. Radio 按鈕與排版 */
.form-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

.col-half {
    flex: 0 0 50%;
    max-width: 50%;
    padding: 0 15px;
}

.radio-inline {
    display: inline-block;
    margin-right: 15px;
    cursor: pointer;
}

.radio-inline input {
    margin-right: 5px;
    accent-color: #c78967; /* 讓原生圓點變成橘色 */
}

/* 5. 送出按鈕 (復刻 btn-primary) */
.btn-submit-old {
    display: block;
    width: 100%;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    user-select: none;
    border: 1px solid #c78967;
    padding: 0.75rem 0.75rem;
    font-size: 1.25rem;
    line-height: 1.5;
    border-radius: 4px; /* 添加小圓角，與輸入框 4px 圓角一致 */
    color: #fff;
    background-color: #c78967;
    transition: all 0.3s;
    cursor: pointer;
    letter-spacing: 2px;
    margin-top: 2rem;
}

.btn-submit-old:hover {
    background-color: #a9785d;
    border-color: #a9785d;
}

/* =========================================
   Section 00-06 (滿版人文詩意：聽鳳鳴 唱鶯歌 與 8張圖片輪播)
   ========================================= */
.section-00-06 {
    position: relative;
    width: 100%;
    background-color: #FAF5ED;
    background-image: url('img/00-05_bg.svg'), url('img/00-05_bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    padding-top: 160px; /* 桌機版改為 160px */
    padding-bottom: 120px;
    box-sizing: border-box;
}

/* 上半部版面：左右錯落佈局 (遵循兩側 5% 留白) */
.section-00-06-top-wrapper {
    width: 100%;
    padding: 0 5%;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: flex-start; /* 頂部基準對齊 */
    margin-bottom: 70px;
    position: relative;
    z-index: 2;
}

/* 左側區塊：副標與詩意文案 (對齊在 Sing the song of Yingge 下方) */
.section-00-06-left-content {
    max-width: 580px;
    text-align: left;
    margin-top: clamp(220px, 19vw, 360px); /* 精準錯落對齊在右側英文下方 */
}

.section-00-06-subtitle {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(18px, 1.6vw, 26px);
    font-weight: 700;
    color: #111111;
    letter-spacing: 2px;
    line-height: 1.4;
    margin: 0 0 40px 0; /* 副標與內文垂直間距保持 40px */
    white-space: nowrap;
}

.section-00-06-body {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(14px, 0.95vw, 17px); /* 統一與上方章節內文完全一致 */
    color: #4A382D;
    line-height: 2.1;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

/* 右側區塊：中式直書大標 (左：唱鶯歌，右：聽鳳鳴 水平並排) 與靠右排英文 */
.section-00-06-right-content {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* 靠右對齊 */
    margin-left: auto;
}

.section-00-06-vertical-title-group {
    display: flex;
    flex-direction: row; /* 兩欄水平並排 */
    align-items: flex-start;
    gap: clamp(12px, 1.1vw, 16px); /* 兩欄直書水平間距縮短更貼近 */
    margin: 0 0 28px 0;
    padding: 0;
}

.section-00-06-vertical-title-group .vertical-col {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-family: 'Noto Serif TC', serif; /* 保持明體 */
    font-size: clamp(38px, 4.2vw, 68px);
    font-weight: 700;
    color: #111111;
    letter-spacing: 16px;
    line-height: 1;
    white-space: nowrap;
    display: block;
}

.section-00-06-en-block {
    width: 100%;
    text-align: right; /* 英文文字本體靠右對齊 */
}

.section-00-06-en-text {
    font-family: 'Noto Serif TC', serif; /* 保持明體 */
    font-size: clamp(13px, 0.95vw, 16px);
    color: #333333;
    line-height: 1.6;
    margin: 0;
    letter-spacing: 0.5px;
    text-align: right; /* 文字靠右排列 */
    font-weight: 400;
}

/* 下半部：單張圖片輪播系統 (遵循左右 5% 留白，附控制點) */
.section-00-06-slider-container {
    width: 100%;
    padding: 0 5%;
    box-sizing: border-box;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

.section-00-06-swiper {
    width: 100%;
    overflow: hidden;
    border-radius: 8px; /* 比照 Section 00-04 大師手筆之 8px 微圓角 */
}

.section-00-06-swiper .swiper-slide {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

.section-00-06-slide-img {
    width: 100%;
    height: clamp(320px, 45vw, 700px);
    object-fit: cover;
    display: block;
    border-radius: 8px;
}

.section-00-06-swiper .swiper-slide {
    width: 100% !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
}

/* 輪播控制點 (Pagination) 樣式 */
.section-00-06-swiper-pagination {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
    position: relative !important;
}

.section-00-06-swiper-pagination .swiper-pagination-bullet {
    background: #801C05 !important;
    opacity: 0.25 !important;
    width: 8px !important;
    height: 8px !important;
    margin: 0 !important;
    border-radius: 9999px !important;
    cursor: pointer;
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transition: width 0.25s ease, background-color 0.25s ease, opacity 0.25s ease !important;
    flex-shrink: 0;
}

.section-00-06-swiper-pagination .swiper-pagination-bullet-active {
    background: #801C05 !important;
    opacity: 1 !important;
    width: 24px !important;
    border-radius: 9999px !important;
}

/* Section 00-06 手機版響應式 (<= 768px) */
@media (max-width: 768px) {
    .section-00-06 {
        padding-top: 100px;
        padding-bottom: 80px;
    }

    .section-00-06-top-wrapper {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 50px;
        margin-bottom: 50px;
    }

    .section-00-06-left-content {
        margin-top: 0;
    }

    .section-00-06-right-content {
        margin-left: 0;
        width: 100%;
    }

    .section-00-06-subtitle {
        white-space: normal;
        margin-bottom: 24px;
    }

    .section-00-06-slide-img {
        height: clamp(220px, 55vw, 360px);
    }
}

/* RWD: 手機版變成單欄 */
@media (max-width: 768px) {
    .col-half {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .contact-section-old {
        padding: 60px 5%;
    }
}

/* =========================================
   Section 00-07 (非對稱錯落畫廊：div1～div4 與底部裝飾字)
   ========================================= */
.section-00-07 {
    position: relative;
    width: 100%;
    background-color: #FFFFFF;
    background-image: url('img/00-06_bg.svg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    padding-top: 100px;
    padding-bottom: 120px;
    box-sizing: border-box;
}

.gallery-container {
    width: 100%;
    padding: 0 5%;
    box-sizing: border-box;
    position: relative;
}

.gallery-canvas {
    position: relative;
    width: 100%;
    aspect-ratio: 1920 / 2300;
    overflow: visible;
}

.gallery-block {
    position: absolute;
    box-sizing: border-box;
}

.gallery-img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px; /* 添加 8px 微圓角 */
}

/* 1. 左上區塊 (div1: 寬度 36.1979%) */
.gallery-div1 {
    top: 0;
    left: 0;
    width: 36.1979%; /* 695 / 1920 */
}

.gallery-div1-img-wrapper,
.gallery-div2-img-wrapper,
.gallery-div3-img-wrapper,
.gallery-div4-img-wrapper {
    position: relative;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
}

.div1-en-text {
    position: absolute;
    top: 0;
    left: calc(100% + 20px);
    white-space: nowrap;
    text-align: left;
    font-family: 'Noto Serif TC', serif; /* 統一明體樣式 (比照 00-06 英文) */
    font-size: clamp(13px, 0.95vw, 16px);
    color: #333333;
    line-height: 1.6;
    letter-spacing: 0.5px;
    margin: 0;
    font-weight: 400;
}

.gallery-div1-cn-text {
    margin-top: clamp(16px, 1.4vw, 24px);
    text-align: left;
}

.gallery-div1-cn-text p {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(13px, 0.9vw, 16px);
    color: #333333;
    line-height: 1.8;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 400;
}

/* 2. 右上區塊 (div2: 寬度 29.1146%) */
.gallery-div2 {
    top: 0;
    right: 0;
    width: 29.1146%; /* 559 / 1920 */
    display: flex;
    flex-direction: column;
}

.gallery-div2-text-group {
    display: flex;
    flex-direction: column;
    text-align: left;
    margin-bottom: clamp(16px, 1.56vw, 30px);
}

.gallery-div2-cn-text p {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(13px, 0.9vw, 16px);
    color: #333333;
    line-height: 1.8;
    letter-spacing: 1px;
    margin: 0 0 clamp(40px, 4.16vw, 80px) 0;
    font-weight: 400;
}

.gallery-div2-en-text p {
    font-family: 'Noto Serif TC', serif; /* 統一明體樣式 (比照 00-06 英文) */
    font-size: clamp(13px, 0.95vw, 16px);
    color: #333333;
    line-height: 1.6;
    letter-spacing: 0.5px;
    margin: 0;
    font-weight: 400;
    text-align: left;
}

.gallery-div2-img-wrapper {
    width: 100%;
}

/* 3. 左側中下區塊 (div3: 寬度 15.9375%, top: 44.3478% 與 div4 同高) */
.gallery-div3 {
    left: 0;
    top: 44.3478%; /* 與 div4 高度位置一致 */
    width: 15.9375%; /* 306 / 1920 */
}

.gallery-div3-img-wrapper {
    width: 100%;
}

.gallery-div3-text {
    margin-top: clamp(10px, 0.8vw, 16px);
    text-align: left;
}

.gallery-div3-text p {
    font-family: 'Noto Serif TC', serif; /* 統一明體樣式 (比照 00-06 英文) */
    font-size: clamp(12px, 0.85vw, 15px);
    color: #333333;
    line-height: 1.6;
    letter-spacing: 0.5px;
    margin: 0;
    font-weight: 400;
}

/* 4. 中央反光鏡區塊 (div4: 寬度 20.1563%, top: 44.3478%) */
.gallery-div4 {
    left: 50%;
    transform: translateX(-50%);
    top: 44.3478%; /* 1020 / 2300 */
    width: 20.1563%; /* 387 / 1920 */
}

.gallery-div4-img-wrapper {
    width: 100%;
}

.gallery-div4-text {
    margin-top: clamp(12px, 0.9vw, 18px);
    text-align: left;
}

.gallery-div4-text p {
    font-family: 'Noto Serif TC', serif; /* 統一明體樣式 (比照 00-06 英文) */
    font-size: clamp(13px, 0.95vw, 16px);
    color: #333333;
    line-height: 1.6;
    letter-spacing: 0.5px;
    margin: 0;
    font-weight: 400;
}

/* 5. 底部中央裝飾字 (deco-word: bottom: 9.4348%) */
.gallery-deco-word-wrapper {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 9.4348%; /* 217 / 2300 */
    width: 21.7187%; /* 417 / 1920 */
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}

.gallery-deco-word {
    width: 100%;
    height: auto;
    display: block;
}

/* Section 00-07 手機版響應式 (<= 768px) */
@media (max-width: 768px) {
    .section-00-07 {
        padding-top: 60px;
        padding-bottom: 90px;
    }

    .gallery-canvas {
        aspect-ratio: auto;
        display: flex;
        flex-direction: column;
        gap: clamp(60px, 16vw, 90px); /* 區塊間距擴大，清晰區隔 div1~4 */
    }

    .gallery-block {
        position: relative !important;
        width: 100% !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        display: flex;
        flex-direction: column;
    }

    /* 手機版 div1: 英文 -> 中文 -> 圖片 (取消絕對定位，直接向下排) */
    .gallery-div1 {
        display: flex;
        flex-direction: column;
    }

    .gallery-div1 .div1-en-text {
        position: static !important;
        top: auto !important;
        left: auto !important;
        white-space: normal !important;
        order: 1 !important;
        margin-bottom: 12px !important;
        text-align: left !important;
        display: block !important;
    }

    .gallery-div1 .gallery-div1-cn-text {
        order: 2 !important;
        margin-top: 0 !important;
        margin-bottom: 20px !important;
        text-align: left !important;
    }

    .gallery-div1 .gallery-div1-img-wrapper {
        order: 3 !important;
        width: 100% !important;
    }

    /* 手機版 div2: 英文 -> 中文 -> 圖片 */
    .gallery-div2 .gallery-div2-text-group {
        order: 1;
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
    }

    .gallery-div2 .gallery-div2-en-text {
        order: 1;
        margin-bottom: 12px;
    }

    .gallery-div2 .gallery-div2-cn-text {
        order: 2;
        margin-bottom: 0;
    }

    .gallery-div2 .gallery-div2-cn-text p {
        margin-bottom: 0;
    }

    .gallery-div2 .gallery-div2-img-wrapper {
        order: 2;
        width: 100%;
    }

    /* 手機版 div3: 英文 -> 圖片 */
    .gallery-div3 .gallery-div3-text {
        order: 1;
        margin-top: 0;
        margin-bottom: 16px;
    }

    .gallery-div3 .gallery-div3-img-wrapper {
        order: 2;
        width: 100%;
    }

    /* 手機版 div4: 英文 -> 圖片 */
    .gallery-div4 .gallery-div4-text {
        order: 1;
        margin-top: 0;
        margin-bottom: 16px;
    }

    .gallery-div4 .gallery-div4-img-wrapper {
        order: 2;
        width: 100%;
    }

    /* 手機版 底部裝飾字 */
    .gallery-deco-word-wrapper {
        position: relative !important;
        width: 75% !important;
        margin: 40px auto 0 auto !important;
        left: auto !important;
        bottom: auto !important;
        transform: none !important;
    }
}


