/* ========== 首頁模塊通用樣式 ========== */
.homepage-section {
    position: relative;
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

/* 全寬度模塊 */
.homepage-section--fullwidth {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}

/* 限制寬度模塊 */
.homepage-section--container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 15px;
}

/* 背景設定 */
.homepage-section--bg-color {
    background-color: var(--section-bg-color, #ffffff);
}

.homepage-section--bg-image {
    background-image: var(--section-bg-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* ========== 窗景式背景支援 ========== */

/* 固定背景層 */
.homepage-section__fixed-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: -1; /* 預設值，前台由 inline style 按模塊順序覆蓋 */
    pointer-events: none;
    /* 使用 mask 而非 clip-path */
    mask-size: 100vw 100vh;
    mask-position: 0 0;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100vw 100vh;
    -webkit-mask-position: 0 0;
    -webkit-mask-repeat: no-repeat;
}

.homepage-section--window-type {
    background: transparent !important;
    position: relative;
    z-index: 1;
}

/* 標題樣式 - 統一間距 */
.homepage-section__title {
    margin: 0;
    padding: 0;
    margin-top: 2rem;
}

.homepage-section__title--center {
    text-align: center;
    font-size: 2.5rem;
    font-weight: bold;
    color: #333;
}

.homepage-section__title--hidden {
    display: none;
}

/* 次標題樣式 */
.homepage-section__subtitle {
    margin: 0;
    padding: 0;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
}

.homepage-section__subtitle--center {
    text-align: center;
    font-size: 1.5625rem;
    font-weight: bold;
    color: #666;
}

/* ========== 圖片優化 - Skeleton 骨架屏 ========== */
.img-skeleton-wrapper {
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
}

    /* 骨架屏動畫背景 */
    .img-skeleton-wrapper::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: linear-gradient( 90deg, #f0f0f0 0%, #e0e0e0 20%, #f0f0f0 40%, #f0f0f0 100% );
        background-size: 200% 100%;
        animation: skeleton-shimmer 1.5s infinite;
        z-index: 1;
    }

    /* 圖片載入完成後隱藏骨架屏 */
    .img-skeleton-wrapper.loaded::before {
        display: none;
    }

/* 骨架屏閃爍動畫 */
@keyframes skeleton-shimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

/* ========== 圖片優化 - Fade In 動畫 ========== */
/* 需要 lazy load 的圖片初始狀態 */
.img-lazy {
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}

    /* 圖片載入完成後顯示 */
    .img-lazy.loaded {
        opacity: 1;
    }

/* 不需要 lazy load 的圖片（前 5 個模塊）也加上基本淡入 */
.img-fade-in {
    opacity: 0;
    animation: img-fade-in-animation 0.4s ease-in-out forwards;
}

/* ========== 輪播圖取消淡入動畫 ========== */
.homepage-section-carousel .img-lazy,
.homepage-section-carousel .img-fade-in,
.homepage-section-carousel-center .img-lazy,
.homepage-section-carousel-center .img-fade-in {
    opacity: 1;
    animation: none;
    transition: none;
}

@keyframes img-fade-in-animation {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* ========== 圖片優化 - 容器固定比例 ========== */
/* 防止圖片載入時頁面跳動 */
.img-lazy-container {
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
}

    /* 圖片填滿容器 */
    .img-lazy-container img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

/* 常用比例 - 16:9 */
.img-lazy-container--16-9 {
    padding-bottom: 56.25%;
}

/* 常用比例 - 4:3 */
.img-lazy-container--4-3 {
    padding-bottom: 75%;
}

/* 常用比例 - 1:1 正方形 */
.img-lazy-container--1-1 {
    padding-bottom: 100%;
}

/* 常用比例 - 3:4 直式 */
.img-lazy-container--3-4 {
    padding-bottom: 133.33%;
}

/* ========== 圖片優化 - 響應式 ========== */
@media (max-width: 768px) {
    /* 手機上動畫稍快 */
    .img-lazy {
        transition: opacity 0.3s ease-in-out;
    }

    @keyframes skeleton-shimmer {
        0% {
            background-position: 200% 0;
        }

        100% {
            background-position: -200% 0;
        }
    }
}

/* 減少動畫（尊重用戶偏好設定） */
@media (prefers-reduced-motion: reduce) {
    .img-lazy {
        transition: none;
        opacity: 1;
    }

    .img-skeleton-wrapper::before {
        animation: none;
    }

    .img-fade-in {
        animation: none;
        opacity: 1;
    }
}

/* ========== HTML內容模塊 001 ========== */
.homepage-section-html-content {
    word-wrap: break-word;
}

    .homepage-section-html-content img,
    .homepage-section-html-content video,
    .homepage-section-html-content iframe {
        max-width: 100%;
    }

/* ========== 輪播圖模塊 002 ========== */
.homepage-section-carousel {
    padding: 0;
    position: relative;
}

.homepage-section-carousel__container {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: calc(100vw * var(--carousel-height-pc) / var(--carousel-width-pc));
    max-width: calc(var(--carousel-width-pc) * 1px);
    max-height: calc(var(--carousel-height-pc) * 1px);
    margin: 0 auto;
}

.homepage-section-carousel__slide {
    display: none;
    width: 100%;
}

.homepage-section-carousel__slide--active {
    display: block;
}

.homepage-section-carousel__image {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 等比放大並裁切 */
    object-position: center center; /* 上下左右置中 */
    display: block;
}

.homepage-section-carousel__controls {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.homepage-section-carousel__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: background-color 0.3s ease;
    border: 2px solid rgba(255, 255, 255, 0.8);
}

.homepage-section-carousel__dot--active {
    background-color: rgba(255, 255, 255, 1);
}

.homepage-section-carousel__dot:hover {
    background-color: rgba(255, 255, 255, 0.8);
}

/* 輪播圖左右按鈕 */
.homepage-section-carousel__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.7);
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 15;
    opacity: 0.6;
}

    .homepage-section-carousel__nav:hover {
        background: rgba(255, 255, 255, 0.9);
        opacity: 1;
        transform: translateY(-50%) scale(1.05);
    }

.homepage-section-carousel__nav--prev {
    left: 20px;
}

.homepage-section-carousel__nav--next {
    right: 20px;
}

.homepage-section-carousel__nav svg {
    color: #333;
    opacity: 0.8;
    width: 24px;
    height: 24px;
}

.homepage-section-carousel__nav:hover svg {
    opacity: 1;
}

/* 輪播圖文字覆蓋層 */
.homepage-section-carousel__text-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    pointer-events: none; /* 讓點擊穿透到下層的連結 */
    z-index: 5;
    overflow: hidden; /* 超出部分隱藏 */
}

.homepage-section-carousel__text-content {
    max-width: 1200px;
    width: 100%;
    max-height: 100%; /* 限制最大高度 */
    overflow: hidden; /* 超出部分隱藏 */
    color: #ffffff;
    text-align: center;
    pointer-events: none;
}

    .homepage-section-carousel__text-content h1,
    .homepage-section-carousel__text-content h2,
    .homepage-section-carousel__text-content h3,
    .homepage-section-carousel__text-content h4,
    .homepage-section-carousel__text-content h5,
    .homepage-section-carousel__text-content h6 {
        margin-bottom: 1rem;
    }

    .homepage-section-carousel__text-content p {
        margin-bottom: 1rem;
        line-height: 1.6;
    }

/* 手機版調整 */
@media (max-width: 991px) {
    .homepage-section-carousel__text-overlay {
        padding: 1.5rem 1rem;
    }

    .homepage-section-carousel__text-content {
        font-size: 0.9rem;
    }
}

@media (max-width: 576px) {
    .homepage-section-carousel__text-overlay {
        padding: 1rem 0.5rem;
    }

    .homepage-section-carousel__text-content {
        font-size: 0.85rem;
    }
}

/* 響應式調整 - 保持動態比例 */
@media (max-width: 1920px) {
    .homepage-section-carousel__container {
        height: calc(100vw * var(--carousel-height-pc) / var(--carousel-width-pc));
    }
}

@media (max-width: 991px) {
    .homepage-section-carousel__container {
        height: calc(100vw * var(--carousel-height-mb) / var(--carousel-width-mb));
        max-width: calc(var(--carousel-width-mb) * 1px);
        max-height: calc(var(--carousel-height-mb) * 1px);
    }
}



/* 手機版按鈕調整 */
@media (max-width: 991px) {
    .homepage-section-carousel__nav {
        width: 40px;
        height: 40px;
    }

    .homepage-section-carousel__nav--prev {
        left: 10px;
    }

    .homepage-section-carousel__nav--next {
        right: 10px;
    }

    .homepage-section-carousel__nav svg {
        width: 18px;
        height: 18px;
    }
}

/* ========== 中心預覽輪播 002 類型3 ========== */
.homepage-section-carousel-center {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 2rem 0;
}

.homepage-section-carousel-center__track {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    height: calc(100vw * var(--carousel-height-pc) / var(--carousel-width-pc) * 0.6);
    max-height: calc(var(--carousel-height-pc) * 0.6px);
}

.homepage-section-carousel-center__slide {
    position: absolute;
    transition: all 0.5s ease;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* 中間主圖 */
.homepage-section-carousel-center__slide--active {
    position: relative;
    z-index: 3;
    transform: scale(1);
    opacity: 1;
}

/* 左側預覽圖 */
.homepage-section-carousel-center__slide--prev {
    z-index: 2;
    transform: translateX(-70%) scale(0.75);
    opacity: 0.6;
    filter: brightness(0.7);
}

/* 右側預覽圖 */
.homepage-section-carousel-center__slide--next {
    z-index: 2;
    transform: translateX(70%) scale(0.75);
    opacity: 0.6;
    filter: brightness(0.7);
}

/* 隱藏的圖片 */
.homepage-section-carousel-center__slide--hidden {
    z-index: 1;
    transform: scale(0.5);
    opacity: 0;
    pointer-events: none;
}

.homepage-section-carousel-center__image {
    width: auto;
    height: 100%;
    max-width: 60vw;
    max-height: calc(var(--carousel-height-pc) * 0.6px);
    object-fit: cover;
    display: block;
}

.homepage-section-carousel-center__link {
    display: block;
    width: 100%;
    height: 100%;
}

/* 左右按鈕 */
.homepage-section-carousel-center__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.8);
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 10;
    opacity: 0.7;
}

    .homepage-section-carousel-center__nav:hover {
        background: rgba(255, 255, 255, 1);
        opacity: 1;
        transform: translateY(-50%) scale(1.1);
    }

.homepage-section-carousel-center__nav--prev {
    left: 5%;
}

.homepage-section-carousel-center__nav--next {
    right: 5%;
}

.homepage-section-carousel-center__nav svg {
    color: #333;
    width: 24px;
    height: 24px;
}

/* 手機版調整 */
@media (max-width: 991px) {
    .homepage-section-carousel-center__track {
        height: calc(100vw * var(--carousel-height-mb) / var(--carousel-width-mb) * 0.6);
        max-height: calc(var(--carousel-height-mb) * 0.6px);
    }

    .homepage-section-carousel-center__image {
        max-width: 70vw;
        max-height: calc(var(--carousel-height-mb) * 0.6px);
    }

    .homepage-section-carousel-center__slide--prev {
        transform: translateX(-60%) scale(0.7);
    }

    .homepage-section-carousel-center__slide--next {
        transform: translateX(60%) scale(0.7);
    }

    .homepage-section-carousel-center__nav {
        width: 40px;
        height: 40px;
    }

    .homepage-section-carousel-center__nav--prev {
        left: 2%;
    }

    .homepage-section-carousel-center__nav--next {
        right: 2%;
    }

    .homepage-section-carousel-center__nav svg {
        width: 18px;
        height: 18px;
    }
}

@media (max-width: 576px) {
    .homepage-section-carousel-center {
        padding: 1rem 0;
    }

    .homepage-section-carousel-center__slide--prev,
    .homepage-section-carousel-center__slide--next {
        opacity: 0.4;
    }
}

/* ========== 產品模塊 101-103 ========== */
.homepage-section-product {
    padding: 2rem 0;
}

.homepage-section-product__grid {
    display: grid;
    gap: 2rem;
    margin-top: 0;
}

/* 商品模塊101_標準 - 增強版 */
.homepage-section-product-101__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    margin-top: 0;
}

.homepage-section-product-101__item {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

    .homepage-section-product-101__item:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
    }

.homepage-section-product-101__image-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
    /* 預設正方形 */
    aspect-ratio: 1 / 1;
    background-color: #fff;
}

/* 動態設定的比例類別 */
.homepage-section-product-101__grid--portrait .homepage-section-product-101__image-wrapper {
    aspect-ratio: 4 / 5; /* 高:寬 5:4，容器呈現高大於寬 */
}

.homepage-section-product-101__grid--landscape .homepage-section-product-101__image-wrapper {
    aspect-ratio: 5 / 4; /* 寬:高 5:4，容器呈現寬大於高 */
}

.homepage-section-product-101__grid--square .homepage-section-product-101__image-wrapper {
    aspect-ratio: 1 / 1; /* 正方形 */
}

.homepage-section-product-101__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transition: transform 0.3s ease;
}

.homepage-section-product-101__item:hover .homepage-section-product-101__image {
    transform: scale(1.05);
}

