/*
 * ============================================================
 * TABLE OF CONTENTS (目錄)
 * ============================================================
 *
 *   1.  Swiper Block & 通用動畫
 *       1-1. Swiper Block
 *       1-2. Form Panel & fadeIn 動畫
 *
 *   2.  底部頁面導航（bot-page-nav）
 *
 *   3.  無內容狀態 & Bot Space
 *
 *   4.  Get Quote Modal
 *
 *   5.  Download Modal
 *
 *   6.  產品圖片輪播
 *       6-1. Gallery Slider
 *       6-2. 影片封面
 *       6-3. 縮圖輪播
 *       6-4. 圖片計數 Badge
 *
 *   7.  產品詳情頁面
 *       7-1. 產品標題 & 內容格線
 *       7-2. 產品詳情 Tabs
 *       7-3. 隱藏 HTML 資料節點
 *
 *   8.  Modal Overlay & Modal Box
 *       8-1. Modal Overlay
 *       8-2. Modal Box & pgModalIn 動畫
 *       8-3. Modal 主圖
 *       8-4. Modal 縮圖
 *
 *   9.  產品圖片區域
 *       9-1. 產品圖片容器
 *       9-2. 縮圖列表
 *
 *  10.  產品資訊區域
 *       10-1. 產品資訊 Block
 *       10-2. 價格與操作區域
 *       10-3. 按鈕樣式
 *       10-4. 頁面導航（center-mode）
 *
 *  11.  下載區域
 *       11-1. 下載結果 Header
 *       11-2. Filter Tabs
 *       11-3. Download Section & Item
 *       11-4. Detail Mode
 *
 *  12.  產品展示區域（product-showcase）
 *
 *  13.  訂購資訊區域
 *       13-1. 訂購 Header
 *       13-2. 訂購表格
 *       13-3. 複選框樣式
 *
 *  14.  Solutions Page
 *       14-1. Content Section
 *       14-2. Offerings Section
 *       14-3. Key Features Section
 *       14-4. Content Block Section
 *       14-5. Applications Section
 *       14-6. Partners Section
 *
 *  15.  Sustainability / Governance Page
 *
 *  16.  Industries Section
 *       16-1. 卡片 & 圖片
 *       16-2. Overlay & 標題
 *       16-3. 下拉選單
 *
 *  17.  Challenges Section
 *
 *  18.  Story / Solution Section
 *
 *  19.  Expert Q&A
 *       19-1. 搜尋框
 *       19-2. Filter Buttons
 *       19-3. Q&A List
 *       19-4. Category Cards
 *       19-5. Q&A Detail
 *       19-6. Feedback Section
 *
 *  20.  Product Downloads
 *       20-1. 搜尋區域
 *       20-2. Sort Dropdown
 *
 *  21.  FAQ Section
 *
 *  22.  RMA Service
 *
 *  23.  Technical / Contact Form
 *
 *  24.  Sales Inquiries List
 *
 *  25.  My Vecow
 *
 *  26.  Product Delete Button & 刪除動畫
 *
 *  27.  Request Inquiry
 *       27-1. Inquiry Table
 *       27-2. Form Styles
 *
 *  28.  Technical Support
 *
 *  29.  Company Information
 *
 *  30.  About Vecow Page
 *       30-1. Hero Section
 *       30-2. Company Info Section
 *       30-3. Vecow Offers Section
 *       30-4. Contact CTA Section
 *
 *  31.  Partners Page
 *       31-1. Hero Section
 *       31-2. Partners Logos
 *       31-3. Brand Detail Panel
 *
 *  32.  ESG Cards Section
 *
 *  33.  Search Result Items
 *
 *  34.  Newsletter Modal
 *
 *  35.  通用組件
 *       35-1. Grid System
 *       35-2. Card Reset
 *       35-3. News Card
 *       35-4. Event Card
 *       35-5. Video Card
 *       35-6. Resource Grid & Cards
 *
 *  36.  Swiper 通用樣式
 *
 *  37.  Partners Section（產品頁）
 *
 *  38.  Case Study Section
 *
 *  39.  頁面區塊（Hero / Page Nav / Features）
 *       39-1. Site Header
 *       39-2. Hero Component
 *       39-3. Page Navigation
 *       39-4. Features & Tabs Section
 *       39-5. Solutions Section
 *       39-6. Resources Section
 *       39-7. Case Study Section
 *
 *  40.  Footer
 *
 *  41.  Slide Hover Component
 *
 *  42.  Demo Info & Account
 *
 *  43.  RWD: min-width: 1200px
 *
 *  44.  RWD: min-width: 1440px
 *
 *  45.  RWD: max-width: 1199px
 *
 *  46.  RWD: max-width: 991px
 *
 *  47.  RWD: max-width: 767px
 *
 *  48.  RWD: max-width: 576px
 *
 *  49.  RWD: max-width: 320px
 *
 * ============================================================
 */
/* ============================================================
 * 1. Swiper Block & 通用動畫
 * ============================================================ */
/* ---- 1-1. Swiper Block ---- */
.swiper-block {
		overflow: hidden !important;
		opacity: 0;
		-webkit-transition: opacity 0.4s ease;
		-o-transition: opacity 0.4s ease;
		transition: opacity 0.4s ease;
		height: 0;
}
.swiper-block.is-ready {
		overflow: visible !important;
		opacity: 1;
		height: auto;
}
/* ---- 1-2. Form Panel & fadeIn 動畫 ---- */
.form-panel {
		display: none;
}
.form-panel.active {
		display: block;
}
.form-panel.active {
		-webkit-animation: fadeIn 0.25s ease;
		animation: fadeIn 0.25s ease;
}
@-webkit-keyframes fadeIn {
		from {
				opacity: 0;
				-webkit-transform: translateY(6px);
				transform: translateY(6px);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
@keyframes fadeIn {
		from {
				opacity: 0;
				-webkit-transform: translateY(6px);
				transform: translateY(6px);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
.bg-curve-down, .bg-curve-top, .bg-curve {
		display: none !important;
}
/* ============================================================
 * 2. 底部頁面導航（bot-page-nav）
 * ============================================================ */
.bot-page-nav {
		background-color: rgba(255, 255, 255, .75);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		padding: 20px 0 20px 0;
}
.bot-page-nav .btn {
		width: 45px;
		height: 45px;
		padding: .25rem .5rem;
}
.bot-page-nav .btn.disabled {
		pointer-events: none;
		opacity: .35 !important;
		background-color: #f1f1f1 !important;
		display: none;
}
.bot-page-nav .btn:hover img {
		-webkit-filter: var(--svg-hover-white);
		filter: var(--svg-hover-white);
}
.bot-page-nav .btn img {
		display: block;
		width: 100%;
}
.bot-page-nav .btn.is-list img {
		position: relative;
		top: 4px;
}
.bot-page-nav li:nth-child(1) .btn {
		border-radius: .25rem 0 0 .25rem;
		border-right: 0;
}
.bot-page-nav li:nth-child(2) .btn {
		border-radius: 0;
}
.bot-page-nav li:nth-child(3) .btn {
		border-radius: 0 .25rem .25rem 0;
		border-left: 0;
}
/* ============================================================
 * 3. 無內容狀態 & Bot Space
 * ============================================================ */
.empty-state .icon {
		width: 65px;
}
.bot-space {
		padding-bottom: 75px;
}
/* ============================================================
 * 4. Get Quote Modal
 * ============================================================ */
#getQuoteModal .modal-content {
		border-radius: 12px;
		border: 3px solid #a855f7;
		-webkit-box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}
#getQuoteModal .modal-header {
		padding: 20px 20px 0 20px;
}
#getQuoteModal .modal-body {
		padding: 0 40px 40px 40px;
}
#getQuoteModal .modal-title {
		font-size: var(--font-size-3xl);
		color: var(--dark-gray);
		font-weight: 300;
		border-bottom: 1px solid var(--color-gray);
}
#getQuoteModal .modal-title strong {
		font-weight: bold;
}
#getQuoteModal .inquiry-info {
		color: var(--color-gray-dark);
		font-size: var(--font-size-lg);
}
#getQuoteModal .inquiry-info .text-primary {
		color: var(--primary-blue, #0066cc) !important;
}
#getQuoteModal .btn-outline-secondary {
		font-size: var(--font-size-base);
		border: 2px solid var(--border-color);
		padding: 12px 24px;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		color: var(--color-gary);
		background: var(--bg-gradient-tl-g);
}
#getQuoteModal .btn-outline-secondary:hover {
		background: var(--bg-gradient-g);
}
#getQuoteModal .btn-primary {
		font-size: var(--font-size-base);
		border-color: var(--primary-blue);
		padding: 12px 24px;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		color: var(--color-white);
		background: var(--bg-light-gradient);
}
#getQuoteModal .btn-primary:hover {
		background: var(--bg-gradient);
}
#getQuoteModal .btn-close {
		font-size: var(--font-size-base);
		opacity: 0.5;
}
#getQuoteModal .btn-close:hover {
		opacity: 1;
}
/* ============================================================
 * 5. Download Modal
 * ============================================================ */
#downloadModal .modal-content {
		border-radius: 12px;
		border: 3px solid #a855f7;
		-webkit-box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}
#downloadModal .modal-header {
		padding: 20px 20px 0 20px;
}
#downloadModal .modal-body {
		padding: 0 40px 40px 40px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-ms-flex-pack: distribute;
		justify-content: space-around;
}
#downloadModal .modal-title {
		font-size: var(--font-size-3xl);
		color: var(--dark-gray);
		font-weight: 300;
		border-bottom: 1px solid var(--color-gray);
		padding-bottom: 15px;
}
#downloadModal .modal-title strong {
		font-weight: bold;
}
#downloadModal .btn-primary {
		font-size: var(--font-size-base);
		border-color: var(--primary-blue);
		padding: 12px 24px;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		color: var(--color-white);
		background: var(--bg-light-gradient);
}
#downloadModal .btn-primary:hover {
		background: var(--bg-gradient);
}
#downloadModal .login-block {
		position: relative;
}
#downloadModal .login-block::after {
		content: '';
		top: 0;
		bottom: 0;
		margin: auto;
		right: -3rem;
		left: auto;
		width: 1px;
		height: 100%;
		max-height: 70%;
		display: block;
		background-color: var(--border-color);
		position: absolute;
}
/* ============================================================
 * 6. 產品圖片輪播
 * ============================================================ */
/* ---- 6-1. Gallery Slider ---- */
.gallery-slider {
		width: 100%;
		max-width: 70%;
		margin: auto;
		height: auto;
		position: relative;
}
.gallery-slider .swiper-slide {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		cursor: pointer;
}
.gallery-slider .swiper-slide .info {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		top: auto;
		margin: auto;
		display: block;
		text-align: center;
		z-index: 2;
		padding: 10px;
		background-color: rgba(255, 255, 255, .125);
		font-size: var(--font-size-base-lg);
		color: var(--dark-blue);
}
.gallery-slider .swiper-slide img {
		width: 100%;
		max-width: 550px;
		margin: auto;
		height: auto;
		-o-object-fit: contain;
		object-fit: contain;
}
.gallery-slider .swiper-button-prev, .gallery-slider .swiper-button-next {
		color: var(--primary-blue, #0066cc);
		background-color: rgba(255, 255, 255, 0.9);
		width: 40px;
		height: 40px;
		border-radius: 50%;
}
.gallery-slider .swiper-button-prev:after, .gallery-slider .swiper-button-next:after {
		font-size: var(--font-size-base-2lg);
}
/* ---- 6-2. 影片封面 ---- */
.video-cover {
		position: relative;
		width: 100%;
		cursor: pointer;
}
.video-cover .play-button {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		font-size: 60px;
		color: var(--color-white);
		text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
}
.video-cover:hover .play-button {
		-webkit-transform: translate(-50%, -50%) scale(1.1);
		-ms-transform: translate(-50%, -50%) scale(1.1);
		transform: translate(-50%, -50%) scale(1.1);
}
/* ---- 6-3. 縮圖輪播 ---- */
.gallery-thumbs {
		margin-top: 20px;
}
.gallery-thumbs {
		opacity: 0;
		transition: opacity 0.2s ease;
}
.gallery-thumbs.is-ready {
		opacity: 1;
}
.gallery-thumbs .swiper-slide {
		height: auto;
		opacity: 0.6;
		cursor: pointer;
		border: 2px solid transparent;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		position: relative;
		overflow: hidden;
		aspect-ratio: 1 / 1;
}
.gallery-thumbs .swiper-slide img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		background-color: #ffffff;
		display: block;
}
.modal-gallery-thumbs .swiper-slide-thumb-active, .gallery-thumbs .swiper-slide-thumb-active {
		-webkit-transform-origin: center;
		-ms-transform-origin: center;
		transform-origin: center;
		opacity: 1;
		padding: 2px;
		background-color: #f5f5f5;
		background: -o-linear-gradient(left, #00a8ff 10px, transparent 10px) 0 0, -o-linear-gradient(left, #00a8ff 10px, transparent 10px) 0 100%, -o-linear-gradient(right, #00a8ff 10px, transparent 10px) 100% 0, -o-linear-gradient(right, #00a8ff 10px, transparent 10px) 100% 100%, -o-linear-gradient(top, #00a8ff 10px, transparent 10px) 0 0, -o-linear-gradient(top, #00a8ff 10px, transparent 10px) 100% 0, -o-linear-gradient(bottom, #00a8ff 10px, transparent 10px) 0 100%, -o-linear-gradient(bottom, #00a8ff 10px, transparent 10px) 100% 100%;
		background: linear-gradient(to right, #00a8ff 10px, transparent 10px) 0 0, linear-gradient(to right, #00a8ff 10px, transparent 10px) 0 100%, linear-gradient(to left, #00a8ff 10px, transparent 10px) 100% 0, linear-gradient(to left, #00a8ff 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, #00a8ff 10px, transparent 10px) 0 0, linear-gradient(to bottom, #00a8ff 10px, transparent 10px) 100% 0, linear-gradient(to top, #00a8ff 10px, transparent 10px) 0 100%, linear-gradient(to top, #00a8ff 10px, transparent 10px) 100% 100%;
		background-repeat: no-repeat;
		background-size: 30px 10px, 30px 10px, 30px 10px, 30px 10px, 10px 30px, 10px 30px, 10px 30px, 10px 30px;
}
.gallery-thumbs .swiper-slide:hover {
		opacity: 1;
}
/* ---- 6-4. 圖片計數 Badge ---- */
.image-count-badge {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.35);
		color: var(--color-white);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		font-size: var(--font-size-base);
		font-weight: bold;
		z-index: 10;
}
/* ============================================================
 * 7. 產品詳情頁面
 * ============================================================ */
/* ---- 7-1. 產品標題 & 內容格線 ---- */
.product-detail-title {
		text-align: start;
		font-size: var(--font-size-3xl);
		margin: 0 0 10px 0;
		position: relative;
		color: var(--dark-gray);
}
.product-detail-title .product-badge {
		font-size: var(--font-size-base);
		right: -80px;
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
		left: auto;
}
.product-detail-title .product-tag {
		right: -100px;
		left: auto;
}
.product-content-grid {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 80px;
		margin-bottom: 50px;
}
.product-detail-header {
		position: relative;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.product-detail-header .compare-btn {
		top: 0;
}
/* ---- 7-2. 產品詳情 Tabs ---- */
.product-detail-tabs {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 50px;
		padding-bottom: 20px;
		margin-bottom: 20px;
		position: relative;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
}
.product-detail-tabs::after {
		content: '';
		display: none;
		width: 100%;
		height: 1px;
		background-color: var(--border-color);
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
}
.detail-tab {
		padding: 10px 0;
		cursor: pointer;
		color: var(--color-gray);
		font-weight: 500;
}
.detail-tab.active {
		color: var(--color-black);
		border-bottom: 2px solid var(--primary-blue);
}
/* ---- 7-3. 隱藏 HTML 資料節點 ---- */
.gallery-data {
		display: none !important;
}
/* ============================================================

 * 8. Modal Overlay & Modal Box
 * ============================================================ */
/* ---- 8-1. Modal Overlay ---- */
.pg-modal-overlay {
		display: none;
		position: fixed;
		inset: 0;
		z-index: 9999;
		background-color: rgba(0, 0, 0, 0.3);
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}
.pg-modal-overlay.active {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
}
/* ---- 8-2. Modal Box & pgModalIn 動畫 ---- */
.pg-modal {
		position: relative;
		background-color: var(--color-white);
		width: 80vw;
		max-width: 600px;
		-webkit-animation: pgModalIn .3s linear;
		animation: pgModalIn .3s linear;
}
@-webkit-keyframes pgModalIn {
		from {
				opacity: 0;
				-webkit-transform: translateY(-120%);
				transform: translateY(-120%);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
@keyframes pgModalIn {
		from {
				opacity: 0;
				-webkit-transform: translateY(-120%);
				transform: translateY(-120%);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
.pg-modal-close {
		position: absolute;
		top: 14px;
		right: 16px;
		background-color: transparent;
		border: none;
		cursor: pointer;
		color: var(--color-white);
		font-size: var(--font-size-2lg);
		line-height: 1;
		opacity: .6;
		-webkit-transition: opacity .2s;
		-o-transition: opacity .2s;
		transition: opacity .2s;
}
.pg-modal-close:hover {
		opacity: 1;
}
.pg-modal-title {
		color: #f0f0f0;
		font-size: var(--font-size-base);
		font-weight: 600;
		margin-bottom: 14px;
		padding-right: 36px;
		letter-spacing: .4px;
}
/* ---- 8-3. Modal 主圖 ---- */
.modal-main-wrapper {
		overflow: hidden;
		background-color: var(--color-white);
		position: relative;
}
.modal-gallery-slider .swiper-slide {
		position: relative;
}
.modal-gallery-slider .swiper-slide img {
		width: 100%;
		-o-object-fit: contain;
		object-fit: contain;
		display: block;
		background-color: var(--color-white);
}
.modal-gallery-slider .swiper-slide .info {
		position: relative;
		left: 0;
		right: 0;
		bottom: 0;
		top: auto;
		margin: auto;
		display: block;
		text-align: center;
		z-index: 2;
		padding: 10px;
		background-color: rgba(255, 255, 255, .125);
		font-size: var(--font-size-base-lg);
		color: var(--dark-blue);
}
.modal-gallery-slider .swiper-button-prev, .modal-gallery-slider .swiper-button-next {
		color: #ccc;
		display: none;
}
.modal-counter {
		text-align: center;
		color: #888;
		font-size: var(--font-size-xs);
		margin: 9px 0 11px;
}
/* ---- 8-4. Modal 縮圖 ---- */
.modal-gallery-thumbs {
		padding: 10px;
		background-color: var(--color-white);
}
.modal-gallery-thumbs .swiper-slide {
		-webkit-transform-origin: center;
		-ms-transform-origin: center;
		transform-origin: center;
		opacity: 1;
		padding: 2px;
		background-color: var(--color-white);
		background: -o-linear-gradient(left, #f2eeee 10px, transparent 10px) 0 0, -o-linear-gradient(left, #f2eeee 10px, transparent 10px) 0 100%, -o-linear-gradient(right, #f2eeee 10px, transparent 10px) 100% 0, -o-linear-gradient(right, #f2eeee 10px, transparent 10px) 100% 100%, -o-linear-gradient(top, #f2eeee 10px, transparent 10px) 0 0, -o-linear-gradient(top, #f2eeee 10px, transparent 10px) 100% 0, -o-linear-gradient(bottom, #f2eeee 10px, transparent 10px) 0 100%, -o-linear-gradient(bottom, #f2eeee 10px, transparent 10px) 100% 100%;
		background: linear-gradient(to right, #f2eeee 10px, transparent 10px) 0 0, linear-gradient(to right, #f2eeee 10px, transparent 10px) 0 100%, linear-gradient(to left, #f2eeee 10px, transparent 10px) 100% 0, linear-gradient(to left, #f2eeee 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, #f2eeee 10px, transparent 10px) 0 0, linear-gradient(to bottom, #f2eeee 10px, transparent 10px) 100% 0, linear-gradient(to top, #f2eeee 10px, transparent 10px) 0 100%, linear-gradient(to top, #f2eeee 10px, transparent 10px) 100% 100%;
		background-repeat: no-repeat;
		background-size: 30px 10px, 30px 10px, 30px 10px, 30px 10px, 10px 30px, 10px 30px, 10px 30px, 10px 30px;
}
.modal-gallery-thumbs .swiper-slide-thumb-active {
		-webkit-transform-origin: center;
		-ms-transform-origin: center;
		transform-origin: center;
		opacity: 1;
		padding: 2px;
		background-color: #f5f5f5;
		background: -o-linear-gradient(left, #00a8ff 10px, transparent 10px) 0 0, -o-linear-gradient(left, #00a8ff 10px, transparent 10px) 0 100%, -o-linear-gradient(right, #00a8ff 10px, transparent 10px) 100% 0, -o-linear-gradient(right, #00a8ff 10px, transparent 10px) 100% 100%, -o-linear-gradient(top, #00a8ff 10px, transparent 10px) 0 0, -o-linear-gradient(top, #00a8ff 10px, transparent 10px) 100% 0, -o-linear-gradient(bottom, #00a8ff 10px, transparent 10px) 0 100%, -o-linear-gradient(bottom, #00a8ff 10px, transparent 10px) 100% 100%;
		background: linear-gradient(to right, #00a8ff 10px, transparent 10px) 0 0, linear-gradient(to right, #00a8ff 10px, transparent 10px) 0 100%, linear-gradient(to left, #00a8ff 10px, transparent 10px) 100% 0, linear-gradient(to left, #00a8ff 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, #00a8ff 10px, transparent 10px) 0 0, linear-gradient(to bottom, #00a8ff 10px, transparent 10px) 100% 0, linear-gradient(to top, #00a8ff 10px, transparent 10px) 0 100%, linear-gradient(to top, #00a8ff 10px, transparent 10px) 100% 100%;
		background-repeat: no-repeat;
		background-size: 30px 10px, 30px 10px, 30px 10px, 30px 10px, 10px 30px, 10px 30px, 10px 30px, 10px 30px;
}
.modal-gallery-thumbs .swiper-slide img {
		width: 100%;
		height: 100%;
		aspect-ratio: 1 / 1;
		-o-object-fit: cover;
		object-fit: cover;
		display: block;
		margin: auto;
		background-color: var(--color-white);
		border: 2px solid var(--color-white);
}
.modal-gallery-thumbs .swiper-slide-thumb-active {
		border-color: var(--color-white);
		opacity: 1;
}
/* ============================================================
 * 9. 產品圖片區域
 * ============================================================ */
/* ---- 9-1. 產品圖片容器 ---- */
.product-images {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
		max-width: 600px;
		position: relative;
}
.product-images .product-favorite {
		right: auto;
}
.thumbnail-info {
		position: relative;
		bottom: -10px;
}
.main-image-wrapper {
		position: relative;
		border: 0;
		padding: 0;
}
.main-image-wrapper .product-favorite {
		top: 0;
		left: 0;
		right: auto;
		font-size: var(--font-size-xl);
}
.main-image-wrapper .product-zoom {
		position: absolute;
		top: 15px;
		right: 0;
		left: auto;
		z-index: 2;
		pointer-events: none;
}
.main-image-wrapper .product-zoom img {
		width: 30px;
}
.main-image-wrapper .product-badge {
		top: 15px;
		left: 0;
}
/* ---- 9-2. 縮圖列表 ---- */
.thumbnail-list {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		margin: 0 auto;
}
.thumbnail-list {
		width: 400px;
}
.thumbnail-list .swiper-slide {
		-webkit-transition: width 0s !important;
		-o-transition: width 0s !important;
		transition: width 0s !important;
}
.thumb-group {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 10px;
}
.thumb {
		width: 65px;
		height: 65px;
		-o-object-fit: cover;
		object-fit: cover;
		border: 1px solid transparent;
		cursor: pointer;
}
.thumb.active {
		border-color: var(--primary-blue);
}
/* ============================================================
 * 10. 產品資訊區域
 * ============================================================ */
/* ---- 10-1. 產品資訊 Block ---- */
.product-info-block {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		display: -webkit-inline-box;
		display: -ms-inline-flexbox;
		display: inline-flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
}
.product-info-block .name-title {
		font-size: var(--font-size-xl);
		line-height: 1.25;
		color: var(--dark-gray);
}
.product-info-block .name-title span {
		display: inline-block;
}
.product-info-block .name-subtitle {
		font-size: var(--font-size-lg);
		line-height: 1.2;
		margin-bottom: 1rem;
}
.product-info-block .info-bullets {
		font-size: var(--font-size-base);
		line-height: 1.75;
		margin-left: .5rem;
		width: 100%;
}
.product-info-block .info-bullets ul {
		padding-left: 1rem;
		margin-bottom: 1rem;
		width: 100%;
}
/* ---- 10-2. 價格與操作區域 ---- */
.price-action-area {
		margin-top: auto;
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 20px;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.price-action-area .product-change {
		width: 200px;
		border: 1px solid var(--border-color);
		padding: 15px;
		text-align: center;
}
.price-action-area .title {
		font-size: var(--font-size-base-lg);
		font-weight: bold;
}
.price-action-area .product-change .text {
		font-size: var(--font-size-base-lg);
		color: var(--dark-blue);
}
.price-block {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: baseline;
		-ms-flex-align: baseline;
		align-items: baseline;
		gap: 10px;
		margin-bottom: 20px;
		text-wrap: nowrap;
}
.price-label {
		font-size: var(--font-size-base-lg);
		font-weight: 700;
		color: var(--text-grey);
}
.price-value {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: baseline;
		-ms-flex-align: baseline;
		align-items: baseline;
}
.currency {
		font-size: var(--font-size-lg);
		font-weight: 700;
		color: var(--text-grey);
}
.unit {
		font-size: var(--font-size-base);
		color: var(--text-grey);
}
.action-buttons {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 10px;
}
/* ---- 10-3. 按鈕樣式 ---- */
.btn-primary {
		background-color: var(--dark-blue);
		border-color: var(--dark-blue);
		padding: 10px 10px;
}
.btn-primary:hover {
		background-color: var(--secondary-blue);
		border-color: var(--secondary-blue);
}
.btn-ordering {
		background-color: var(--dark-blue);
		color: var(--color-white);
}
.btn-ordering:hover {
		background-color: var(--secondary-blue);
		color: var(--color-white);
}
/* ---- 10-4. 頁面導航（center-mode） ---- */
#page-nav.center-mode {
		background-color: var(--color-light-gray);
		-webkit-box-shadow: none;
		box-shadow: none;
		border: 0;
		position: sticky;
		top: 190px;
}
#page-nav.center-mode .page-nav-link.active, #page-nav.center-mode .page-nav-link:hover {
		color: var(--dark-blue);
}
#page-nav.center-mode .page-nav-link {
		color: var(--secondary-blue);
		border: 0;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		text-decoration: underline;
}
#page-nav.center-mode .nav-bar .icon {
		width: 20px;
		margin: auto 0;
}
/* ============================================================
 * 11. 下載區域
 * ============================================================ */
/* ---- 11-1. 下載結果 Header ---- */
.downloads-results-header {
		text-align: center;
}
.downloads-results-title {
		font-size: var(--font-size-lg);
}
/* ---- 11-2. Filter Tabs ---- */
.downloads-filter-tabs {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		gap: 5px;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		border-bottom: 2px solid var(--color-gray);
		background-color: var(--color-white);
		padding-top: 10px;
		top: 70px;
}
.downloads-filter-tab {
		padding: 8px 10px 5px 10px;
		background-color: var(--border-color);
		border-radius: 12px 12px 0 0;
		color: var(--color-gray);
		text-decoration: none;
		font-size: var(--font-size-base-lg);
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		cursor: pointer;
		position: relative;
		top: 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
}
.downloads-filter-tab:hover {
		background-color: var(--cloud-blue);
		color: var(--color-white);
}
.downloads-filter-tab.active {
		background-color: var(--dark-blue);
		color: var(--color-white);
		border-color: var(--dark-blue);
}
/* ---- 11-3. Download Section & Item ---- */
.download-section {
		margin-bottom: 50px;
}
.download-section-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		padding: 15px 0;
		border-bottom: 2px solid #e0e0e0;
		margin-bottom: 20px;
}
.download-section-title {
		font-size: var(--font-size-base-2lg);
		font-weight: 600;
		color: var(--dark-gray);
		margin: 0;
}
.download-section-lang {
		font-size: var(--font-size-base);
		color: var(--color-gray-dark);
}
.download-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		padding: 8px 15px;
		background-color: var(--color-white);
		border: 1px solid var(--border-color);
		border-radius: 8px;
		margin-bottom: 10px;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.download-item.faq-mode:hover, .download-item.faq-mode {
		padding: 0;
		background-color: transparent;
		border: 0;
}
.download-item:hover {
		background-color: var(--color-light-gray);
		border-color: var(--color-gray);
}
.download-item-info {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
}
.download-item-title {
		font-size: var(--font-size-base);
		font-weight: 600;
		color: var(--dark-blue);
}
.download-item:hover .download-item-title {
		color: var(--secondary-blue);
}
.download-item-meta {
		font-size: var(--font-size-base);
}
.download-item-actions {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 15px;
}
.download-item-size {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 5px;
		font-size: var(--font-size-base);
		color: var(--color-gray-dark);
}
.download-item-size img {
		width: 25px;
		height: 25px;
}
.download-btn {
		width: 22px;
		height: 22px;
		background-color: transparent;
		border: none;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.download-btn img {
		width: 100%;
		height: 100%;
}
/* ---- 11-4. Detail Mode ---- */
.detail-mode .downloads-filter-tabs {
		height: 120px;
		-webkit-box-align: end;
		-ms-flex-align: end;
		align-items: flex-end;
		border: 0;
}
.detail-mode .downloads-filter-tabs li {
		height: 35;
		margin-top: auto;
}
.detail-mode .download-section-header {
		text-align: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		border: 0;
		padding: 30px 0;
		margin-bottom: 0;
}
.detail-mode .select-wrapper {
		min-width: 200px;
		width: auto;
		display: inline-block;
		margin-bottom: 30px;
}
.detail-mode .downloads-filter-tabs.has-bg {
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		top: 190px;
}
.detail-mode .downloads-filter-tab {
		background-color: var(--color-gray);
		color: var(--color-white);
		border-color: var(--color-gray);
		padding: 10px 15px;
		border-radius: 8px 8px 0 0;
		top: 0;
}
.detail-mode .downloads-filter-tab.active {
		background-color: var(--color-white);
		color: var(--secondary-blue);
		border-color: var(--color-white);
		font-size: var(--font-size-base);
}
.download-section-header.has-color {
		border-bottom-color: var(--secondary-blue);
}
/* ============================================================
 * 12. 產品展示區域（product-showcase）
 * ============================================================ */
.product-showcase-section {
		margin-bottom: 30px;
		overflow: hidden;
}
.product-showcase-container {
		position: relative;
		width: 100%;
		max-width: var(--sp-space);
		overflow-x: auto;
		overflow-y: visible;
		overflow: hidden;
		margin-right: 0;
		margin-left: auto;
		cursor: -webkit-grab;
		cursor: grab;
		padding: 20px 0;
		scrollbar-width: none;
		-ms-overflow-style: none;
		-webkit-overflow-scrolling: touch; /* iOS 慣性滾動（舊版） */
		scroll-behavior: smooth;
}
.product-showcase-container::-webkit-scrollbar {
		display: none;
}
.product-showcase-container:active {
		cursor: -webkit-grabbing;
		cursor: grabbing;
}
.product-showcase-container.dragging {
		cursor: -webkit-grabbing;
		cursor: grabbing;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
}
.product-showcase-wrapper {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 0;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
}
.product-in-card {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		min-width: 280px;
		max-width: 280px;
		padding: 20px 15px;
		text-align: center;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		cursor: pointer;
}
.product-in-card img {
		max-width: 180px;
		-o-object-fit: cover;
		object-fit: cover;
		width: 100%;
		height: auto;
		margin-bottom: 15px;
		pointer-events: none;
}
.product-in-card-name {
		font-size: var(--font-size-base-lg);
		margin-bottom: 5px;
}
.product-in-card-btn {
		display: block;
		width: 100%;
		padding: 8px 16px;
		background-color: var(--secondary-blue);
		color: var(--color-white);
		border: none;
		border-radius: 4px;
		text-decoration: none;
		font-size: var(--font-size-sm);
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		cursor: pointer;
}
.product-in-card-btn:hover {
		background-color: var(--primary-blue);
		color: var(--color-white);
}
.product-showcase-container:hover .drag-hint {
		opacity: 1;
}
/* ============================================================
 * 13. 訂購資訊區域
 * ============================================================ */
/* ---- 13-1. 訂購 Header ---- */
.ordering-info-section {
		margin-bottom: 50px;
}
.ordering-info-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		margin-bottom: 10px;
		padding-bottom: 10px;
		border-bottom: 2px solid var(--border-color);
}
.ordering-info-title {
		font-size: var(--font-size-lg);
		margin: 0;
}
.selection-info {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 15px;
}
.selection-count {
		font-size: var(--font-size-base);
		color: var(--color-gray);
}
.selection-count .count {
		font-weight: 600;
		color: var(--primary-blue);
}
.clear-selection-btn {
		padding: 8px 16px;
		background-color: var(--color-gray);
		color: var(--color-white);
		border: none;
		border-radius: 4px;
		font-size: var(--font-size-sm);
		cursor: pointer;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
}
.clear-selection-btn:hover {
		background-color: var(--dark-blue);
}
.clear-selection-btn:disabled {
		opacity: 0.5;
		cursor: not-allowed;
}
/* ---- 13-2. 訂購表格 ---- */
.ordering-table {
		width: 100%;
		border-collapse: collapse;
		background-color: var(--color-white);
		border: 1px solid var(--border-color);
		border-radius: 8px;
		overflow: hidden;
}
.ordering-table thead {
		background-color: var(--dark-blue);
		color: var(--color-white);
		display: none;
}
.ordering-table th {
		padding: 15px;
		text-align: left;
		font-weight: 600;
		font-size: var(--font-size-base);
}
.ordering-table tbody tr {
		border-bottom: 1px solid var(--border-color);
		-webkit-transition: background 0.3s;
		-o-transition: background 0.3s;
		transition: background 0.3s;
}
.ordering-table tbody tr:last-child {
		border-bottom: none;
}
.ordering-table td {
		padding: 8px;
		font-size: var(--font-size-base);
		line-height: 1.6;
}
.ordering-table td:first-child {
		color: var(--dark-blue);
		width: 200px;
		padding: 8px;
		position: relative;
		font-weight: bold;
}
/* ---- 13-3. 複選框樣式 ---- */
.checkbox-indicator {
		display: inline-block;
		width: 20px;
		height: 20px;
		border: 2px solid var(--color-gray);
		border-radius: 4px;
		margin-right: 10px;
		vertical-align: middle;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		position: relative;
		opacity: 1;
}
.ordering-table tbody tr.selected .checkbox-indicator {
		border-color: var(--primary-blue);
		background-color: var(--primary-blue);
}
.ordering-table tbody tr.selected .checkbox-indicator:after {
		content: '✓';
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		color: var(--color-white);
		font-size: var(--font-size-base);
		font-weight: bold;
}
/* ============================================================
 * 14. Solutions Page
 * ============================================================ */
/* ---- 14-1. Content Section ---- */
.solution-content-section {
		padding: 40px 0;
}
.solution-content-title {
		font-size: var(--font-size-lg);
		font-weight: 600;
		color: var(--dark-gray);
		margin-bottom: 20px;
}
.solution-content-text {
		font-size: var(--font-size-base);
		color: var(--color-gray-dark);
		line-height: 1.8;
		margin-bottom: 30px;
		padding-top: 1rem;
}
/* ---- 14-2. Offerings Section ---- */
.offerings-section {
		background-color: #f8f9fa;
		padding: 60px 0;
}
.offerings-title {
		font-size: var(--font-size-4lg);
		font-weight: 700;
		color: #0066cc;
		margin-bottom: 40px;
		text-align: center;
}
.offerings-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(4, 1fr);
		gap: 20px;
		margin-bottom: 40px;
}
/* ---- 14-3. Key Features Section ---- */
.key-features-section {
		padding: 60px 0;
}
.key-features-title {
		font-size: var(--font-size-4lg);
		font-weight: 700;
		color: var(--dark-gray);
		margin-bottom: 40px;
		text-align: center;
}
.key-features-layout {
		padding-bottom: 50px;
}
.key-features-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 40px 1fr;
		grid-template-columns: repeat(2, 1fr);
		gap: 40px;
}
.feature-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 20px;
}
.feature-icon {
		width: 80px;
		height: 80px;
		border-radius: 50%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-ms-flex-negative: 0;
		flex-shrink: 0;
}
.feature-content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
}
.feature-title {
		font-size: var(--font-size-base-lg);
		font-weight: 600;
		color: var(--dark-gray);
		margin-bottom: 10px;
}
.feature-list {
		list-style: none;
		padding: 0;
		margin: 0;
}
.feature-list li {
		font-size: var(--font-size-base);
		color: var(--color-gray-dark);
		line-height: 1.8;
		padding-left: 20px;
		position: relative;
}
.feature-list li:before {
		content: "·";
		position: absolute;
		left: 5px;
		font-weight: bold;
}
/* ---- 14-4. Content Block Section ---- */
.content-block-section {
		padding: 60px 0;
		background-color: #f8f9fa;
}
.content-block {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 0;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		background-color: var(--color-light-gray);
}
.content-block.reverse {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
}
.content-block-image {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		aspect-ratio: 16 / 9;
}
.content-block-image img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
}
.content-block-text {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
}
.content-info {
		padding: 40px;
}
.content-block-title {
		font-size: var(--font-size-base-lg);
		font-weight: 600;
		margin-bottom: 15px;
}
.content-block-description {
		font-size: var(--font-size-base);
		line-height: 1.5;
}
/* ---- 14-5. Applications Section ---- */
.applications-section {
		padding: 60px 0;
}
.applications-title {
		font-size: var(--font-size-4lg);
		font-weight: 700;
		color: var(--dark-gray);
		margin-bottom: 40px;
		text-align: center;
}
.applications-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(4, 1fr);
		gap: 20px;
}
.application-card {
		background-color: var(--color-white);
		overflow: hidden;
		text-decoration: none;
}
.application-image {
		width: 100%;
		height: 180px;
		overflow: hidden;
		aspect-ratio: 16 / 9;
}
.application-image img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
}
.application-title {
		padding: 15px;
		font-size: var(--font-size-base);
		font-weight: 600;
		text-align: center;
}
/* ---- 14-6. Partners Section ---- */
.partners-section {
		padding: 60px 0;
		background-color: #f8f9fa;
}
.partners-title {
		font-size: var(--font-size-4lg);
		font-weight: 700;
		color: var(--dark-gray);
		margin-bottom: 40px;
		text-align: center;
}
.partners-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 30px 1fr 30px 1fr 30px 1fr 30px 1fr;
		grid-template-columns: repeat(5, 1fr);
		gap: 30px;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.partner-logo {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		min-height: 100px;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.partner-logo img {
		max-width: 100%;
		max-height: 100%;
		-o-object-fit: contain;
		object-fit: contain;
}
/* ============================================================
 * 15. Sustainability / Governance Page
 * ============================================================ */
.sustainability-hero {
		position: relative;
		width: 100%;
		height: 640px;
		overflow: hidden;
		background-color: var(--color-white);
}
.sustainability-hero-bg {
		position: fixed;
		width: auto;
		height: 100%;
		-o-object-fit: contain;
		object-fit: contain;
		-o-object-position: center top;
		object-position: center top;
		left: 0;
		top: 0;
		margin: auto;
}
.sustainability-hero-content {
		position: relative;
		z-index: 2;
}
.sustainability-hero-content .section-title {
		color: var(--color-white);
		text-shadow: 0 2px 5px rgba(0, 0, 0, .35);
}
.sustainability-commitment {
		color: var(--color-white);
		font-size: var(--font-size-base);
		text-shadow: 0 2px 5px rgba(0, 0, 0, .5);
}
.basic-info {
		background-color: var(--color-white);
		padding: 75px 0;
		font-size: var(--font-size-base);
}
/* ============================================================
 * 16. Industries Section
 * ============================================================ */
.industries-section {}
.industries-container {}
.page-title {
		font-size: var(--font-size-3xl);
		font-weight: 700;
		color: var(--dark-gray);
		margin-bottom: 40px;
		text-align: center;
}
.industries-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 40px 1fr 40px 1fr;
		grid-template-columns: repeat(3, 1fr);
		gap: 40px;
		margin: 20px auto 75px auto;
}
.industries-item {
		position: relative;
}
/* ---- 16-1. 卡片 & 圖片 ---- */
.industries-card {
		width: 100%;
		aspect-ratio: 4 / 3;
		position: relative;
		overflow: hidden;
		display: block;
		text-decoration: none;
		border-radius: 0;
		-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		-o-transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
}
.industries-card:hover, .industries-card:focus {
		outline: none;
}
.industries-img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		position: relative;
}
.industries-img img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		-webkit-transition: -webkit-filter 0.5s ease, -webkit-transform 0.5s ease;
		transition: -webkit-filter 0.5s ease, -webkit-transform 0.5s ease;
		-o-transition: filter 0.5s ease, transform 0.5s ease;
		transition: filter 0.5s ease, transform 0.5s ease;
		transition: filter 0.5s ease, transform 0.5s ease, -webkit-filter 0.5s ease, -webkit-transform 0.5s ease;
		-webkit-filter: grayscale(0%);
		filter: grayscale(0%);
}
.industries-card:hover .industries-img img, .industries-card:focus .industries-img img {
		-webkit-transform: scale(1.08);
		-ms-transform: scale(1.08);
		transform: scale(1.08);
}
/* ---- 16-2. Overlay & 標題 ---- */
.industries-overlay {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0);
		color: var(--color-white);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		-webkit-transition: background 0.3s ease;
		-o-transition: background 0.3s ease;
		transition: background 0.3s ease;
}
.on-hover .industries-card .industries-overlay {
		background-color: rgba(0, 0, 0, 0.35);
}
.industries-title {
		font-size: var(--font-size-base-lg);
		line-height: 1.3;
		color: var(--color-white);
		margin: 0;
		padding: 11px 15px;
		width: 100%;
		display: block;
		text-align: center;
		background-color: rgba(var(--dark-blue-rgb), .85);
}
.industries-title::after {
		content: '';
		position: absolute;
		right: 15px;
		top: 50%;
		-webkit-transform: translateY(-50%) rotate(45deg);
		-ms-transform: translateY(-50%) rotate(45deg);
		transform: translateY(-50%) rotate(45deg);
		width: 8px;
		height: 8px;
		border-top: 2px solid var(--color-white);
		border-right: 2px solid var(--color-white);
		-webkit-transition: -webkit-transform 0.3s ease;
		transition: -webkit-transform 0.3s ease;
		-o-transition: transform 0.3s ease;
		transition: transform 0.3s ease;
		transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.industries-item.active .industries-title::after {
		transform: rotate(135deg);
		transform-origin: center top;
}
/* ---- 16-3. 下拉選單 ---- */
.industries-dropdown {
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		-webkit-transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease, margin-top 0.3s ease;
		-o-transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease, margin-top 0.3s ease;
		transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease, margin-top 0.3s ease;
		background-color: var(--color-white);
		border: 1px solid #e0e0e0;
		border-top: none;
}
.industries-item:hover .industries-dropdown, .industries-item:focus-within .industries-dropdown {
		max-height: 500px;
		opacity: 1;
		margin-top: 0;
}
.dropdown-content {
		position: relative;
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: (1fr)[2];
		grid-template-columns: repeat(2, 1fr);
}
.dropdown-content::after {
		content: '';
		position: absolute;
		width: 1px;
		height: 100%;
		max-height: calc(100% - 20px);
		display: block;
		background-color: var(--color-light-gray);
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		pointer-events: none;
}
.dropdown-section {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
}
.dropdown-heading {
		font-size: var(--font-size-base);
		padding: 10px 10px 5px 10px;
		text-align: center;
}
.dropdown-list {
		list-style: none;
		margin: 0;
		padding: 0;
}
.dropdown-link {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		padding: 5px 10px;
		background-color: var(--color-white);
		color: var(--color-dark-gray);
		text-decoration: none;
		font-size: var(--font-size-base);
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.dropdown-link:hover, .dropdown-link:focus {
		background-color: var(--color-light-gray);
}
/* ============================================================
 * 17. Challenges Section
 * ============================================================ */
.challenges-section {
		background-color: #d9d9d9;
		padding: 75px 0;
}
.challenges-content {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 20px;
}
.challenges-content h2 {
		font-size: var(--font-size-4lg);
		font-weight: 700;
		color: var(--color-dark-gray);
		text-align: center;
		margin-bottom: 30px;
}
.challenges-content .subtitle {
		font-size: var(--font-size-base);
		color: var(--color-medium-gray);
		margin-bottom: 54px;
}
.challenge-list {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 24px;
}
.challenge-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 60px;
		position: relative;
}
.challenge-connector {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		position: absolute;
		min-width: 75px;
		width: 75px;
		left: 85px;
}
.challenge-text-box {
		background-color: #9f9f9f;
		border-radius: 10px;
		padding: 20px;
		color: var(--color-white);
		-webkit-box-flex: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
}
.challenge-text-box h3 {
		font-size: var(--font-size-lg);
		margin-bottom: 10px;
}
.challenge-text-box p {
		font-size: var(--font-size-base);
		line-height: 1.5;
		padding-bottom: 0;
}
.challenges-image {
		width: 400px;
		height: 400px;
		aspect-ratio: 1 / 1;
}
.challenges-image > img {
		-o-object-fit: cover;
		object-fit: cover;
		width: 100%;
		height: 100%;
		-webkit-clip-path: circle(50% at 50% 50%);
		clip-path: circle(50% at 50% 50%);
}
.challenge-icon-wrapper {
		width: 92px;
		height: 92px;
		background-color: var(--color-gray);
		border-radius: 50%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-ms-flex-negative: 0;
		flex-shrink: 0;
		padding: 20px;
}
.challenge-icon-wrapper img {
		-o-object-fit: contain;
		object-fit: contain;
		width: 100%;
		height: 100%;
}
.connector-svg {
		position: absolute;
		left: 0;
		width: 18px;
		height: 18px;
}
/* ============================================================
 * 18. Story / Solution Section
 * ============================================================ */
.story-section {
		padding: 50px 0 30px 0;
		position: relative;
}
.story-section::after {
		content: '';
		position: absolute;
		width: 100%;
		height: 100%;
		max-width: 50%;
		top: 0;
		left: 0;
		display: block;
		margin: auto;
		background-color: var(--dark-blue);
		z-index: -1;
}
.story-cta-column {
		background-color: var(--color-primary);
		padding: 40px 20px 20px 20px;
		color: var(--color-white);
}
.cta-image-wrapper {
		width: 100%;
		height: 233px;
		overflow: hidden;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.cta-image-wrapper img {
		width: 337px;
		height: 337px;
		-o-object-fit: cover;
		object-fit: cover;
}
.cta-content {
		text-align: center;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 20px;
}
.cta-content h3 {
		font-size: var(--font-size-base-lg);
}
.cta-content p {
		font-size: var(--font-size-base);
		line-height: 1.5;
}
.story-column {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		padding: 20px;
}
.story-column h2 {
		font-size: var(--font-size-4lg);
		font-weight: 700;
		margin-bottom: 10px;
}
.story-subtitle {
		font-size: var(--font-size-base);
		line-height: 1.5;
		margin-bottom: 20px;
}
.story-features {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 10px;
		margin-bottom: 20px;
}
.story-feature-item {
		border: 1px solid #9f9f9f;
		border-radius: 5px;
		padding: 10px 20px;
}
.story-feature-item h4 {
		font-size: var(--font-size-base-lg);
		margin-bottom: 10px;
}
.story-feature-item p {
		font-size: var(--font-size-base);
		line-height: 1.5;
		margin-bottom: 0;
}
.story-conclusion {
		font-size: var(--font-size-base);
		line-height: 1.5;
}
#story .swiper-pagination {
		top: 3rem;
		position: relative !important;
}
#story .swiper-pagination .swiper-pagination-bullet {
		background-color: var(--color-white);
}
#story .swiper-pagination .swiper-pagination-bullet-active {
		background-color: var(--secondary-blue);
}
/* ============================================================
 * 19. Expert Q&A
 * ============================================================ */