.homepage-section-product-101__content {
    padding: 10px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.homepage-section-product-101__title {
    font-size: 1.2rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.8rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.homepage-section-product-101__description {
    color: #666;
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0 0 1rem 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex-grow: 1;
}

/* 價格和操作按鈕區域 - 合併為一個水平區域 */
.homepage-section-product-101__price-section {
    margin-bottom: 0.8rem;
}

.homepage-section-product-101__price-frame {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.homepage-section-product-101__original-price {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.homepage-section-product-101__original-price-cross {
    font-size: 0.9rem;
    color: #999;
    text-decoration: line-through;
    margin: 0;
}

.homepage-section-product-101__new-price {
    font-size: 1.2rem;
    font-weight: 700;
    color: #e74c3c;
    margin: 0;
}

/* 分潤點數區域 */
.homepage-section-product-101__sharepoint-frame {
    margin-bottom: 1rem;
}

    .homepage-section-product-101__sharepoint-frame .text-info {
        font-size: 0.85rem;
        color: #17a2b8;
        font-weight: 500;
    }

/* 操作按鈕區域 - 與價格在同一水平線 */
.homepage-section-product-101__action-frame {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    margin-top: auto;
}

/* 底部價格和按鈕的水平容器 */
.homepage-section-product-101__bottom-section {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    margin-top: auto;
}

.homepage-section-product-101__price-action-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 1rem;
}

.homepage-section-product-101__price-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.homepage-section-product-101__action-buttons {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* 當沒有購買權限時的樣式 */
.homepage-section-product-101__action-frame--no-purchase {
    justify-content: flex-end;
}

/* 響應式設計 */
@media (max-width: 991px) {
    .homepage-section-product-101__grid {
        grid-template-columns: repeat(var(--mobile-columns, 2), 1fr);
        gap: 1rem;
    }

        /* 2 個一列時，字體縮小 */
        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__title {
            font-size: 0.95rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__description {
            font-size: 0.8rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__original-price {
            font-size: 0.9rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__original-price-cross {
            font-size: 0.75rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__new-price {
            font-size: 0.95rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__content {
            padding: 10px;
        }

        /* 1 個一列時，維持較大字體 */
        .homepage-section-product-101__grid[style*="--mobile-columns: 1"] .homepage-section-product-101__title {
            font-size: 1.1rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 1"] .homepage-section-product-101__description {
            font-size: 0.85rem;
        }
}

@media (max-width: 576px) {
    .homepage-section-product-101__grid {
        grid-template-columns: repeat(var(--mobile-columns, 2), 1fr);
        gap: 0.8rem;
    }

        /* 576px 以下 2 個一列，字體再更小 */
        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__title {
            font-size: 0.85rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__description {
            font-size: 0.75rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__original-price {
            font-size: 0.8rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__original-price-cross {
            font-size: 0.7rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__new-price {
            font-size: 0.85rem;
        }

        .homepage-section-product-101__grid[style*="--mobile-columns: 2"] .homepage-section-product-101__content {
            padding: 10px;
        }
}

/* 101 無簡述模式 */
.homepage-section-product-101__grid--no-description .homepage-section-product-101__title {
    height: calc(2 * 1.4em);
}

.homepage-section-product-101__grid--no-description .homepage-section-product-101__bottom-section {
    margin-top: 0;
}

/* ========== 商品模塊102_橫幅標準 ========== */

/* 橫幅區域 */
.homepage-section-product-102__banner {
    position: relative;
    width: 100%;
    margin-bottom: 0;
    overflow: hidden;
    border-radius: 12px;
}

/* 橫幅底部間距 - 電腦版 */
.homepage-section-product-102__banner-bottom-space--pc {
    display: block;
    height: 30px;
}

.homepage-section-product-102__banner-bottom-space--mobile {
    display: none;
}

@media (max-width: 768px) {
    .homepage-section-product-102__banner-bottom-space--pc {
        display: none;
    }

    .homepage-section-product-102__banner-bottom-space--mobile {
        display: block;
        height: 20px;
    }
}

.homepage-section-product-102__banner-image {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.homepage-section-product-102__banner-link:hover .homepage-section-product-102__banner-image {
    transform: scale(1.02);
}

.homepage-section-product-102__banner--pc {
    display: block;
}

.homepage-section-product-102__banner--mobile {
    display: none;
}

/* 商品網格區域 */
.homepage-section-product-102__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.homepage-section-product-102__item {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

    .homepage-section-product-102__item:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
    }

/* 商品圖片區域 */
.homepage-section-product-102__image-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background-color: #fff;
}

/* 動態設定的比例類別 */
.homepage-section-product-102__grid--portrait .homepage-section-product-102__image-wrapper {
    aspect-ratio: 4 / 5;
}

.homepage-section-product-102__grid--landscape .homepage-section-product-102__image-wrapper {
    aspect-ratio: 5 / 4;
}

.homepage-section-product-102__grid--square .homepage-section-product-102__image-wrapper {
    aspect-ratio: 1 / 1;
}

.homepage-section-product-102__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transition: transform 0.3s ease;
}

.homepage-section-product-102__item:hover .homepage-section-product-102__image {
    transform: scale(1.05);
}

/* 商品內容區域 */
.homepage-section-product-102__content {
    padding: 10px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.homepage-section-product-102__title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 1rem 0;
    line-height: 1.4;
    text-align: left;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.homepage-section-product-102__description {
    color: #666;
    font-size: 0.9rem;
    line-height: 1.5;
    margin-bottom: 0.8rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 分潤點數區域 */
.homepage-section-product-102__sharepoint-frame {
    margin-bottom: 1rem;
}

    .homepage-section-product-102__sharepoint-frame .text-info {
        font-size: 0.85rem;
        color: #17a2b8;
        font-weight: 500;
        text-align: left;
    }

/* 底部價格和按鈕的容器 */
.homepage-section-product-102__bottom-section {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    margin-top: auto;
}

.homepage-section-product-102__price-action-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 1rem;
}

.homepage-section-product-102__price-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.homepage-section-product-102__action-buttons {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* 價格樣式 */
.homepage-section-product-102__original-price {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.homepage-section-product-102__original-price-cross {
    font-size: 0.9rem;
    color: #999;
    text-decoration: line-through;
    margin: 0;
}

.homepage-section-product-102__new-price {
    font-size: 1.2rem;
    font-weight: 700;
    color: #e74c3c;
    margin: 0;
}

/* 響應式設計 */
@media (max-width: 991px) {
    /* 橫幅響應式 */
    .homepage-section-product-102__banner--pc {
        display: none;
    }

    .homepage-section-product-102__banner--mobile {
        display: block;
    }

    /* 網格響應式 */
    .homepage-section-product-102__grid {
        grid-template-columns: repeat(var(--mobile-columns, 2), 1fr);
        gap: 1.5rem;
    }

        /* 2 個一列時，字體縮小 */
        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__title {
            font-size: 0.95rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__original-price {
            font-size: 0.9rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__original-price-cross {
            font-size: 0.75rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__new-price {
            font-size: 0.95rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__content {
            padding: 10px;
        }

        /* 1 個一列時，維持較大字體 */
        .homepage-section-product-102__grid[style*="--mobile-columns: 1"] .homepage-section-product-102__title {
            font-size: 1rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 1"] .homepage-section-product-102__content {
            padding: 10px;
        }
}

@media (max-width: 576px) {
    .homepage-section-product-102__grid {
        grid-template-columns: repeat(var(--mobile-columns, 2), 1fr);
        gap: 1rem;
    }

        /* 576px 以下 2 個一列，字體再更小 */
        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__title {
            font-size: 0.85rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__original-price {
            font-size: 0.8rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__original-price-cross {
            font-size: 0.7rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__new-price {
            font-size: 0.85rem;
        }

        .homepage-section-product-102__grid[style*="--mobile-columns: 2"] .homepage-section-product-102__content {
            padding: 10px;
        }

        /* 1 個一列時 */
        .homepage-section-product-102__grid[style*="--mobile-columns: 1"] .homepage-section-product-102__content {
            padding: 10px;
        }
}

/* 102 無簡述模式 */
.homepage-section-product-102__grid--no-description .homepage-section-product-102__title {
    height: calc(2 * 1.4em);
}

.homepage-section-product-102__grid--no-description .homepage-section-product-102__bottom-section {
    margin-top: 0;
}

/* ========== 商品模塊103_橫向滑動條 - 針對滑動優化 ========== */

/* 容器和導航按鈕 */
.homepage-section-product-103__container {
    position: relative;
    width: 100%;
}

.homepage-section-product-103__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.9);
    border: 2px solid #e0e0e0;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    z-index: 10;
}

.homepage-section-product-103__nav--prev {
    left: 15px;
}

.homepage-section-product-103__nav--next {
    right: 15px;
}

.homepage-section-product-103__nav:hover {
    background: #f8f9fa;
    border-color: #007bff;
}

    .homepage-section-product-103__nav:disabled {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none;
    }

    .homepage-section-product-103__nav svg {
        color: #666;
    }

    .homepage-section-product-103__nav:hover svg {
        color: #007bff;
    }

/* 滑動軌道 */
.homepage-section-product-103__slider {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.homepage-section-product-103__track {
    display: flex;
    gap: 1.5rem;
    transition: transform 0.4s ease;
    align-items: stretch; /* 改為stretch確保所有卡片高度一致 */
}

/* 商品卡片 - 橫向滑動優化 */
.homepage-section-product-103__item {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    /* 固定寬度確保滑動一致性 */
    width: 320px;
    min-width: 320px;
    max-width: 320px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}

    .homepage-section-product-103__item:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
    }

/* 商品圖片區域 - 固定比例 */
.homepage-section-product-103__image-wrapper {
    position: relative;
    width: 100%;
    height: 240px; /* 固定高度 */
    overflow: hidden;
    background-color: #fff;
    flex-shrink: 0;
}

.homepage-section-product-103__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transition: transform 0.3s ease;
}

.homepage-section-product-103__item:hover .homepage-section-product-103__image {
    transform: scale(1.05);
}

/* 商品內容區域 - 固定布局 */
.homepage-section-product-103__content {
    padding: 10px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.homepage-section-product-103__title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.2rem;
    line-height: 1.4;
    /* 改為單行顯示，超出部分使用省略號 */
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: calc(2 * 1.4em);
}

.homepage-section-product-103__description {
    color: #666;
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0 0 10px 0;
    /* 改為單行顯示，超出部分使用省略號 */
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: calc(2 * 1.4em);
}

/* 分潤點數區域 - 固定高度 */
.homepage-section-product-103__sharepoint-frame {
    height: 1.5rem; /* 固定高度，沒有內容時保持空間 */
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}

    .homepage-section-product-103__sharepoint-frame .text-info {
        font-size: 0.85rem;
        color: #17a2b8;
        font-weight: 500;
        line-height: 1;
    }

/* 底部價格和按鈕的容器 - 固定在底部 */
.homepage-section-product-103__bottom-section {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: auto;
    /* 固定高度確保按鈕區域統一 */
    min-height: 10px;
}

.homepage-section-product-103__price-action-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 1rem;
}

.homepage-section-product-103__price-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    /* 限制價格區域最大高度 */
    max-height: 3rem;
    overflow: hidden;
}

.homepage-section-product-103__action-buttons {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* 價格樣式 - 針對滑動優化 */
.homepage-section-product-103__original-price {
    font-size: 1rem; /* 稍微縮小避免過長 */
    font-weight: 600;
    color: #333;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.homepage-section-product-103__original-price-cross {
    font-size: 0.85rem;
    color: #999;
    text-decoration: line-through;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.homepage-section-product-103__new-price {
    font-size: 1.1rem;
    font-weight: 700;
    color: #e74c3c;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 響應式設計 - 手機版滑動優化 */
@media (max-width: 991px) {
    .homepage-section-product-103__container {
        gap: 0;
    }

    .homepage-section-product-103__slider {
        margin: 0 -15px;
        padding: 0 15px;
    }

    .homepage-section-product-103__item {
        width: 300px;
        min-width: 300px;
        max-width: 300px;
    }

    .homepage-section-product-103__image-wrapper {
        height: 220px;
    }

    .homepage-section-product-103__content {
        padding: 10px;
    }

    .homepage-section-product-103__nav {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 36px;
        height: 36px;
        background: rgba(255, 255, 255, 0.9);
        border: 1px solid rgba(224, 224, 224, 0.6);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        z-index: 20;
    }

    .homepage-section-product-103__nav--prev {
        left: 10px;
    }

    .homepage-section-product-103__nav--next {
        right: 10px;
    }

    .homepage-section-product-103__nav:hover {
        background: rgba(248, 249, 250, 0.9);
        border-color: rgba(0, 123, 255, 0.6);
    }

    .homepage-section-product-103__nav svg {
        color: rgba(102, 102, 102, 0.7);
        width: 16px;
        height: 16px;
    }

    .homepage-section-product-103__nav:hover svg {
        color: rgba(0, 123, 255, 0.8);
    }

    .homepage-section-product-103__title {
        font-size: 1rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .homepage-section-product-103__description {
        font-size: 0.85rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .homepage-section-product-103__sharepoint-frame {
        height: 1.2rem;
    }

    .homepage-section-product-103__bottom-section {
        min-height: 50px;
    }

    .homepage-section-product-103__original-price {
        font-size: 0.9rem;
    }

    .homepage-section-product-103__original-price-cross {
        font-size: 0.8rem;
    }

    .homepage-section-product-103__new-price {
        font-size: 1rem;
    }
}

@media (max-width: 576px) {
    .homepage-section-product-103__slider {
        margin: 0 -12px;
        padding: 0 12px;
    }

    .homepage-section-product-103__item {
        width: 270px;
        min-width: 270px;
        max-width: 270px;
    }

    .homepage-section-product-103__image-wrapper {
        height: 200px;
    }

    .homepage-section-product-103__content {
        padding: 10px;
    }

    .homepage-section-product-103__nav {
        width: 32px;
        height: 32px;
    }

    .homepage-section-product-103__nav--prev {
        left: 8px;
    }

    .homepage-section-product-103__nav--next {
        right: 8px;
    }

    .homepage-section-product-103__nav svg {
        width: 14px;
        height: 14px;
    }

    .homepage-section-product-103__title {
        font-size: 0.95rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .homepage-section-product-103__description {
        font-size: 0.8rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* 103 無簡述模式 */
.homepage-section-product-103__track--no-description .homepage-section-product-103__title {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    height: calc(2 * 1.4em);
}

.homepage-section-product-103__track--no-description .homepage-section-product-103__bottom-section {
    margin-top: 0;
}


/* 移除動態比例類別，因為使用固定高度 */
/* 如果需要保持比例功能，可以使用以下備用方案 */
/*
.homepage-section-product-103__track--portrait .homepage-section-product-103__image-wrapper {
    height: 280px;
}
.homepage-section-product-103__track--landscape .homepage-section-product-103__image-wrapper {
    height: 200px;
}
.homepage-section-product-103__track--square .homepage-section-product-103__image-wrapper {
    height: 240px;
}
*/

/* ========== 最新消息模塊 201-202 ========== */
.homepage-section-news {
    padding: 2rem 0;
}

.homepage-section-news__grid {
    display: grid;
    gap: 2rem;
    margin-top: 0;
}

/* 最新消息模塊201_標準 */
/* 最新消息模塊201_標準 */
.homepage-section-news-standard__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    width: 100%;
}

.homepage-section-news-201__item {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    width: 100%;
}

    .homepage-section-news-201__item:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
    }

/* 影片容器 */
.homepage-section-news-201__video-wrapper {
    position: relative;
    width: 100%;
    max-height: 400px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background-color: #000;
}

.homepage-section-news-201__video {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

    .homepage-section-news-201__video[loading="lazy"] {
        background: #000 url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="%23fff"><text x="50%" y="50%" text-anchor="middle" dy=".3em">...</text></svg>') center/contain no-repeat;
    }

/* 圖片容器 */
.homepage-section-news-201__image-wrapper {
    position: relative;
    width: 100%;
    max-height: 400px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background-color: #f5f5f5;
}

.homepage-section-news-201__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s ease;
}

.homepage-section-news-201__item:hover .homepage-section-news-201__image {
    transform: scale(1.05);
}

/* 內容區域 */
.homepage-section-news-201__content {
    padding: 1.5rem;
}

.homepage-section-news-201__title {
    font-size: 1.2rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.8rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.homepage-section-news-201__description {
    color: #666;
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 手機版響應式 */
@media (max-width: 991px) {
    .homepage-section-news-standard__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
        max-width: 500px;
    }

    .homepage-section-news-201__item {
        width: 100%;
    }

    .homepage-section-news-201__video-wrapper,
    .homepage-section-news-201__image-wrapper {
        max-height: 240px;
        aspect-ratio: 4 / 3;
    }

    .homepage-section-news-201__content {
        padding: 1.2rem;
    }

    .homepage-section-news-201__title {
        font-size: 1.1rem;
    }

    .homepage-section-news-201__description {
        font-size: 0.85rem;
    }
}

/* 最新消息模塊202_橫向滑動條 */
.homepage-section-news-202__container {
    position: relative;
    width: 100%;
}

.homepage-section-news-202__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.9);
    border: 2px solid #e0e0e0;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    z-index: 10;
}

.homepage-section-news-202__nav--prev {
    left: 15px;
}

.homepage-section-news-202__nav--next {
    right: 15px;
}

.homepage-section-news-202__nav:hover {
    background: #f8f9fa;
    border-color: #007bff;
}

    .homepage-section-news-202__nav:disabled {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none;
    }

    .homepage-section-news-202__nav svg {
        color: #666;
    }

    .homepage-section-news-202__nav:hover svg {
        color: #007bff;
    }

.homepage-section-news-202__slider {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.homepage-section-news-202__track {
    display: flex;
    gap: 1.5rem;
    transition: transform 0.4s ease;
    align-items: flex-start;
}

.homepage-section-news-202__item {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    /* 固定寬度確保滑動一致性 - 與 103 一致 */
    width: 320px;
    min-width: 320px;
    max-width: 320px;
    flex-shrink: 0;
}

    .homepage-section-news-202__item:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
    }

/* 影片容器 */
.homepage-section-news-202__video-wrapper {
    position: relative;
    width: 100%;
    max-height: 300px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background-color: #000;
}

.homepage-section-news-202__video {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* 圖片容器 */
.homepage-section-news-202__image-wrapper {
    position: relative;
    width: 100%;
    max-height: 300px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background-color: #f5f5f5;
}

.homepage-section-news-202__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s ease;
}

.homepage-section-news-202__item:hover .homepage-section-news-202__image {
    transform: scale(1.05);
}

/* 內容區域 */
.homepage-section-news-202__content {
    padding: 1.5rem;
}

.homepage-section-news-202__title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.8rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.homepage-section-news-202__description {
    color: #666;
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 手機版調整 */
@media (max-width: 991px) {
    .homepage-section-news-202__item {
        width: 300px;
        min-width: 300px;
        max-width: 300px;
    }

    .homepage-section-news-202__video-wrapper,
    .homepage-section-news-202__image-wrapper {
        max-height: 200px;
        aspect-ratio: 4 / 3;
    }

    .homepage-section-news-202__nav {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 36px;
        height: 36px;
        background: rgba(255, 255, 255, 0.9);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        z-index: 20;
    }

    .homepage-section-news-202__nav--prev {
        left: 10px;
    }

    .homepage-section-news-202__nav--next {
        right: 10px;
    }

    .homepage-section-news-202__content {
        padding: 1.2rem;
    }

    .homepage-section-news-202__title {
        font-size: 1rem;
    }

    .homepage-section-news-202__description {
        font-size: 0.85rem;
    }
}

@media (max-width: 576px) {
    .homepage-section-news-202__item {
        width: 270px;
        min-width: 270px;
        max-width: 270px;
    }
}

/* ========== AI文章模塊 211-212 ========== */
.homepage-section-AIGenerationPage {
    padding: 2rem 0;
}

.homepage-section-AIGenerationPage__grid {
    display: grid;
    gap: 2rem;
    margin-top: 0;
}

/* ========== AI文章模塊 211_標準 (純文字卡片式) ========== */
.homepage-section-AIGenerationPage-211__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    padding: 2rem 0;
}

.homepage-section-AIGenerationPage-211__card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.homepage-section-AIGenerationPage-211__card {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 1.5rem;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    border: 1px solid #eee;
    transition: all 0.3s ease;
    height: 100%;
}

    .homepage-section-AIGenerationPage-211__card:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
        border-color: #ddd;
    }

.homepage-section-AIGenerationPage-211__icon-wrapper {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.homepage-section-AIGenerationPage-211__icon {
    font-size: 1.5rem;
    font-weight: 700;
    color: inherit;
    text-transform: uppercase;
}

.homepage-section-AIGenerationPage-211__content {
    flex: 1;
    min-width: 0;
}

.homepage-section-AIGenerationPage-211__title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 0.5rem 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.homepage-section-AIGenerationPage-211__description {
    font-size: 0.9rem;
    color: #666;
    margin: 0 0 0.75rem 0;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.homepage-section-AIGenerationPage-211__read-more {
    font-size: 0.85rem;
    color: #667eea;
    font-weight: 500;
    transition: all 0.3s ease;
}

.homepage-section-AIGenerationPage-211__card:hover .homepage-section-AIGenerationPage-211__read-more {
    color: #764ba2;
    letter-spacing: 1px;
}

/* 查看更多按鈕（多模塊共用：QA 701、AI 文章 211/212、商品 101~103、新聞 201/202 等）
   4 色由前台 inline style 注入 --btn-border / --btn-text / --btn-hover-bg / --btn-hover-text，未設定時 fallback */
.homepage-section-more-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: fit-content;
    margin: 1.5rem auto 0;
    padding: 0.625rem 1.75rem;
    border: 2px solid var(--btn-border, #333);
    border-radius: 999px;
    color: var(--btn-text, #333);
    font-size: 0.95rem;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

    .homepage-section-more-button:hover {
        background: var(--btn-hover-bg, #333);
        color: var(--btn-hover-text, #fff);
        border-color: var(--btn-hover-bg, #333);
    }

.homepage-section-more-button__text {
    line-height: 1.4;
}

.homepage-section-more-button__icon {
    font-size: 1rem;
    line-height: 1;
    transition: transform 0.25s ease;
}

.homepage-section-more-button:hover .homepage-section-more-button__icon {
    transform: translateX(4px);
}

/* 響應式設計 */
@media (max-width: 1200px) {
    .homepage-section-AIGenerationPage-211__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .homepage-section-AIGenerationPage-211__grid {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 1.5rem 0;
    }

    .homepage-section-AIGenerationPage-211__card {
        padding: 1.25rem;
    }

    .homepage-section-AIGenerationPage-211__icon-wrapper {
        width: 48px;
        height: 48px;
    }

    .homepage-section-AIGenerationPage-211__icon {
        font-size: 1.25rem;
    }

    .homepage-section-AIGenerationPage-211__read-more {
        opacity: 1;
    }
}

/* ========== AI文章模塊 212_垂直列表 ========== */
.homepage-section-AIGenerationPage-212__list {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 2rem 0;
}

.homepage-section-AIGenerationPage-212__item-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.homepage-section-AIGenerationPage-212__item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: #ffffff;
    border-bottom: 1px solid #eee;
    transition: all 0.3s ease;
}

.homepage-section-AIGenerationPage-212__item-link:first-child .homepage-section-AIGenerationPage-212__item {
    border-top: 1px solid #eee;
    border-radius: 8px 8px 0 0;
}

.homepage-section-AIGenerationPage-212__item-link:last-child .homepage-section-AIGenerationPage-212__item {
    border-radius: 0;
}

.homepage-section-AIGenerationPage-212__item-link:only-child .homepage-section-AIGenerationPage-212__item {
    border-radius: 8px 8px 0 0;
}

.homepage-section-AIGenerationPage-212__item:hover {
    background: #f8f9ff;
    padding-left: 1.5rem;
}

.homepage-section-AIGenerationPage-212__icon-wrapper {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.homepage-section-AIGenerationPage-212__icon {
    font-size: 1.2rem;
    font-weight: 700;
    color: inherit;
    text-transform: uppercase;
}

.homepage-section-AIGenerationPage-212__content {
    flex: 1;
    min-width: 0;
}

.homepage-section-AIGenerationPage-212__title {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 0.25rem 0;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.homepage-section-AIGenerationPage-212__description {
    font-size: 0.85rem;
    color: #888;
    margin: 0;
    line-height: 1.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.homepage-section-AIGenerationPage-212__arrow {
    flex-shrink: 0;
    font-size: 1.25rem;
    color: #ccc;
    transition: all 0.3s ease;
}

.homepage-section-AIGenerationPage-212__item:hover .homepage-section-AIGenerationPage-212__arrow {
    color: #667eea;
    transform: translateX(4px);
}


/* 響應式設計 */
@media (max-width: 768px) {
    .homepage-section-AIGenerationPage-212__list {
        padding: 1.5rem 0;
    }

    .homepage-section-AIGenerationPage-212__item {
        padding: 0.875rem 1rem;
    }

    .homepage-section-AIGenerationPage-212__icon-wrapper {
        width: 40px;
        height: 40px;
    }

    .homepage-section-AIGenerationPage-212__icon {
        font-size: 1rem;
    }

    .homepage-section-AIGenerationPage-212__title {
        font-size: 0.95rem;
    }

    .homepage-section-AIGenerationPage-212__description {
        display: none;
    }
}


/* ========== 最新消息模塊 203_垂直列表（漸層首字色塊，可單欄/多欄）========== */
.homepage-section-news-203__list {
    display: grid;
    grid-template-columns: repeat(var(--news-columns, 1), minmax(0, 1fr));
    gap: 0.75rem;
    padding: 2rem 0;
}

.homepage-section-news-203__item-link {
    text-decoration: none;
    color: inherit;
    display: block;
    height: 100%;
}

.homepage-section-news-203__item {
    display: flex;
    align-items: center;
    gap: 1rem;
    height: 100%;
    padding: 1rem 1.25rem;
    background: #ffffff;
    border: 1px solid #eee;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.homepage-section-news-203__item:hover {
    background: #f8f9ff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
}

.homepage-section-news-203__icon-wrapper {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.homepage-section-news-203__icon {
    font-size: 1.2rem;
    font-weight: 700;
    color: inherit;
    text-transform: uppercase;
}

.homepage-section-news-203__content {
    flex: 1;
    min-width: 0;
}

.homepage-section-news-203__title {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 0.25rem 0;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.homepage-section-news-203__description {
    font-size: 0.85rem;
    color: #888;
    margin: 0;
    line-height: 1.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.homepage-section-news-203__arrow {
    flex-shrink: 0;
    font-size: 1.25rem;
    color: #ccc;
    transition: all 0.3s ease;
}

.homepage-section-news-203__item:hover .homepage-section-news-203__arrow {
    color: #667eea;
    transform: translateX(4px);
}

/* 響應式設計：手機一律單欄 */
@media (max-width: 768px) {
    .homepage-section-news-203__list {
        grid-template-columns: minmax(0, 1fr);
        padding: 1.5rem 0;
    }

    .homepage-section-news-203__item {
        padding: 0.875rem 1rem;
    }

    .homepage-section-news-203__icon-wrapper {
        width: 40px;
        height: 40px;
    }

    .homepage-section-news-203__icon {
        font-size: 1rem;
    }

    .homepage-section-news-203__title {
        font-size: 0.95rem;
    }

    .homepage-section-news-203__description {
        display: none;
    }
}

    /* ========== 圖文模塊 301-310 ========== */
    .homepage-section-imagetext {
        padding: 2rem 0;
    }

    /* 圖文模塊301_左圖右文 */
    .homepage-section-imagetext-left-image {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 0;
        align-items: stretch;
        min-height: 400px;
    }

    .homepage-section-imagetext-301__image-container {
        position: relative;
        overflow: hidden;
        height: 100%;
    }

.homepage-section-imagetext-301__image {
    width: 100%;
    height: 100%;
    max-width: 960px;
    max-height: 960px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

        .homepage-section-imagetext-301__image:hover {
            transform: scale(1.05);
        }

    .homepage-section-imagetext-301__content {
        display: flex;
        align-items: center;
        padding: 3rem 2.5rem;
        position: relative;
        background: transparent;
    }

    .homepage-section-imagetext-301__text-wrapper {
        line-height: 1.6;
        color: inherit; /* 繼承父元素的文字顏色 */
    }

        .homepage-section-imagetext-301__text-wrapper h1,
        .homepage-section-imagetext-301__text-wrapper h2,
        .homepage-section-imagetext-301__text-wrapper h3,
        .homepage-section-imagetext-301__text-wrapper h4,
        .homepage-section-imagetext-301__text-wrapper h5,
        .homepage-section-imagetext-301__text-wrapper h6 {
            margin-bottom: 1rem;
        }

        .homepage-section-imagetext-301__text-wrapper p {
            margin-bottom: 1rem;
        }

    /* 圖片響應式顯示控制 */
    .homepage-section-imagetext-301__image--pc {
        display: block;
    }

    .homepage-section-imagetext-301__image--mobile {
        display: none;
    }

.homepage-section-imagetext-301__image-wrapper {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    max-width: 960px;
    max-height: 960px;
}

    /* 圖文模塊301_左圖右文 - overlay 樣式 */
    .homepage-section-imagetext-301__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay */
    .homepage-section-imagetext-301__overlay--always-show {
        opacity: 1;
    }

    /* hover 時也要顯示（兩種狀態都適用） */
    .homepage-section-imagetext-301__image-wrapper:hover .homepage-section-imagetext-301__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-301__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-301__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    /* 手機版文字樣式 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-301__mobile-title {
            font-weight: 600;
            margin: 1rem 0 0.5rem 0;
            line-height: 1.4;
            /* font-size, color, text-align 由 inline style 控制 */
        }

        .homepage-section-imagetext-301__mobile-text {
            line-height: 1.6;
            margin: 0;
            /* font-size, color, text-align 由 inline style 控制 */
        }
    }

    .homepage-section-imagetext-301__link {
        text-decoration: none;
        color: inherit;
        display: block;
    }

    @media (min-width: 991px) {
        .homepage-section-imagetext-301__image-container {
            display: flex;
            justify-content: flex-end;
            align-items: center;
        }

        .homepage-section-imagetext-301__content {
            justify-content: flex-start;
            padding: 0;
            padding-left: 1rem;
            display: flex;
            align-items: center;
        }

        .homepage-section-imagetext-301__text-wrapper {
            width: var(--word-item-width-pc, 500px);
            max-width: 100%;
            overflow: visible;
            box-sizing: border-box;
            line-height: 1.6;
            color: inherit;
            padding: 2rem;
        }
    }

    /* 手機版時切換圖片顯示 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-left-image {
            grid-template-columns: minmax(0, 1fr);
            min-height: auto;
        }

        .homepage-section-imagetext-301__image-container {
            max-width: 100%;
        }

        .homepage-section-imagetext-301__image-wrapper {
            margin: auto;
            max-width: 100%;
            max-height: 100%;
        }

        .homepage-section-imagetext-301__image {
            max-width: 100%;
            max-height: 100%;
        }

        .homepage-section-imagetext-301__content {
            padding: 10px;
            min-height: auto;
            height: auto;
            align-items: flex-start;
        }

        .homepage-section-imagetext-301__text-wrapper {
            width: 100%;
            max-width: 100%;
            height: auto;
            overflow: visible;
            box-sizing: border-box;
            padding: 10px;
        }

        .homepage-section-imagetext-301__image--pc {
            display: none;
        }

        .homepage-section-imagetext-301__image--mobile {
            display: block;
        }

        .homepage-section-imagetext-301__mobile-title {
            padding: 5px;
            font-size: 1.2rem;
            font-weight: 600;
            color: #333;
            margin: 1rem 0 0.5rem 0;
            line-height: 1.4;
        }

        .homepage-section-imagetext-301__mobile-text {
            padding: 5px;
            color: #666;
            font-size: 0.9rem;
            line-height: 1.6;
            margin: 0;
        }
    }

    .homepage-section-imagetext-301__pc-image,
    .homepage-section-imagetext-301__mobile-image {
        display: block;
        width: 100%;
        height: 100%;
    }


    /* 圖文模塊302_左文右圖 */
    .homepage-section-imagetext-left-text {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 0;
        align-items: stretch;
        min-height: 400px;
    }

    .homepage-section-imagetext-302__content {
        display: flex;
        align-items: center;
        padding: 3rem 2.5rem;
        position: relative;
        background: transparent;
    }

    .homepage-section-imagetext-302__text-wrapper {
        line-height: 1.6;
        color: inherit;
    }

        .homepage-section-imagetext-302__text-wrapper h1,
        .homepage-section-imagetext-302__text-wrapper h2,
        .homepage-section-imagetext-302__text-wrapper h3,
        .homepage-section-imagetext-302__text-wrapper h4,
        .homepage-section-imagetext-302__text-wrapper h5,
        .homepage-section-imagetext-302__text-wrapper h6 {
            margin-bottom: 1rem;
        }

        .homepage-section-imagetext-302__text-wrapper p {
            margin-bottom: 1rem;
        }

    .homepage-section-imagetext-302__image-container {
        position: relative;
        overflow: hidden;
        height: 100%;
    }

.homepage-section-imagetext-302__image {
    width: 100%;
    height: 100%;
    max-width: 960px;
    max-height: 960px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

        .homepage-section-imagetext-302__image:hover {
            transform: scale(1.05);
        }

    /* 圖片響應式顯示控制 */
    .homepage-section-imagetext-302__image--pc {
        display: block;
    }

    .homepage-section-imagetext-302__image--mobile {
        display: none;
    }

.homepage-section-imagetext-302__image-wrapper {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    max-width: 960px;
    max-height: 960px;
}

    /* 圖文模塊302_左文右圖 - overlay 樣式 */
    .homepage-section-imagetext-302__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay */
    .homepage-section-imagetext-302__overlay--always-show {
        opacity: 1;
    }

    /* hover 時也要顯示（兩種狀態都適用） */
    .homepage-section-imagetext-302__image-wrapper:hover .homepage-section-imagetext-302__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-302__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-302__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    /* 手機版文字樣式 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-302__mobile-title {
            font-weight: 600;
            margin: 1rem 0 0.5rem 0;
            line-height: 1.4;
            /* font-size, color, text-align 由 inline style 控制 */
        }

        .homepage-section-imagetext-302__mobile-text {
            line-height: 1.6;
            margin: 0;
            /* font-size, color, text-align 由 inline style 控制 */
        }
    }

    .homepage-section-imagetext-302__link {
        text-decoration: none;
        color: inherit;
        display: block;
    }

    @media (min-width: 991px) {
        .homepage-section-imagetext-302__content {
            justify-content: flex-end; /* 左文向右對齊（向中靠） */
            padding: 0; /* 移除原本的 padding */
            padding-right: 1rem;
            display: flex;
            align-items: center;
        }

        .homepage-section-imagetext-302__image-container {
            display: flex;
            justify-content: flex-start; /* 右圖向左對齊（向中靠） */
            align-items: center;
        }

        .homepage-section-imagetext-302__text-wrapper {
            width: var(--word-item-width-pc, 500px);
            max-width: 100%;
            overflow: visible;
            box-sizing: border-box;
            line-height: 1.6;
            color: inherit;
            padding: 2rem;
        }
    }

    /* 手機版時切換圖片顯示 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-left-text {
            grid-template-columns: minmax(0, 1fr);
            min-height: auto;
        }


        .homepage-section-imagetext-302__image-wrapper {
            margin: auto;
            max-width: 100%;
            max-height: 100%;
        }

        .homepage-section-imagetext-302__image {
            max-width: 100%;
            max-height: 100%;
        }

        .homepage-section-imagetext-302__image-container {
            order: -1; /* 手機版時圖片移到上方 */
            max-width: 100%;
        }

        .homepage-section-imagetext-302__content {
            padding: 10px;
            min-height: auto;
            height: auto;
            align-items: flex-start;
        }

        .homepage-section-imagetext-302__text-wrapper {
            width: 100%;
            max-width: 100%;
            height: auto;
            overflow: visible;
            box-sizing: border-box;
            padding: 10px;
        }

        .homepage-section-imagetext-302__image--pc {
            display: none;
        }

        .homepage-section-imagetext-302__image--mobile {
            display: block;
        }

        .homepage-section-imagetext-302__mobile-title {
            padding: 5px;
            font-size: 1.2rem;
            font-weight: 600;
            color: #333;
            margin: 1rem 0 0.5rem 0;
            line-height: 1.4;
        }

        .homepage-section-imagetext-302__mobile-text {
            padding: 5px;
            color: #666;
            font-size: 0.9rem;
            line-height: 1.6;
            margin: 0;
        }
    }

    .homepage-section-imagetext-302__pc-image,
    .homepage-section-imagetext-302__mobile-image {
        display: block;
        width: 100%;
        height: 100%;
    }

    /* 圖文模塊303_四大圖 */
    .homepage-section-imagetext-303__grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr); /* 固定4欄，每欄平均分配 */
        gap: 2rem;
        width: 100%; /* 填滿父容器寬度 */
        /* 移除 max-width 和 margin: 0 auto，讓它跟著 .homepage-section--container 走 */
    }

    .homepage-section-imagetext-303__item {
        text-align: center;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-303__item:hover {
            transform: scale(1.02);
        }

    .homepage-section-imagetext-303__image {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
        object-fit: cover;
        border-radius: 12px;
        margin-bottom: 1rem;
        transition: opacity 0.3s ease;
    }

        .homepage-section-imagetext-303__image:hover {
            opacity: 0.9;
        }

    /* 圖文模塊303 - 圖上文 overlay 樣式 */
    .homepage-section-imagetext-303__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 12px;
        margin-bottom: 1rem;
    }

        .homepage-section-imagetext-303__image-wrapper .homepage-section-imagetext-303__image {
            margin-bottom: 0; /* 在 wrapper 內時移除 margin */
        }

    .homepage-section-imagetext-303__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 1.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay（模式2）*/
    .homepage-section-imagetext-303__overlay--always-show {
        opacity: 1;
    }

    /* hover 時顯示（模式1、2 都適用）*/
    .homepage-section-imagetext-303__image-wrapper:hover .homepage-section-imagetext-303__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-303__overlay-title {
        font-weight: bold;
        margin-bottom: 0.8rem;
        line-height: 1.4;
    }

    .homepage-section-imagetext-303__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
    }

    .homepage-section-imagetext-303__title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-303__text {
        line-height: 1.6;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-303__link {
        text-decoration: none;
        color: inherit;
        display: block;
    }

    /* 手機版調整 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-303__grid {
            grid-template-columns: repeat(2, 1fr); /* 手機版 2 欄 */
            gap: 1.5rem;
        }
    }

    @media (max-width: 576px) {
        .homepage-section-imagetext-303__grid {
            gap: 1rem;
        }
    }


    /* 圖文模塊304_三大圖 */
    .homepage-section-imagetext-304__grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr); /* 固定3欄 */
        gap: 2rem;
        width: 100%;
    }

    .homepage-section-imagetext-304__item {
        position: relative;
        border-radius: 12px;
        overflow: hidden;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-304__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-304__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 12px;
    }

    .homepage-section-imagetext-304__image {
        width: 100%;
        aspect-ratio: 1 / 1;
        object-fit: cover;
        transition: transform 0.3s ease;
        display: block;
    }

    .homepage-section-imagetext-304__item:hover .homepage-section-imagetext-304__image {
        transform: scale(1.05);
    }

    .homepage-section-imagetext-304__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay（模式2）*/
    .homepage-section-imagetext-304__overlay--always-show {
        opacity: 1;
    }

    /* hover 時顯示（模式1、2 都適用）*/
    .homepage-section-imagetext-304__image-wrapper:hover .homepage-section-imagetext-304__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-304__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-304__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    /* 模式3：圖下文樣式 */
    .homepage-section-imagetext-304__title {
        font-weight: bold;
        margin: 1rem 0 0.5rem 0;
        line-height: 1.4;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-304__text {
        line-height: 1.6;
        margin: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-304__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    /* 響應式設計 - 手機版根據 --mobile-columns 決定欄數 */
    @media (max-width: 576px) {
        .homepage-section-imagetext-304__grid {
            grid-template-columns: repeat(var(--mobile-columns, 1), 1fr);
            gap: 2rem;
        }

        .homepage-section-imagetext-304__grid[style*="--mobile-columns: 1"] .homepage-section-imagetext-304__item {
            max-width: 400px;
            margin: 0 auto;
        }

        .homepage-section-imagetext-304__overlay {
            padding: 1.5rem;
        }

        .homepage-section-imagetext-304__title {
            font-size: 1.2rem;
            margin: 1rem 0 0.5rem 0;
        }

        .homepage-section-imagetext-304__text {
            font-size: 0.9rem;
        }
    }

    /* 圖文模塊305_六小圖 */
    .homepage-section-imagetext-305__grid {
        display: grid;
        grid-template-columns: repeat(6, 1fr); /* 固定6欄 */
        gap: 0; /* 無間隔 */
        width: 100%;
    }

    .homepage-section-imagetext-305__item {
        position: relative;
        overflow: hidden;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-305__item:hover {
            transform: translateY(-5px);
            z-index: 1; /* hover 時提升層級避免被遮擋 */
        }

    .homepage-section-imagetext-305__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
    }

    .homepage-section-imagetext-305__image {
        width: 100%;
        aspect-ratio: 1 / 1;
        object-fit: cover;
        transition: transform 0.3s ease;
        display: block;
    }

    .homepage-section-imagetext-305__item:hover .homepage-section-imagetext-305__image {
        transform: scale(1.05);
    }

    .homepage-section-imagetext-305__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 1rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay（模式2）*/
    .homepage-section-imagetext-305__overlay--always-show {
        opacity: 1;
    }

    /* hover 時顯示（模式1、2 都適用）*/
    .homepage-section-imagetext-305__image-wrapper:hover .homepage-section-imagetext-305__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-305__overlay-title {
        font-weight: bold;
        margin-bottom: 0.5rem;
        line-height: 1.4;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-305__overlay-text {
        line-height: 1.5;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    /* 模式3：圖下文樣式 */
    .homepage-section-imagetext-305__title {
        font-weight: bold;
        margin: 0.8rem 0 0.4rem 0;
        line-height: 1.4;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-305__text {
        line-height: 1.5;
        margin: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-305__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    /* 響應式設計 */
    @media (max-width: 768px) {
        .homepage-section-imagetext-305__grid {
            grid-template-columns: repeat(3, 1fr); /* 平板 3 欄 */
        }
    }

    @media (max-width: 576px) {
        .homepage-section-imagetext-305__grid {
            grid-template-columns: repeat(2, 1fr); /* 手機版 2 欄 */
        }

        .homepage-section-imagetext-305__overlay {
            padding: 0.8rem;
        }

        .homepage-section-imagetext-305__title {
            margin: 0.5rem 0 0.3rem 0;
        }
    }

    /* 圖文模塊306_一大兩小 */
    .homepage-section-imagetext-306__grid {
        display: grid;
        grid-template-columns: 400px 200px;
        grid-template-rows: 200px 200px;
        gap: 1.5rem;
        justify-content: center;
    }

    .homepage-section-imagetext-306__item:first-child {
        grid-row: span 2;
    }

    .homepage-section-imagetext-306__item {
        position: relative;
        border-radius: 12px;
        overflow: hidden;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-306__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-306__image-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .homepage-section-imagetext-306__image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.3s ease;
    }

    .homepage-section-imagetext-306__item:hover .homepage-section-imagetext-306__image {
        transform: scale(1.05);
    }

    /* 圖文模塊306_一大兩小 */
    .homepage-section-imagetext-306__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 1.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay */
    .homepage-section-imagetext-306__overlay--always-show {
        opacity: 1;
    }

    /* hover 時也要顯示（兩種狀態都適用） */
    .homepage-section-imagetext-306__item:hover .homepage-section-imagetext-306__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-306__overlay-title {
        font-weight: bold;
        margin-bottom: 0.8rem;
        line-height: 1.3;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-306__overlay-text {
        line-height: 1.5;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-306__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    /* 手機版：上面一個大圖下面兩個小圖 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-306__grid {
            display: block;
            max-width: 350px;
            margin: 0 auto;
        }

        .homepage-section-imagetext-306__item:first-child {
            width: 100%;
            height: 250px;
            margin-bottom: 1rem;
        }

        .homepage-section-imagetext-306__item:nth-child(2),
        .homepage-section-imagetext-306__item:nth-child(3) {
            width: 168px;
            height: 168px;
            vertical-align: top;
        }

        .homepage-section-imagetext-306__item:nth-child(2) {
            margin-right: 10px;
        }

        .homepage-section-imagetext-306__overlay {
            padding: 1rem;
        }

        .homepage-section-imagetext-306__title {
            font-size: 1rem;
            margin-bottom: 0.5rem;
        }

        .homepage-section-imagetext-306__text {
            font-size: 0.8rem;
        }
    }

    /* 圖文模塊307_一大五小圖 */
    .homepage-section-imagetext-307__grid {
        display: grid;
        grid-template-columns: 200px 200px 200px;
        grid-template-rows: 200px 200px 200px;
        gap: 1.5rem;
        justify-content: center;
    }

    .homepage-section-imagetext-307__item:nth-child(4) {
        grid-row: span 2;
        grid-column: span 2;
    }

    .homepage-section-imagetext-307__item {
        position: relative;
        border-radius: 12px;
        overflow: hidden;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-307__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-307__image-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .homepage-section-imagetext-307__image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.3s ease;
    }

    .homepage-section-imagetext-307__item:hover .homepage-section-imagetext-307__image {
        transform: scale(1.05);
    }

    /* 圖文模塊307_一大五小圖 */
    .homepage-section-imagetext-307__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 1.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay */
    .homepage-section-imagetext-307__overlay--always-show {
        opacity: 1;
    }

    /* hover 時也要顯示（兩種狀態都適用） */
    .homepage-section-imagetext-307__item:hover .homepage-section-imagetext-307__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-307__overlay-title {
        font-weight: bold;
        margin-bottom: 0.8rem;
        line-height: 1.3;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-307__overlay-text {
        line-height: 1.5;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-307__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    /* 手機版：改為兩欄排列 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-307__grid {
            grid-template-columns: 1fr 1fr;
            grid-template-rows: auto;
            gap: 1rem;
            max-width: 350px;
            margin: 0 auto;
        }

        .homepage-section-imagetext-307__item:nth-child(4) {
            grid-row: auto;
            grid-column: auto;
        }

        .homepage-section-imagetext-307__overlay {
            padding: 1rem;
        }

        .homepage-section-imagetext-307__title {
            font-size: 1rem;
            margin-bottom: 0.5rem;
        }

        .homepage-section-imagetext-307__text {
            font-size: 0.8rem;
        }
    }

    /* 圖文模塊308_二大十小圖 */
    .homepage-section-imagetext-308__grid {
        display: grid;
        grid-template-columns: repeat(6, 140px);
        grid-template-rows: repeat(3, 140px);
        gap: 1.5rem;
        justify-content: center;
    }

    .homepage-section-imagetext-308__item:nth-child(1) {
        grid-row: span 2;
        grid-column: span 2;
    }

    .homepage-section-imagetext-308__item:nth-child(7) {
        grid-row: span 2;
        grid-column: span 2;
    }

    .homepage-section-imagetext-308__item {
        position: relative;
        border-radius: 12px;
        overflow: hidden;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-308__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-308__image-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .homepage-section-imagetext-308__image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.3s ease;
    }

    .homepage-section-imagetext-308__item:hover .homepage-section-imagetext-308__image {
        transform: scale(1.05);
    }

    /* 圖文模塊308_二大十小圖 */
    .homepage-section-imagetext-308__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 1.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    /* 預設顯示的 overlay */
    .homepage-section-imagetext-308__overlay--always-show {
        opacity: 1;
    }

    /* hover 時也要顯示（兩種狀態都適用） */
    .homepage-section-imagetext-308__item:hover .homepage-section-imagetext-308__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-308__overlay-title {
        font-weight: bold;
        margin-bottom: 0.8rem;
        line-height: 1.3;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-308__overlay-text {
        line-height: 1.5;
        margin-bottom: 0;
        /* font-size, color, text-align 由 inline style 控制 */
    }

    .homepage-section-imagetext-308__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    /* 手機版：改為兩欄排列 */
    @media (max-width: 991px) {
        .homepage-section-imagetext-308__grid {
            grid-template-columns: 1fr 1fr;
            grid-template-rows: repeat(6, 150px);
            gap: 1rem;
            max-width: 350px;
            margin: 0 auto;
        }

        .homepage-section-imagetext-308__item:nth-child(1),
        .homepage-section-imagetext-308__item:nth-child(7) {
            grid-row: auto;
            grid-column: auto;
        }

        .homepage-section-imagetext-308__overlay {
            padding: 1rem;
        }

        .homepage-section-imagetext-308__title {
            font-size: 1rem;
            margin-bottom: 0.5rem;
        }

        .homepage-section-imagetext-308__text {
            font-size: 0.8rem;
        }
    }

    /* 圖文模塊309_左圖右圖 */
    .homepage-section-imagetext-leftright-image {
        display: flex;
        gap: 2rem;
        width: 100%;
    }

    .homepage-section-imagetext-309__left-container,
    .homepage-section-imagetext-309__right-container {
        flex: 1;
    }

    /* 左圖樣式 */
    .homepage-section-imagetext-309-left__item {
        position: relative;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-309-left__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-309-left__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    .homepage-section-imagetext-309-left__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 12px;
    }

    .homepage-section-imagetext-309-left__image {
        width: 100%;
        height: auto; /* 根據圖片本身比例 */
        object-fit: cover;
        transition: transform 0.3s ease;
        display: block;
    }

    .homepage-section-imagetext-309-left__item:hover .homepage-section-imagetext-309-left__image {
        transform: scale(1.05);
    }

    .homepage-section-imagetext-309-left__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .homepage-section-imagetext-309-left__overlay--always-show {
        opacity: 1;
    }

    .homepage-section-imagetext-309-left__image-wrapper:hover .homepage-section-imagetext-309-left__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-309-left__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
    }

    .homepage-section-imagetext-309-left__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
    }

    /* 左圖 - 圖下文樣式 */
    .homepage-section-imagetext-309-left__title {
        font-weight: bold;
        margin: 1rem 0 0.5rem 0;
        line-height: 1.4;
    }

    .homepage-section-imagetext-309-left__text {
        line-height: 1.6;
        margin: 0;
    }

    /* 右圖樣式 */
    .homepage-section-imagetext-309-right__item {
        position: relative;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-309-right__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-309-right__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    .homepage-section-imagetext-309-right__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 12px;
    }

    .homepage-section-imagetext-309-right__image {
        width: 100%;
        height: auto; /* 根據圖片本身比例 */
        object-fit: cover;
        transition: transform 0.3s ease;
        display: block;
    }

    .homepage-section-imagetext-309-right__item:hover .homepage-section-imagetext-309-right__image {
        transform: scale(1.05);
    }

    .homepage-section-imagetext-309-right__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .homepage-section-imagetext-309-right__overlay--always-show {
        opacity: 1;
    }

    .homepage-section-imagetext-309-right__image-wrapper:hover .homepage-section-imagetext-309-right__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-309-right__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
    }

    .homepage-section-imagetext-309-right__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
    }

    /* 右圖 - 圖下文樣式 */
    .homepage-section-imagetext-309-right__title {
        font-weight: bold;
        margin: 1rem 0 0.5rem 0;
        line-height: 1.4;
    }

    .homepage-section-imagetext-309-right__text {
        line-height: 1.6;
        margin: 0;
    }

    /* 響應式設計 - 手機版根據 --mobile-columns 決定方向 */
    @media (max-width: 768px) {
        .homepage-section-imagetext-leftright-image {
            flex-direction: column;
            gap: 1.5rem;
        }

        .homepage-section-imagetext-leftright-image[style*="--mobile-columns: 2"] {
            flex-direction: row;
        }

        .homepage-section-imagetext-309-left__overlay,
        .homepage-section-imagetext-309-right__overlay {
            padding: 1.5rem;
        }
    }

    @media (max-width: 576px) {
        .homepage-section-imagetext-leftright-image {
            gap: 1rem;
        }

        .homepage-section-imagetext-leftright-image[style*="--mobile-columns: 2"] {
            flex-direction: row;
            gap: 0.5rem;
        }

        .homepage-section-imagetext-309-left__overlay,
        .homepage-section-imagetext-309-right__overlay {
            padding: 1rem;
        }

        .homepage-section-imagetext-309-left__title,
        .homepage-section-imagetext-309-right__title {
            margin: 0.8rem 0 0.4rem 0;
        }
    }

    /* 圖文模塊310_左圖中圖右圖 */
    .homepage-section-imagetext-leftcenterright-image {
        display: flex;
        gap: 2rem;
        width: 100%;
    }

    .homepage-section-imagetext-310__left-container,
    .homepage-section-imagetext-310__center-container,
    .homepage-section-imagetext-310__right-container {
        flex: 1;
    }

    /* 左圖樣式 */
    .homepage-section-imagetext-310-left__item {
        position: relative;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-310-left__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-310-left__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    .homepage-section-imagetext-310-left__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 12px;
    }

    .homepage-section-imagetext-310-left__image {
        width: 100%;
        height: auto; /* 根據圖片本身比例 */
        object-fit: cover;
        transition: transform 0.3s ease;
        display: block;
    }

    .homepage-section-imagetext-310-left__item:hover .homepage-section-imagetext-310-left__image {
        transform: scale(1.05);
    }

    .homepage-section-imagetext-310-left__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .homepage-section-imagetext-310-left__overlay--always-show {
        opacity: 1;
    }

    .homepage-section-imagetext-310-left__image-wrapper:hover .homepage-section-imagetext-310-left__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-310-left__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
    }

    .homepage-section-imagetext-310-left__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
    }

    /* 左圖 - 圖下文樣式 */
    .homepage-section-imagetext-310-left__title {
        font-weight: bold;
        margin: 1rem 0 0.5rem 0;
        line-height: 1.4;
    }

    .homepage-section-imagetext-310-left__text {
        line-height: 1.6;
        margin: 0;
    }

    /* 中圖樣式 */
    .homepage-section-imagetext-310-center__item {
        position: relative;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-310-center__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-310-center__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    .homepage-section-imagetext-310-center__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 12px;
    }

    .homepage-section-imagetext-310-center__image {
        width: 100%;
        height: auto; /* 根據圖片本身比例 */
        object-fit: cover;
        transition: transform 0.3s ease;
        display: block;
    }

    .homepage-section-imagetext-310-center__item:hover .homepage-section-imagetext-310-center__image {
        transform: scale(1.05);
    }

    .homepage-section-imagetext-310-center__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .homepage-section-imagetext-310-center__overlay--always-show {
        opacity: 1;
    }

    .homepage-section-imagetext-310-center__image-wrapper:hover .homepage-section-imagetext-310-center__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-310-center__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
    }

    .homepage-section-imagetext-310-center__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
    }

    /* 中圖 - 圖下文樣式 */
    .homepage-section-imagetext-310-center__title {
        font-weight: bold;
        margin: 1rem 0 0.5rem 0;
        line-height: 1.4;
    }

    .homepage-section-imagetext-310-center__text {
        line-height: 1.6;
        margin: 0;
    }

    /* 右圖樣式 */
    .homepage-section-imagetext-310-right__item {
        position: relative;
        transition: transform 0.3s ease;
    }

        .homepage-section-imagetext-310-right__item:hover {
            transform: translateY(-5px);
        }

    .homepage-section-imagetext-310-right__link {
        text-decoration: none;
        color: inherit;
        display: block;
        width: 100%;
        height: 100%;
    }

    .homepage-section-imagetext-310-right__image-wrapper {
        position: relative;
        width: 100%;
        overflow: hidden;
        border-radius: 12px;
    }

    .homepage-section-imagetext-310-right__image {
        width: 100%;
        height: auto; /* 根據圖片本身比例 */
        object-fit: cover;
        transition: transform 0.3s ease;
        display: block;
    }

    .homepage-section-imagetext-310-right__item:hover .homepage-section-imagetext-310-right__image {
        transform: scale(1.05);
    }

    .homepage-section-imagetext-310-right__overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        color: white;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .homepage-section-imagetext-310-right__overlay--always-show {
        opacity: 1;
    }

    .homepage-section-imagetext-310-right__image-wrapper:hover .homepage-section-imagetext-310-right__overlay {
        opacity: 1;
    }

    .homepage-section-imagetext-310-right__overlay-title {
        font-weight: bold;
        margin-bottom: 1rem;
        line-height: 1.4;
    }

    .homepage-section-imagetext-310-right__overlay-text {
        line-height: 1.6;
        margin-bottom: 0;
    }

    /* 右圖 - 圖下文樣式 */
    .homepage-section-imagetext-310-right__title {
        font-weight: bold;
        margin: 1rem 0 0.5rem 0;
        line-height: 1.4;
    }

    .homepage-section-imagetext-310-right__text {
        line-height: 1.6;
        margin: 0;
    }

    /* 響應式設計 - 手機版根據 --mobile-columns 決定方向 */
    @media (max-width: 768px) {
        .homepage-section-imagetext-leftcenterright-image {
            flex-direction: column;
            gap: 1.5rem;
        }

        .homepage-section-imagetext-leftcenterright-image[style*="--mobile-columns: 3"] {
            flex-direction: row;
        }

        .homepage-section-imagetext-310-left__overlay,
        .homepage-section-imagetext-310-center__overlay,
        .homepage-section-imagetext-310-right__overlay {
            padding: 1.5rem;
        }
    }

    @media (max-width: 576px) {
        .homepage-section-imagetext-leftcenterright-image {
            gap: 1rem;
        }

        .homepage-section-imagetext-leftcenterright-image[style*="--mobile-columns: 3"] {
            flex-direction: row;
            gap: 0.5rem;
        }

        .homepage-section-imagetext-310-left__overlay,
        .homepage-section-imagetext-310-center__overlay,
        .homepage-section-imagetext-310-right__overlay {
            padding: 1rem;
        }

        .homepage-section-imagetext-310-left__title,
        .homepage-section-imagetext-310-center__title,
        .homepage-section-imagetext-310-right__title {
            margin: 0.8rem 0 0.4rem 0;
        }
    }

    /* ========== 圖文模塊311_幾何構圖 ========== */

    /* 主容器 */
    .homepage-section-imagetext-311__container {
        width: 100%;
        height: 600px;
        margin: 0 auto;
    }

    /* ===== 電腦版：水平幾何構圖 ===== */
    .homepage-section-imagetext-311__grid {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 56.25%; /* 16:9 比例 */
        background: #ffffff; /* 白色分隔線的底色 */
    }

    .homepage-section-imagetext-311__item {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 600px;
        overflow: hidden;
        transition: filter 0.3s ease;
        cursor: pointer;
    }

        .homepage-section-imagetext-311__item:hover {
            filter: brightness(1.05);
            z-index: 20 !important;
        }

    /* 背景圖片 */
    .homepage-section-imagetext-311__background {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    /* 內容遮罩 */
    .homepage-section-imagetext-311__content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1.5rem;
        transition: background 0.3s ease;
    }

    .homepage-section-imagetext-311__item:hover .homepage-section-imagetext-311__content {
        background: rgba(0, 0, 0, calc(var(--overlay-opacity, 0.4) + 0.15));
    }

    .homepage-section-imagetext-311__title {
        font-weight: 700;
        line-height: 1.3;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        margin: 0;
        word-wrap: break-word;
    }

    .homepage-section-imagetext-311__link {
        display: block;
        width: 100%;
        height: 100%;
        text-decoration: none;
        color: inherit;
    }

    /* ========== 圖文模塊311_幾何構圖 - 內容位置控制 ========== */

    /* 電腦版 - 各區塊標題位置 */
    .homepage-section-imagetext-311__itemContent--1 {
        position: absolute;
        left: 12%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 70%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent--2 {
        position: absolute;
        left: 45%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 70%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent--3 {
        position: absolute;
        left: 62.5%;
        top: 17%;
        transform: translate(-50%, -50%);
        width: 70%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent--4 {
        position: absolute;
        left: 62.5%;
        top: 83%;
        transform: translate(-50%, -50%);
        width: 70%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent--5 {
        position: absolute;
        left: 88%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 70%;
        z-index: 2;
    }

    /* 手機版 - 各區塊標題位置 */
    .homepage-section-imagetext-311__itemContent-mobile--1 {
        position: absolute;
        left: 70%;
        top: 15%;
        transform: translate(-50%, -50%);
        width: 60%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent-mobile--2 {
        position: absolute;
        left: 50%;
        top: 45%;
        transform: translate(-50%, -50%);
        width: 60%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent-mobile--3 {
        position: absolute;
        left: 12%;
        top: 62.5%;
        transform: translate(-50%, -50%);
        width: 60%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent-mobile--4 {
        position: absolute;
        left: 88%;
        top: 62.5%;
        transform: translate(-50%, -50%);
        width: 60%;
        z-index: 2;
    }

    .homepage-section-imagetext-311__itemContent-mobile--5 {
        position: absolute;
        left: 50%;
        top: 82%;
        transform: translateX(-50%);
        width: 60%;
        z-index: 2;
    }

        /* 標題和內容的樣式 */
        .homepage-section-imagetext-311__itemContent--1 h3,
        .homepage-section-imagetext-311__itemContent--2 h3,
        .homepage-section-imagetext-311__itemContent--3 h3,
        .homepage-section-imagetext-311__itemContent--4 h3,
        .homepage-section-imagetext-311__itemContent--5 h3,
        .homepage-section-imagetext-311__itemContent-mobile--1 h3,
        .homepage-section-imagetext-311__itemContent-mobile--2 h3,
        .homepage-section-imagetext-311__itemContent-mobile--3 h3,
        .homepage-section-imagetext-311__itemContent-mobile--4 h3,
        .homepage-section-imagetext-311__itemContent-mobile--5 h3 {
            margin: 0 0 0.5rem 0;
            font-weight: 700;
            line-height: 1.3;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        }

        .homepage-section-imagetext-311__itemContent--1 p,
        .homepage-section-imagetext-311__itemContent--2 p,
        .homepage-section-imagetext-311__itemContent--3 p,
        .homepage-section-imagetext-311__itemContent--4 p,
        .homepage-section-imagetext-311__itemContent--5 p,
        .homepage-section-imagetext-311__itemContent-mobile--1 p,
        .homepage-section-imagetext-311__itemContent-mobile--2 p,
        .homepage-section-imagetext-311__itemContent-mobile--3 p,
        .homepage-section-imagetext-311__itemContent-mobile--4 p,
        .homepage-section-imagetext-311__itemContent-mobile--5 p {
            margin: 0;
            line-height: 1.6;
            text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
        }

    /* ===== 電腦版五個區塊 ===== */

    /* 區塊1 */
    .homepage-section-imagetext-311__item--1 {
        clip-path: polygon(0 0, 44.5% 0, 9.5% 100%, 0% 100%);
        z-index: 1;
    }

    /* 區塊2 */
    .homepage-section-imagetext-311__item--2 {
        clip-path: polygon(10.5% 100%, 45% 1%, 62% 50%, 44.5% 100%);
        z-index: 1;
    }

    /* 區塊3 */
    .homepage-section-imagetext-311__item--3 {
        clip-path: polygon(45.5% 0, 79.5% 0, 62.5% 49.5%);
        z-index: 1;
    }

    /* 區塊4 */
    .homepage-section-imagetext-311__item--4 {
        clip-path: polygon(45.5% 100%, 62.5% 50.5%, 79.5% 100%);
        z-index: 1;
    }

    /* 區塊5 */
    .homepage-section-imagetext-311__item--5 {
        clip-path: polygon(63% 50%, 80.5% 0%, 100% 0%, 100% 100%, 80.5% 100%);
        z-index: 1;
    }

    /* ===== 手機版：垂直幾何構圖（旋轉90度）===== */
    .homepage-section-imagetext-311__grid-mobile {
        position: relative;
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
        height: 0;
        padding-bottom: 177.78%; /* 9:16 比例 */
        background: #ffffff;
    }

    .homepage-section-imagetext-311__item-mobile {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        transition: filter 0.3s ease;
        cursor: pointer;
    }

        .homepage-section-imagetext-311__item-mobile:active {
            filter: brightness(1.05);
            z-index: 20 !important;
        }

    /* 手機版五個區塊（垂直旋轉90度）*/

    /* 區塊1 - 手機版 */
    .homepage-section-imagetext-311__item-mobile--1 {
        clip-path: polygon(0 0, 100% 0, 100% 44.5%, 0% 9.5%);
        z-index: 1;
    }

    /* 區塊2 - 手機版 */
    .homepage-section-imagetext-311__item-mobile--2 {
        clip-path: polygon(0% 10.5%, 99% 45%, 50% 62%, 0% 44.5%);
        z-index: 1;
    }

    /* 區塊3 - 手機版 */
    .homepage-section-imagetext-311__item-mobile--3 {
        clip-path: polygon(0 45.5%, 0 79.5%, 49.5% 62.5%);
        z-index: 1;
    }

    /* 區塊4 - 手機版 */
    .homepage-section-imagetext-311__item-mobile--4 {
        clip-path: polygon(100% 45.5%, 50.5% 62.5%, 100% 79.5%);
        z-index: 1;
    }

    /* 區塊5 - 手機版 */
    .homepage-section-imagetext-311__item-mobile--5 {
        clip-path: polygon(50% 63%, 0% 80.5%, 0% 100%, 100% 100%, 100% 80.5%);
        z-index: 1;
    }

    /* 響應式調整 */
    @media (max-width: 1200px) {
    }

    @media (max-width: 991px) {
        .homepage-section-imagetext-311__container {
            height: 100%;
        }

        .homepage-section-imagetext-311__grid-mobile {
            max-width: 450px;
            padding-bottom: 160%;
        }

        .homepage-section-imagetext-311__title {
            font-size: 1.3rem !important;
        }
    }

    @media (max-width: 576px) {


        .homepage-section-imagetext-311__title {
            font-size: 1.1rem !important;
        }
    }

    /* ========== 地圖模塊 401 ========== */
    .homepage-section-map {
        padding: 2rem 0;
    }

    .homepage-section-map__container {
        text-align: center;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    }

    .homepage-section-map__iframe {
        width: 100%;
        height: 400px;
        border: none;
        display: block;
    }

    /* ========== 跑碼模塊501_一跑碼  ========== */

    /* 主容器  */
    .homepage-section-runnumber-501 {
        padding: 4rem 0;
    }

    .homepage-section-runnumber-501__container {
        display: flex;
        align-items: flex-start;
        max-width: 1200px;
        margin: 0 auto;
        gap: 3rem;
        padding: 0 2rem;
    }

    /* 文字區域 - 限制高度與數字區域相同 */
    .homepage-section-runnumber-501__text-section {
        flex: 1;
        max-width: 1500px;
        height: 110px;
        overflow: hidden;
        display: flex;
        align-items: flex-start;
    }

    .homepage-section-runnumber-501__text-section--left {
        order: 1;
    }

    .homepage-section-runnumber-501__text-section--right {
        order: 3;
    }

    .homepage-section-runnumber-501__text-content {
        line-height: 1.6;
        color: #333;
        width: 100%;
        overflow: hidden;
        padding-top: 0;
        margin-top: 0;
    }

        .homepage-section-runnumber-501__text-content h1,
        .homepage-section-runnumber-501__text-content h2,
        .homepage-section-runnumber-501__text-content h3 {
            margin-bottom: 1rem;
            margin-top: 0;
            font-weight: 700;
        }

        .homepage-section-runnumber-501__text-content p {
            margin-bottom: 1rem;
            margin-top: 0;
            font-size: 1rem;
            line-height: 1.8;
        }

            .homepage-section-runnumber-501__text-content p:first-child,
            .homepage-section-runnumber-501__text-content h1:first-child,
            .homepage-section-runnumber-501__text-content h2:first-child,
            .homepage-section-runnumber-501__text-content h3:first-child {
                margin-top: 0;
            }

    /* 數字區域容器 - 單個數字置中設計 */
    .homepage-section-runnumber-501__numbers-section {
        flex: 2;
        order: 2;
        margin: 0 auto; /* 確保在沒有文字時居中 */
    }

    .homepage-section-runnumber-501__numbers-grid {
        display: flex;
        justify-content: center;
        align-items: stretch;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
        max-width: 450px; /* 單個數字區域，縮小最大寬度 */
        min-height: 110px;
        margin: auto;
    }

    /* 單個數字項目 - 放大設計適合單獨顯示 */
    .homepage-section-runnumber-501__number-item {
        text-align: center;
        position: relative;
        transition: transform 0.3s ease;
        background: transparent;
        border-radius: 16px; /* 添加圓角 */
        display: flex;
        flex-direction: column;
    }

        /* 移除分隔線，因為只有一個數字 */
        .homepage-section-runnumber-501__number-item:not(:last-child)::after {
            display: none;
        }

        .homepage-section-runnumber-501__number-item:hover {
            transform: translateY(-5px) scale(1.05); /* 增強 hover 效果 */
        }

    /* 數字顯示區域 - 放大設計 */
    .homepage-section-runnumber-501__number-display {
        margin-bottom: 1.2rem; /* 增加間距 */
        display: flex;
        align-items: baseline;
        justify-content: center;
        gap: 0.5rem;
    }

    .homepage-section-runnumber-501__number-value {
        font-size: 3.5rem; /* 放大數字 */
        font-weight: 700;
        color: #ff4757;
        line-height: 1;
        transition: color 0.3s ease;
        text-wrap: nowrap;
    }

    .homepage-section-runnumber-501__number-unit {
        font-size: 1rem; /* 稍微放大單位 */
        color: #666;
        font-weight: 400;
        margin-top: 0.3rem;
        text-wrap: nowrap;
    }

    /* 數字標題 - 稍微放大 */
    .homepage-section-runnumber-501__number-title {
        font-size: 1.2rem; /* 放大標題 */
        font-weight: 600;
        color: #333;
        line-height: 1.3;
        white-space: pre-line; /* 允許 \n 手動換行 */
        word-break: break-word; /* 太長自動換行 */
    }

    /* 空白項目樣式 */
    .homepage-section-runnumber-501__number-item--empty {
        opacity: 0.2;
        pointer-events: none;
    }

    /* 數字動畫效果的顏色變化 */
    .homepage-section-runnumber-501__number-item.animating .homepage-section-runnumber-501__number-value {
        color: #ff6b6b;
    }

    .homepage-section-runnumber-501__number-item.completed .homepage-section-runnumber-501__number-value {
        color: #ff4757;
    }

    /* 響應式設計 */
    @media (max-width: 1200px) {
        .homepage-section-runnumber-501__container {
            max-width: 100%;
            padding: 0 1.5rem;
            gap: 2rem;
        }
    }

    @media (max-width: 991px) {
        .homepage-section-runnumber-501 {
            padding: 3rem 0;
        }

        .homepage-section-runnumber-501__container {
            flex-direction: column;
            gap: 2rem;
            align-items: center;
        }

        .homepage-section-runnumber-501__text-section,
        .homepage-section-runnumber-501__numbers-section {
            max-width: 100%;
            order: initial !important;
        }

        .homepage-section-runnumber-501__text-section--left {
            order: 1 !important;
        }

        .homepage-section-runnumber-501__numbers-section {
            order: 2 !important;
        }

        .homepage-section-runnumber-501__text-section--right {
            order: 3 !important;
        }

        /* 手機版文字區域高度調整 */
        .homepage-section-runnumber-501__text-section {
            height: 110px;
            align-items: flex-start;
        }

        .homepage-section-runnumber-501__numbers-section {
            max-width: 320px; /* 手機版調整寬度 */
        }

        .homepage-section-runnumber-501__numbers-grid {
            padding: 2.5rem 1.5rem;
            min-height: 110px;
        }

        .homepage-section-runnumber-501__number-value {
            font-size: 3rem; /* 手機版稍微縮小 */
        }

        .homepage-section-runnumber-501__number-item {
            padding: 2rem 2.5rem;
        }

        .homepage-section-runnumber-501__number-title {
            font-size: 1.1rem;
        }

        .homepage-section-runnumber-501__number-unit {
            font-size: 0.9rem;
        }
    }

    @media (max-width: 768px) {
        .homepage-section-runnumber-501__numbers-grid {
            padding: 2rem 1rem;
            min-height: auto;
        }

        .homepage-section-runnumber-501__number-item {
            padding: 1.5rem 2rem;
        }

        /* 手機版文字區域不限制高度 */
        .homepage-section-runnumber-501__text-section {
            height: auto;
            overflow: visible;
        }

        .homepage-section-runnumber-501__number-value {
            font-size: 2.5rem;
        }

        .homepage-section-runnumber-501__text-content {
            text-align: center;
            overflow: visible;
        }

        .homepage-section-runnumber-501__container {
            padding: 0 1rem;
        }
    }

    @media (max-width: 576px) {
        .homepage-section-runnumber-501 {
            padding: 2rem 0;
        }

        .homepage-section-runnumber-501__number-value {
            font-size: 2rem;
        }

        .homepage-section-runnumber-501__number-item {
            padding: 1.2rem 1.5rem;
        }

        .homepage-section-runnumber-501__number-title {
            font-size: 1rem;
        }

        .homepage-section-runnumber-501__number-unit {
            font-size: 0.8rem;
        }

        .homepage-section-runnumber-501__numbers-grid {
            padding: 1.8rem 1rem;
        }
    }

    /* ========== 跑碼模塊502_二跑碼  ========== */

    /* 主容器  */
    .homepage-section-runnumber-502 {
        padding: 4rem 0;
    }

    .homepage-section-runnumber-502__container {
        display: flex;
        align-items: flex-start; /* 改為頂部對齊，方便控制高度 */
        max-width: 1200px;
        margin: 0 auto;
        gap: 3rem;
        padding: 0 2rem;
    }

    /* 文字區域 - 限制高度與數字區域相同 */
    .homepage-section-runnumber-502__text-section {
        flex: 1;
        max-width: 600px;
        /* 設定固定高度，與數字區域相同 */
        height: 110px; /* 對應數字區域調整後的高度 */
        overflow: hidden; /* 超出內容隱藏 */
        display: flex;
        align-items: flex-start; /* 改為頂部對齊，確保從頭開始顯示 */
    }

    .homepage-section-runnumber-502__text-section--left {
        order: 1;
    }

    .homepage-section-runnumber-502__text-section--right {
        order: 3;
    }

    .homepage-section-runnumber-502__text-content {
        line-height: 1.6;
        color: #333;
        width: 100%;
        /* 內容超出時隱藏，不顯示滾動條 */
        overflow: hidden;
        /* 確保從頂部開始顯示 */
        padding-top: 0;
        margin-top: 0;
    }

        .homepage-section-runnumber-502__text-content h1,
        .homepage-section-runnumber-502__text-content h2,
        .homepage-section-runnumber-502__text-content h3 {
            margin-bottom: 1rem;
            margin-top: 0; /* 確保標題從頂部開始 */
            font-weight: 700;
        }

        .homepage-section-runnumber-502__text-content p {
            margin-bottom: 1rem;
            margin-top: 0; /* 確保段落從頂部開始 */
            font-size: 1rem;
            line-height: 1.8;
        }

            .homepage-section-runnumber-502__text-content p:first-child,
            .homepage-section-runnumber-502__text-content h1:first-child,
            .homepage-section-runnumber-502__text-content h2:first-child,
            .homepage-section-runnumber-502__text-content h3:first-child {
                margin-top: 0; /* 第一個元素頂部無邊距 */
            }

    /* 數字區域容器 */
    .homepage-section-runnumber-502__numbers-section {
        flex: 2;
        order: 2;
    }

    .homepage-section-runnumber-502__numbers-grid {
        display: flex;
        justify-content: center;
        align-items: stretch;
        /* 移除白色背景，改為透明 */
        background: transparent;
        /* 移除邊框圓角 */
        border-radius: 0;
        /* 移除陰影 */
        box-shadow: none;
        /* 設定固定高度 */
        min-height: 110px;
        max-width: 600px; /* 從600px增加到750px (1.25倍) */
        margin: auto;
    }

    /* 單個數字項目 - 移除背景 + 加左右間距 */
    .homepage-section-runnumber-502__number-item {
        flex: 1;
        text-align: center;
        position: relative;
        transition: transform 0.2s ease;
        background: transparent;
        padding: 0 15px; /* PC 版每個格子左右間距 */
        display: flex;
        flex-direction: column;
    }

        /* 移除分隔線 */
        .homepage-section-runnumber-502__number-item:not(:last-child)::after {
            display: none;
        }

        .homepage-section-runnumber-502__number-item:hover {
            transform: translateY(-2px);
        }

    /* 數字顯示區域 */
    .homepage-section-runnumber-502__number-display {
        margin-bottom: 0.8rem;
        display: flex;
        align-items: baseline;
        justify-content: center;
        gap: 0.3rem;
    }

    .homepage-section-runnumber-502__number-value {
        font-size: 2.8rem;
        font-weight: 700;
        color: #ff4757;
        line-height: 1;
        transition: color 0.3s ease;
        text-wrap: nowrap;
    }

    .homepage-section-runnumber-502__number-unit {
        font-size: 0.85rem;
        color: #666;
        font-weight: 400;
        margin-top: 0.2rem;
        text-wrap: nowrap;
    }

    /* 數字標題 */
    .homepage-section-runnumber-502__number-title {
        font-size: 1rem;
        font-weight: 600;
        color: #333;
        line-height: 1.3;
        white-space: pre-line; /* 允許 \n 手動換行 */
        word-break: break-word; /* 太長自動換行 */
    }

    /* 空白項目樣式 */
    .homepage-section-runnumber-502__number-item--empty {
        opacity: 0.2;
        pointer-events: none;
    }

    /* 數字動畫效果的顏色變化 */
    .homepage-section-runnumber-502__number-item.animating .homepage-section-runnumber-502__number-value {
        color: #ff6b6b;
    }

    .homepage-section-runnumber-502__number-item.completed .homepage-section-runnumber-502__number-value {
        color: #ff4757;
    }

    /* 響應式設計 */
    @media (max-width: 1200px) {
        .homepage-section-runnumber-502__container {
            max-width: 100%;
            padding: 0 1.5rem;
            gap: 2rem;
        }
    }

    @media (max-width: 991px) {
        .homepage-section-runnumber-502 {
            padding: 3rem 0;
        }

        .homepage-section-runnumber-502__container {
            flex-direction: column;
            gap: 2rem;
            align-items: center; /* 垂直布局時居中對齊 */
        }

        .homepage-section-runnumber-502__text-section,
        .homepage-section-runnumber-502__numbers-section {
            max-width: 100%;
            order: initial !important;
        }

        .homepage-section-runnumber-502__text-section--left {
            order: 1 !important;
        }

        .homepage-section-runnumber-502__numbers-section {
            order: 2 !important;
        }

        .homepage-section-runnumber-502__text-section--right {
            order: 3 !important;
        }

        /* 手機版文字區域高度調整 */
        .homepage-section-runnumber-502__text-section {
            height: 110px;
            align-items: flex-start; /* 確保從頂部開始 */
        }

        .homepage-section-runnumber-502__numbers-section {
            max-width: 625px; /* 對應桌面版比例調整 (500px * 1.25) */
        }

        .homepage-section-runnumber-502__numbers-grid {
            padding: 1.9rem 1rem; /* 從1.5rem調整 (1.5 * 1.25 = 1.875，湊整為1.9rem) */
            min-height: 110px; /* 對應文字區域高度 */
        }

        .homepage-section-runnumber-502__number-value {
            font-size: 2.75rem; /* 從2.2rem調整 (2.2 * 1.25 = 2.75rem) */
        }

        .homepage-section-runnumber-502__number-item {
            padding: 1.25rem 1rem; /* 從1rem調整 (1 * 1.25 = 1.25rem) */
        }
    }

    @media (max-width: 768px) {
        .homepage-section-runnumber-502__numbers-grid {
            flex-direction: column;
            gap: 15px; /* 手機版每個格子上下間距 */
            padding: 2rem 1rem;
            min-height: auto; /* 垂直布局時不限制高度 */
        }

        .homepage-section-runnumber-502__number-item {
            padding: 1rem;
        }

            /* 手機版同樣不要分隔線 */
            .homepage-section-runnumber-502__number-item:not(:last-child)::after {
                display: none;
            }

        /* 手機版文字區域不限制高度 */
        .homepage-section-runnumber-502__text-section {
            height: auto;
            overflow: visible;
        }

        .homepage-section-runnumber-502__number-value {
            font-size: 2rem;
        }

        .homepage-section-runnumber-502__text-content {
            text-align: center;
            overflow: visible; /* 手機版允許顯示完整內容 */
        }

        .homepage-section-runnumber-502__container {
            padding: 0 1rem;
        }
    }

    @media (max-width: 576px) {
        .homepage-section-runnumber-502 {
            padding: 2rem 0;
        }

        .homepage-section-runnumber-502__number-value {
            font-size: 1.8rem;
        }

        .homepage-section-runnumber-502__number-item {
            padding: 0.8rem;
        }

        .homepage-section-runnumber-502__number-title {
            font-size: 0.9rem;
        }

        .homepage-section-runnumber-502__number-unit {
            font-size: 0.75rem;
        }

        .homepage-section-runnumber-502__numbers-grid {
            padding: 1.5rem 0.8rem;
        }
    }

    /* ========== 跑碼模塊503_三跑碼  ========== */

    /* 主容器  */
    .homepage-section-runnumber-503 {
        padding: 4rem 0;
    }

    .homepage-section-runnumber-503__container {
        display: flex;
        align-items: flex-start; /* 改為頂部對齊，方便控制高度 */
        max-width: 1200px;
        margin: 0 auto;
        gap: 3rem;
        padding: 0 2rem;
    }

    /* 文字區域 - 限制高度與數字區域相同 */
    .homepage-section-runnumber-503__text-section {
        flex: 1;
        max-width: 400px;
        /* 設定固定高度，與數字區域相同 */
        height: 110px; /* 對應數字區域調整後的高度 */
        overflow: hidden; /* 超出內容隱藏 */
        display: flex;
        align-items: flex-start; /* 改為頂部對齊，確保從頭開始顯示 */
    }

    .homepage-section-runnumber-503__text-section--left {
        order: 1;
    }

    .homepage-section-runnumber-503__text-section--right {
        order: 3;
    }

    .homepage-section-runnumber-503__text-content {
        line-height: 1.6;
        color: #333;
        width: 100%;
        /* 內容超出時隱藏，不顯示滾動條 */
        overflow: hidden;
        /* 確保從頂部開始顯示 */
        margin-top: 0;
        padding-top: 0;
    }

        .homepage-section-runnumber-503__text-content h1,
        .homepage-section-runnumber-503__text-content h2,
        .homepage-section-runnumber-503__text-content h3 {
            margin-bottom: 1rem;
            margin-top: 0; /* 確保標題從頂部開始 */
            font-weight: 700;
        }

        .homepage-section-runnumber-503__text-content p {
            margin-bottom: 1rem;
            margin-top: 0; /* 確保段落從頂部開始 */
            font-size: 1rem;
            line-height: 1.8;
        }

            .homepage-section-runnumber-503__text-content p:first-child,
            .homepage-section-runnumber-503__text-content h1:first-child,
            .homepage-section-runnumber-503__text-content h2:first-child,
            .homepage-section-runnumber-503__text-content h3:first-child {
                margin-top: 0; /* 第一個元素頂部無邊距 */
            }

    /* 數字區域容器 */
    .homepage-section-runnumber-503__numbers-section {
        flex: 2;
        order: 2;
    }

    .homepage-section-runnumber-503__numbers-grid {
        display: flex;
        justify-content: center;
        align-items: stretch;
        /* 移除白色背景，改為透明 */
        background: transparent;
        /* 移除邊框圓角 */
        border-radius: 0;
        /* 移除陰影 */
        box-shadow: none;
        /* 設定固定高度 */
        min-height: 110px;
        max-width: 600px; /* 從600px增加到750px (1.25倍) */
        margin: auto;
    }

    /* 單個數字項目 - 移除背景 + 加左右間距 */
    .homepage-section-runnumber-503__number-item {
        flex: 1;
        text-align: center;
        position: relative;
        transition: transform 0.2s ease;
        background: transparent;
        padding: 0 15px; /* PC 版每個格子左右間距 */
        display: flex;
        flex-direction: column;
    }

        /* 移除分隔線 */
        .homepage-section-runnumber-503__number-item:not(:last-child)::after {
            display: none;
        }

        .homepage-section-runnumber-503__number-item:hover {
            transform: translateY(-2px);
        }

    /* 數字顯示區域 */
    .homepage-section-runnumber-503__number-display {
        margin-bottom: 0.8rem;
        display: flex;
        align-items: baseline;
        justify-content: center;
        gap: 0.3rem;
    }

    .homepage-section-runnumber-503__number-value {
        font-size: 2.8rem;
        font-weight: 700;
        color: #ff4757;
        line-height: 1;
        transition: color 0.3s ease;
        text-wrap: nowrap;
    }

    .homepage-section-runnumber-503__number-unit {
        font-size: 0.85rem;
        color: #666;
        font-weight: 400;
        margin-top: 0.2rem;
        text-wrap: nowrap;
    }

    /* 數字標題 */
    .homepage-section-runnumber-503__number-title {
        font-size: 1rem;
        font-weight: 600;
        color: #333;
        line-height: 1.3;
        white-space: pre-line; /* 允許 \n 手動換行 */
        word-break: break-word; /* 太長自動換行 */
    }

    /* 空白項目樣式 */
    .homepage-section-runnumber-503__number-item--empty {
        opacity: 0.2;
        pointer-events: none;
    }

    /* 數字動畫效果的顏色變化 */
    .homepage-section-runnumber-503__number-item.animating .homepage-section-runnumber-503__number-value {
        color: #ff6b6b;
    }

    .homepage-section-runnumber-503__number-item.completed .homepage-section-runnumber-503__number-value {
        color: #ff4757;
    }

    /* 響應式設計 */
    @media (max-width: 1200px) {
        .homepage-section-runnumber-503__container {
            max-width: 100%;
            padding: 0 1.5rem;
            gap: 2rem;
        }
    }

    @media (max-width: 991px) {
        .homepage-section-runnumber-503 {
            padding: 3rem 0;
        }

        .homepage-section-runnumber-503__container {
            flex-direction: column;
            gap: 2rem;
            align-items: center; /* 垂直布局時居中對齊 */
        }

        .homepage-section-runnumber-503__text-section,
        .homepage-section-runnumber-503__numbers-section {
            max-width: 100%;
            order: initial !important;
        }

        .homepage-section-runnumber-503__text-section--left {
            order: 1 !important;
        }

        .homepage-section-runnumber-503__numbers-section {
            order: 2 !important;
        }

        .homepage-section-runnumber-503__text-section--right {
            order: 3 !important;
        }

        /* 手機版文字區域高度調整 */
        .homepage-section-runnumber-503__text-section {
            height: 110px;
            align-items: flex-start; /* 確保從頂部開始 */
        }

        .homepage-section-runnumber-503__numbers-section {
            max-width: 625px; /* 對應桌面版比例調整 (500px * 1.25) */
        }

        .homepage-section-runnumber-503__numbers-grid {
            padding: 1.9rem 1rem; /* 從1.5rem調整 (1.5 * 1.25 = 1.875，湊整為1.9rem) */
            min-height: 110px; /* 對應文字區域高度 */
        }

        .homepage-section-runnumber-503__number-value {
            font-size: 2.75rem; /* 從2.2rem調整 (2.2 * 1.25 = 2.75rem) */
        }

        .homepage-section-runnumber-503__number-item {
            padding: 1.25rem 1rem; /* 從1rem調整 (1 * 1.25 = 1.25rem) */
        }
    }

    @media (max-width: 768px) {
        .homepage-section-runnumber-503__numbers-grid {
            flex-direction: column;
            gap: 15px; /* 手機版每個格子上下間距 */
            padding: 2rem 1rem;
            min-height: auto; /* 垂直布局時不限制高度 */
        }

        .homepage-section-runnumber-503__number-item {
            padding: 1rem;
        }

            /* 手機版同樣不要分隔線 */
            .homepage-section-runnumber-503__number-item:not(:last-child)::after {
                display: none;
            }

        /* 手機版文字區域不限制高度 */
        .homepage-section-runnumber-503__text-section {
            height: auto;
            overflow: visible;
        }

        .homepage-section-runnumber-503__number-value {
            font-size: 2rem;
        }

        .homepage-section-runnumber-503__text-content {
            text-align: center;
            overflow: visible; /* 手機版允許顯示完整內容 */
        }

        .homepage-section-runnumber-503__container {
            padding: 0 1rem;
        }
    }

    @media (max-width: 576px) {
        .homepage-section-runnumber-503 {
            padding: 2rem 0;
        }

        .homepage-section-runnumber-503__number-value {
            font-size: 1.8rem;
        }

        .homepage-section-runnumber-503__number-item {
            padding: 0.8rem;
        }

        .homepage-section-runnumber-503__number-title {
            font-size: 0.9rem;
        }

        .homepage-section-runnumber-503__number-unit {
            font-size: 0.75rem;
        }

        .homepage-section-runnumber-503__numbers-grid {
            padding: 1.5rem 0.8rem;
        }
    }

    /* ========== 文框模塊601_豎文框欄 ========== */
    .homepage-section-verticalword-601 {
        padding: 2rem 0;
        width: 100%;
    }

    .homepage-section-verticalword-601__grid {
        display: grid;
        gap: 1.5rem;
        width: 100%;
    }

    /* 根據文框數量調整欄數 */
    .homepage-section-verticalword-601__grid--count-1 {
        grid-template-columns: 1fr;
    }

    .homepage-section-verticalword-601__grid--count-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .homepage-section-verticalword-601__grid--count-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .homepage-section-verticalword-601__grid--count-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .homepage-section-verticalword-601__item {
        border-radius: 12px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        overflow: hidden;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

        .homepage-section-verticalword-601__item:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
        }

    .homepage-section-verticalword-601__content {
        padding: 2rem;
        height: 100%;
    }

        /* 編輯器放進來的圖片／影片／表格不可撐破卡片（2026-09-30 回饋：原圖過大被卡片 overflow 切掉、右側內距消失）→ 最大寬＝內容區寬、高度等比例 */
        .homepage-section-verticalword-601__content img,
        .homepage-section-verticalword-601__content video,
        .homepage-section-verticalword-601__content iframe {
            max-width: 100%;
            height: auto;
        }

        .homepage-section-verticalword-601__content table {
            max-width: 100%;
        }

        /* 內容區域的基本文字樣式 */
        .homepage-section-verticalword-601__content h1,
        .homepage-section-verticalword-601__content h2,
        .homepage-section-verticalword-601__content h3,
        .homepage-section-verticalword-601__content h4,
        .homepage-section-verticalword-601__content h5,
        .homepage-section-verticalword-601__content h6 {
            margin-bottom: 1rem;
            line-height: 1.4;
        }

        .homepage-section-verticalword-601__content p {
            margin-bottom: 0.8rem;
            line-height: 1.8;
        }

        .homepage-section-verticalword-601__content ul,
        .homepage-section-verticalword-601__content ol {
            margin-bottom: 1rem;
            padding-left: 1.5rem;
        }

        .homepage-section-verticalword-601__content li {
            margin-bottom: 0.5rem;
            line-height: 1.6;
        }

        /* 按鈕樣式（如果 HTML 內容中有按鈕） */
        .homepage-section-verticalword-601__content a.btn,
        .homepage-section-verticalword-601__content .button {
            display: inline-block;
            padding: 0.8rem 1.5rem;
            border-radius: 8px;
            text-decoration: none;
            transition: all 0.3s ease;
            margin-top: 1rem;
        }

    /* 響應式設計 */
    @media (max-width: 1200px) {
        .homepage-section-verticalword-601__grid--count-4 {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media (max-width: 991px) {
        .homepage-section-verticalword-601__grid--count-3,
        .homepage-section-verticalword-601__grid--count-4 {
            grid-template-columns: repeat(2, 1fr);
        }

        .homepage-section-verticalword-601__content {
            padding: 1.5rem;
        }
    }

    @media (max-width: 576px) {
        .homepage-section-verticalword-601__grid--count-2,
        .homepage-section-verticalword-601__grid--count-3,
        .homepage-section-verticalword-601__grid--count-4 {
            grid-template-columns: 1fr;
        }

        .homepage-section-verticalword-601__content {
            padding: 1.2rem;
        }

        .homepage-section-verticalword-601 {
            padding: 1.5rem 0;
        }
    }

    /* ========== 純文字欄位支援手動換行（圖文模塊 301~311） ========== */
    [class*="homepage-section-imagetext-"][class*="__title"]:not([class*="__title-"]),
    [class*="homepage-section-imagetext-"][class*="__text"]:not([class*="__text-"]),
    [class*="homepage-section-imagetext-"][class*="__overlay-title"],
    [class*="homepage-section-imagetext-"][class*="__overlay-text"],
    [class*="homepage-section-imagetext-"][class*="__mobile-title"],
    [class*="homepage-section-imagetext-"][class*="__mobile-text"] {
        white-space: pre-line;
    }

    /* ========== 區段分隔模塊 901 ========== */
    .homepage-section-divider {
        width: 100%;
        background: transparent;
    }

    /* ========== 未知模塊 ========== */
    .homepage-section-unknown {
        padding: 2rem;
        text-align: center;
        background-color: #f8f9fa;
        border: 2px dashed #dee2e6;
        border-radius: 12px;
        color: #6c757d;
    }

    /* ========== 響應式設計 ========== */
    @media (max-width: 1200px) {
        .homepage-section--container {
            max-width: 1140px;
        }

        .homepage-section-imagetext-one-five-top__grid {
            grid-template-columns: 2fr 1fr;
            grid-template-rows: repeat(3, auto);
        }

        .homepage-section-imagetext-two-ten-top__grid {
            grid-template-columns: repeat(4, 1fr);
        }
    }

    @media (max-width: 992px) {
        .homepage-section--container {
            max-width: 960px;
            padding: 0 12px;
        }

        .homepage-section-imagetext-three-top__grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .homepage-section-imagetext-one-two-top__grid {
            grid-template-columns: 1fr 1fr;
        }

            .homepage-section-imagetext-one-two-top__grid .homepage-section-imagetext__item:first-child {
                grid-row: span 1;
                grid-column: span 2;
            }
    }

    @media (max-width: 991px) {
        .homepage-section--container {
            max-width: 720px;
            padding: 0 10px;
        }

        /* 標題間距 - 平板版 */
        .homepage-section__title {
            margin-top: 1.5rem;
        }

        .homepage-section__title--center {
            font-size: 2rem;
        }

        .homepage-section__subtitle--center {
            font-size: 1.25rem;
        }

        .homepage-section-imagetext-left-image,
        .homepage-section-imagetext-left-text {
            grid-template-columns: minmax(0, 1fr);
            gap: 1rem;
        }

        .homepage-section-imagetext-three-top__grid,
        .homepage-section-imagetext-one-two-top__grid {
            grid-template-columns: 1fr;
        }

            .homepage-section-imagetext-one-two-top__grid .homepage-section-imagetext__item:first-child {
                grid-row: span 1;
                grid-column: span 1;
            }

        .homepage-section-imagetext-one-five-top__grid,
        .homepage-section-imagetext-two-ten-top__grid {
            grid-template-columns: repeat(2, 1fr);
        }

            .homepage-section-imagetext-one-five-top__grid .homepage-section-imagetext__item:first-child,
            .homepage-section-imagetext-two-ten-top__grid .homepage-section-imagetext__item:nth-child(1),
            .homepage-section-imagetext-two-ten-top__grid .homepage-section-imagetext__item:nth-child(2) {
                grid-column: span 1;
                grid-row: span 1;
            }

        .homepage-section-product-slider__grid,
        .homepage-section-news-slider__grid {
            gap: 1rem;
        }

        .homepage-section-product__item,
        .homepage-section-news__item {
            min-width: 220px;
        }

        .homepage-section-product,
        .homepage-section-news,
        .homepage-section-imagetext {
            padding: 2rem 0;
        }

        .homepage-section-map__iframe {
            height: 300px;
        }
    }

    @media (max-width: 576px) {
        .homepage-section--container {
            padding: 0 8px;
        }

        /* 標題間距 - 手機版 */
        .homepage-section__title {
            margin-top: 1.5rem;
        }

        .homepage-section__title--center {
            font-size: 1.5rem;
        }

        .homepage-section__subtitle--center {
            font-size: 1rem;
        }

        .homepage-section-imagetext-six-top__grid,
        .homepage-section-imagetext-one-five-top__grid,
        .homepage-section-imagetext-two-ten-top__grid {
            grid-template-columns: 1fr;
        }

        .homepage-section-product__item,
        .homepage-section-news__item {
            min-width: 200px;
            padding: 1rem;
        }

        .homepage-section-product,
        .homepage-section-news,
        .homepage-section-imagetext,
        .homepage-section-examplestrip {
            padding: 1.5rem 0;
        }

        .homepage-section-map__iframe {
            height: 250px;
        }

        .homepage-section-carousel__controls {
            bottom: 10px;
        }

        .homepage-section-carousel__dot {
            width: 10px;
            height: 10px;
        }
    }

    /* ========== 可訪問性和互動增強 ========== */
    .homepage-section-imagetext__item a,
    .homepage-section-carousel__slide a {
        text-decoration: none;
        color: inherit;
        display: block;
    }

        .homepage-section-imagetext__item a:focus,
        .homepage-section-carousel__slide a:focus {
            outline: 2px solid #007bff;
            outline-offset: 2px;
        }

    .homepage-section-carousel__dot:focus {
        outline: 2px solid #007bff;
        outline-offset: 2px;
    }

    /* ========== 載入動畫 ========== */
    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(30px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .homepage-section {
        animation: fadeInUp 0.6s ease-out;
    }

    /* ========== 列印樣式 ========== */
    @media print {
        .homepage-section-carousel__controls {
            display: none;
        }

        .homepage-section-carousel__slide {
            display: block !important;
            page-break-inside: avoid;
        }

        .homepage-section {
            animation: none;
        }
    }


    /* ========== QA模塊 701 ========== */
    /* CSS 變數（使用者可設定）：--qa-icon-bg、--qa-icon-color */

    .homepage-section-qa-701 {
        width: 100%;
        max-width: 1320px;
        margin: 0 auto;
        padding: 2rem 15px; /* 2026-09-30 回饋：補上下留白（通用標題只有上留白，其他模塊容器各自有垂直留白，701 原為 0 → 標題貼著第一題） */
        box-sizing: border-box;
    }

    .homepage-section-qa-701__accordion {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .homepage-section-qa-701__item {
        border: 1px solid #e8e8e8;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
        transition: box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .homepage-section-qa-701__item:hover {
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
        border-color: #d0d0d0;
    }

    .homepage-section-qa-701__item.is-open {
        border-color: #d0d0d0;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    }

    .homepage-section-qa-701__header {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 16px 20px;
        border: none;
        background: #fafafa;
        cursor: pointer;
        text-align: left;
        gap: 14px;
        font-size: 16px;
        line-height: 1.5;
        transition: background-color 0.2s ease;
        box-sizing: border-box;
    }

    .homepage-section-qa-701__item.is-open .homepage-section-qa-701__header {
        background: #f5f5f5;
    }

    .homepage-section-qa-701__header:hover {
        background: #f0f0f0;
    }

    .homepage-section-qa-701__icon {
        flex-shrink: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        border-radius: 50%;
        background: var(--qa-icon-bg, #4CAF50);
        color: var(--qa-icon-color, #fff);
        font-size: 14px;
        font-weight: 700;
    }

    .homepage-section-qa-701__question {
        flex: 1;
        font-weight: 600;
        color: #333;
    }

    .homepage-section-qa-701__arrow {
        flex-shrink: 0;
        transition: transform 0.3s ease;
        color: #bbb;
        font-size: 14px;
    }

    .homepage-section-qa-701__item.is-open .homepage-section-qa-701__arrow {
        transform: rotate(180deg);
        color: #888;
    }

    .homepage-section-qa-701__body {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease;
        background: #fff;
    }

    .homepage-section-qa-701__item.is-open .homepage-section-qa-701__body {
        max-height: 2000px;
    }

    .homepage-section-qa-701__answer {
        padding: 16px 20px 20px;
        border-top: 1px solid #f0f0f0;
        color: #555;
        font-size: 15px;
        line-height: 1.8;
        word-break: break-word;
    }

    .homepage-section-qa-701__answer img {
        max-width: 100%;
        height: auto;
    }

    .homepage-section-qa-701__answer p {
        margin: 0 0 8px;
    }

    /* 手機版 */
    @media (max-width: 768px) {
        .homepage-section-qa-701 {
            padding: 0 10px;
        }

        .homepage-section-qa-701__header {
            padding: 14px 16px;
            font-size: 15px;
            gap: 10px;
        }

        .homepage-section-qa-701__icon {
            width: 30px;
            height: 30px;
            font-size: 12px;
        }

        .homepage-section-qa-701__answer {
            padding: 14px 16px 16px;
            font-size: 14px;
        }
    }


    /* ========== 站內標籤模塊 702 ========== */

    .homepage-section-sitetag-702 {
        width: 100%;
        max-width: 900px;
        margin: 0 auto;
        padding: 24px 15px;
        box-sizing: border-box;
    }

    /* 專用小標題：── 探索主題 ── */
    .homepage-section-sitetag-702__subtitle {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 16px;
        margin-bottom: 20px;
    }

    .homepage-section-sitetag-702__subtitle::before,
    .homepage-section-sitetag-702__subtitle::after {
        content: '';
        height: 1px;
        width: 48px;
        background: #d0d0d0;
    }

    .homepage-section-sitetag-702__subtitle span {
        font-size: 18px;
        font-weight: 500;
        color: #777;
        letter-spacing: 1px;
        white-space: nowrap;
    }

    /* 標籤群 */
    .homepage-section-sitetag-702__tags {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }

    .homepage-section-sitetag-702__tag {
        display: inline-block;
        padding: 10px 26px;
        font-size: 18px;
        color: #555;
        background: #f8f8f8;
        border: 1px solid #e0e0e0;
        border-radius: 24px;
        text-decoration: none;
        transition: all 0.25s ease;
    }

    .homepage-section-sitetag-702__tag:hover {
        background: #e8f5e9;
        border-color: #4CAF50;
        color: #2e7d32;
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(76, 175, 80, 0.15);
    }

    @media (max-width: 576px) {
        .homepage-section-sitetag-702 {
            padding: 20px 10px;
        }

        .homepage-section-sitetag-702__subtitle {
            gap: 12px;
            margin-bottom: 16px;
        }

        .homepage-section-sitetag-702__subtitle::before,
        .homepage-section-sitetag-702__subtitle::after {
            width: 32px;
        }

        .homepage-section-sitetag-702__subtitle span {
            font-size: 21px;
        }

        .homepage-section-sitetag-702__tags {
            gap: 8px;
        }

        .homepage-section-sitetag-702__tag {
            padding: 9px 24px;
            font-size: 21px;
        }
    }


    /* ========== 廣告模塊 801 ========== */

    /* 佔位 marker（不佔版面空間）*/
    .homepage-section-ad-marker {
        height: 0;
        overflow: hidden;
        margin: 0;
        padding: 0;
    }

    /* fixed overlay 容器 */
    .homepage-section-ad-overlay {
        position: fixed;
        z-index: 9990;
        max-width: 500px;
        max-height: 500px;
        background: #fff;
        border-radius: 8px;
        box-shadow: 0 4px 24px rgba(0,0,0,0.18);
        overflow: visible;
        display: none;
        animation: adFadeIn 0.3s ease;
    }

    .homepage-section-ad-overlay.active {
        display: block;
    }

    @keyframes adFadeIn {
        from { opacity: 0; transform: scale(0.95); }
        to { opacity: 1; transform: scale(1); }
    }

    /* 位置：電腦版 */
    .homepage-section-ad-overlay--top-left { top: 20px; left: 20px; }
    .homepage-section-ad-overlay--top-right { top: 20px; right: 20px; }
    .homepage-section-ad-overlay--center { top: 50%; left: 50%; transform: translate(-50%, -50%); }
    .homepage-section-ad-overlay--center.active { animation: adFadeInCenter 0.3s ease; }
    @keyframes adFadeInCenter {
        from { opacity: 0; transform: translate(-50%, -50%) scale(0.95); }
        to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    }
    .homepage-section-ad-overlay--bottom-left { bottom: 20px; left: 20px; }
    .homepage-section-ad-overlay--bottom-right { bottom: 20px; right: 20px; }

    /* 位置：手機版（左上/右上→上方置中、正中間→中間、左下/右下→下方置中）*/
    @media (max-width: 991px) {
        .homepage-section-ad-overlay--top-left,
        .homepage-section-ad-overlay--top-right {
            top: 10px; left: 50%; right: auto; transform: translateX(-50%);
        }
        .homepage-section-ad-overlay--center {
            top: 50%; left: 50%; transform: translate(-50%, -50%);
        }
        .homepage-section-ad-overlay--bottom-left,
        .homepage-section-ad-overlay--bottom-right {
            bottom: 10px; left: 50%; right: auto; top: auto; transform: translateX(-50%);
        }
        .homepage-section-ad-overlay {
            max-width: calc(100vw - 20px);
        }
    }

    /* 關閉按鈕（中心點在廣告框右上角角落）*/
    .homepage-section-ad-overlay__close {
        position: absolute;
        top: -14px;
        right: -14px;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        background: rgba(0,0,0,0.5);
        color: #fff;
        border: none;
        font-size: 16px;
        line-height: 28px;
        text-align: center;
        cursor: pointer;
        z-index: 10;
        transition: background 0.2s;
    }

    .homepage-section-ad-overlay__close:hover {
        background: rgba(0,0,0,0.8);
    }

    /* 內容區 */
    .homepage-section-ad-overlay__content {
        position: relative;
        max-width: 500px;
        max-height: 500px;
        overflow: hidden;
        border-radius: 8px;
    }

    /* 圖片 */
    .homepage-section-ad-overlay__image {
        display: block;
        max-width: 500px;
        max-height: 500px;
        width: auto;
        height: auto;
        object-fit: contain;
    }

    /* 影片 */
    .homepage-section-ad-overlay__video-wrapper {
        position: relative;
        width: 500px;
        max-width: 100%;
        aspect-ratio: 16 / 9;
    }

    .homepage-section-ad-overlay__video-wrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0;
    }

    /* 文字 */
    .homepage-section-ad-overlay__text {
        padding: 16px;
        max-height: 460px;
        overflow: auto;
        line-height: 1.6;
    }

    /* 按鈕 */
    .homepage-section-ad-overlay__button-area {
        padding: 8px 16px 12px;
        text-align: right;
    }

    .homepage-section-ad-overlay__button {
        display: inline-block;
        padding: 6px 16px;
        background: #007bff;
        color: #fff;
        border: none;
        border-radius: 4px;
        font-size: 14px;
        text-decoration: none;
        cursor: pointer;
        transition: background 0.2s;
    }

    .homepage-section-ad-overlay__button:hover {
        background: #0056b3;
        color: #fff;
        text-decoration: none;
    }


    /* ========== 模塊編輯按鈕（小齒輪）========== */

    .homepage-section__edit-button {
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 999;
    }

    .homepage-section__edit-gear {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.8);
        border: none;
        color: #ffffff;
        font-size: 18px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    }

        .homepage-section__edit-gear:hover {
            background: rgba(0, 0, 0, 0.95);
            transform: rotate(90deg);
        }

    /* 當滑鼠移到整個模塊上時，齒輪變更透明 */
    .homepage-section:hover .homepage-section__edit-gear {
        background: rgba(0, 0, 0, 0.2);
    }

        .homepage-section:hover .homepage-section__edit-gear:hover {
            background: rgba(0, 0, 0, 0.95);
        }

    /* 下拉選單 */
    .homepage-section__edit-menu {
        position: absolute;
        top: 50px;
        right: 0;
        background: #ffffff;
        border-radius: 8px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
        min-width: 160px;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        transition: all 0.3s ease;
        overflow: hidden;
    }

        .homepage-section__edit-menu.active {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

    .homepage-section__edit-menu-item {
        width: 100%;
        padding: 12px 16px;
        border: none;
        background: #ffffff;
        color: #333333;
        text-align: left;
        cursor: pointer;
        transition: background 0.2s ease;
        font-size: 14px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

        .homepage-section__edit-menu-item:hover {
            background: #f5f5f5;
        }

    .homepage-section__edit-menu-item--delete {
        color: #dc3545;
    }

        .homepage-section__edit-menu-item--delete:hover {
            background: #fff5f5;
        }

    .homepage-section__edit-menu-item i {
        font-size: 14px;
        width: 16px;
        text-align: center;
    }

/* ===== 純圖區塊1001_範例圖條 ===== */
.homepage-section-examplestrip {
    position: relative;
    overflow: hidden;
    padding: 2rem 0;
}

.homepage-section-examplestrip__fade {
    position: absolute;
    top: 0;
    width: 15%;
    height: 100%;
    z-index: 5;
    pointer-events: none;
}

.homepage-section-examplestrip__fade--left {
    left: 0;
    background: linear-gradient(to right, var(--es-fade-color, #ffffff), transparent);
}

.homepage-section-examplestrip__fade--right {
    right: 0;
    background: linear-gradient(to left, var(--es-fade-color, #ffffff), transparent);
}

.homepage-section-examplestrip__row {
    height: 8.3vw;
    overflow: hidden;
    margin-bottom: 24px;
}

    .homepage-section-examplestrip__row:last-child {
        margin-bottom: 0;
    }

.homepage-section-examplestrip__viewport {
    height: 100%;
}

.homepage-section-examplestrip__viewport--mb {
    display: none;
}

.homepage-section-examplestrip__track {
    display: flex;
    gap: 8px;
    height: 100%;
    transform: translateX(0);
}

.homepage-section-examplestrip__item {
    flex: 0 0 14vw;
    width: 14vw;
    height: 100%;
}

.homepage-section-examplestrip__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    display: block;
}

/* 靜態錯位：奇數圖條淡（1、3），偶數圖條錯位（2、4）；不透明度改由後台設定（--es-odd-opacity／--es-even-opacity），預設值同原寫死 0.6／1 */
.homepage-section-examplestrip__row--odd .homepage-section-examplestrip__track {
    opacity: var(--es-odd-opacity, 0.6);
}

.homepage-section-examplestrip__row--even .homepage-section-examplestrip__track {
    opacity: var(--es-even-opacity, 1);
}

.homepage-section-examplestrip:not(.homepage-section-examplestrip--animate) .homepage-section-examplestrip__row--even .homepage-section-examplestrip__track {
    transform: translateX(-6vw);
}

/* 手機版（<=991px）：切換 MB 圖組、加寬每張圖 */
@media (max-width: 991px) {
    .homepage-section-examplestrip__viewport--pc {
        display: none;
    }

    .homepage-section-examplestrip__viewport--mb {
        display: block;
    }

    .homepage-section-examplestrip__row {
        height: 18vw;
        margin-bottom: 12px;
    }

    .homepage-section-examplestrip__item {
        flex: 0 0 30vw;
        width: 30vw;
    }

    .homepage-section-examplestrip:not(.homepage-section-examplestrip--animate) .homepage-section-examplestrip__row--even .homepage-section-examplestrip__track {
        transform: translateX(-12vw);
    }
}

/* ===== 影片區塊1101_橫幅影片 ===== */
.homepage-section-video {
    width: 100%;
    line-height: 0;
}

.homepage-section-video__player {
    width: 100%;
    height: 80vh;
    object-fit: cover;
    display: block;
    background: #000;
    pointer-events: none; /* 純裝飾、完全不可互動（右鍵/暫停/PiP/下載皆不可） */
}

/* 手機版：影片寬>高，改自動高度依比例顯示（不裁切） */
@media (max-width: 991px) {
    .homepage-section-video__player {
        height: auto;
    }
}

/* ===== 影片區塊1102_三短影片 ===== */
.homepage-section-threevideo {
    display: grid;
    grid-template-columns: repeat(3, 300px);
    gap: 2rem;
    justify-content: center;
    padding: 2rem 16px;
    box-sizing: border-box;
}

/* 依實際顯示支數調整欄數，固定卡寬、置中（1~3 支大小一致） */
.homepage-section-threevideo[data-count="1"] {
    grid-template-columns: repeat(1, 300px);
}

.homepage-section-threevideo[data-count="2"] {
    grid-template-columns: repeat(2, 300px);
}

.homepage-section-threevideo__item {
    line-height: 0;
}

.homepage-section-threevideo__player {
    width: 100%;
    aspect-ratio: 9 / 16; /* 直版 Shorts 比例 */
    object-fit: cover;
    display: block;
    background: #000;
    border-radius: 8px;
    pointer-events: none; /* 純裝飾、完全不可互動（右鍵/暫停/PiP/下載皆不可） */
}

/* 手機版：三卡改單欄往下堆疊，每卡仍 9:16 */
@media (max-width: 991px) {
    .homepage-section-threevideo,
    .homepage-section-threevideo[data-count="1"],
    .homepage-section-threevideo[data-count="2"] {
        grid-template-columns: minmax(0, 1fr);
        max-width: 400px;
        margin: 0 auto;
        gap: 1.5rem;
        padding: 1.5rem 16px;
    }
}

/* ===== 目的按鈕區塊1301_橫幅（對齊靠左/置中/靠右由欄位控制） ===== */
/* 以按鈕為主體的橫幅式模塊：無自帶圖，視覺靠通用背景（背景色/背景圖/窗景式）；按鈕色彙用 per-button CSS 變數 --pb-main / --pb-text / --pb-hover-bg / --pb-hover-text */
.homepage-section-purpose-button {
    width: 100%;
    box-sizing: border-box;
    padding: 72px 0; /* 水平寬度交由通用外層治理（--container 1320 / --fullwidth） */
    display: flex;
}

/* 滿版時保留 15px 安全留白（按鈕/搜尋類內容不宜貼齊螢幕邊）；不滿版由 --container 自帶的左右 padding 處理（1301/1302/1401/1402 共用） */
.homepage-section--fullwidth .homepage-section-purpose-button,
.homepage-section--fullwidth .homepage-section-purpose-image,
.homepage-section--fullwidth .homepage-section-site-search {
    padding-left: 15px;
    padding-right: 15px;
}

.homepage-section-purpose-button--left {
    justify-content: flex-start;
    text-align: left;
}

.homepage-section-purpose-button--center {
    justify-content: center;
    text-align: center;
}

.homepage-section-purpose-button--right {
    justify-content: flex-end;
    text-align: right;
}

.homepage-section-purpose-button__content {
    max-width: 620px; /* 左/右版約佔半邊，另一半留給背景視覺 */
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.homepage-section-purpose-button__title {
    margin: 0;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.25;
}

.homepage-section-purpose-button__subtitle {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 500;
    line-height: 1.5;
}

.homepage-section-purpose-button__text {
    font-size: 1rem;
    line-height: 1.7;
}

.homepage-section-purpose-button__text-line {
    display: block;
}

.homepage-section-purpose-button__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 8px;
}

.homepage-section-purpose-button--center .homepage-section-purpose-button__buttons {
    justify-content: center;
}

.homepage-section-purpose-button--right .homepage-section-purpose-button__buttons {
    justify-content: flex-end;
}

.homepage-section-purpose-button__btn {
    display: inline-block;
    padding: 12px 28px;
    border: 2px solid var(--pb-main, #333333);
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.homepage-section-purpose-button__btn--solid {
    background-color: var(--pb-main, #333333);
    color: var(--pb-text, #ffffff);
}

.homepage-section-purpose-button__btn--outline {
    background-color: transparent;
    color: var(--pb-text, #333333);
}

/* hover 色由後台每顆按鈕自行設定（Hover背景色/Hover文字色），實心與外框同規則 */
.homepage-section-purpose-button__btn--solid:hover,
.homepage-section-purpose-button__btn--outline:hover {
    background-color: var(--pb-hover-bg, #555555);
    border-color: var(--pb-hover-bg, #555555);
    color: var(--pb-hover-text, #ffffff);
}

span.homepage-section-purpose-button__btn {
    cursor: default; /* 未設連結時同樣式但不可點 */
}

.homepage-section-purpose-button__placeholder {
    width: 100%;
    padding: 24px;
    border: 1px dashed #bbb;
    border-radius: 8px;
    color: #888;
    font-size: 0.95rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.6);
}

@media (max-width: 991px) {
    .homepage-section-purpose-button {
        padding: 56px 0;
    }

    .homepage-section-purpose-button__title {
        font-size: 2rem;
    }
}

@media (max-width: 576px) {
    .homepage-section-purpose-button {
        padding: 40px 0;
    }

    .homepage-section-purpose-button__content {
        max-width: 100%;
    }

    .homepage-section-purpose-button__title {
        font-size: 1.6rem;
    }

    .homepage-section-purpose-button__subtitle {
        font-size: 1.05rem;
    }

    .homepage-section-purpose-button__btn {
        padding: 11px 22px;
        font-size: 0.95rem;
    }
}

/* ===== 目的按鈕區塊1302_六圖橫幅（六小圖＋單顆按鈕；按鈕位置左/中/右由欄位控制；文字與按鈕沿用 purpose-button 的元素樣式與 --pb 變數） ===== */
.homepage-section-purpose-image {
    width: 100%;
    box-sizing: border-box;
    padding: 64px 0; /* 水平寬度交由通用外層治理；滿版 15px 留白見 purpose-button 段共用規則 */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 48px;
}

/* 本區塊 display:flex 與全站 PCOnly/MobileOnly（同權重、本檔較晚載入）互蓋 → 用組合選擇器明確分流，斷點對齊全站 991 */
@media (min-width: 992px) {
    .homepage-section-purpose-image.MobileOnly {
        display: none;
    }
}

@media (max-width: 991px) {
    .homepage-section-purpose-image.PCOnly {
        display: none;
    }
}

/* 電腦版一排式：六圖與按鈕同一橫排（6欄×1列）；置中版側翼＝各 3 張橫排 */
.homepage-section-purpose-image__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
    flex: 1 1 auto;
    min-width: 0;
}

.homepage-section-purpose-image__grid--side {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    flex: 1 1 0; /* 基準歸零強制左右側翼均分寬度，避免依圖片固有寬分配造成一側偏小 */
}

.homepage-section-purpose-image__item {
    display: block;
    line-height: 0;
}

.homepage-section-purpose-image__img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 8px;
    display: block;
}

/* ===== 目的按鈕區塊1303_多圖橫幅（2026-09-30）：左一排 3 或 4 張 2:1 橫圖（實測 3:2 太高改 4:2）＋右 CTA；圖區佔剩餘寬、CTA 固定最大 420px ===== */
.homepage-section-purpose-image__img--wide {
    aspect-ratio: 2 / 1;
}

.homepage-section-purpose-image__grid--cols3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.homepage-section-purpose-image__grid--cols3 .homepage-section-purpose-image__img--wide {
    aspect-ratio: 3 / 1; /* 3 張時每張更扁（3:1）；4 張維持 2:1；手機兩欄不套此規則 */
}

.homepage-section-purpose-image__grid--cols4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.homepage-section-purpose-image--mobile .homepage-section-purpose-image__grid.homepage-section-purpose-image__grid--mobile2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* 手機：3 或 4 張兩欄排（3 張時最後一張自然落單）；三類別選擇器壓過下方 --mobile 的 3 欄規則 */
}

.homepage-section-purpose-image__cta {
    flex: 0 0 auto;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* 按鈕位置三向：CTA 欄文字對齊跟著按鈕側 */
.homepage-section-purpose-image--btn-left .homepage-section-purpose-image__cta {
    text-align: left;
    align-items: flex-start;
}

.homepage-section-purpose-image--btn-right .homepage-section-purpose-image__cta {
    text-align: right;
    align-items: flex-end;
}

.homepage-section-purpose-image--btn-center .homepage-section-purpose-image__cta {
    text-align: center;
    align-items: center;
}

/* 手機版：六圖 3×2 在上、CTA 置中在下 */
.homepage-section-purpose-image--mobile {
    flex-direction: column;
    padding: 40px 0;
    gap: 24px;
}

.homepage-section-purpose-image--mobile .homepage-section-purpose-image__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)); /* 手機維持六圖 3×2 */
    max-width: 100%;
    gap: 10px;
}

.homepage-section-purpose-image--mobile .homepage-section-purpose-image__cta {
    text-align: center;
    align-items: center;
    max-width: 100%;
}

@media (max-width: 991px) {
    .homepage-section-purpose-image {
        padding: 48px 0;
        gap: 28px;
    }
}

/* ===== 全站搜尋區塊1401_搜尋+大圖（左搜尋右大圖可互換、50/50 等寬；搜尋鈕色用 --ss-btn-bg / --ss-btn-icon 變數） ===== */
.homepage-section-site-search {
    width: 100%;
    box-sizing: border-box;
    padding: 64px 0; /* 水平寬度交由通用外層治理；滿版 15px 留白見 purpose-button 段共用規則 */
    display: flex;
    align-items: stretch;
    gap: 40px;
}

.homepage-section-site-search--swap {
    flex-direction: row-reverse; /* 搜尋區在右、大圖在左 */
}

.homepage-section-site-search__search,
.homepage-section-site-search__image,
.homepage-section-site-search__word {
    flex: 1 1 0; /* 50/50 等寬（basis 0 不依內容分配） */
    min-width: 0;
}

.homepage-section-site-search__search {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 14px;
}

.homepage-section-site-search__form {
    display: flex;
    max-width: 100%; /* 跟著搜尋半邊寬度走（滿版變寬與標題齊寬；原 560px 上限造成滿版時上寬下窄） */
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}

.homepage-section-site-search__input {
    flex: 1 1 0;
    min-width: 0;
    padding: 14px 18px;
    border: 1px solid #ddd;
    border-right: none;
    border-radius: 8px 0 0 8px;
    font-size: 1rem;
    background: #ffffff;
    color: #333333;
    outline: none;
}

.homepage-section-site-search__input:focus {
    border-color: var(--ss-btn-bg, #333333);
}

.homepage-section-site-search__btn {
    flex: 0 0 auto;
    width: 56px;
    border: none;
    border-radius: 0 8px 8px 0;
    background: var(--ss-btn-bg, #333333);
    color: var(--ss-btn-icon, #ffffff);
    font-size: 1.3rem;
    cursor: pointer;
    transition: filter .2s ease;
}

.homepage-section-site-search__btn:hover {
    filter: brightness(0.85);
}

.homepage-section-site-search__btn:disabled {
    cursor: default;
    opacity: .7;
}

.homepage-section-site-search__hot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

/* 搜尋框固定寬（2026-09-30）：--ss-box-width 由後台設定；仍不超過搜尋半邊寬（min）；對齊修飾同時管搜尋框與熱門標籤列 */
.homepage-section-site-search__search--fixed .homepage-section-site-search__form,
.homepage-section-site-search__search--fixed .homepage-section-site-search__hot {
    width: min(var(--ss-box-width, 500px), 100%);
}

.homepage-section-site-search__search--align-left .homepage-section-site-search__form,
.homepage-section-site-search__search--align-left .homepage-section-site-search__hot {
    align-self: flex-start;
}

.homepage-section-site-search__search--align-center .homepage-section-site-search__form,
.homepage-section-site-search__search--align-center .homepage-section-site-search__hot {
    align-self: center;
    justify-content: center;
}

.homepage-section-site-search__search--align-right .homepage-section-site-search__form,
.homepage-section-site-search__search--align-right .homepage-section-site-search__hot {
    align-self: flex-end;
    justify-content: flex-end;
}

.homepage-section-site-search__hot-tag {
    display: inline-block;
    padding: 4px 12px;
    border: 1px solid currentColor;
    border-radius: 999px;
    background: transparent;
    color: inherit;
    font-size: 0.85rem;
    line-height: 1.4;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

button.homepage-section-site-search__hot-tag:hover {
    background-color: var(--ss-btn-bg, #333333);
    border-color: var(--ss-btn-bg, #333333);
    color: var(--ss-btn-icon, #ffffff);
}

span.homepage-section-site-search__hot-tag {
    cursor: default; /* 系統範本預覽不可點 */
}

.homepage-section-site-search__image {
    line-height: 0;
}

/* 1402 文字區塊側（獨立設定 WordItemJsonPC/MB；內層 __word-content 掛 PCOnly/MobileOnly，不可在此設 display 以免蓋掉全站分流規則） */
.homepage-section-site-search__word {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.homepage-section-site-search__word-content {
    word-break: break-word;
}

.homepage-section-site-search__img {
    width: 100%;
    height: 100%;
    min-height: 280px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
}

/* 手機版：搜尋區在上、大圖在下堆疊 */
@media (max-width: 991px) {
    .homepage-section-site-search,
    .homepage-section-site-search--swap {
        flex-direction: column;
        padding: 40px 0;
        gap: 24px;
    }

    .homepage-section-site-search__form {
        max-width: 100%;
    }

    .homepage-section-site-search__img {
        min-height: 0;
        height: auto;
        aspect-ratio: 16 / 9;
    }
}

/* ===== 目的按鈕 1301～1303／全站搜尋 1401～1402 手機文字留白（2026-10-25）=====
   手機上外層留白只有 滿版 15px／不滿版 10px（≤576 為 8px），文字與按鈕貼邊。
   --hp-mobile-text-inset＝補到距螢幕邊約 24px 的差額（滿版、不滿版一致）；只套文字／搜尋／按鈕區，圖片維持原寬。 */
@media (max-width: 991px) {
    .homepage-section--fullwidth {
        --hp-mobile-text-inset: 9px;
    }

    .homepage-section--container {
        --hp-mobile-text-inset: 14px;
    }

    .homepage-section-purpose-button__content,
    .homepage-section-purpose-image--mobile .homepage-section-purpose-image__cta,
    .homepage-section-site-search__search,
    .homepage-section-site-search__word {
        box-sizing: border-box;
        padding-left: var(--hp-mobile-text-inset, 0px);
        padding-right: var(--hp-mobile-text-inset, 0px);
    }
}

@media (max-width: 576px) {
    .homepage-section--container {
        --hp-mobile-text-inset: 16px;
    }
}

/* ===== 圖文區塊312_雙排圖層（8=4×2、10=5×2；圖上文同308；手機一列2張；間格可關） ===== */
.homepage-section-imagetext-312__grid {
    display: grid;
    gap: 1rem;
}

.homepage-section-imagetext-312--cols5 .homepage-section-imagetext-312__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.homepage-section-imagetext-312--cols4 .homepage-section-imagetext-312__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.homepage-section-imagetext-312--no-gap .homepage-section-imagetext-312__grid {
    gap: 0; /* 無間格：貼齊 */
}

.homepage-section-imagetext-312__item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.homepage-section-imagetext-312--no-gap .homepage-section-imagetext-312__item {
    border-radius: 0; /* 貼齊時無圓角 */
}

.homepage-section-imagetext-312__item:hover {
    transform: translateY(-4px);
}

.homepage-section-imagetext-312--no-gap .homepage-section-imagetext-312__item:hover {
    transform: none; /* 貼齊時位移會露縫 */
}

.homepage-section-imagetext-312__image-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.homepage-section-imagetext-312__image {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.homepage-section-imagetext-312__item:hover .homepage-section-imagetext-312__image {
    transform: scale(1.05);
}

.homepage-section-imagetext-312__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
    color: #ffffff;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.homepage-section-imagetext-312__overlay--always-show {
    opacity: 1;
}

/* hover 時也要顯示（兩種狀態都適用） */
.homepage-section-imagetext-312__item:hover .homepage-section-imagetext-312__overlay {
    opacity: 1;
}

.homepage-section-imagetext-312__overlay-title {
    font-weight: bold;
    margin: 0 0 0.4rem;
    line-height: 1.3;
    /* font-size, color, text-align 由 inline style 控制 */
}

.homepage-section-imagetext-312__overlay-text {
    margin: 0;
    line-height: 1.4;
    /* font-size, color, text-align 由 inline style 控制 */
}

/* 手機版：一列 2 張 */
@media (max-width: 991px) {
    .homepage-section-imagetext-312--cols4 .homepage-section-imagetext-312__grid,
    .homepage-section-imagetext-312--cols5 .homepage-section-imagetext-312__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
    }

    .homepage-section-imagetext-312--no-gap .homepage-section-imagetext-312__grid {
        gap: 0;
    }
}

/* ===== 圖文區塊313_矮版雙圖／314_矮板四圖（扁圖單排；僅配圖文字標題；間距共用 ImageWordItemHasGap312） ===== */
.homepage-section-imagetext-flat__grid {
    display: grid;
    gap: 1rem;
}

.homepage-section-imagetext-flat--cols2 .homepage-section-imagetext-flat__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.homepage-section-imagetext-flat--cols4 .homepage-section-imagetext-flat__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.homepage-section-imagetext-flat--no-gap .homepage-section-imagetext-flat__grid {
    gap: 0; /* 無間距：貼齊 */
}

.homepage-section-imagetext-flat__item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.homepage-section-imagetext-flat--no-gap .homepage-section-imagetext-flat__item {
    border-radius: 0; /* 貼齊時無圓角 */
}

.homepage-section-imagetext-flat__item:hover {
    transform: translateY(-4px);
}

.homepage-section-imagetext-flat--no-gap .homepage-section-imagetext-flat__item:hover {
    transform: none; /* 貼齊時位移會露縫 */
}

.homepage-section-imagetext-flat__image-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.homepage-section-imagetext-flat__image {
    width: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

/* 扁圖比例：313 高寬 1:4、314 高寬 1:2 */
.homepage-section-imagetext-flat--cols2 .homepage-section-imagetext-flat__image {
    aspect-ratio: 4 / 1;
}

.homepage-section-imagetext-flat--cols4 .homepage-section-imagetext-flat__image {
    aspect-ratio: 2 / 1;
}

.homepage-section-imagetext-flat__item:hover .homepage-section-imagetext-flat__image {
    transform: scale(1.05);
}

.homepage-section-imagetext-flat__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
    color: #ffffff;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.homepage-section-imagetext-flat__overlay--always-show {
    opacity: 1;
}

/* hover 時也要顯示（兩種狀態都適用） */
.homepage-section-imagetext-flat__item:hover .homepage-section-imagetext-flat__overlay {
    opacity: 1;
}

.homepage-section-imagetext-flat__overlay-title {
    font-weight: bold;
    margin: 0;
    line-height: 1.3;
    /* font-size, color, text-align 由 inline style 控制 */
}

/* 手機版：313 一列 1 張、314 一列 2 張（維持各自扁圖比例） */
@media (max-width: 991px) {
    .homepage-section-imagetext-flat--cols2 .homepage-section-imagetext-flat__grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: 0.75rem;
    }

    .homepage-section-imagetext-flat--cols4 .homepage-section-imagetext-flat__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
    }

    .homepage-section-imagetext-flat--no-gap .homepage-section-imagetext-flat__grid {
        gap: 0;
    }
}

/* ===== 圖文區塊315_文字塊多圖（2026-09-30）：正方形文字塊＋正方形圖區各佔一半寬（aspect-ratio 1:1 寬度驅動）；
   圖區 2 張＝1 欄 2 列（每張 2:1）／4 張＝1 欄 4 列（4:1）／6 張＝2 欄 3 列（3:2）→ 三種張數的圖區皆為正方形與文字塊等高；
   --swap 文字塊在右；手機改上下堆疊（文字塊不再強制正方形）；圖上文字沿用 overlay hover 機制（有填才顯示） ===== */
.homepage-section-textblock-315 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    padding: 32px 0;
    align-items: start; /* 不可 stretch：stretch 會蓋掉 aspect-ratio；兩欄等寬＋各自 1:1 即自然等高 */
}

.homepage-section-textblock-315--swap .homepage-section-textblock-315__text {
    order: 2; /* 文字塊在右、圖區在左 */
}

.homepage-section-textblock-315__text {
    aspect-ratio: 1 / 1;
    min-width: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.55);
    box-sizing: border-box;
    padding: 2rem;
    overflow: hidden; /* 文字塊固定正方形；超出的內容裁切，內容長度由編輯者控制 */
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.homepage-section-textblock-315__text-content {
    word-break: break-word;
    line-height: 1.8;
}

    .homepage-section-textblock-315__text-content img,
    .homepage-section-textblock-315__text-content video,
    .homepage-section-textblock-315__text-content iframe {
        max-width: 100%;
        height: auto;
    }

.homepage-section-textblock-315__grid {
    aspect-ratio: 1 / 1;
    min-width: 0;
    display: grid;
    gap: 12px;
}

.homepage-section-textblock-315--count-2 .homepage-section-textblock-315__grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.homepage-section-textblock-315--count-4 .homepage-section-textblock-315__grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(4, minmax(0, 1fr));
}

.homepage-section-textblock-315--count-6 .homepage-section-textblock-315__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, minmax(0, 1fr));
}

.homepage-section-textblock-315__item {
    position: relative;
    min-width: 0;
    min-height: 0;
    border-radius: 10px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.homepage-section-textblock-315__item:hover {
    transform: translateY(-3px);
}

.homepage-section-textblock-315__link {
    display: block;
    width: 100%;
    height: 100%;
}

.homepage-section-textblock-315__image-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.homepage-section-textblock-315__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.homepage-section-textblock-315__item:hover .homepage-section-textblock-315__image {
    transform: scale(1.05);
}

.homepage-section-textblock-315__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, var(--overlay-opacity, 0.4));
    color: #ffffff;
    padding: 0.6rem 0.9rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.homepage-section-textblock-315__overlay--always-show,
.homepage-section-textblock-315__item:hover .homepage-section-textblock-315__overlay {
    opacity: 1;
}

.homepage-section-textblock-315__overlay-title {
    font-weight: bold;
    margin: 0 0 0.3rem;
    line-height: 1.3;
}

.homepage-section-textblock-315__overlay-text {
    margin: 0;
    line-height: 1.5;
}

@media (max-width: 991px) {
    .homepage-section-textblock-315 {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
        padding: 24px 0;
    }

    .homepage-section-textblock-315--swap .homepage-section-textblock-315__text {
        order: 2; /* 文字塊在右者手機改「圖上文字下」 */
    }

    .homepage-section-textblock-315__text {
        aspect-ratio: auto; /* 手機不強制正方形，內容多寡決定高度 */
        padding: 1.25rem;
    }

    .homepage-section-textblock-315__grid {
        gap: 8px;
    }
}

/* ===== 六題一圖 204/213/703（題區 2 欄 4或6 題填滿剩餘寬＋正方形形象圖貼齊題區總高；--swap 互換；手機 column 跟隨） ===== */
.homepage-section-sixtopic {
    display: flex;
    align-items: stretch;
    gap: 20px;
    padding: 32px 0;
}

.homepage-section-sixtopic--swap {
    flex-direction: row-reverse; /* 題區在右、圖在左 */
}

.homepage-section-sixtopic__topics {
    flex: 2 1 0; /* 題區佔 2/3 寬、圖佔 1/3（寬度 2:1 → 6題卡自動成 1:3、4題卡自動成 1:2） */
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr; /* 題列高度均分圖高（由 stretch 取得圖的正方高） */
    gap: 14px;
}

.homepage-section-sixtopic__topic {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 18px;
    background: #ffffff;
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    color: #333333;
    text-decoration: none;
    min-width: 0;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

a.homepage-section-sixtopic__topic:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
}

.homepage-section-sixtopic__topic-title {
    flex: 1 1 0;
    min-width: 0;
    font-weight: 600;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* 螢幕小題寬變短時兩行後 ... 截斷 */
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 題卡內文區（2026-10-25）：標題＋簡介直向排；簡介目前只有 204 最新消息輸出（是否顯示簡介＝ShowNewsShortInfo） */
.homepage-section-sixtopic__topic-body {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .homepage-section-sixtopic__topic-body .homepage-section-sixtopic__topic-title {
        flex: 0 0 auto; /* 直向排時標題依內容高度，不參與伸縮 */
    }

.homepage-section-sixtopic__topic-desc {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #777777;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 992～1199：題卡較矮（約 95px），簡介只留一行 */
@media (min-width: 992px) and (max-width: 1199px) {
    .homepage-section-sixtopic__topic-desc {
        -webkit-line-clamp: 1;
    }
}

.homepage-section-sixtopic__topic-arrow {
    flex: 0 0 auto;
    color: #999999;
}

.homepage-section-sixtopic__image {
    flex: 1 1 0; /* 圖佔 1/3 寬 */
    min-width: 0;
    aspect-ratio: 1 / 1; /* 正方形：寬度驅動高、題區再 stretch 貼齊圖高 */
    align-self: flex-start; /* 不被 stretch 拉高，保住正方比例 */
}

.homepage-section-sixtopic__image-link {
    display: block;
    width: 100%;
    height: 100%;
}

.homepage-section-sixtopic__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    display: block;
}

.homepage-section-sixtopic__placeholder {
    width: 100%;
    padding: 24px;
    border: 1px dashed #bbb;
    border-radius: 8px;
    color: #888;
    font-size: 0.95rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.6);
}

/* 手機版：直向堆疊、跟隨互換（題左→題上；題右→圖上） */
@media (max-width: 991px) {
    .homepage-section-sixtopic {
        flex-direction: column;
        padding: 24px 0;
        gap: 14px;
    }

    .homepage-section-sixtopic--swap {
        flex-direction: column-reverse;
    }

    .homepage-section-sixtopic__topics {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        grid-auto-rows: minmax(64px, auto); /* 有簡介時卡片長高（2026-10-25；原固定 64px） */
        gap: 10px;
    }

    .homepage-section-sixtopic__topic {
        padding: 10px 18px;
    }

    .homepage-section-sixtopic__image {
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
        aspect-ratio: 1 / 1;
    }
}