/* ---- 19-1. 搜尋框 ---- */
.qa-search-box {
		margin: 0 auto 40px;
		position: relative;
}
.qa-search-input {
		width: 100%;
		height: 50px;
		border: 1px solid var(--color-gray);
		border-radius: 25px;
		padding: 0 60px 0 25px;
		font-size: var(--font-size-base);
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.qa-search-input:focus {
		outline: none;
		border-color: var(--dark-blue);
}
.qa-search-btn {
		position: absolute;
		right: 5px;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 40px;
		height: 40px;
		border: none;
		background-color: #0066cc;
		border-radius: 50%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.qa-search-btn:hover {
		background-color: #0052a3;
		-webkit-transform: translateY(-50%) scale(1.05);
		-ms-transform: translateY(-50%) scale(1.05);
		transform: translateY(-50%) scale(1.05);
}
.qa-search-btn img {
		width: 20px;
		height: 20px;
}
/* ---- 19-2. Filter Buttons ---- */
.qa-filter-buttons {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		gap: 30px;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		padding: 0;
		margin-bottom: 60px;
}
.qa-filter-btn {
		padding: 10px 25px 10px 20px;
		background-color: var(--color-white);
		border: 1px solid var(--color-gray);
		border-radius: 8px;
		color: var(--color-gray-dark);
		text-decoration: none;
		font-size: var(--font-size-base);
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 8px;
}
.qa-filter-btn:hover {
		background-color: var(--secondary-blue);
		color: var(--color-white);
		border-color: var(--secondary-blue);
}
.qa-filter-btn.active {
		background-color: var(--dark-blue);
		color: var(--color-white);
		border-color: var(--dark-blue);
}
.qa-filter-btn img {
		width: 16px;
		height: 16px;
}
.qa-filter-btn:hover img, .qa-filter-btn.active img {
		-webkit-filter: var(--svg-hover-white);
		filter: var(--svg-hover-white);
}
/* ---- 19-3. Q&A List ---- */
.qa-list {
		margin: 0 auto 4rem auto;
}
.qa-list-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		font-size: var(--font-size-base-2lg);
		-webkit-box-pack: justify;
		    -ms-flex-pack: justify;
		        justify-content: space-between;
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
		padding: 8px 0;
		margin-bottom: 10px;
		text-decoration: none;
		color: var(--dark-blue);
}
.qa-list-item:hover {
		color: var(--secondary-blue);
}
.qa-list-item-content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
}
.qa-list-item-question {
		font-size: var(--font-size-base-2lg);
		font-weight: 500;
		margin: 0;
		padding-left: 0;
}
.qa-list-item-date {
		font-size: var(--font-size-base-sm);
		white-space: nowrap;
		margin-left: 20px;
		color: var(--color-gray);
}
/* ---- 19-4. Category Cards ---- */
.qa-categories {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(4, 1fr);
		gap: 20px;
		margin-bottom: 60px;
}
.qa-category-card {
		background-color: var(--color-white);
		border: 1px solid var(--border-color);
		border-radius: 8px;
		padding: 15px;
		text-decoration: none;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 15px;
}
.qa-category-card:hover {
		border-color: var(--secondary-blue);
		background-color: var(--secondary-blue);
		-webkit-transform: translateY(-2px);
		-ms-transform: translateY(-2px);
		transform: translateY(-2px);
}
.qa-category-card:hover .qa-category-title, .qa-category-card:hover .qa-category-description {
		color: var(--color-white);
}
.qa-category-title {
		font-size: var(--font-size-base-lg);
		font-weight: 600;
		color: var(--dark-blue);
		margin-bottom: 0;
}
.qa-category-description {
		font-size: var(--font-size-base);
		line-height: 1.5;
		color: var(--color-gray);
		margin: 0;
}
/* ---- 19-5. Q&A Detail ---- */
.qa-detail-card {}
.qa-question-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		gap: 15px;
		margin-bottom: 30px;
		padding-bottom: 20px;
		border-bottom: 2px solid #f0f0f0;
}
.qa-question-badge {
		width: 40px;
		height: 40px;
		background-color: var(--dark-blue);
		color: var(--color-white);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		font-size: var(--font-size-base-lg);
		font-weight: 700;
		-ms-flex-negative: 0;
		flex-shrink: 0;
	 top: 6px;
	 position: relative;
}
.qa-question-content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.qa-question-title {
		font-size: var(--font-size-base-2lg);
		font-weight: 600;
		margin-bottom: 0;
}
.qa-question-date {
		font-size: var(--font-size-base-sm);
		color: var(--color-gray);
		background-color: var(--footer-text);
		padding: 5px 15px;
		display: inline-block;
	 top: 6px;
	 position: relative;
}
.qa-answer-section {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		gap: 15px;
}
.qa-answer-badge {
		width: 40px;
		height: 40px;
		background-color: var(--color-gray);
		color: var(--color-white);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		font-size: var(--font-size-base-lg);
		font-weight: 700;
		-ms-flex-negative: 0;
		flex-shrink: 0;
	 top: 6px;
	 position: relative;
}
.qa-answer-content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
}
.qa-answer-text {
		font-size: var(--font-size-base);
		line-height: 1.5;
		margin: 0;
}
/* ---- 19-6. Feedback Section ---- */
.qa-feedback {
		text-align: start;
		margin-top: 30px;
		position: relative;
}
.qa-feedback-title {
		margin-bottom: 15px;
		font-size: var(--font-size-base);
}
.qa-feedback-buttons {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		gap: 8px;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.qa-feedback-buttons .btn {
		padding: 0 5px;
		text-decoration: none;
		color: var(--secondary-blue);
		font-weight: 500;
		font-size: var(--font-size-base);
		-webkit-transition: color 0.3s ease;
		-o-transition: color 0.3s ease;
		transition: color 0.3s ease;
}
.qa-feedback-buttons .btn:hover {
		color: var(--dark-blue);
}
.qa-feedback-tooltip-wrapper {
		margin-top: 15px;
		-webkit-animation: slideDown 0.3s ease-out;
		animation: slideDown 0.3s ease-out;
}
@-webkit-keyframes slideDown {
		from {
				opacity: 0;
				-webkit-transform: translateY(-10px);
				transform: translateY(-10px);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
@keyframes slideDown {
		from {
				opacity: 0;
				-webkit-transform: translateY(-10px);
				transform: translateY(-10px);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
.qa-feedback-tooltip-inline {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 20px;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		position: relative;
}
.qa-feedback-tooltip-inline::before {
		content: '';
		position: absolute;
		left: 30px;
		top: -10px;
		width: 0;
		height: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-bottom: 10px solid var(--secondary-blue);
}
.tooltip-inline-message {
		color: var(--color-white);
		font-size: var(--font-size-base);
		font-weight: 500;
		margin: 0;
		white-space: nowrap;
		background-color: var(--secondary-blue);
		padding: 8px 10px;
		border-radius: 5px;
}
.tooltip-inline-links {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 12px;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
}
.tooltip-inline-link {
		color: var(--secondary-blue);
		text-decoration: none;
		font-size: var(--font-size-base);
		font-weight: 500;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		position: relative;
		padding-bottom: 2px;
}
.tooltip-inline-link:hover {
		color: var(--dark-blue);
}
.tooltip-separator {
		color: var(--secondary-blue);
		font-size: var(--font-size-base);
		position: relative;
		top: -2px;
}
.qa-back-section {
		text-align: center;
		padding: 20px 0 40px;
}
.qa-back-btn {
		padding: 12px 40px;
		background-color: var(--color-gray);
		color: var(--color-white);
		border: none;
		border-radius: 25px;
		font-size: var(--font-size-base);
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		text-decoration: none;
		display: inline-block;
}
.qa-back-btn:hover {
		background-color: var(--hover-gray);
		color: var(--color-white);
}
/* ============================================================
 * 20. Product Downloads
 * ============================================================ */
/* ---- 20-1. 搜尋區域 ---- */
.downloads-search-section {
		background: -o-linear-gradient(315deg, #0066cc 0%, #0052a3 100%);
		background: linear-gradient(135deg, #0066cc 0%, #0052a3 100%);
		padding: 60px 0;
		color: var(--color-white);
}
.downloads-search-title {
		font-size: var(--font-size-3xl);
		font-weight: 700;
		margin-bottom: 15px;
		text-align: center;
}
.downloads-search-subtitle {
		font-size: var(--font-size-base);
		margin-bottom: 30px;
		text-align: center;
		opacity: 0.9;
}
.downloads-search-box {
		max-width: 700px;
		margin: 0 auto;
		position: relative;
}
.downloads-search-input {
		width: 100%;
		height: 50px;
		border: 1px solid var(--dark-gray);
		border-radius: 25px;
		padding: 0 60px 0 25px;
		font-size: var(--font-size-base);
}
.downloads-search-input:focus {
		border: 1px solid var(--dark-gray);
}
.downloads-search-btn {
		position: absolute;
		right: 5px;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 40px;
		height: 40px;
		border: none;
		background-color: transparent;
		border-radius: 50%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.downloads-search-btn:hover img {
		-webkit-filter: var(--svg-hover-dark-blue);
		filter: var(--svg-hover-dark-blue);
}
.downloads-search-btn img {
		width: 20px;
		height: 20px;
}
/* ---- 20-2. Sort Dropdown ---- */
.sort-dropdown {
		position: relative;
}
.sort-btn {
		min-width: 80px;
		padding: 8px 16px;
		font-size: var(--font-size-base);
		color: var(--color-gray-dark);
		border: 1px solid #ddd;
		border-radius: 4px;
		background-color: var(--color-white);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.sort-btn:hover {
		border-color: #999;
		background-color: #f8f9fa;
}
.sort-btn:focus {
		-webkit-box-shadow: none;
		box-shadow: none;
		border-color: #999;
}
.sort-label {
		font-weight: 500;
}
.sort-dropdown .dropdown-menu {
		min-width: 220px;
		padding: 8px 0;
		border: 1px solid #ddd;
		border-radius: 4px;
		-webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
		margin-top: 4px;
}
.sort-dropdown .dropdown-item {
		padding: 10px 16px;
		font-size: var(--font-size-base);
		color: var(--dark-gray);
		-webkit-transition: all 0.2s ease;
		-o-transition: all 0.2s ease;
		transition: all 0.2s ease;
}
.sort-dropdown .dropdown-item:hover {
		background-color: #f0f0f0;
		color: #0066cc;
}
.sort-dropdown .dropdown-item:active {
		background-color: #e0e0e0;
}
.sort-dropdown .sort-btn::after {
		display: none;
}
.sort-dropdown .sort-arrow {
		width: 16px;
		height: 16px;
		-webkit-transition: -webkit-transform 0.3s ease;
		transition: -webkit-transform 0.3s ease;
		-o-transition: transform 0.3s ease;
		transition: transform 0.3s ease;
		transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.sort-dropdown .sort-btn[aria-expanded="true"] .sort-arrow {
		-webkit-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
		transform: rotate(180deg);
}
/* ============================================================
 * 21. FAQ Section
 * ============================================================ */
#faq {
		padding-top: 50px;
		padding-bottom: 50px;
}
.faq-header {
		text-align: center;
		margin-bottom: 40px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 20px;
}
.faq-header h3 {
		font-size: var(--font-size-lg);
		font-weight: 700;
		margin-bottom: 0;
		text-wrap: nowrap;
}
.faq-line {
		width: 100%;
		height: 1px;
		background-color: var(--color-gray);
}
.faq-list.light-mode .faq-item {
		background-color: var(--color-white);
		margin-bottom: 10px;
}
.faq-list.light-mode .faq-item:hover {
		background-color: var(--color-light-gray);
}
/* Filter Tabs Light Mode */
.downloads-filter-tabs.light {
		border-bottom-color: var(--border-color);
		background-color: var(--color-white);
}
/* ============================================================
 * 22. RMA Service
 * ============================================================ */
.rma-hero-section {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 20px;
		margin-bottom: 50px;
}
.rma-hero-bg {
		position: relative;
		aspect-ratio: 21 / 3.5;
		border-radius: 8px 0 0 8px;
		overflow: hidden;
}
.rma-hero-bg img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		-o-object-position: center;
		object-position: center;
}
.rma-policy-link {
		position: relative;
		background-color: var(--dark-blue);
		color: var(--color-white);
		padding: 40px 30px;
		border-radius: 0 8px 8px 0;
		text-decoration: none;
		font-size: var(--font-size-base-lg);
		font-weight: 600;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		min-width: 200px;
}
.rma-content {
		margin: 0 auto;
}
.rma-warranty-text {
		line-height: 1.8;
		margin-bottom: 40px;
		font-size: var(--font-size-base);
}
.rma-procedure-title {
		font-size: var(--font-size-lg);
		font-weight: 600;
		margin-bottom: 20px;
}
.rma-procedure-intro {
		margin-bottom: 40px;
		font-size: var(--font-size-base);
}
.rma-steps-two {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 20px;
		margin-bottom: 20px;
}
.rma-step-group {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
}
.rma-step-card {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		background-color: var(--color-white);
		border: 2px solid var(--dark-blue);
		border-radius: 8px;
		padding: 10px;
		position: relative;
		gap: 15px;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		color: var(--dark-blue);
		font-size: var(--font-size-base);
		-webkit-transition: var(--transition-basic);
		-o-transition: var(--transition-basic);
		transition: var(--transition-basic);
}
.rma-step-card:hover {
		background-color: var(--cloud-blue);
}
.rma-step-number {
		width: 80px;
		height: 60px;
		background-color: var(--dark-blue);
		color: var(--color-white);
		border-radius: 8px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		font-size: var(--font-size-4lg);
		font-weight: 700;
}
.rma-step-content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		color: var(--dark-blue);
		font-size: var(--font-size-base);
		line-height: 1.6;
}
.rma-step-content a {
		color: var(--dark-blue);
		text-decoration: none;
		font-weight: 600;
}
.rma-step-content a:hover {
		text-decoration: underline;
}
.rma-step-card.active {
		background-color: var(--dark-blue);
		color: var(--color-white);
}
.rma-step-card:hover .rma-step-number, .rma-step-card.active .rma-step-number {
		background-color: var(--color-white);
		color: var(--dark-blue);
}
.rma-step-card:hover .rma-step-content, .rma-step-card.active .rma-step-content {
		color: var(--color-white);
}
.rma-step-card:hover .rma-step-content a, .rma-step-card.active .rma-step-content a {
		color: var(--color-yellow);
}
.rma-disclaimer {
		font-size: var(--font-size-base);
		line-height: 1.8;
}
/* ============================================================
 * 23. Technical / Contact Form
 * ============================================================ */
.question-section-title {
		font-size: var(--font-size-base-lg);
		font-weight: 600;
		margin-bottom: 20px;
		margin-top: 40px;
		color: var(--dark-gray);
}
.contact-tabs {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		gap: 40px;
		border-bottom: 2px solid #e0e0e0;
		margin-bottom: 40px;
}
.contact-tab {
		padding: 15px 0;
		color: var(--color-gray);
		text-decoration: none;
		font-weight: 500;
		border-bottom: 5px solid transparent;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		position: relative;
		top: 2px;
		font-size: var(--font-size-base-lg);
}
.contact-tab:hover {
		color: var(--dark-blue);
}
.contact-tab.active {
		border-bottom-color: var(--dark-blue);
}
.contact-form-section {
		max-width: 100%;
		margin: 0 auto;
}
.contact-sidebar {}
.contact-option {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		margin-bottom: 10px;
}
.contact-option input[type="radio"] {
		margin-right: 15px;
		width: 20px;
		height: 20px;
}
.form-section-title {
		font-size: var(--font-size-lg);
		font-weight: 600;
		margin-bottom: 10px;
		color: var(--dark-gray);
}
.form-section-subtitle {
		color: var(--color-gray-dark);
		margin-bottom: 30px;
}
/* ============================================================
 * 24. Sales Inquiries List
 * ============================================================ */
.inquiry-list-header {
		text-align: center;
		margin-bottom: 30px;
		font-size: var(--font-size-base);
		display: block;
		height: 45px;
}
.inquiry-list-header .add-btn {
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
}
.inquiry-item {
		background-color: var(--color-white);
		border: 1px solid var(--color-gray);
		border-radius: 8px;
		padding: 10px 25px;
		margin-bottom: 10px;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		position: relative;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.inquiry-item:hover {
		background-color: var(--color-light-gray);
}
.inquiry-item-header > div {
		padding: 2px 0;
		font-size: var(--font-size-base);
}
.inquiry-info-label {
		width: 180px;
		display: inline-block;
		text-align: end;
}
.inquiry-info-value {
		display: inline-block;
		text-align: start;
		padding-left: 10px;
		color: var(--dark-blue);
}
.inquiry-view-btn {
		width: 36px;
		height: 36px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		cursor: pointer;
		padding: 0;
		background-color: transparent;
		border: 0;
}
/* ============================================================
 * 25. My Vecow
 * ============================================================ */
.myvecow-welcome {
		text-align: start;
		margin: auto;
		max-width: 100%;
}
.myvecow-welcome h5 {
		font-size: var(--font-size-base-lg);
		color: var(--dark-gray);
		margin-bottom: 15px;
}
.myvecow-welcome p {
		color: var(--color-gray-dark);
		font-size: var(--font-size-base);
		line-height: 1.6;
}
.myvecow-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
		max-width: 100%;
		margin: 0 auto;
		padding: 40px 0;
}
.myvecow-grid li .btn {
		background-color: var(--color-light-gray);
		border-radius: 12px;
		border: 1px solid #9f9f9f;
		padding: 0.625rem 1.25rem;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 0.3125rem;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		width: 100%;
		height: 150px;
		position: relative;
		-webkit-transition: var(--transition-basic);
		-o-transition: var(--transition-basic);
		transition: var(--transition-basic);
		-webkit-box-shadow: 0rem 0.25rem 0.25rem 0rem rgba(0, 0, 0, 0.25);
		box-shadow: 0rem 0.25rem 0.25rem 0rem rgba(0, 0, 0, 0.25);
}
.myvecow-grid li .btn .text {
		color: var(--color-gray);
		text-align: center;
		line-height: var(--line-height-tight);
}
.myvecow-grid li .btn > img {
		-ms-flex-negative: 0;
		flex-shrink: 0;
		width: 30px;
		height: 30px;
		margin-bottom: 10px;
		position: relative;
		overflow: visible;
		aspect-ratio: 1;
}
.myvecow-grid li .btn:hover {
		color: var(--color-white);
		background-color: var(--secondary-blue);
		-webkit-transition: var(--transition-basic);
		-o-transition: var(--transition-basic);
		transition: var(--transition-basic);
}
.myvecow-grid li .btn:hover > img {
		-webkit-filter: var(--svg-hover-white);
		filter: var(--svg-hover-white);
}
/* ============================================================
 * 26. Product Delete Button & 刪除動畫
 * ============================================================ */
.product-delete {
		position: absolute;
		top: -2px;
		right: 10px;
		width: 36px;
		height: 36px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		z-index: 10;
		padding: 0;
		border: 0;
		background-color: transparent;
}
.product-delete:hover img {
		-webkit-filter: var(--svg-hover-blue);
		filter: var(--svg-hover-blue);
}
.product-delete img {
		width: 25px;
}
.product-info-card.removing {
		-webkit-animation: fadeOutScale 0.3s ease forwards;
		animation: fadeOutScale 0.3s ease forwards;
}
@-webkit-keyframes fadeOutScale {
		0% {
				opacity: 1;
				-webkit-transform: scale(1);
				transform: scale(1);
		}
		100% {
				opacity: 0;
				-webkit-transform: scale(0.8);
				transform: scale(0.8);
		}
}
@keyframes fadeOutScale {
		0% {
				opacity: 1;
				-webkit-transform: scale(1);
				transform: scale(1);
		}
		100% {
				opacity: 0;
				-webkit-transform: scale(0.8);
				transform: scale(0.8);
		}
}
/* ============================================================
 * 27. Request Inquiry
 * ============================================================ */
/* ---- 27-1. Inquiry Table ---- */
.inquiry-limit-text {
		text-align: center;
		font-size: var(--font-size-base);
		margin-bottom: 20px;
}
.inquiry-limit-text .limit-number {
		font-size: var(--font-size-lg);
		font-weight: 700;
		color: var(--secondary-blue);
}
.inquiry-table {
		width: 100%;
		margin-bottom: 40px;
}
.inquiry-table thead {
		border-bottom: 2px solid var(--border-color);
}
.inquiry-table th {
		padding: 15px 10px;
		font-weight: 600;
		text-align: center;
		font-size: var(--font-size-base);
}
.inquiry-table td {
		padding: 15px 10px;
		vertical-align: middle;
		font-size: var(--font-size-base);
}
.inquiry-table .product-name {
		color: var(--dark-blue);
		font-weight: 600;
		text-decoration: none;
		font-size: var(--font-size-base-lg);
}
.inquiry-table .product-name:hover {
		color: var(--secondary-blue);
}
.inquiry-table .product-description {
		font-size: var(--font-size-base);
		color: var(--color-gray-dark);
		margin: 5px 0 0 0;
}
.inquiry-table .remove-btn {
		background-color: var(--color-dark-red);
		color: var(--color-white);
		border: none;
		border-radius: 4px;
		padding: 8px 30px;
		min-width: 150px;
		font-size: var(--font-size-sm);
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		display: -webkit-inline-box;
		display: -ms-inline-flexbox;
		display: inline-flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 5px;
}
.inquiry-table .remove-btn-outline {
		background-color: transparent;
		color: var(--color-dark-red);
		border: 1px solid var(--color-dark-red);
		border-radius: 4px;
		padding: 8px 30px;
		min-width: 150px;
		font-size: var(--font-size-sm);
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		display: -webkit-inline-box;
		display: -ms-inline-flexbox;
		display: inline-flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 5px;
}
.inquiry-table .remove-btn-outline:hover {
		color: var(--color-white);
		background-color: var(--color-dark-red);
}
.inquiry-table .remove-btn:hover {
		color: var(--color-white);
		background-color: var(--color-red);
}
.inquiry-table .remove-btn-outline img {
		-webkit-filter: var(--svg-hover-red);
		filter: var(--svg-hover-red);
		width: 20px;
}
.inquiry-table .remove-btn-outline:hover img {
		-webkit-filter: var(--svg-hover-white);
		filter: var(--svg-hover-white);
}
.inquiry-table .remove-btn img {
		width: 20px;
}
/* ---- 27-2. Form Styles ---- */
.inquiry-form-section {
		max-width: 100%;
		margin: 0 auto;
}
.odm-request-wrapper {
		margin: 20px 0;
}
.odm-request-wrapper .form-check {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 10px;
}
.odm-request-wrapper .form-check-input {
		width: 20px;
		height: 20px;
		cursor: pointer;
}
.odm-request-wrapper .form-check-label {
		font-size: var(--font-size-base);
		cursor: pointer;
		margin: 0;
}
.captcha-block {
		margin: 30px 0 20px 0;
		text-align: center;
}
.captcha-image {
		height: 40px;
		border: 1px solid #dee2e6;
		border-radius: 4px;
}
.captcha-refresh {
		background-color: transparent;
		border: none;
		cursor: pointer;
		padding: 5px;
}
.captcha-refresh img {
		width: 24px;
		height: 24px;
}
.form-input.short {
		max-width: 200px;
}
/* ============================================================
 * 28. Technical Support
 * ============================================================ */
.user-info-section {
		margin-bottom: 70px;
}
.user-info-row {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 30px;
		margin-bottom: 15px;
}
.user-info-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		min-width: 200px;
}
.user-info-label {
		color: var(--color-gray);
		font-size: var(--font-size-base);
}
.user-info-value {
		color: var(--dark-blue);
		font-size: var(--font-size-base);
		padding-left: 10px;
}
/* ============================================================
 * 29. Company Information
 * ============================================================ */
.company-info-section {
		max-width: 100%;
		margin: 0 auto;
}
.info-sidebar {
		position: sticky;
		top: 100px;
}
.info-sidebar h5 {
		font-size: var(--font-size-lg);
		margin-bottom: 20px;
		color: var(--color-gray);
		line-height: 1.25;
		font-weight: 300;
}
.contact-info-card {
		margin-bottom: 50px;
}
.contact-info-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 15px;
		margin-bottom: 20px;
}
.contact-info-badge {
		background-color: var(--color-gray);
		color: var(--color-white);
		padding: 8px 16px;
		border-radius: 4px;
		font-size: var(--font-size-base-lg);
}
.contact-info-title {
		font-size: var(--font-size-lg);
		color: var(--color-gray);
		margin: 0;
}
.contact-info-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		gap: 15px;
		margin-bottom: 10px;
		font-size: var(--font-size-base);
		color: var(--color-gray);
}
.contact-info-item img {
		width: 25px;
		height: 25px;
		margin-top: 2px;
		-ms-flex-negative: 0;
		flex-shrink: 0;
}
.contact-info-item .info-label {
		min-width: 80px;
}
.contact-info-item .info-value {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
}
.contact-info-item a {
		color: var(--primary-color);
		text-decoration: none;
}
.contact-info-item a:hover {
		text-decoration: underline;
}
.email-notice-box {
		background-color: var(--dark-blue);
		color: var(--color-white);
		padding: 30px;
		border-radius: 8px;
		margin-bottom: 30px;
		font-weight: normal;
		font-size: var(--font-size-base-lg);
}
.email-notice-box h5 {
		color: var(--color-white);
		margin-bottom: 15px;
}
.email-notice-box p {
		margin-bottom: 10px;
		line-height: 1.6;
}
.email-notice-box a {
		color: var(--color-white);
		font-weight: 600;
		text-decoration: underline;
}
/* ============================================================
 * 30. About Vecow Page
 * ============================================================ */
/* ---- 30-1. Hero Section ---- */
.about-hero {
		position: relative;
		width: 100%;
		height: 640px;
		overflow: hidden;
		background-color: var(--color-white);
}
.about-hero-bg {
		position: fixed;
		width: 70%;
		height: auto;
		-o-object-fit: contain;
		object-fit: contain;
		left: 0;
		top: 0;
}
.about-hero-content {
		position: relative;
		z-index: 2;
		background-color: var(--dark-blue);
		color: var(--color-white);
		padding: 20px;
		border-radius: 8px 0 0 8px;
		display: -webkit-inline-box;
		display: -ms-inline-flexbox;
		display: inline-flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
		word-break: break-all;
		width: calc(100% - (100% - 1135px) * 1.25);
}
.about-hero-content .section-title {
		color: var(--color-white);
		margin: 0;
		text-align: start;
}
.about-hero-content .about-hero-text {}
/* ---- 30-2. Company Info Section ---- */
.about-info {
		background-color: #BAE2F6;
		padding: 80px 0;
		position: relative;
		z-index: 2;
}
.about-info-text {
		padding-right: 40px;
}
.about-info-text p {
		font-size: var(--font-size-base);
		line-height: 1.8;
		color: var(--dark-gray);
		margin-bottom: 20px;
}
.about-info-badge {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		padding: 40px;
}
.about-info-badge img {
		max-width: 280px;
}
/* ---- 30-3. Vecow Offers Section ---- */
.vecow-offers {
		padding: 80px 0;
		background-color: var(--color-white);
		position: relative;
		z-index: 2;
}
.vecow-offers .section-subtitle {
		color: var(--secondary-blue);
}
.offers-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(5, 1fr);
		gap: 20px;
}
.offer-item {
		text-align: center;
		-webkit-transition: -webkit-transform 0.3s ease;
		transition: -webkit-transform 0.3s ease;
		-o-transition: transform 0.3s ease;
		transition: transform 0.3s ease;
		transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.offer-item:hover {
		-webkit-transform: translateY(-5px);
		-ms-transform: translateY(-5px);
		transform: translateY(-5px);
}
.offer-icon {
		width: 100px;
		height: 100px;
		margin: 0 auto 20px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}
.offer-icon img {
		max-width: 100%;
		height: auto;
		-webkit-filter: grayscale(100%);
		filter: grayscale(100%);
		-webkit-transition: -webkit-filter 0.3s ease;
		transition: -webkit-filter 0.3s ease;
		-o-transition: filter 0.3s ease;
		transition: filter 0.3s ease;
		transition: filter 0.3s ease, -webkit-filter 0.3s ease;
}
.offer-item:hover .offer-icon img {
		-webkit-filter: grayscale(0%);
		filter: grayscale(0%);
}
.offer-title {
		font-size: var(--font-size-base);
		font-weight: 500;
		color: var(--dark-gray);
		line-height: 1.4;
		margin: 0;
}
/* ---- 30-4. Contact CTA Section ---- */
.contact-cta {
		background-color: var(--dark-blue);
		padding: 0;
		position: relative;
		overflow: hidden;
}
.contact-cta-bg {}
.contact-cta-content {
		color: var(--color-white);
		padding: 0 40px 0 75px;
}
.contact-cta-title {
		font-size: var(--font-size-2xl);
		font-weight: 600;
		margin-bottom: 20px;
		color: var(--color-white);
}
.contact-cta-text {
		font-size: var(--font-size-base);
		line-height: 1.8;
		margin-bottom: 30px;
		opacity: 0.95;
		color: var(--color-light-gray);
}
.contact-cta-buttons a {
		color: var(--color-light-gray);
		text-decoration: none;
}
.contact-cta-buttons a:hover {
		color: var(--color-white);
}
.contact-cta-image {
		position: relative;
		aspect-ratio: 16 / 9;
}
.contact-cta-image img {
		position: absolute;
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
}
/* ============================================================
 * 31. Partners Page
 * ============================================================ */
/* ---- 31-1. Hero Section ---- */
.partners-hero {
		background: -o-linear-gradient(315deg, #00a8e8 0%, #0066cc 100%);
		background: linear-gradient(135deg, #00a8e8 0%, #0066cc 100%);
		padding: 80px 0;
		color: var(--color-white);
		position: relative;
		overflow: hidden;
}
.partners-hero .container-xxl {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		gap: 60px;
}
.partners-hero-content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		background-color: var(--dark-blue);
		padding: 10px 20px;
		border-radius: 16px;
		max-width: 80%;
}
.partners-hero-content .section-title {
		color: var(--color-white);
		margin: 10px 0;
}
.partners-hero-content p {
		color: var(--sp-blue);
		font-size: var(--font-size-base);
}
.partners-hero-visual {
		position: absolute;
		max-width: 70%;
		right: 0;
}
.partners-hero-visual img {
		max-width: 100%;
		height: auto;
}
/* ---- 31-2. Partners Logos ---- */
.partners-logos-container {
		position: relative;
		min-height: 500px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}
.partners-logos-group {
		display: none;
		width: 100%;
		padding: 0 50px;
}
.partners-logos-group.active {
		display: block;
		-webkit-animation: fadeIn 0.5s ease;
		animation: fadeIn 0.5s ease;
}
@-webkit-keyframes fadeIn {
		from {
				opacity: 0;
				-webkit-transform: translateY(10px);
				transform: translateY(10px);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
@keyframes fadeIn {
		from {
				opacity: 0;
				-webkit-transform: translateY(10px);
				transform: translateY(10px);
		}
		to {
				opacity: 1;
				-webkit-transform: translateY(0);
				transform: translateY(0);
		}
}
.partners-logos-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
		-webkit-transition: opacity 0.3s ease;
		-o-transition: opacity 0.3s ease;
		transition: opacity 0.3s ease;
}
.partners-logos-grid.blur {
		opacity: 0.3;
		pointer-events: none;
}
.partner-logo-item {
		background-color: var(--color-white);
		border-radius: 8px;
		padding: 5px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		min-height: 100px;
		-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		-o-transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
}
.partner-logo-item:hover {
		-webkit-transform: translateY(-5px);
		-ms-transform: translateY(-5px);
		transform: translateY(-5px);
		-webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
.partner-logo-item img {
		max-width: 100%;
		max-height: 100%;
		-o-object-fit: contain;
		object-fit: contain;
}
.partners-highlights-list {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
}
.partner-highlight-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		-o-transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
}
.partner-highlight-item:hover {
		-webkit-transform: translateX(5px);
		-ms-transform: translateX(5px);
		transform: translateX(5px);
}
.highlight-logos {
		max-width: 150px;
}
.highlight-content {
		padding-left: 20px;
		font-size: var(--font-size-base-lg);
		color: var(--color-white);
		line-height: 1.5;
}
.highlight-content .header-link {
		color: var(--sp-blue);
		margin: 15px 0;
}
.highlight-content .header-link img {
		-webkit-filter: var(--svg-hover-sp-blue);
		filter: var(--svg-hover-sp-blue);
}
/* ---- 31-3. Brand Detail Panel ---- */
.brand-detail-panel {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		margin: auto;
		width: 100%;
		max-width: calc(100% - 80px);
		height: -webkit-fit-content;
		height: -moz-fit-content;
		height: fit-content;
		min-height: 360px;
		background-color: rgba(255, 255, 255, 0.98);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		border-radius: 16px;
		padding: 10px 20px;
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		transform: translateX(20px);
		-webkit-transition: all 0.4s ease;
		-o-transition: all 0.4s ease;
		transition: all 0.4s ease;
		z-index: 10;
		-webkit-box-shadow: -5px 0 30px rgba(0, 0, 0, 0.1);
		box-shadow: -5px 0 30px rgba(0, 0, 0, 0.1);
}
.brand-detail-panel.active {
		opacity: 1;
		visibility: visible;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
}
.brand-detail-content {
		position: relative;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}
.brand-detail-close {
		position: absolute;
		top: -40px;
		right: 0;
		background-color: transparent;
		border: none;
		font-size: var(--font-size-4lg);
		color: var(--color-gray-dark);
		cursor: pointer;
		width: 40px;
		height: 40px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-transition: color 0.3s ease;
		-o-transition: color 0.3s ease;
		transition: color 0.3s ease;
}
.brand-detail-close:hover {
		color: var(--color-black);
}
.brand-detail-logo {
		margin-bottom: 20px;
		max-width: 200px;
}
.brand-detail-logo img {
		width: 100%;
		height: auto;
}
.brand-detail-description {
		max-width: 600px;
		text-align: center;
}
.brand-detail-description p {
		color: var(--color-gray-dark);
		line-height: 1.8;
		font-size: var(--font-size-base);
}
/* ============================================================
 * 32. ESG Cards Section
 * ============================================================ */
.esg-cards {
		padding: 80px 0;
		background-color: #f8f9fa;
}
.esg-card {
		background-color: transparent;
		overflow: hidden;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
}
.esg-card-image {
		width: 100%;
		height: 250px;
		overflow: hidden;
		-webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.25);
		box-shadow: 0 4px 5px rgba(0, 0, 0, 0.25);
		border-radius: 8px;
		aspect-ratio: 4 / 3;
}
.esg-card-image img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		-webkit-transition: -webkit-transform 0.5s ease;
		transition: -webkit-transform 0.5s ease;
		-o-transition: transform 0.5s ease;
		transition: transform 0.5s ease;
		transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}
.esg-card:hover .esg-card-image img {
		-webkit-transform: scale(1.1);
		-ms-transform: scale(1.1);
		transform: scale(1.1);
}
.esg-card-content {
		padding: 30px 0;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
}
.esg-card-title {
		font-size: var(--font-size-lg);
		margin-bottom: 15px;
}
.esg-card-text {
		font-size: var(--font-size-base);
}
/* ============================================================
 * 33. Search Result Items
 * ============================================================ */
.result-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 20px;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		border: 0;
		border-bottom: 1px solid var(--border-color) !important;
		margin-bottom: 10px;
		-webkit-transition: var(--transition-basic);
		-o-transition: var(--transition-basic);
		transition: var(--transition-basic);
}
.result-item.product-card {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
}
.result-item:hover {
		-webkit-box-shadow: none;
		box-shadow: none;
		-webkit-transform: translateY(-3px);
		-ms-transform: translateY(-3px);
		transform: translateY(-3px);
		-webkit-transition: var(--transition-basic);
		-o-transition: var(--transition-basic);
		transition: var(--transition-basic);
}
.result-item.product-card .product-image {
		width: 200px;
}
.result-item.product-card .product-info {
		padding: 0;
}
.result-item.product-card .product-desc {
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		margin-bottom: 10px;
}
.result-item.product-card .product-category {
		font-size: var(--font-size-base-lg);
}
.result-item.news-card {
		border: 0 !important;
		border-bottom: 1px solid var(--border-color) !important;
		-webkit-box-shadow: none;
		box-shadow: none;
		padding: 0 !important;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
}
.result-item.news-card .card-title {
		font-size: var(--font-size-base-lg);
		color: var(--dark-blue);
		margin-bottom: 0;
}
.result-item.news-card .card-desc {
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		margin-bottom: 0;
}
.result-item.video-card .video-thumbnail {
		width: 200px;
}
.result-item.video-card .card-content {
		width: calc(100% - 200px - 20px);
}
.result-item.video-card {
		border: 0 !important;
		border-bottom: 1px solid var(--border-color) !important;
		-webkit-box-shadow: none;
		box-shadow: none;
		padding: 0 0 10px 0 !important;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
}
.result-item.video-card .card-title {
		font-size: var(--font-size-base-lg);
		color: var(--dark-blue);
}
.result-item.video-card .card-desc {
		-webkit-box-flex: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
		margin-bottom: 0;
}
.result-item.download-item {
		border: 0 !important;
		border-bottom: 1px solid var(--border-color) !important;
		-webkit-box-shadow: none;
		box-shadow: none;
		padding: 0 0 10px 0 !important;
}
.result-item.download-item:hover {
		background-color: transparent;
}
/* ============================================================
 * 34. Newsletter Modal
 * ============================================================ */
/* ---- 34-1. Newsletter Success Modal ---- */
.newsletter-success-modal {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.7);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		z-index: 10000;
		opacity: 0;
		visibility: hidden;
		-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
		-o-transition: opacity 0.3s ease, visibility 0.3s ease;
		transition: opacity 0.3s ease, visibility 0.3s ease;
}
.newsletter-success-modal.show {
		opacity: 1;
		visibility: visible;
}
.newsletter-success-content {
		background-color: var(--color-white);
		border-radius: 12px;
		padding: 60px 40px 40px;
		max-width: 500px;
		width: 90%;
		position: relative;
		text-align: center;
		-webkit-transform: scale(0.9);
		-ms-transform: scale(0.9);
		transform: scale(0.9);
		-webkit-transition: -webkit-transform 0.3s ease;
		transition: -webkit-transform 0.3s ease;
		-o-transition: transform 0.3s ease;
		transition: transform 0.3s ease;
		transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.newsletter-success-modal.show .newsletter-success-content {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
}
.newsletter-success-close {
		position: absolute;
		top: 20px;
		right: 20px;
		background-color: transparent;
		border: none;
		font-size: var(--font-size-lg);
		color: var(--color-gray);
		cursor: pointer;
		padding: 5px;
		line-height: 1;
		-webkit-transition: color 0.3s;
		-o-transition: color 0.3s;
		transition: color 0.3s;
}
.newsletter-success-close:hover {
		color: var(--dark-blue);
}
.newsletter-success-title {
		font-size: var(--font-size-3xl);
		margin-bottom: 20px;
		font-weight: 400;
}
.newsletter-success-title b {
		font-weight: 700;
}
.newsletter-success-text {
		font-size: var(--font-size-base);
		color: var(--color-gray);
		line-height: 1.6;
		margin-bottom: 30px;
}
#newsletterSuccessCloseBtn {
		min-width: 150px;
}
/* ---- 34-2. Newsletter Modal ---- */
.newsletter-modal {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 9999;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		opacity: 0;
		visibility: hidden;
		-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
		-o-transition: opacity 0.3s ease, visibility 0.3s ease;
		transition: opacity 0.3s ease, visibility 0.3s ease;
}
.newsletter-modal.show {
		opacity: 1;
		visibility: visible;
}
.newsletter-modal-content {
		background-color: var(--color-white);
		border-radius: 8px;
		padding: 40px;
		max-width: 600px;
		width: 90%;
		max-height: 90vh;
		overflow-y: auto;
		position: relative;
		-webkit-box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}
.newsletter-close {
		position: absolute;
		top: 20px;
		right: 20px;
		background-color: transparent;
		border: none;
		font-size: var(--font-size-lg);
		cursor: pointer;
		color: var(--color-gray-dark);
		-webkit-transition: color 0.3s ease;
		-o-transition: color 0.3s ease;
		transition: color 0.3s ease;
		padding: 0;
		width: 20px;
		height: 20px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}
.newsletter-close:hover {
		color: var(--color-black);
}
.newsletter-title {
		font-size: var(--font-size-xl);
		margin-bottom: 16px;
		text-align: center;
		font-weight: 300;
}
.newsletter-title b {
		font-weight: bold;
}
.newsletter-subtitle {
		font-size: var(--font-size-base);
		color: var(--color-gray-dark);
		margin-bottom: 32px;
		line-height: 1.6;
}
/* ============================================================
 * 35. 通用組件
 * ============================================================ */
/* ---- 35-1. Grid System ---- */
.section-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.grid-2 {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr;
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
}
.grid-3 {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
}
/* ---- 35-2. Card Reset ---- */
.card.reset, .card.reset .card-header, .card.reset .card-body, .card.reset .card-footer {
		border: 0;
		background-color: transparent;
		padding: 0;
		border-radius: 0;
}
/* ---- 35-3. News Card ---- */
.news-card {
		gap: 20px;
		background-color: var(--color-white);
		border: 1px solid var(--border-color) !important;
		-webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
		box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		overflow: hidden;
		padding: 20px 20px 5px !important;
}
.news-card .card-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.news-card .card-body {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 10px;
}
.news-card .card-footer {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 5px;
		margin-top: auto;
}
.news-card:hover .card-title {
		color: var(--dark-blue);
}
.news-card .card-title {
		font-size: var(--font-size-base-2lg);
		font-weight: 500;
		color: var(--color-gray);
		line-height: 1.5;
}
.news-card .card-desc {
		font-size: var(--font-size-sm);
		color: var(--color-gray);
		line-height: 1.5;
}
/* ---- 35-4. Event Card ---- */
.event-card {
		background-color: var(--color-white);
		border: 1px solid var(--border-color) !important;
		-webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
		box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		overflow: hidden;
}
.event-card .card-header {
		padding: 15px 15px 0 15px !important;
		text-align: end;
}
.event-card .card-image {
		padding: 45px 29px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		aspect-ratio: 16 / 9;
}
.event-card .card-image a {
		width: 100%;
		height: 100%;
		display: block;
}
.event-card .card-image img {
		width: 100%;
		height: 100%;
		-o-object-fit: contain;
		object-fit: contain;
}
.event-card .card-content {
		padding: 0 20px 5px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
}
.event-card .card-title {
		font-size: var(--font-size-base-2lg);
		font-weight: 500;
		color: var(--color-gray);
		line-height: 1.5;
}
.event-card:hover .card-title {
		color: var(--dark-blue);
}
.event-card:hover .card-image {
		-webkit-animation: imageFlash 0.6s ease-in-out;
		animation: imageFlash 0.6s ease-in-out;
}
@-webkit-keyframes imageFlash {
		0% {
				opacity: 1;
		}
		50% {
				opacity: 0.5;
		}
		100% {
				opacity: 1;
		}
}
@keyframes imageFlash {
		0% {
				opacity: 1;
		}
		50% {
				opacity: 0.5;
		}
		100% {
				opacity: 1;
		}
}
.event-card .card-desc {
		font-size: var(--font-size-sm);
		color: var(--color-gray);
		line-height: 1.5;
}
/* ---- 35-5. Video Card ---- */
.video-card {
		gap: 20px;
		background-color: var(--color-white);
		border: 1px solid var(--border-color) !important;
		-webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
		box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		overflow: hidden;
		padding: 20px 20px 5px !important;
}
.video-card .card-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.video-card:hover .card-title {
		color: var(--dark-blue);
}
.video-card .card-title {
		font-size: var(--font-size-base-2lg);
		font-weight: 500;
		color: var(--color-gray);
		line-height: 1.5;
		margin: 10px auto;
}
.merged-image-wrapper {
		position: relative;
		width: 100%;
		height: 100%;
}
.video-card:hover .play-button {
		-webkit-transform: scale(1.25);
		-ms-transform: scale(1.25);
		transform: scale(1.25);
		opacity: 1;
}
/* ---- 35-6. Resource Grid & Cards ---- */
.grid-inner {
		padding: 0 50px;
}
.cards-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(4, 1fr);
		gap: 20px;
		margin-bottom: 50px;
}
.card-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		text-decoration: none !important;
}
.card-item.disabled {
		pointer-events: none;
		opacity: .5;
}
.card-item.disabled .card-image-wrapper {
		border-color: var(--color-gray);
}
.card-item.disabled .card-image {
		-webkit-filter: grayscale(100%);
		filter: grayscale(100%);
}
.card-item.disabled .card-tag {
		background-color: var(--color-gray);
}
.card-item .card-image-wrapper {
		position: relative;
		width: 100%;
		border: 5px solid #005eac;
		aspect-ratio: 5 / 7;
}
.card-item .card-image {
		-o-object-fit: cover;
		object-fit: cover;
		width: 100%;
		height: 100%;
}
.card-item .card-tag {
		position: absolute;
		top: 30px;
		left: 0;
		background-color: #005eac;
		padding: 10px 20px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.card-item .tag-text {
		color: var(--color-white);
		font-size: var(--font-size-base);
}
.card-item .card-date {
		margin-top: 10px;
		color: var(--color-gray);
		font-size: var(--font-size-base);
}
.card-item .card-info {
		position: relative;
		width: 100%;
		height: 100%;
}
.card-expand {
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		-webkit-transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
		-o-transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
		transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
		background-color: rgba(var(--dark-blue-rgb), .9);
		color: var(--color-white);
		position: absolute;
		bottom: 0;
		z-index: 3;
		width: 100%;
}
.card-item:hover .card-expand {
		max-height: 500px;
		height: 100%;
		opacity: 1;
}
/* ============================================================
 * 36. Swiper 通用樣式
 * ============================================================ */
.swiper-button-none .swiper-button-prev, .swiper-button-none .swiper-button-next {
		display: none !important;
}
.swiper-pagination {
		bottom: 0 !important;
}
.swiper-pagination-bullet {
		width: 12px;
		height: 12px;
		background-color: var(--color-gray);
		opacity: 1;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.swiper-pagination-bullet-active {
		background-color: var(--color-black);
		width: 30px;
		border-radius: 12px;
}
.swiper-button-prev, .swiper-button-next {
		color: #0071c5;
		width: 40px;
		height: 40px;
		background-color: var(--color-white);
		border-radius: 50%;
		-webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.swiper-button-next svg, .swiper-button-prev svg {
		display: none !important;
}
.swiper-button-prev:after, .swiper-button-next:after {
		font-size: var(--font-size-base-2lg);
}
.swiper-button-prev:hover, .swiper-button-next:hover {
		background-color: #0071c5;
		color: var(--color-white);
}
/* ============================================================
 * 37. Partners Section（產品頁）
 * ============================================================ */
#partners {
		padding: 50px 0;
		background-color: var(--color-white);
		border-top: 1px solid #ddd;
}
.partners-swiper {
		position: relative;
		padding-bottom: 0;
}
.partners-swiper .swiper-wrapper {
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.partners-swiper .swiper-slide {
		height: auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}
.partner-item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-transition: -webkit-transform 0.3s ease;
		transition: -webkit-transform 0.3s ease;
		-o-transition: transform 0.3s ease;
		transition: transform 0.3s ease;
		transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.partner-item:hover {
		-webkit-transform: scale(1.05);
		-ms-transform: scale(1.05);
		transform: scale(1.05);
}
.partner-item img {
		height: 100px;
		width: auto;
		max-width: 100%;
		-o-object-fit: contain;
		object-fit: contain;
		opacity: 1;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.partners-swiper .swiper-pagination {
		bottom: 0 !important;
}
.partners-swiper .swiper-pagination-bullet {
		width: 10px;
		height: 10px;
		background-color: #ccc;
		opacity: 1;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.partners-swiper .swiper-pagination-bullet-active {
		background-color: var(--dark-gray);
		width: 30px;
		border-radius: 5px;
}
/* ============================================================
 * 38. 頁面區塊（Hero / Page Nav / Features）
 * ============================================================ */
/* ---- 38-1. Site Header ---- */
.site-header {
		background: -o-linear-gradient(left, #005eac 0%, #00a1ff 100%);
		background: -webkit-gradient(linear, left top, right top, from(#005eac), to(#00a1ff));
		background: linear-gradient(90deg, #005eac 0%, #00a1ff 100%);
		height: 70px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.home-icon {
		width: 12px;
		height: 12px;
		position: relative;
		top: 0;
		opacity: .75;
}
/* ---- 38-2. Hero Component ---- */
#section-hero {
		margin-bottom: 40px;
}
.hero-container {
		position: relative;
		height: 653px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}
.hero-image-wrapper {
		width: 100%;
		height: 100%;
		overflow: hidden;
		border-radius: 2rem;
}
.hero-bg {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
}
.hero-card {
		position: absolute;
		right: 80px;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 500px;
		background: -o-linear-gradient(left, #006bff 0%, #00f0ff 100%);
		background: -webkit-gradient(linear, left top, right top, from(#006bff), to(#00f0ff));
		background: linear-gradient(90deg, #006bff 0%, #00f0ff 100%);
		padding: 50px 30px;
		border-radius: 25px;
		color: var(--color-white);
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		z-index: 10;
}
.hero-card-title {
		font-size: var(--font-size-lg);
		font-weight: 700;
		margin-top: 0;
		margin-bottom: 20px;
}
.hero-card-text {
		font-size: var(--font-size-base);
		line-height: 1.5;
		margin: 0;
}
/* ---- 38-3. Page Navigation ---- */
#page-nav {
		background-color: var(--color-white);
		border-bottom: 1px solid #e6e6e6;
		position: relative;
		top: 0;
		z-index: 10;
		-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
		box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
		height: 60px;
}
#page-nav.has-cover {
		position: sticky;
		top: 70px;
}
#page-nav .nav-bar {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: end;
		-ms-flex-align: end;
		align-items: flex-end;
		height: 60px;
		gap: 20px;
}
.page-nav-link {
		font-size: var(--font-size-base);
		color: var(--color-gray);
		font-weight: 500;
		padding: 10px;
		border-bottom: 4px solid transparent;
		-webkit-transition: border-color 0.3s ease;
		-o-transition: border-color 0.3s ease;
		transition: border-color 0.3s ease;
}
.page-nav-link.active, .page-nav-link:hover {
		border-bottom-color: var(--primary-blue);
}
.nav-divider {
		width: 1px;
		height: 24px;
		margin-bottom: 15px;
		background-color: #d9d9d9;
}
/* ---- 38-4. Features & Tabs Section ---- */
#features {
		background: var(--bg-gradient-g);
		position: relative;
		padding-top: 50px;
		padding-bottom: 50px;
}
#features > div.container-xxl {
		padding-top: 0;
}
.overview-content {
		padding: 50px 0 50px 0;
		background-color: var(--color-white);
}
.overview-text {
		color: var(--color-gray);
		line-height: 1.6;
		margin-bottom: 0;
}
.features-section .tab-section > div {
		padding-top: 55px !important;
		border-top: 1px solid #ddd;
		margin: 55px auto !important;
}
.bg-curve-top {
		position: relative;
		width: 100%;
}
.bg-curve-top.change {
		background-color: var(--color-white);
}
.features-grid {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 50px 1fr 50px 1fr;
		grid-template-columns: repeat(3, 1fr);
		gap: 50px;
		position: relative;
		z-index: 1;
		padding: 0 80px;
}
.feature-card {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		text-align: center;
}
.feature-photo {
		width: 150px;
		height: 150px;
		margin-bottom: 15px;
}
.feature-card h4 {
		margin: 10px 0;
		color: var(--color-gray);
}
.feature-card p {
		color: var(--color-gray);
		font-size: var(--font-size-base);
}
.bg-curve-top {
		width: 100%;
		position: relative;
		top: 0;
		background: var(--bg-gradient-g);
		margin-bottom: 80px;
		display: block;
}
.bg-curve-down {
		width: 100%;
		position: relative;
		bottom: 0;
		background: var(--bg-gradient-g);
		margin-top: 80px;
		display: block;
}
#related {
		position: relative;
		background-color: var(--color-white);
		padding: 50px 0 0 0;
}
/* ---- 38-5. Solutions Section ---- */
#solutions {
		position: relative;
		background-color: #d9d9d9;
		padding-top: 50px;
		padding-bottom: 70px;
}
#solutions .swiper-pagination {
		bottom: -50px !important;
}
.solutions-swiper {
		position: relative;
		overflow: visible;
}
.solutions-swiper .swiper-wrapper {
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
}
.solutions-swiper .swiper-slide {
		height: auto;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.product-card {
		background-color: var(--color-white);
		border: 1px solid #e6e6e6;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		height: 100%;
		-webkit-transition: -webkit-transform 0.3s ease;
		transition: -webkit-transform 0.3s ease;
		-o-transition: transform 0.3s ease;
		transition: transform 0.3s ease;
		transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.product-card:hover {
		-webkit-transform: translateY(-5px);
		-ms-transform: translateY(-5px);
		transform: translateY(-5px);
}
.product-image {
		position: relative;
		width: 100%;
		overflow: hidden;
		aspect-ratio: 1 / 1;
}
.product-image img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
}
.product-info {
		padding: 20px;
		-webkit-box-flex: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
}
.product-category {
		color: var(--primary-blue);
		font-weight: 700;
		margin-bottom: 10px;
		font-size: var(--font-size-base);
}
.product-desc {
		font-size: var(--font-size-base);
		color: var(--color-gray);
		margin-bottom: 20px;
		-webkit-box-flex: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
		line-height: 1.5;
}
.solutions-swiper .swiper-pagination {
		bottom: 10px !important;
}
.solutions-swiper .swiper-pagination-bullet {
		width: 10px;
		height: 10px;
		background-color: #ccc;
		opacity: 1;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.solutions-swiper .swiper-pagination-bullet-active {
		background-color: #0071c5;
		width: 30px;
		border-radius: 5px;
}
.solutions-swiper .swiper-button-prev, .solutions-swiper .swiper-button-next {
		color: #0071c5;
		width: 44px;
		height: 44px;
		background-color: var(--color-white);
		border-radius: 50%;
		-webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
		box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.solutions-swiper .swiper-button-prev:after, .solutions-swiper .swiper-button-next:after {
		font-size: var(--font-size-base-2lg);
		font-weight: 700;
}
.solutions-swiper .swiper-button-prev:hover, .solutions-swiper .swiper-button-next:hover {
		background-color: #0071c5;
		color: var(--color-white);
		-webkit-transform: scale(1.1);
		-ms-transform: scale(1.1);
		transform: scale(1.1);
}
.solutions-swiper .swiper-button-prev {
		left: 20px;
}
.solutions-swiper .swiper-button-next {
		right: 20px;
}
/* ---- 38-6. Resources Section ---- */
#resources {
		position: relative;
		background: var(--bg-gradient-g);
		padding-bottom: 50px;
		padding-top: 50px;
}
#resources.space {
		padding-bottom: 0;
		padding-top: 0;
}
#resources .swiper-pagination {
		bottom: -20px !important;
}
#related .swiper-pagination {
		bottom: 150px !important;
}
#related .swiper-block, #solutions .swiper-block, #resources .swiper-block {
		max-width: calc(100% - (100% - 1280px)/2);
		overflow: visible;
		margin-right: 0;
		margin-left: auto;
}
#solutions .product-card, #resources .product-card, #related .product-card {
		border: 0;
}
#solutions .product-card .product-info, #resources .product-card .product-info, #related .product-card .product-info {
		padding: 10px;
}
.tag-block {
		max-width: calc(100% - (100% - 1280px)/2);
		margin: 0 0 0 auto;
		padding: 80px 0;
}
.tag-block > .news-tags {
		gap: 10px;
}
.resources-swiper {
		overflow: visible;
		position: relative;
		padding-bottom: 30px;
}
.resource-item {
		position: relative;
		-webkit-transition: opacity 0.3s ease;
		-o-transition: opacity 0.3s ease;
		transition: opacity 0.3s ease;
		overflow: hidden;
}
.resource-item.on-hover {
		opacity: 0.75;
}
.resource-item.active {
		opacity: 1;
}
.resource-card {
		background-color: var(--color-white);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		cursor: pointer;
		transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		height: 100%;
		min-height: 400px;
}
.resource-card:hover, .resource-item.active .resource-card {
		-webkit-transform: translateY(-5px);
		-ms-transform: translateY(-5px);
		transform: translateY(-5px);
		-webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
.resource-card .res-photo {
		width: 100%;
		display: block;
		aspect-ratio: 4 / 3;
}
.resource-card img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
}
.resource-content {
		padding: 20px;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
}
.res-meta {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		font-size: var(--font-size-xs);
		color: var(--color-gray);
		margin-bottom: 10px;
}
.res-tag {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 5px;
}
.res-tag img {
		width: 16px;
		height: 16px;
}
.res-title {
		font-size: var(--font-size-base);
		color: var(--color-gray);
		margin: 0;
		line-height: 1.4;
		display: -webkit-box;
		-webkit-line-clamp: 6;
		-webkit-box-orient: vertical;
		overflow: hidden;
}
.resource-expand {
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		-webkit-transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
		-o-transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
		transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
		background-color: var(--primary-blue);
		color: var(--color-white);
		position: absolute;
		bottom: 0;
}
.resource-item.active .resource-expand {
		max-height: 500px;
		height: calc(100% + 5px);
		opacity: 1;
}
.expand-content {
		padding: 20px 20px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		height: 100%;
}
.expand-meta {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		font-size: var(--font-size-xs);
		color: rgba(255, 255, 255, 0.9);
		margin-bottom: 15px;
}
.expand-date {
		font-weight: 500;
}
.expand-tag {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 5px;
		color: var(--color-white);
}
.expand-tag.downloads .expand-tag {
		pointer-events: none;
}
.expand-tag img {
		width: 16px;
		height: 16px;
		-webkit-filter: var(--svg-hover-white);
		filter: var(--svg-hover-white);
}
.expand-title {
		font-size: var(--font-size-base-lg);
		font-weight: 700;
		color: var(--color-white);
		margin: 0 0 15px 0;
		line-height: 1.4;
}
.expand-desc {
		font-size: var(--font-size-base);
		color: rgba(255, 255, 255, 0.9);
		line-height: 1.6;
		margin: 0;
}
/* ---- 38-7. Case Study Section ---- */
.case-section {
		padding: 75px 0 30px 0;
}
.case-section .case-item a {
		font-size: var(--font-size-base-lg);
		color: var(--dark-blue);
		display: block;
		padding: 5px 0px;
}
.case-section .case-item a:hover {
		color: var(--primary-blue);
}
#hero {
		width: 100%;
		background-color: var(--color-white);
}
.page-hero-container {
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
}
.page-hero-image-wrapper {
		position: relative;
		width: 100%;
		height: 400px;
		overflow: hidden;
}
.page-hero-img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
}
.page-hero-overlay {
		position: relative;
		margin: auto 0;
		background-color: rgba(255, 255, 255, 0.2);
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
		padding: 30px;
		border-radius: 10px;
		border: 1px solid rgba(255, 255, 255, 0.5);
		max-width: 660px;
		color: var(--dark-gray);
}
.page-hero-overlay.fill-mode {
		background: var(--bg-gradient);
		color: var(--color-white);
		border: 0;
		border-radius: 0 3rem 0 3rem;
}
.page-hero-title {
		font-size: var(--font-size-4lg);
		font-weight: 700;
		margin: 0 0 10px 0;
}
.page-hero-desc {
		font-size: var(--font-size-base);
		line-height: 1.5;
		margin: 0;
}
/* ---- 38-8. CTA Section ---- */
#section-cta {
		padding: 40px 0 80px 0;
}
.cta-container {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 30px;
		text-align: center;
}
.cta-text {
		color: var(--color-gray);
		font-size: var(--font-size-base);
}
.cta-buttons {
		gap: 20px;
}
/* ---- 38-9. Case Study Section（casestudy）---- */
.casestudy-section {
		background-color: #ededed;
		padding: 110px 0;
}
.casestudy-container {
		margin: 0 auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
}
.casestudy-top {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 20px;
}
.casestudy-header-row {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: end;
		-ms-flex-align: end;
		align-items: flex-end;
}
.casestudy-header-row .section-title {
		margin: 0;
}
.casestudy-grid {
		display: -ms-grid;
		display: grid;
		gap: 40px 20px;
		-ms-grid-columns: 1fr 20px 1fr 20px 1fr;
		grid-template-columns: repeat(3, 1fr);
		margin-top: 20px;
}
.casestudy-grid.show-all {
		margin-bottom: 20px;
}
.casestudy-card {
		width: 100%;
		height: 100%;
		aspect-ratio: 16 / 9;
		position: relative;
		overflow: hidden;
		display: block;
		text-decoration: none;
		-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
		-o-transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease;
		transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
}
.casestudy-img {
		width: 100%;
		height: 100%;
		position: relative;
}
.casestudy-img img {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		-webkit-transition: -webkit-filter 0.5s ease, -webkit-transform 0.5s ease;
		transition: -webkit-filter 0.5s ease, -webkit-transform 0.5s ease;
		-o-transition: filter 0.5s ease, transform 0.5s ease;
		transition: filter 0.5s ease, transform 0.5s ease;
		transition: filter 0.5s ease, transform 0.5s ease, -webkit-filter 0.5s ease, -webkit-transform 0.5s ease;
}
.casestudy-card:not(.active) .casestudy-img img {
		-webkit-filter: grayscale(100%);
		filter: grayscale(100%);
}
.casestudy-grid.show-all .casestudy-card:not(.active) .casestudy-img img {
		-webkit-filter: grayscale(0%);
		filter: grayscale(0%);
}
.casestudy-card.active .casestudy-img img, .casestudy-card:hover .casestudy-img img, .casestudy-card:focus .casestudy-img img {
		-webkit-filter: grayscale(0%);
		filter: grayscale(0%);
		-webkit-transform: scale(1.05);
		-ms-transform: scale(1.05);
		transform: scale(1.05);
}
.casestudy-overlay {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 10px;
		background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .5) 70%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgba(0, 0, 0, 0)), color-stop(70%, rgba(0, 0, 0, .5)));
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .5) 70%);
		color: var(--color-white);
		-webkit-transition: background 0.3s ease, padding 0.3s ease;
		-o-transition: background 0.3s ease, padding 0.3s ease;
		transition: background 0.3s ease, padding 0.3s ease;
}
.casestudy-card.active .casestudy-overlay, .casestudy-card:hover .casestudy-overlay, .casestudy-card:focus .casestudy-overlay {
		background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, .75) 70%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(5%, rgba(0, 0, 0, 0)), color-stop(70%, rgba(0, 0, 0, .75)));
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, .75) 70%);
		padding: 10px;
}
.casestudy-meta {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		font-size: var(--font-size-sm);
		font-weight: 500;
		opacity: 0.9;
}
.meta-sep {
		margin: 0 8px;
}
.casestudy-title {
		font-size: var(--font-size-base-lg);
		font-weight: 700;
		line-height: 1.3;
		color: rgba(255, 255, 255, 0.9);
		margin: 0;
		max-height: 0;
		opacity: 0;
		overflow: hidden;
		-webkit-transition: max-height 0.5s ease, opacity 0.5s ease, margin 0.3s ease;
		-o-transition: max-height 0.5s ease, opacity 0.5s ease, margin 0.3s ease;
		transition: max-height 0.5s ease, opacity 0.5s ease, margin 0.3s ease;
}
.casestudy-card.active .casestudy-title, .casestudy-card:hover .casestudy-title, .casestudy-card:focus .casestudy-title {
		max-height: 100px;
		opacity: 1;
		margin-top: 10px;
}
th.th-first {
		min-width: 200px;
		vertical-align: middle !important;
		padding-left: 0 !important;
		height: 100%;
}
/* ============================================================
 * 39. Footer
 * ============================================================ */
.site-footer {
		background-color: var(--color-gray);
		color: var(--footer-text);
		padding: 30px 0 30px 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
}
.footer-content {
		padding: 0 20px;
}
.footer-top {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 0;
		margin-bottom: 0;
}
.footer-links-group {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 80px;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
}
.footer-col {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 2px;
		min-width: 140px;
}
.footer-col ul {
		margin-bottom: 0;
}
.footer-heading {
		color: var(--color-white);
		font-size: var(--font-size-base);
		margin: 0 0 10px 0;
}
.footer-bottom {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.footer-legal {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 10px;
		margin-right: 30px;
}
.footer-col a {
		color: var(--font-size-base);
		display: block;
		padding: .125rem 0;
		line-height: 1.25;
}
.footer-legal a {
		color: var(--font-size-sm);
		display: block;
		padding: .125rem 0;
		line-height: 1.25;
}
.footer-col a:hover, .footer-legal a:hover {
		color: var(--color-white);
}
.subscribe-content .divider {
		width: 2px;
		height: 100%;
		max-height: calc(100% - 1rem);
		margin-bottom: 1rem;
		background-color: #9f9f9f;
}
.footer-subscribe {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
}
.subscribe-content {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 0;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		height: 100%;
}
.subscribe-text p, .social-follow p {
		font-size: var(--font-size-base);
		color: var(--footer-text);
		margin-bottom: 15px;
}
.subscribe-btn {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		text-align: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		gap: 8px;
		background: var(--bg-gradient-w);
		padding: 8px 20px;
		border-radius: 10px;
		color: var(--color-white);
		font-size: var(--font-size-base);
		border: 1px solid var(--color-white);
}
.subscribe-btn:hover {
		background: var(--bg-light-gradient);
}
.subscribe-btn .icon {
		width: 20px;
}
.divider {
		width: 2px;
		height: 80px;
		background-color: #9f9f9f;
}
.social-icons {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 12px;
		margin-bottom: 0;
}
.social-icons a {
		display: inline-block;
		opacity: .5;
		-webkit-transition: var(--transition-basic);
		-o-transition: var(--transition-basic);
		transition: var(--transition-basic);
}
.social-icons a:hover {
		opacity: 1;
}
.social-icons img {
		width: 30px;
		height: 30px;
}
/* ============================================================
 * 40. Slide Hover Component
 * ============================================================ */ :root {
		--vecow-blue: #0066b3;
		--vecow-dark-blue: #004d87;
}
.slidehover-row {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		height: 350px;
		overflow: hidden;
		border-radius: 2rem;
		gap: 2px;
}
.slidehover-card {
		position: relative;
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		min-width: 80px;
		overflow: hidden;
		cursor: pointer;
		-webkit-transition: -webkit-box-flex 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		transition: -webkit-box-flex 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		-o-transition: flex 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		transition: flex 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		transition: flex 0.6s cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-flex 0.6s cubic-bezier(0.4, 0, 0.2, 1), -ms-flex 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.slidehover-card.active {
		-webkit-box-flex: 3;
		-ms-flex: 3;
		flex: 3;
}
.slidehover-bg {
		position: relative;
		overflow: hidden;
		width: 100%;
		height: 100%;
		-webkit-transition: -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		transition: -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		-o-transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.slidehover-bg .card-bg {
		width: 100%;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		-webkit-transition: -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		transition: -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		-o-transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
		transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.slidehover-card:hover .card-bg {
		-webkit-transform: scale(1.1);
		-ms-transform: scale(1.1);
		transform: scale(1.1);
}
.slidehover-overlay {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: -o-linear-gradient(315deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.3) 100%);
		background: linear-gradient(135deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.3) 100%);
		-webkit-transition: background 0.6s ease;
		-o-transition: background 0.6s ease;
		transition: background 0.6s ease;
		z-index: 1;
}
.slidehover-card.active .slidehover-overlay, .slidehover-card:hover .slidehover-overlay {
		background: -o-linear-gradient(315deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.3) 100%);
		background: linear-gradient(135deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.3) 100%);
}
.slidehover-content {
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		z-index: 2;
		width: 100%;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: end;
		-ms-flex-align: end;
		align-items: flex-end;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		padding: 2rem;
		color: var(--color-white);
}
.slidehover-vertical {
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		text-orientation: mixed;
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -20%) rotate(180deg);
		-ms-transform: translate(-50%, -20%) rotate(180deg);
		transform: translate(-50%, -20%) rotate(180deg);
		opacity: 1;
		-webkit-transition: opacity 0.3s ease;
		-o-transition: opacity 0.3s ease;
		transition: opacity 0.3s ease;
}
.slidehover-card.active .slidehover-vertical {
		opacity: 0;
		pointer-events: none;
}
.slidehover-vertical .slidehover-title {
		font-size: var(--font-size-2lg);
		font-weight: bold;
		letter-spacing: 0.1em;
}
.slidehover-horizontal {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		opacity: 0;
		-webkit-transform: translateX(-30px);
		-ms-transform: translateX(-30px);
		transform: translateX(-30px);
		-webkit-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		-o-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		pointer-events: none;
		width: 100%;
}
.slidehover-card.active .slidehover-horizontal {
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
		pointer-events: auto;
}
.slidehover-horizontal .slidehover-title {
		font-size: var(--font-size-4lg);
		font-weight: bold;
		margin-bottom: 1rem;
		line-height: 1.2;
}
.slidehover-horizontal .slidehover-desc {
		font-size: var(--font-size-base);
		line-height: 1.6;
		margin-bottom: 1.5rem;
		max-width: 500px;
		opacity: 0.95;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}
.slidehover-horizontal .slidehover-btn {
		display: -webkit-inline-box;
		display: -ms-inline-flexbox;
		display: inline-flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 0.5rem;
		padding: 0.75rem 2rem;
		background-color: var(--color-white);
		color: var(--vecow-blue);
		border: 2px solid white;
		border-radius: 30px;
		font-weight: 600;
		font-size: 0.95rem;
		cursor: pointer;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		text-decoration: none;
}
.slidehover-horizontal .slidehover-btn:hover {
		background-color: transparent;
		color: var(--color-white);
		-webkit-transform: translateX(5px);
		-ms-transform: translateX(5px);
		transform: translateX(5px);
}
.slidehover-tag {
		display: inline-block;
		padding: 0.25rem 0.75rem;
		background-color: rgba(255, 255, 255, 0.2);
		border-radius: 20px;
		font-size: 0.75rem;
		margin-bottom: 0.5rem;
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
}
/* ============================================================
 * 41. Demo Info
 * ============================================================ */
.demo-info {
		background-color: var(--color-white);
		padding: 2rem;
		border-radius: 12px;
		-webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
		margin-bottom: 2rem;
}
.demo-info h3 {
		color: var(--vecow-blue);
		margin-bottom: 1rem;
}
.demo-info ul {
		list-style: none;
		padding: 0;
}
.demo-info li {
		padding: 0.5rem 0;
		padding-left: 1.5rem;
		position: relative;
}
.demo-info li::before {
		content: "✓";
		position: absolute;
		left: 0;
		color: var(--vecow-blue);
		font-weight: bold;
}
/* ============================================================
 * 42. Account & Whitepaper
 * ============================================================ */
.account-detail-header {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 20px;
		position: relative;
		margin-bottom: 2rem;
}
.account-actions .text {
		display: none;
}
.whitepaper-section {
		padding: 0 0 100px 0;
}
.whitepaper-section .card-item .card-image-wrapper {
		width: 320px;
		margin: auto;
}
.whitepaper-section .card-item .card-image-wrapper + .btn-dw {
		width: 320px;
		margin-left: auto;
		margin-right: auto;
}
/* ============================================================
 * 43. RWD: min-width: 1200px
 * ============================================================ */
@media (min-width: 1200px) {
		.product-info-block .info-bullets, .product-info-block .name-title {}
		.product-content-grid {
				gap: 10px;
		}
		.overview-text {
				max-width: calc(100% - 12rem);
				margin: auto;
		}
		.subscribe-content {
				gap: 20px;
		}
		.footer-links-group {
				gap: 25px;
		}
		.product-showcase-container, .tag-block, #related .swiper-block, #solutions .swiper-block, #resources .swiper-block {
				max-width: calc(100% - 7rem);
		}
}
/* ============================================================
 * 44. RWD: min-width: 1440px
 * ============================================================ */
@media (min-width: 1440px) {
		.downloads-filter-tabs {
				gap: 10px;
		}
		#page-nav .nav-bar {
				gap: 25px;
		}
		.footer-links-group {
				gap: 80px;
		}
		.subscribe-content {
				gap: 45px;
		}
		.product-images {
				max-width: 550px;
		}
		.product-info-block {
				padding: 0 20px;
		}
		.price-block {
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.action-buttons {
				max-width: 300px;
		}
		.product-content-grid {
				gap: 30px;
		}
		.product-content-grid .product-info-block {
				max-width: calc(50% - 1rem);
		}
		.thumbnail-list {
				width: 400px;
		}
		.product-showcase-container, .tag-block, #related .swiper-block, #solutions .swiper-block, #resources .swiper-block {
				max-width: calc(100% - (100% - 1345px + 4rem) / 2);
		}
		.hero-card {
				right: 120px;
				width: 500px;
		}
}
/* ============================================================
 * 45. RWD: max-width: 1199px
 * ============================================================ */
@media (max-width: 1199px) {
		#page-nav.has-cover {
				position: sticky;
				top: 60px;
		}
		.footer-bottom {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: end;
				-ms-flex-align: end;
				align-items: flex-end;
		}
		.footer-legal {
				margin-right: 0;
		}
		.qa-filter-buttons {
				gap: 10px;
		}
		.qa-list-item-question {
				font-size: var(--font-size-base);
		}
		.qa-list-item-date {
				font-size: var(--font-size-sm);
		}
		.qa-filter-btn {
				padding: 4px 8px;
				font-size: var(--font-size-sm);
				gap: 2px;
		}
		.qa-filter-btn img {
				width: 10px;
				height: 10px;
		}
		.slidehover-vertical .slidehover-title {
				font-size: var(--font-size-lg);
		}
		.challenges-image {
				width: 300px;
				height: 300px;
		}
		.features-grid {
				gap: 30px;
				padding: 0;
		}
		#faq {
				padding-top: 0;
				padding-bottom: 0;
		}
		#faq > div {
				padding: 110px 4rem 30px 4rem !important;
		}
		.downloads-filter-tab {
				font-size: var(--font-size-sm);
		}
		.footer-links-group {
				gap: 30px;
				-webkit-box-pack: justify;
				-ms-flex-pack: justify;
				justify-content: space-between;
		}
		.footer-top {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.subscribe-content {
				gap: 30px;
				-webkit-box-align: end;
				-ms-flex-align: end;
				align-items: flex-end;
		}
		.subscribe-content .divider {
				height: 80px;
				margin-bottom: 0;
		}
		.subscribe-content .divider:first-child {
				display: none;
		}
		.subscribe-btn .icon {
				width: 15px;
		}
		.subscribe-btn {
				font-size: var(--font-size-base);
				padding: .25rem 1rem;
		}
		.main-image-wrapper .product-zoom img {
				width: 25px;
		}
		.product-images {
				max-width: 450px;
		}
		.price-action-area {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
		}
		.price-block {
				-webkit-box-orient: horizontal;
				-webkit-box-direction: normal;
				-ms-flex-direction: row;
				flex-direction: row;
				margin-bottom: 0;
		}
		.product-detail-title {
				font-size: var(--font-size-2xl);
		}
		.product-info-block .name-title {
				font-size: var(--font-size-lg);
				line-height: 1.25;
		}
		.product-info-block .info-bullets {
				font-size: var(--font-size-sm);
		}
		.action-buttons .btn {
				font-size: var(--font-size-sm);
		}
		.solutions-section, .resources-section {
				overflow: hidden;
		}
		.tools-btn {
				width: 40px;
				height: 40px;
		}
		.tag-block, #related .swiper-block, #solutions .swiper-block, #resources .swiper-block {
				max-width: calc(100% - 4rem);
		}
		.main-image-wrapper {
				padding: 0;
		}
		.main-image-wrapper .product-favorite {
				top: 0;
				left: 0;
		}
		.main-image-wrapper .product-zoom {
				top: 0;
				right: 0;
		}
		.drag-hint {
				display: none !important;
		}
		.sustainability-hero-bg {
				-o-object-fit: cover;
				object-fit: cover;
		}
		.sustainability-hero {
				height: 550px;
		}
		#partners {
				padding: 30px 0;
		}
		.partners-swiper {
				padding-bottom: 0;
		}
		.casestudy-grid {
				gap: 20px 10px;
				-ms-grid-columns: 1fr 10px 1fr;
				grid-template-columns: repeat(2, 1fr);
				margin-top: 0;
		}
		.challenge-text-box h3 {
				font-size: var(--font-size-base-lg);
		}
		.casestudy-title {
				font-size: var(--font-size-base);
		}
		.challenge-text-box p {
				font-size: var(--font-size-sm);
		}
		.challenge-item {
				gap: 50px;
		}
		.challenges-section {
				text-align: center;
		}
		.contact-cta-title {
				font-size: var(--font-size-lg);
				margin: 20px 0;
		}
		.contact-cta-text {
				font-size: var(--font-size-sm);
				margin-bottom: 10px;
		}
		.contact-cta-buttons a {
				font-size: var(--font-size-sm);
		}
		.offer-icon {
				width: 70px;
				height: 70px;
				margin: 0 auto 10px;
		}
		.about-info-badge {
				padding: 0;
		}
		.about-info-badge img {
				max-width: 120px;
		}
		.hero-card-title, .slidehover-horizontal .slidehover-title {
				font-size: var(--font-size-base-2lg);
		}
		.hero-card-text, .slidehover-horizontal .slidehover-desc {
				font-size: var(--font-size-sm);
				line-height: 1.5;
		}
		.sticky-top-m:not(.is-close) {
				top: 60px;
		}
		#page-nav.center-mode {
				top: 165px;
		}
		.detail-mode .downloads-filter-tabs.has-bg {
				top: 160px;
		}
}
/* ============================================================
 * 46. RWD: max-width: 991px
 * ============================================================ */
@media (max-width: 991px) {
		.sticky-top-m:not(.is-close) {
				top: 50px;
		}
		#page-nav.has-cover {
				top: 50px;
		}
		#page-nav.center-mode {
				top: 0;
				position: relative;
		}
		.is-sticky .cell-header {
				top: 50px;
		}
		.is-stickyOn .cell-header {
				top: 0;
		}
		.qa-filter-buttons {
				-ms-flex-wrap: nowrap;
				flex-wrap: nowrap;
				overflow-x: auto;
				overflow-y: hidden;
				-webkit-box-pack: start;
				-ms-flex-pack: start;
				justify-content: flex-start;
				padding-top: 10px;
				white-space: nowrap;
				-webkit-overflow-scrolling: touch;
				scroll-behavior: smooth;
				scrollbar-width: none;
				-ms-overflow-style: none;
				gap: 5px;
				background-color: var(--color-white);
		}
		.qa-filter-buttons::-webkit-scrollbar {
				display: none;
		}
		.qa-filter-buttons li {
				-ms-flex-negative: 0;
				flex-shrink: 0;
		}
		.qa-search-box {
				margin: 0 auto 20px;
		}
		.qa-back-btn {
				font-size: var(--font-size-sm);
				padding: 8px 20px;
		}
		.qa-question-title {
				font-size: var(--font-size-base-lg);
		}
		.qa-answer-text {
				font-size: var(--font-size-sm);
		}
		.qa-question-date {
				font-size: var(--font-size-sm);
		}
		.tooltip-inline-link, .tooltip-inline-message {
				font-size: var(--font-size-sm);
		}
		.qa-answer-badge, .qa-question-badge {
				width: 35px;
				height: 35px;
				font-size: var(--font-size-base);
		}
		.qa-search-input {
				font-size: var(--font-size-sm);
				height: 45px;
		}
		.qa-search-btn {
				width: 30px;
				height: 30px;
		}
		.qa-search-btn img {
				width: 16px;
				height: 16px;
		}
		.slidehover-vertical {
				left: calc(50%);
				bottom: -5%;
				top: auto;
				height: calc(100% - 2rem);
		}
		.contact-cta-title {
				font-size: var(--font-size-base);
				margin: 10px 0;
		}
		.contact-cta-text {
				font-size: var(--font-size-sm);
				margin-bottom: 10px;
		}
		.about-info-text p {
				font-size: var(--font-size-sm);
				line-height: 1.5;
		}
		.about-info-text {
				padding-right: 0;
		}
		.contact-cta-content {
				padding: 0 20px 0 20px;
		}
		.about-hero-bg {
				width: 100%;
				height: 100%;
				-o-object-fit: cover;
				object-fit: cover;
		}
		.cards-grid {
				-ms-grid-columns: (1fr)[3];
				grid-template-columns: repeat(3, 1fr);
		}
		#page-nav .nav-bar {
				gap: 15px;
		}
		.page-nav-link {
				font-size: var(--font-size-sm);
				padding: 10px 0;
		}
		.story-section {
				padding: 30px 0;
		}
		.feature-card h4 {
				font-size: var(--font-size-base);
		}
		.feature-card p {
				font-size: var(--font-size-sm);
		}
		.feature-photo {
				width: 120px;
				height: 120px;
				margin-bottom: 15px;
		}
		.tools-btn {
				width: 36px;
				height: 36px;
		}
		.back-to-top, .support-agent {
				width: 42px;
				height: 42px;
		}
		.footer-bottom {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: end;
				-ms-flex-align: end;
				align-items: flex-end;
				gap: 5px;
		}
		.footer-legal {
				margin-right: 0;
				text-align: end;
				gap: 5px;
		}
		.subscribe-content {
				gap: 15px;
		}
		.product-content-grid {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
				margin-bottom: 1rem;
		}
		.price-action-area {
				-webkit-box-orient: horizontal;
				-webkit-box-direction: normal;
				-ms-flex-direction: row;
				flex-direction: row;
				-webkit-box-pack: justify;
				-ms-flex-pack: justify;
				justify-content: space-between;
		}
		#related .swiper-pagination {
				bottom: 190px !important;
		}
		.subscribe-content .divider {
				height: 55px;
		}
		.qa-categories {
				-ms-grid-columns: 1fr 20px 1fr;
				grid-template-columns: repeat(2, 1fr);
				gap: 20px;
		}
		.downloads-filter-tabs {
				top: 50px;
				-ms-flex-wrap: nowrap;
				flex-wrap: nowrap;
				overflow-x: auto;
				overflow-y: hidden;
				-webkit-box-pack: start;
				-ms-flex-pack: start;
				justify-content: flex-start;
				padding-top: 10px;
				white-space: nowrap;
				-webkit-overflow-scrolling: touch;
				scroll-behavior: smooth;
				scrollbar-width: none;
				-ms-overflow-style: none;
				gap: 15px;
				background-color: var(--color-white);
		}
		.downloads-filter-tabs::-webkit-scrollbar {
				display: none;
		}
		.downloads-filter-tabs li {
				-ms-flex-negative: 0;
				flex-shrink: 0;
		}
		.download-btn, .download-item-size img {
				width: 18px;
				height: 18px;
		}
		.page-hero-title {
				font-size: var(--font-size-lg);
		}
		.page-hero-desc {
				font-size: var(--font-size-sm);
		}
		.challenge-icon-wrapper {
				width: 60px;
				height: 60px;
				padding: 10px;
		}
		.challenge-connector {
				min-width: 60px;
				width: 60px;
				left: 50px;
		}
		.cta-image-wrapper img {
				width: 100%;
				height: 100%;
		}
		.grid-3 {
				-ms-grid-columns: (1fr)[2];
				grid-template-columns: repeat(2, 1fr);
		}
		.content-info {
				padding: 10px;
		}
		.content-block-description {
				font-size: var(--font-size-sm);
				line-height: 1.5;
		}
		.content-block-title {
				font-size: var(--font-size-base);
				margin-bottom: 5px;
		}
		.applications-grid {
				-ms-grid-columns: (1fr)[2];
				grid-template-columns: repeat(2, 1fr);
		}
		.partners-grid {
				-ms-grid-columns: 1fr 10px 1fr 10px 1fr 10px 1fr 10px 1fr;
				grid-template-columns: repeat(5, 1fr);
				gap: 10px;
		}
		.partners-logos-group {
				padding: 10px 0;
		}
		.whitepaper-section h2 {
				font-size: var(--font-size-lg);
		}
		.whitepaper-section, .whitepaper-section p {
				font-size: var(--font-size-sm);
		}
		.product-detail-title {
				font-size: var(--font-size-xl);
		}
		.section-title {
				margin: 20px auto;
				font-size: var(--font-size-2xl);
		}
		.compare-btn {
				position: relative;
				top: 0;
				padding: 4px 10px;
				margin-left: auto;
		}
		.compare-btn img {
				width: 15px;
		}
		.downloads-search-box {
				max-width: calc(100% - 2rem);
				margin-bottom: 1rem;
		}
		.slidehover-vertical .slidehover-title {
				font-size: var(--font-size-base-lg);
		}
}
/* ============================================================
 * 47. RWD: max-width: 767px
 * ============================================================ */
@media (max-width: 767px) {
		.product-detail-header {
				-webkit-box-pack: justify;
				-ms-flex-pack: justify;
				justify-content: space-between;
		}
		.section-title {
				margin: 20px auto 10px auto;
		}
		.product-showcase-section {
				margin-bottom: 10px;
		}
		#page-nav.center-mode {
				position: relative;
				top: 0;
		}
		.subscribe-content {
				gap: 40px;
		}
		.pg-modal {
				width: 100%;
				max-width: 60vw;
		}
		.pg-modal-overlay.active {
				overflow-y: auto;
				overflow-x: hidden;
		}
		.whitepaper-section .card-item .card-image-wrapper {
				max-width: 300px;
				margin: 2rem auto 0 auto;
		}
		.info-content.has-underline a {
				padding: 8px 20px;
				margin: auto;
				font-size: var(--font-size-sm);
				min-width: 300px;
		}
		.social-icons img {
				width: 25px;
				height: 25px;
		}
		.content-info {
				padding: 20px;
		}
		.content-block, .content-block.reverse {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.key-features-grid {
				-ms-grid-columns: (1fr)[1];
				grid-template-columns: repeat(1, 1fr);
		}
		.cards-grid {
				-ms-grid-columns: (1fr)[3];
				grid-template-columns: repeat(3, 1fr);
		}
		.story-card {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.story-cta-column {
				-webkit-box-flex: 0;
				-ms-flex: 0 0 100%;
				flex: 0 0 100%;
				padding-top: 0;
		}
		.story-section::after {
				max-width: 100%;
				max-height: calc(50% - 2rem);
		}
		#story .swiper-pagination {
				max-width: 100%;
				top: 0;
		}
		.story-column h2 {
				font-size: var(--font-size-lg);
		}
		.story-feature-item h4 {
				font-size: var(--font-size-base);
		}
		.story-feature-item p, .story-subtitle {
				font-size: var(--font-size-sm);
		}
		.story-column {
				padding-top: 15%;
		}
		.challenges-image {
				width: 250px;
				height: 250px;
		}
		#faq > div {
				padding: 30px 3rem 30px 3rem !important;
		}
		.inquiry-table td, .inquiry-table th {
				padding: 10px 5px;
		}
		.quantity-input-wrapper .form-input {
				padding-left: 10px !important;
				padding-right: 10px !important;
				font-size: var(--font-size-sm);
				height: 30px;
		}
		.inquiry-table .product-description {
				font-size: var(--font-size-sm);
		}
		.inquiry-table .product-name {
				font-size: var(--font-size-base);
		}
		.inquiry-table .remove-btn img {
				width: 15px;
		}
		.inquiry-table .remove-btn {
				padding: 4px 10px;
				min-width: inherit;
		}
		.main-image-wrapper .product-badge {
				top: 20px;
				left: 55px;
		}
		.main-image-wrapper .product-zoom {
				top: 20px;
		}
		.price-action-area .product-change .text {
				font-size: var(--font-size-sm);
		}
		.price-action-area .product-change {
				width: 150px;
		}
		.product-badge {
				font-size: var(--font-size-sm) !important;
				padding: .125rem .5rem !important;
		}
		.footer-top {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.footer-bottom {
				margin-top: auto;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
		}
		.footer-links-group {
				display: -ms-grid;
				display: grid;
				-ms-grid-columns: 1fr 15px 1fr 15px 1fr;
				grid-template-columns: repeat(3, 1fr);
		}
		.subscribe-content {
				-webkit-box-pack: justify;
				-ms-flex-pack: justify;
				justify-content: space-between;
				-webkit-box-align: end;
				-ms-flex-align: end;
				align-items: flex-end;
		}
		.footer-legal {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
				gap: 0;
				margin-bottom: 5px;
		}
		.footer-legal .separator {
				display: none;
		}
		.footer-col a, .footer-legal a {
				padding: .125rem 0;
		}
		.products-layout {
				gap: 10px;
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.products-sidebar {
				width: 100%;
				position: relative;
				top: 0;
				margin-bottom: 2rem;
		}
		.products-layout.collapsed .products-sidebar {
				position: fixed;
				display: none;
		}
		.products-layout.collapsed .products-info-grid, .products-layout .products-info-grid {
				-ms-grid-columns: 1fr 10px 1fr 10px 1fr;
				grid-template-columns: repeat(3, 1fr);
				gap: 40px 10px;
		}
		.product-info-card .btn-group > .btn {
				padding: .25rem .25rem;
		}
		.detail-mode .downloads-filter-tabs {
				height: 60px;
				margin-bottom: 0;
				-webkit-box-pack: center;
				-ms-flex-pack: center;
				justify-content: center;
		}
		#page-nav.center-mode .page-nav-link, .downloads-filter-tab {
				text-wrap: nowrap;
				font-size: var(--font-size-sm);
				top: 0;
		}
		.product-detail-title {
				margin-bottom: 10px;
				padding-right: 0;
				max-width: 100%;
		}
		.product-detail-title .product-badge, .product-detail-title .product-tag {
				right: -40px;
				left: auto;
				top: -21px;
				line-height: 1;
		}
		.product-info-block {
				margin-bottom: 0;
				padding: 0;
		}
		.product-info-block .product-favorite {
				margin-right: 0 !important;
				width: 35px;
		}
		.product-favorite .icon {
				min-width: 20px;
		}
		.center-mode .nav-bar {
				gap: 10px;
				height: 45px;
		}
		#page-nav.center-mode {
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
		}
		#page-nav.center-mode .nav-bar .icon {
				width: 15px;
		}
		.account-actions {
				position: relative;
				right: 0;
		}
		.account-detail-header {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.account-detail-header .section-title {
				margin-bottom: 10px !important;
		}
		.inquiry-list-header {
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-pack: justify;
				-ms-flex-pack: justify;
				justify-content: space-between;
		}
		.inquiry-list-header .add-btn {
				position: relative !important;
				margin-left: auto;
				margin-right: 0;
		}
		.inquiry-item-header > div:first-child {
				display: -webkit-box !important;
				display: -ms-flexbox !important;
				display: flex !important;
				-webkit-box-orient: horizontal;
				-webkit-box-direction: normal;
				-ms-flex-direction: row;
				flex-direction: row;
				gap: 15px;
		}
		.inquiry-info-label {
				width: auto;
				text-align: start;
				margin-left: 0 !important;
				padding-left: 0;
		}
		.inquiry-info-value {
				padding-left: 0;
		}
		.industries-grid {
				-ms-grid-columns: 1fr 20px 1fr;
				grid-template-columns: repeat(2, 1fr);
				gap: 20px;
		}
		.expand-meta {
				margin-bottom: 5px;
		}
		.expand-title {
				font-size: var(--font-size-sm);
				line-height: 1.5;
				margin-bottom: 1rem;
		}
		.expand-desc {
				font-size: var(--font-size-sm);
				line-height: 1.35;
		}
		.btn-dw {
				font-size: var(--font-size-sm);
		}
		.btn-dw .btn-icon {
				width: 12px;
				height: 12px;
		}
		.product-delete {
				top: -8px;
		}
		.product-delete img {
				width: 20px;
		}
		.ordering-table td {
				font-size: var(--font-size-sm);
		}
		.ordering-info-title {
				font-size: var(--font-size-base);
				margin: 0;
		}
		.selection-count {
				font-size: var(--font-size-sm);
		}
		.clear-selection-btn {
				padding: 5px 10px;
				font-size: var(--font-size-sm);
		}
		.sustainability-hero {
				height: 500px;
		}
		#page-nav .nav-bar {
				gap: 8px;
		}
		.page-hero-img {
				-o-object-position: center;
				object-position: center;
		}
		.partner-logo {
				min-height: 50px;
		}
		.hero-card {
				width: 100%;
				max-width: 60%;
		}
		.hero-card-text, .slidehover-horizontal .slidehover-desc {
				font-size: var(--font-size-base);
		}
		.rma-step-number {
				width: 60px;
				height: 45px;
				margin-top: 5px;
				font-size: var(--font-size-lg);
		}
		.rma-steps-two {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.rma-step-card {
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
		}
		.partners-hero {
				padding: 40px 0;
		}
		.expand-meta, .card-item .tag-text {
				font-size: var(--font-size-sm);
		}
		.expand-content {
				padding: 1rem;
		}
		.expand-content .btn-dw.dark {
				padding: 4px 10px;
				font-size: var(--font-size-sm);
		}
		.card-item .card-tag {
				top: 1rem;
		}
		#downloadModal .modal-body {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		#downloadModal .login-block::after {
				top: auto;
				bottom: -10px;
				margin: auto;
				right: 0;
				left: 0;
				width: 100%;
				height: 1px;
				max-width: 100%;
				background-color: var(--dark-gray);
		}
		#downloadModal .login-block {
				margin-bottom: 2rem;
		}
		#downloadModal .modal-title {
				font-size: var(--font-size-2xl);
		}
		.bot-space {
				padding-bottom: 35px;
		}
		.solution-content-text img {
				margin: 10px auto !important;
				float: inline-end;
		}
}
/* ============================================================
 * 48. RWD: max-width: 576px
 * ============================================================ */
@media (max-width: 576px) {
		#story .swiper-pagination {
				margin-bottom: 2rem;
		}
		.story-section::after {
				max-height: 50%;
		}
		.story-column {
				position: relative;
				z-index: 1;
				padding-top: 2rem;
		}
		.story-column::after {
				content: '';
				height: 100%;
				width: calc(100% + 3rem);
				position: absolute;
				left: -1.5rem;
				top: 0;
				margin: auto;
				background-color: var(--color-white);
				z-index: -1;
		}
		.social-follow {
				margin-top: 1rem;
		}
		.footer-col ul {
				margin-bottom: 1rem;
		}
		.solution-content-text img {
				margin: 10px auto !important;
				float: none;
		}
		.ordering-table tbody tr:last-child {
				border-bottom: 1px solid #ddd;
		}
		.product-detail-header {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
				padding-bottom: 0;
				text-align: center;
		}
		.act-btn-group {
				position: relative;
				top: 0 !important;
				margin: 0 0 10px auto;
		}
		.act-btn-group.only {
				margin: 0 auto 15px auto;
		}
		.is-stickyOn .cell-header {
				top: 0;
		}
		.cell-header, .compare-cell {
				padding: 5px 5px 10px 5px;
		}
		.main-image-wrapper .product-favorite {
				top: 0;
				left: 0;
		}
		.pg-modal {
				width: 100%;
				max-width: calc(100vw - 16px);
		}
		.label-col .cell-header.label-header, .label-col {
				min-width: 140px;
				width: 140px;
		}
		.label-col {
				left: 0;
		}
		.offers-grid {
				-ms-grid-columns: 1fr 10px 1fr;
				grid-template-columns: repeat(2, 1fr);
				gap: 10px;
		}
		.feature-photo {
				width: 100%;
				height: 100%;
				margin-bottom: 0;
		}
		.contact-cta-content {
				padding: 20px;
				text-align: center !important;
		}
		.features-grid {
				-ms-grid-columns: 1fr 20px 1fr;
				grid-template-columns: repeat(2, 1fr);
				gap: 20px 20px;
		}
		#faq > div {
				padding: 30px 1.5rem 30px 1.5rem !important;
		}
		#page-nav .nav-bar .page-nav-link {
				font-size: var(--font-size-base);
				padding: 2px 5px;
				line-height: 1.25;
				text-wrap: nowrap;
				height: 55px;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
				-webkit-box-pack: center;
				-ms-flex-pack: center;
				justify-content: center;
		}
		.footer-top {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-ms-flex-wrap: wrap;
				flex-wrap: wrap;
		}
		.footer-legal {
				-webkit-box-orient: horizontal;
				-webkit-box-direction: normal;
				-ms-flex-direction: row;
				flex-direction: row;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
				gap: 20px;
				margin-bottom: 0;
		}
		.footer-legal .separator {
				display: block;
		}
		.site-footer {
				padding: 30px 0;
		}
		.site-footer.add-height {
				padding-bottom: 90px;
		}
		.subscribe-btn {
				padding: .25rem .75rem;
				width: -webkit-fit-content;
				width: -moz-fit-content;
				width: fit-content;
		}
		.social-icons img {
				width: 22px;
				height: 22px;
		}
		.products-layout.collapsed .products-info-grid, .products-layout .products-info-grid {
				-ms-grid-columns: 1fr 10px 1fr;
				grid-template-columns: repeat(2, 1fr);
				gap: 40px 10px;
		}
		.explore-header {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.explore-header .section-title {
				margin: 1rem 0 .5rem 0;
		}
		.download-item {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
		}
		.download-item-actions {
				margin: 1rem 0 .25rem 0;
		}
		.detail-mode .downloads-filter-tabs {
				-webkit-box-pack: start;
				-ms-flex-pack: start;
				justify-content: flex-start;
		}
		.detail-mode .downloads-filter-tabs.has-bg {
				top: 200px;
		}
		.download-item-actions .download-btn {
				margin-top: 0;
		}
		.download-btn {
				margin-top: 15px;
		}
		.download-btn img, .download-btn, .download-item-size img {
				min-width: 18px;
				min-height: 18px;
				width: 18px;
				height: 18px;
		}
		.action-buttons {
				position: fixed;
				bottom: 0;
				z-index: 1056;
				background-color: rgba(255, 255, 255, 0.5);
				backdrop-filter: blur(10px);
				-webkit-backdrop-filter: blur(10px);
				left: 0;
				padding: .5rem;
				gap: 10px;
				-webkit-box-orient: horizontal;
				-webkit-box-direction: normal;
				-ms-flex-direction: row;
				flex-direction: row;
				max-width: 100%;
		}
		.account-detail-section, .product-detail-section {
				z-index: 101;
		}
		.product-detail-tabs {
				-webkit-box-pack: center;
				-ms-flex-pack: center;
				justify-content: center;
		}
		.product-content-grid .product-images, .thumbnail-list {
				max-width: calc(100vw - 4rem);
				width: calc(100vw - 4rem);
				margin: auto;
		}
		.key-features-grid {
				-ms-grid-columns: 1fr;
				grid-template-columns: repeat(1, 1fr);
				gap: 20px;
		}
		.applications-grid {
				-ms-grid-columns: 1fr;
				grid-template-columns: repeat(1, 1fr);
				gap: 20px;
		}
		.partners-grid {
				-ms-grid-columns: 1fr 5px 1fr 5px 1fr;
				grid-template-columns: repeat(3, 1fr);
				gap: 5px;
		}
		.application-image {
				width: 100%;
		}
		.application-title {
				font-size: var(--font-size-sm);
				padding: 10px;
		}
		.tag-block, #related .swiper-block, #solutions .swiper-block, #resources .swiper-block {
				max-width: calc(100% - 1rem);
		}
		.account-actions {
				position: fixed;
				bottom: 0;
				z-index: 1056;
				background-color: var(--color-light-gray);
				left: 0;
				padding: .5rem;
				margin: 0;
				gap: 10px !important;
				-ms-flex-pack: distribute;
				justify-content: space-around;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
		}
		.account-actions .btn {
				border: 0;
				min-width: 50px;
				width: 50px;
				max-width: 50px;
				padding: 3px !important;
		}
		.account-actions .btn > img {
				max-width: 20px;
		}
		.account-actions .text {
				font-size: var(--font-size-xxs);
				margin-top: 5px;
				text-align: center;
				line-height: 1;
				display: block !important;
		}
		.account-actions li a {
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
		}
		.inquiry-item-header > div:first-child {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				gap: 2px;
		}
		.inquiry-list-header {
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
		}
		.inquiry-info-label {
				margin-top: 10px;
		}
		.inquiry-list-header .add-btn {
				font-size: var(--font-size-sm);
				width: -webkit-fit-content;
				width: -moz-fit-content;
				width: fit-content;
				position: relative;
				text-align: start;
				padding-left: 30px;
		}
		.inquiry-list-header .add-btn img {
				position: absolute !important;
				left: 5px;
				top: 8px;
		}
		.inquiry-list-header .text {
				max-width: 40%;
				text-align: start;
		}
		.inquiry-item {
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
		}
		.load-more-btn img, .add-btn img {
				width: 15px;
		}
		.inquiry-view-btn {
				min-width: 20px;
				min-height: 20px;
				width: 20px;
				height: 20px;
				margin-top: 10px;
		}
		.industries-grid {
				-ms-grid-columns: 1fr;
				grid-template-columns: repeat(1, 1fr);
				gap: 10px;
				margin: 0 auto 2rem auto;
		}
		.industries-card {
				aspect-ratio: auto;
				width: 100%;
				height: 40px;
		}
		.industries-img {
				display: none;
		}
		.footer-col a, .footer-legal a {
				padding: .25rem 0;
		}
		.qa-categories {
				-ms-grid-columns: 1fr;
				grid-template-columns: repeat(1, 1fr);
				gap: 20px;
		}
		.subscribe-content {
				display: -ms-grid;
				display: grid;
				-ms-grid-columns: 1fr 10px 1fr;
				grid-template-columns: repeat(2, 1fr);
				-webkit-box-align: end;
				-ms-flex-align: end;
				align-items: flex-end;
				gap: 10px;
		}
		.social-icons {
				gap: 10px;
		}
		.result-item.video-card .card-content, .result-item.video-card .video-thumbnail, .result-item.product-card .product-image {
				width: 100%;
		}
		.result-item.video-card, .result-item.product-card {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				padding: 1.5rem;
				gap: 10px;
		}
		.btn-ordering {
				font-size: var(--font-size-sm);
		}
		.btn-ordering, .specs-product-card .btn {
				padding: .25rem .25rem;
		}
		.center-mode .nav-bar {
				gap: 5px;
		}
		/* 訂購表格 RWD：隱藏表頭，tr 變區塊 */
		.inquiry-table {
				border: 0;
				margin-bottom: 0;
		}
		.inquiry-table thead {
				display: none;
		}
		.inquiry-table tbody tr {
				display: block;
				margin-bottom: 20px;
				border: 1px solid #ddd;
				border-radius: 8px;
				padding: 15px 15px 15px 25px;
				background-color: var(--color-white);
				position: relative;
		}
		.inquiry-table tbody td {
				display: block;
				text-align: left !important;
				padding: 10px 0;
				border: none;
				position: relative;
				padding-left: 50%;
		}
		.inquiry-table tbody td:first-child {
				position: absolute;
				top: 21px;
				left: 10px;
				padding: 0;
				font-weight: bold;
				font-size: var(--font-size-base-lg);
				color: var(--dark-gray);
		}
		.inquiry-table tbody td:not(:first-child)::before {
				content: attr(data-title);
				position: absolute;
				left: 15px;
				font-weight: bold;
				color: var(--color-gray-dark);
				white-space: nowrap;
		}
		.inquiry-table tbody td .product-name, .inquiry-table tbody td .product-description, .inquiry-table tbody td .quantity-input-wrapper, .inquiry-table tbody td .remove-btn {
				display: block;
				width: 100%;
		}
		.inquiry-table tbody td .quantity-input-wrapper {
				max-width: 100px;
		}
		.inquiry-table tbody td .remove-btn {
				width: 100%;
				max-width: 150px;
		}
		.contact-info-badge {
				font-size: var(--font-size-sm);
				width: 100%;
		}
		.contact-info-header {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
		}
		/* 訂購資訊表格 RWD */
		.ordering-table {
				border: 0;
		}
		.ordering-table thead {
				display: none;
		}
		.ordering-table tbody tr {
				display: block;
				margin-bottom: 20px;
				border: 1px solid #ddd;
				border-radius: 8px;
				padding: 15px;
				background-color: var(--color-white);
				position: relative;
		}
		.ordering-table tbody td {
				display: block;
				text-align: left !important;
				padding: 12px 0;
				border: none;
				position: relative;
				padding-left: 0;
		}
		.ordering-table tbody td::before {
				content: attr(data-title);
				font-weight: bold;
				color: var(--dark-gray);
				margin-bottom: 5px;
				font-size: var(--font-size-base);
				display: block;
		}
		.ordering-table tbody td:first-child {
				padding-top: 0;
				padding-left: 0;
				margin-bottom: 10px;
		}
		.ordering-table tbody td:first-child::before {
				color: #0066cc;
				font-size: var(--font-size-base);
		}
		.ordering-table tbody td .checkbox-indicator {
				display: inline-block;
				margin-right: 8px;
		}
		.ordering-table tbody td:last-child {
				padding-bottom: 0;
				line-height: 1.6;
		}
		.ordering-table.ordering-table-3col tbody td:nth-child(2) {
				padding: 5px 0;
				border-top: 1px solid #eee;
				margin-top: 10px;
		}
		.ordering-table.ordering-table-3col tbody td:nth-child(3) {
				border-top: 1px solid #eee;
				padding-top: 5px;
				margin-top: 0;
		}
		.sustainability-hero {
				height: 640px;
		}
		.casestudy-grid {
				gap: 20px 10px;
				-ms-grid-columns: 1fr;
				grid-template-columns: repeat(1, 1fr);
				margin-top: 0;
		}
		#page-nav .nav-bar {
				height: -webkit-max-content;
				height: -moz-max-content;
				height: max-content;
				min-height: 60px;
				padding-top: 5px;
				overflow-x: auto;
				overflow-y: hidden;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-pack: start;
				-ms-flex-pack: start;
				justify-content: flex-start;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
				scrollbar-width: none;
				-ms-overflow-style: none;
		}
		#page-nav .nav-bar::-webkit-scrollbar {
				display: none;
		}
		.nav-divider {
				height: 15px;
				margin-bottom: 5px;
		}
		.myvecow-grid {
				-ms-grid-columns: (1fr)[2];
				grid-template-columns: repeat(2, 1fr);
		}
		.card-item .card-tag {
				top: 10px;
				padding: 5px 10px;
		}
		.grid-2, .grid-3 {
				-ms-grid-columns: (1fr)[1];
				grid-template-columns: repeat(1, 1fr);
		}
		.filter-container .custom-select-wrapper {
				min-width: 46%;
				max-width: 46%;
		}
		.partner-logo {
				min-height: 50px;
		}
		.feature-icon {
				width: 60px;
				height: 60px;
		}
		.hero-card {
				max-width: 80%;
				right: 1rem;
				padding: 30px 25px;
				max-width: 85%;
		}
		.slidehover-row {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				height: 520px;
		}
		.slidehover-vertical {
				-webkit-writing-mode: horizontal-tb;
				-ms-writing-mode: lr-tb;
				writing-mode: horizontal-tb;
				text-orientation: mixed;
				left: 0;
				position: relative;
				-webkit-transform: translate(10%, -50%) rotate(0deg);
				-ms-transform: translate(10%, -50%) rotate(0deg);
				transform: translate(10%, -50%) rotate(0deg);
				bottom: -10%;
		}
		.slidehover-card.active .slidehover-vertical {
				display: none;
		}
		.slidehover-vertical .slidehover-title {
				font-size: var(--font-size-base);
				letter-spacing: normal;
				line-height: 1.35;
				text-align: left; /* 確保標題也靠左 */
				min-width: 250px;
		}
		.slidehover-content {
				padding: 10px 1rem;
				-webkit-box-pack: start;
				-ms-flex-pack: start;
				justify-content: flex-start;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
		}
		.slidehover-horizontal {
				text-align: left; /* horizontal 模式也靠左 */
				padding-left: 1rem;
				-webkit-transition: all 0s ease;
				-o-transition: all 0s ease;
				transition: all 0s ease;
		}
		.slidehover-horizontal .slidehover-title, .slidehover-horizontal .slidehover-desc {
				text-align: left;
		}
		.rma-hero-section {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				margin-bottom: 20px;
		}
		.rma-hero-bg {
				aspect-ratio: 16 / 5;
				border-radius: 8px 8px 0 0;
		}
		.rma-policy-link {
				border-radius: 0 0 8px 8px;
				min-width: auto;
				padding: 15px 20px;
				font-size: var(--font-size-base);
		}
		.rma-step-card {
				padding: 8px;
				gap: 10px;
		}
		.rma-step-number {
				width: 50px;
				height: 40px;
				font-size: var(--font-size-base-lg);
		}
		.rma-step-content {
				font-size: var(--font-size-sm);
		}
		.rma-procedure-title {
				font-size: var(--font-size-base-lg);
		}
		.rma-procedure-intro, .rma-warranty-text, .rma-disclaimer {
				font-size: var(--font-size-sm);
		}
		.about-hero {
				height: auto;
				min-height: 300px;
		}
		.about-hero-bg {
				width: 100%;
				height: 100%;
				-o-object-fit: cover;
				object-fit: cover;
				position: absolute;
		}
		.about-hero-content {
				width: 100%;
				border-radius: 0;
				padding: 15px;
				gap: 10px;
		}
		.about-hero-content .section-title {
				font-size: var(--font-size-lg);
		}
		.about-info {
				padding: 30px 0;
		}
		.vecow-offers {
				padding: 40px 0;
		}
		.offers-grid {
				-ms-grid-columns: 1fr 10px 1fr 10px 1fr;
				grid-template-columns: repeat(3, 1fr);
				gap: 15px;
		}
		.offer-icon {
				width: 50px;
				height: 50px;
		}
		.offer-title {
				font-size: var(--font-size-sm);
		}
		.contact-cta {
				padding: 0;
		}
		.contact-cta-image {
				aspect-ratio: 16 / 6;
		}
		.contact-cta-buttons {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				gap: 5px;
		}
		.partners-hero-content {
				max-width: 100%;
		}
		.partners-hero-content p {
				font-size: var(--font-size-sm);
		}
		.partners-logos-grid {
				-ms-grid-columns: 1fr 10px 1fr;
				grid-template-columns: repeat(2, 1fr);
				gap: 10px;
		}
		.partner-logo-item {
				min-height: 70px;
				padding: 10px;
		}
		.partners-highlights-list {
				gap: 10px;
		}
		.partner-highlight-item {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
		}
		.highlight-logos {
				max-width: 100px;
		}
		.highlight-content {
				padding-left: 0;
				font-size: var(--font-size-sm);
		}
		.brand-detail-panel {
				max-width: 100%;
				padding: 10px;
		}
		.brand-detail-close {
				top: -30px;
				right: -5px;
		}
		.brand-detail-description p {
				font-size: var(--font-size-sm);
		}
		.challenges-section {
				padding: 40px 0;
		}
		.challenges-content {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				gap: 10px;
		}
		.challenges-image {
				width: 180px;
				height: 180px;
				margin: 0 auto;
		}
		.challenge-item {
				gap: 10px;
		}
		.challenge-icon-wrapper {
				width: 50px;
				height: 50px;
				padding: 8px;
		}
		.challenge-connector {
				min-width: 40px;
				width: 40px;
				left: 40px;
		}
		.challenge-text-box {
				padding: 10px;
				border-radius: 8px;
		}
		.challenge-text-box h3 {
				font-size: var(--font-size-base);
				margin-bottom: 5px;
		}
		.challenge-text-box p {
				font-size: var(--font-size-sm);
		}
		.esg-cards {
				padding: 40px 0;
		}
		.esg-card-title {
				font-size: var(--font-size-base-lg);
		}
		.esg-card-text {
				font-size: var(--font-size-sm);
		}
		.newsletter-modal-content {
				padding: 25px 20px;
		}
		.newsletter-title {
				font-size: var(--font-size-lg);
		}
		.newsletter-subtitle {
				font-size: var(--font-size-sm);
				margin-bottom: 20px;
		}
		.newsletter-success-content {
				padding: 40px 20px 25px;
		}
		.newsletter-success-title {
				font-size: var(--font-size-xl);
		}
		.newsletter-success-text {
				font-size: var(--font-size-sm);
		}
		.user-info-row {
				gap: 10px;
		}
		.user-info-item {
				min-width: 100%;
		}
		.user-info-label, .user-info-value {
				font-size: var(--font-size-sm);
		}
		.contact-info-item {
				font-size: var(--font-size-sm);
				gap: 8px;
		}
		.contact-info-item img {
				width: 18px;
				height: 18px;
		}
		.email-notice-box {
				padding: 20px;
				font-size: var(--font-size-sm);
		}
		.email-notice-box h5 {
				font-size: var(--font-size-base);
		}
		.email-notice-box p {
				font-size: var(--font-size-sm);
		}
		.contact-tabs {
				gap: 10px;
		}
		.contact-tab {
				font-size: var(--font-size-base);
				padding: 10px 5px;
		}
		.myvecow-welcome h5 {
				font-size: var(--font-size-base-lg);
		}
		.myvecow-welcome p {
				font-size: var(--font-size-sm);
		}
		.myvecow-grid {
				padding: 20px 0;
				gap: 10px;
		}
		.myvecow-grid li .btn {
				height: 100px;
		}
		.myvecow-grid li .btn > img {
				width: 22px;
				height: 22px;
				margin-bottom: 5px;
		}
		.myvecow-grid li .btn .text {
				font-size: var(--font-size-sm);
		}
		.product-in-card {
				min-width: 200px;
				max-width: 200px;
		}
		.product-in-card img {
				max-width: 120px;
		}
		.product-in-card-name {
				font-size: var(--font-size-base);
		}
		.product-in-card-btn {
				font-size: var(--font-size-sm);
				padding: 6px 10px;
		}
		.casestudy-section {
				padding: 40px 0;
		}
		.casestudy-header-row {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
				gap: 10px;
		}
		.casestudy-meta {
				font-size: var(--font-size-sm);
		}
		.casestudy-title {
				font-size: var(--font-size-sm);
		}
		.industries-title {
				font-size: var(--font-size-sm);
		}
		.dropdown-link {
				font-size: var(--font-size-sm);
				padding: 4px 8px;
		}
		.dropdown-heading {
				font-size: var(--font-size-sm);
				padding: 8px 8px 4px 8px;
		}
		.page-hero-image-wrapper {
				height: 250px;
		}
		.page-hero-overlay {
				padding: 15px;
				max-width: 80%;
		}
		.page-hero-title {
				font-size: var(--font-size-base-lg);
				margin-bottom: 5px;
		}
		.page-hero-desc {
				font-size: var(--font-size-sm);
		}
		.cards-grid {
				-ms-grid-columns: (1fr)[2];
				grid-template-columns: repeat(2, 1fr);
				gap: 10px;
		}
		.card-item .card-image-wrapper {
				border-width: 3px;
		}
		.card-item .card-tag {
				padding: 5px 8px;
		}
		.card-item .tag-text {
				font-size: var(--font-size-sm);
		}
		.card-item .card-date {
				font-size: var(--font-size-sm);
		}
		.download-section-title {
				font-size: var(--font-size-base-lg);
		}
		.download-section-lang {
				font-size: var(--font-size-sm);
		}
		.download-item-title {
				font-size: var(--font-size-sm);
		}
		.download-item-meta {
				font-size: var(--font-size-sm);
		}
		.download-item-size {
				font-size: var(--font-size-sm);
		}
		.faq-header h3 {
				font-size: var(--font-size-base-lg);
		}
		.qa-list-item-question {
				font-size: var(--font-size-sm);
		}
		.qa-list-item-date {
				font-size: var(--font-size-sm);
		}
		.qa-category-title {
				font-size: var(--font-size-base);
		}
		.qa-category-description {
				font-size: var(--font-size-sm);
		}
		.inquiry-limit-text {
				font-size: var(--font-size-sm);
		}
		.inquiry-limit-text .limit-number {
				font-size: var(--font-size-base-lg);
		}
		.ordering-info-header {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
				-webkit-box-align: start;
				-ms-flex-align: start;
				align-items: flex-start;
				gap: 10px;
		}
		.selection-info {
				width: 100%;
				-webkit-box-pack: justify;
				-ms-flex-pack: justify;
				justify-content: space-between;
		}
		.result-item.news-card {
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
		}
		.result-item.news-card .news-thumbnail {
				width: 100%;
		}
		.result-item.download-item {
				padding: 1rem 0 !important;
		}
		.sustainability-hero {
				height: 550px;
		}
		.sustainability-hero-content .section-title {
				font-size: var(--font-size-lg);
		}
		.sustainability-commitment {
				font-size: var(--font-size-sm);
		}
		.basic-info {
				padding: 30px 0;
				font-size: var(--font-size-sm);
		}
}
/* ============================================================
 * END OF STYLESHEET
 * ============================================================ */