@charset "UTF-8";
	/* CSS Document */
	/* --- 全局與基礎設定 --- */
	*, *::before, *::after {
	  box-sizing: border-box;
	}
	:root {
	  --gold-color: #aca561;
	  --dark-gold-color: #8f8951;
	  --light-gold-color: #e7e4d1;
	  --text-primary: #333333;
	  --text-secondary: #aca561;
	  --text-thirdary: #666666;
	  --bg-light-gray: #f3f4f6;
	  --bg-dark: #1f2937;
	  --bg-lightest-gray: #f9fafb;
	  --step-inactive-color: #d1d5db;
	  --step-active-color: var(--gold-color);
	  --panel-w: 520px;
	  --line: #d1d5db;
	  --chip: #fff;
	  --shadow: 0 10px 15px -3px rgba(0, 0, 0, .1);
	  --panel-bg: #fff;
	  --submenu-bg: #f4f1e1;
	  --text-gray: #848484;
	  --primary-blue: #3b82f6;
	  --cream: #F8F6EE;
	  --chip-border: #d1d5db;
	  --danger-color: #ef4444;
	}
	body {
	  font-family: 'Montserrat', sans-serif;
	  background-color: var(--bg-light-gray);
	  color: var(--text-primary);
	  margin: 0;
	  line-height: 1.6;
	}
	.product-image {
	  width: auto;
	  height: 100%;
	  align-content: center;
	}
	.section {
	  padding-top: 0rem;
	  padding-bottom: .75rem;
	} /* 全局略縮 */
	.section + .section {
	  padding-top: .25rem;
	}
	.container {
	  width: 100%;
	  max-width: 1280px;
	  margin-left: auto;
	  margin-right: auto; /*padding-left: 1rem;
  padding-right: 1rem;*/
	}
	.content-box {
	  background-color: white;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
	  padding: 1rem 2rem 2rem; /*border-radius: 0.75rem;*/
	  margin-top: 1rem;
	}
	.content-box2 {
	  background-color: white;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
	  padding: 1rem 1.5rem;
	  margin: .5rem 0;
	}
	.content-box2 h2 {
	  font-size: 1.25rem;
	  font-weight: 600;
	  border-left: 4px solid var(--gold-color);
	  padding-left: 1rem;
	}
	/* --- Breadcrumb (NEW) --- */
	.breadcrumb-wrapper {
	  padding: 1rem 1rem 0 1rem;
	}
	.breadcrumb ol {
	  display: flex;
	  flex-wrap: wrap;
	  align-items: center;
	  padding: 0;
	  margin: 0;
	  list-style: none;
	  font-size: 0.875rem;
	}
	.breadcrumb li {
	  display: flex;
	  align-items: center;
	}
	.breadcrumb li a {
	  color: var(--text-thirdary);
	  text-decoration: none;
	  transition: color 0.3s;
	}
	.breadcrumb li a:hover {
	  color: var(--gold-color);
	}
	.breadcrumb li:not(:last-child)::after {
	  content: '>';
	  margin: 0 0.75rem;
	  color: #d1d5db;
	}
	.breadcrumb li[aria-current="page"] {
	  color: var(--text-primary);
	  font-weight: 500;
	}
	.section-title {
	  font-size: 1.6em;
	  font-weight: 700;
	  color: var(--text-primary);
	  margin-bottom: 0.75rem;
	  text-align: center;
	}
	.section-subtitle {
	  font-size: 1rem;
	  color: var(--text-secondary);
	  max-width: 42rem;
	  margin: 0 auto 3rem auto;
	  text-align: center;
	}
	.icon-button {
	  color: var(--text-secondary);
	}
	.icon-button:hover {
	  color: var(--dark-gold-color);
	}
	.f_c_green {
	  color: #16a34a;
	}
	.f_c_red {
	  color: red;
	}
	.f_c_lightgray {
	  color: var(--text-gray);
	}
	.btn {
	  padding: 0.75rem 1rem;
	  border-radius: 0.5rem;
	  border: 1px solid transparent;
	  font-size: 1rem;
	  font-weight: 600;
	  cursor: pointer;
	  transition: all 0.3s ease;
	  text-align: center;
	}
	.btn-primary {
	  background-color: var(--gold-color);
	  color: white;
	  border-color: var(--gold-color);
	}
	.btn-primary:hover {
	  background-color: var(--dark-gold-color);
	  border-color: var(--dark-gold-color);
	}
	.btn-secondary {
	  background-color: #f3f4f6;
	  color: var(--text-thirdary);
	}
	.btn-secondary:hover {
	  background-color: #e5e7eb;
	}
	.btn-full {
	  display: block;
	  width: 100%;
	}
	.btn-small {
	  padding: 0.25rem 0.75rem;
	  font-size: 0.875rem;
	  border-radius: 0.25rem;
	}
	.btn-danger-outline {
	  background-color: transparent;
	  color: var(--danger-color);
	  border-color: var(--danger-color);
	}
	.btn-danger-outline:hover {
	  background-color: var(--danger-color);
	  color: white;
	}
	/* --- Page Header --- */
	.page-header {
	  padding: 1rem 1rem;
	  margin-bottom: 1rem;
	  background-color: var(--light-gold-color);
	  background-image: url('');
	  background-blend-mode: overlay;
	  background-size: cover;
	  background-position: center;
	}
	.page-header h1 {
	  font-size: 2rem;
	  font-weight: 700;
	  text-align: center;
	  color: var(--text-primary);
	  margin: 0;
	}
	/* --- Limited Time Popup (NEW) --- */
	.popup-overlay {
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  background-color: rgba(0, 0, 0, 0.6);
	  z-index: 50;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  padding: 1rem;
	}
	.popup-content {
	  background-color: white;
	  padding: 2rem;
	  border-radius: 0.75rem;
	  width: 100%;
	  max-width: 800px;
	  max-height: 90vh; /* Add max height */
	  overflow-y: auto; /* Add scroll for overflow */
	  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
	  position: relative;
	}
	.popup-close-btn {
	  position: absolute;
	  top: 1rem;
	  right: 1rem;
	  background: none;
	  border: none;
	  cursor: pointer;
	  color: #9ca3af;
	}
	.popup-close-btn:hover {
	  color: var(--text-primary);
	}
	.popup-header {
	  text-align: center;
	  margin-bottom: 1.5rem;
	}
	.popup-header h2 {
	  font-size: 1.25rem;
	  font-weight: 700;
	  line-height: .5;
	}
	#countdown-timer {
	  border-radius: 9999px;
	  background: linear-gradient(180deg, #e35d6a 0%, #c4162a 45%, #960b1c 100%);
	  box-shadow: 0 6px 18px rgba(196, 22, 42, 0.35);
	  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	  margin-top: 0.5rem;
	  font-size: .9rem;
	  color: white;
	  padding: 10px;
	  font-weight: 600;
	  width: 60%;
	  margin: auto;
	}
	.popup-product-grid {
	  display: grid;
	  grid-template-columns: repeat(2, 1fr);
	  gap: 1.5rem;
	}
	.popup-product-card {
	  text-align: center;
	}
	.popup-product-image-container { /* UPDATED */
	  position: relative;
	  width: 100%;
	  padding-top: 100%; /* 1:1 Aspect Ratio */
	  border-radius: 0.5rem;
	  overflow: hidden;
	  background-color: #f9fafb;
	}
	.popup-product-image-container img { /* UPDATED */
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	}
	.popup-product-card h3 {
	  font-size: 1rem;
	  margin: 0.75rem 0 0.25rem;
	}
	.popup-product-card .price {
	  color: #c4162a;
	  font-size: 1rem;
	  line-height: .5;
	}
	.popup-product-card .interest-btn {
	  margin-top: 1rem;
	  font-size: 1rem;
	  width: 100%;
	  padding: 0.5rem;
	  background: linear-gradient(180deg, #c4bd75 0%, #aca561 45%, #918b4d 100%);
	  box-shadow: 0 5px 15px rgba(145, 139, 77, 0.4);
	  color: white;
	  border: none;
	  border-radius: 9999px;
	  cursor: pointer;
	  transition: background-color 0.3s;
	}
	.popup-product-card .interest-btn:hover {
	  background: linear-gradient(90deg, #a6a063 0%, #928c52 45%, #7b7641 100%);
	}
	/* ===== Header ===== */
	.main-header {
	  background-color: rgba(255, 255, 255, 0.8);
	  backdrop-filter: blur(10px);
	  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
	  position: sticky;
	  top: 0;
	  z-index: 40;
	  transition: all 0.3s;
	}
	.header-container {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  height: 3.2rem;
	  padding-right: .5rem;
	}
	.logo {
	  display: inline-flex; /* 或 flex；inline-flex 可保持像行內元素 */
	  align-items: center;
	}
	.logo img {
	  height: 38px; /* 依實際視覺調整 32~40px */
	  display: block; /* 移除行內圖片的下方空白 */
	  object-fit: contain;
	}
	.header-actions {
	  display: flex;
	  align-items: center;
	  gap: .75rem
	}
	/* 按鈕：沿用 icon 風格，擺在 header-actions 內 */
	.hamburger-btn {
	  width: 36px;
	  height: 36px;
	  border-radius: 9999px;
	  border: 1px solid #d1d5db;
	  background: transparent;
	  color: var(--text-secondary);
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  cursor: pointer;
	}
	.hamburger-btn:hover {
	  background: #f3f4f6;
	}
	/* ===== 手機：滿版展開（主導覽下） ===== */
	.hamburger-menu {
	  display: none;
	  position: fixed;
	  left: 0;
	  right: 0;
	  background: var(--cream);
	  border-top: 1px solid #eee;
	  width: 100vw;
	  margin-left: 50%;
	  transform: translateX(-50%);
	  z-index: 1200;
	}
	.hamburger-menu.show {
	  display: block;
	}
	.hamburger-list {
	  list-style: none;
	  margin: 0;
	  padding: 0;
	}
	.menu-item {
	  width: 100%;
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  border-bottom: 3px solid transparent; /* 關鍵：先用透明邊框佔位 */
	  transition: border-color 0.3s ease, color 0.3s ease; /* 設定平滑過渡效果 */
	  padding: .6rem 1rem;
	  color: var(--text-primary);
	  text-decoration: none;
	  font-size: .95rem;
	}
	.menu-item:hover {
	  color: var(--gold-color);
	  border-bottom: 3px solid var(--gold-color);
	}
	.menu-item + .menu-item, .hamburger-list > li + li .menu-item {
	  margin-top: .5rem;
	}
	.has-sub .menu-item {
	  background: transparent;
	  border: 1px solid transparent
	}
	.submenu {
	  list-style: none;
	  margin: .5rem 0 0;
	  padding: 0;
	  background-color: white;
	}
	.submenu-item {
	  display: block;
	  padding: .4rem 2rem;
	  color: var(--text-primary);
	  text-decoration: none;
	  font-size: .92rem;
	}
	.submenu-item:hover {
	  border-bottom: 1px solid var(--gold-color);
	  color: var(--gold-color);
	}
	.submenu-item + .submenu-item {
	  margin-top: .4rem;
	}
	.submenu-trigger .chev {
	  color: var(--gold-color);
	  transition: transform .2s ease;
	}
	.submenu-trigger[aria-expanded="true"] .chev {
	  transform: rotate(180deg);
	}
	/* ===== Header 搜尋 ===== */
	.header-search {
	  display: none; /* Mobile first：先隱藏，桌機再開 */
	  align-items: center;
	}
	.search-input {
	  height: 36px;
	  width: clamp(180px, 24vw, 320px);
	  border-radius: 9999px;
	  border: 1px solid #d1d5db;
	  padding: 0 .9rem;
	  font-size: .9rem;
	  background: #fff;
	  outline: none;
	}
	.search-input::placeholder {
	  color: #9ca3af;
	}
	/* 手機右上角放大鏡 */
	.search-toggle {
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  width: 36px;
	  height: 36px;
	  border-radius: 9999px;
	  border: 1px solid #d1d5db;
	  background: transparent;
	  cursor: pointer;
	}
	.search-desktop {
	  display: none;
	  position: relative;
	}
	/* 手機搜尋面板 */
	.search-panel {
	  display: none; /* 由 JS 控制 hidden / 顯示 */
	  background: var(--cream);
	  border-top: 1px solid #eee;
	  position: relative;
	  z-index: 45; /* 高於 header 的導覽列 */
	  padding: .75rem 0 1rem;
	}
	.search-panel-inner {
	  position: relative;
	}
	.search-input-mobile {
	  height: 44px;
	  width: 100%;
	  border-radius: 9999px;
	  border: 1px solid #d1d5db;
	  padding: 0 1rem;
	  font-size: 1rem;
	  background: #fff;
	}
	.search-close {
	  position: absolute;
	  right: .5rem;
	  top: 0;
	  height: 44px;
	  width: 44px;
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  border: none;
	  background: transparent;
	  cursor: pointer;
	}
	/* 使用者頭像按鈕 */
	.user-menu {
	  position: relative;
	}
	.profile-button {
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  width: 36px;
	  height: 36px;
	  border-radius: 9999px;
	  border: 1px solid #d1d5db;
	  background: transparent;
	  cursor: pointer;
	  overflow: hidden;
	}
	.profile-button img {
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	  display: none;
	}
	.profile-button.has-avatar img {
	  display: block;
	}
	.profile-button.has-avatar .user-fallback {
	  display: none;
	}
	/* 下拉 */
	.user-dropdown {
	  display: none;
	  position: absolute;
	  right: 0;
	  top: calc(100% + .5rem);
	  background: #fff;
	  border: 1px solid #d1d5db;
	  border-radius: .5rem;
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1);
	  z-index: 2100;
	  min-width: 180px;
	  overflow: hidden;
	}
	.user-dropdown.show {
	  display: block;
	}
	.user-item {
	  display: block;
	  padding: .75rem 1rem;
	  font-size: .875rem;
	  text-decoration: none;
	  color: var(--text-primary);
	}
	/* 手機搜尋條：放在 Banner 下方，滿版寬 */
	.mobile-search, #mobile-search-bar {
	  display: block;
	  width: 100vw; /* 滿版寬 */
	  margin-left: 50%;
	  transform: translateX(-50%); /* 讓滿版寬置中，不受 container 影響 */
	  background: var(--cream);
	  border-bottom: 1px solid #d1d5db;
	  padding: .75rem 0; /* 外層不要左右 padding，內層自己控 */
	  position: relative;
	  z-index: 5;
	}
	.mobile-search-bar[hidden] {
	  display: none !important;
	}
	/* 內層加最大寬與左右間距，對齊頁面容器 */
	.mobile-search-row {
	  position: relative;
	  padding: 16px 16px 18px; /* 左右/下內距 */
	  padding-top: 36px; /* ↑ 調這個值可決定輸入框距上方的距離 */
	  min-height: 78px; /* ↑ 調整整列高度 */
	}
	.mobile-search-input {
	  width: 100%;
	  height: 32px;
	  border-radius: 9999px;
	  border: 1px solid #d1d5db;
	  background: #fff;
	  padding: 0 2.75rem 0 1rem; /* 預留右側給 X */
	  font-size: .9rem;
	  outline: none;
	}
	.mobile-search-input:focus {
	  border-color: var(--gold-color);
	  box-shadow: 0 0 0 3px rgba(172, 165, 97, .15);
	}
	.mobile-search-close {
	  position: absolute;
	  top: 0px;
	  right: 14px;
	  width: 32px;
	  height: 32px;
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  border: 0;
	  background: transparent;
	  line-height: 0;
	  cursor: pointer;
	  z-index: 2;
	}
	.mobile-search-close:hover {
	  background: #f3f4f6;
	}
	.mobile-search-close svg {
	  width: 20px;
	  height: 20px;
	}
	.user-item:hover {
	  background: #f9fafb;
	}
	/* Row-1: 主導覽 */
	.primary-nav {
	  border-top: 1px solid #f1f1f1;
	  padding-left: 1rem;
	  background-color: #fff;
	}
	.primary-nav .nav-list {
	  display: flex;
	  gap: .5rem;
	  list-style: none;
	  flex-wrap: nowrap; /* 關鍵：禁止項目換行 */
	  overflow-x: auto;
	  margin: 0;
	  padding: .5rem 0 .9rem;
	  -webkit-overflow-scrolling: touch;
	  scrollbar-width: none; /* 適用於 Firefox */
	  -ms-overflow-style: none; /* 適用於 IE and Edge */
	}
	.nav-list:hover, .nav-list .active {
	  color: var(--gold-color);
	  border-bottom-color: var(--gold-color);
	}
	.primary-nav .nav-link {
	  white-space: nowrap; /* 關鍵：確保連結內的文字本身也不會換行 */
	  flex-shrink: 0; /* 確保項目不會被壓縮 */
	  color: var(--text-thirdary);
	  padding: .4rem 0rem;
	  text-decoration: none;
	  border-bottom: 3px solid transparent; /* 關鍵：先用透明邊框佔位 */
	  transition: border-color 0.3s ease, color 0.3s ease; /* 設定平滑過渡效果 */
	}
	.primary-nav .nav-link.nav-link_selected {
	  color: var(--text-secondary);
	  border-color: var(--gold-color);
	}
	.primary-nav .nav-link:hover {
	  color: var(--text-secondary);
	  border-color: var(--gold-color);
	}
	/* === NEW: 主導覽下拉使用與次導覽相同樣式 === */
	.primary-nav .nav-item {
	  position: relative;
	}
	.primary-dropdown {
	  display: none;
	  position: absolute;
	  top: 100%;
	  left: 0;
	  background: var(--cream);
	  min-width: 180px;
	  box-shadow: 0 8px 16px rgba(0, 0, 0, .1);
	  border-radius: .5rem;
	  padding: .5rem 0;
	  z-index: 999;
	}
	.primary-dropdown.show {
	  display: block;
	}
	/* 主導覽的觸發器沿用次導覽的樣式，保持一致 */
	.nav-trigger {
	  display: flex;
	  align-items: center;
	  gap: .25rem;
	}
	.nav-chevron {
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  width: 24px;
	  height: 24px;
	  border: none;
	  background: transparent;
	  cursor: pointer;
	  border-radius: 6px;
	}
	.nav-chevron:hover {
	  background: #f3f4f6;
	}
	.nav-chevron svg {
	  width: .9rem;
	  height: .9rem;
	  transition: transform .2s;
	}
	.nav-chevron[aria-expanded="true"] svg {
	  transform: rotate(180deg);
	}
	.secondary-nav {
	  position: relative;
	  border-top: 1px solid #f7f7f7;
	  border-bottom: 1px solid #d1d5db;
	  background: #fff;
	  margin-left: -0.1rem;
	}
	.secondary-nav .sub-nav-list {
	  display: flex;
	  gap: 0rem;
	  list-style: none;
	  margin: 0;
	  padding-left: 1rem;
	}
	.sub-nav-item {
	  position: relative
	}
	.sub-nav-trigger {
	  display: flex;
	  align-items: center;
	  gap: .25rem
	}
	.sub-nav-chevron {
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  width: 24px;
	  height: 24px;
	  border: none;
	  background: transparent;
	  border-radius: 6px;
	  cursor: pointer
	}
	.sub-nav-chevron:hover {
	  background: #f3f4f6
	}
	.sub-nav-chevron svg {
	  width: .9rem;
	  height: .9rem;
	  transition: transform .2s
	}
	.sub-nav-chevron[aria-expanded="true"] svg {
	  transform: rotate(180deg)
	}
	/* Dropdown base（桌機預設對齊項目下方） */
	.cta-button {
	  display: none; /* Mobile first */
	  background-color: transparent;
	  border: 1px solid var(--gold-color);
	  color: var(--gold-color);
	  font-size: 0.875rem;
	  font-weight: 700;
	  padding: 0.4rem 1rem;
	  border-radius: 9999px;
	  text-decoration: none;
	  transition: all 0.3s;
	}
	.cta-button:hover {
	  background-color: var(--gold-color);
	  color: white;
	}
	.mobile-menu .cta-button {
	  display: block;
	  width: 100%;
	  text-align: center;
	  margin-top: 1rem;
	  background-color: var(--gold-color);
	  color: white;
	}
	.mobile-menu-btn {
	  padding: .5rem;
	  border-radius: .375rem;
	  color: #4b5563;
	  background: none;
	  border: none;
	  cursor: pointer;
	}
	.mobile-menu-btn:hover {
	  background: #f3f4f6
	}
	.mobile-menu {
	  display: none;
	  padding: .5rem 1rem 1rem;
	  background: #fff;
	  border-top: 1px solid #d1d5db
	}
	/* 手機版使用者區塊（在 mobile menu 裡） */
	.mobile-user {
	  padding-top: .25rem;
	}
	.mobile-user-header {
	  display: flex;
	  align-items: center;
	  gap: .5rem;
	  padding: .25rem 0 .5rem;
	}
	.mobile-user-item {
	  display: block;
	  padding: .6rem 0;
	  text-decoration: none;
	  color: var(--text-primary);
	  border-top: 1px solid #eee;
	}
	.mobile-user-item:hover {
	  color: var(--gold-color);
	}
	.nav-link {
	  color: var(--text-thirdary);
	  text-decoration: none;
	  font-size: 0.9rem;
	}
	.nav-link:hover {
	  color: var(--text-secondary);
	}
	/* 讓選單可以滾動的容器 */
	.scroll-container {
	  overflow-x: scroll;
	  overflow-y: none;
	  scrollbar-width: none; /* 隱藏 Firefox 滾動條 */
	}
	.scroll-container::-webkit-scrollbar {
	  display: none; /* 隱藏 Chrome/Safari 滾動條 */
	}
	/* ===== 次導覽（手機也常駐顯示） ===== */
	.header-subnav {
	  display: flex;
	  position: relative;
	  z-index: 100;
	  overflow: visible;
	  margin-top: -.5rem;
	  padding: .5rem 1rem;
	  border-top: 1px solid #f1f1f1;
	  background-color: #fff;
	}
	.header-subnav .sub-nav-list {
	  display: flex;
	  flex-wrap: nowrap; /* 關鍵：禁止項目換行 */
	  overflow-x: auto;
	  gap: .8rem;
	  list-style: none;
	  margin: 0;
	  padding: 0;
	  -webkit-overflow-scrolling: touch;
	  scrollbar-width: none;
	  -ms-overflow-style: none;
	}
	.sub-nav-item {
	  position: relative
	}
	.sub-nav-trigger {
	  display: flex;
	  align-items: center;
	  gap: 0rem;
	}
	.sub-nav-label {
	  font-size: 0.9rem;
	  line-height: 1.2; /* 更緊湊 */
	  display: inline-flex;
	  align-items: center;
	  padding: .6rem 0rem;
	  color: var(--text-thirdary);
	  text-decoration: none;
	  border-bottom: 2px solid transparent;
	  transition: color .3s, border-color .3s;
	  white-space: nowrap;
	}
	.sub-nav-label:hover, .sub-nav-label.active {
	  color: var(--gold-color);
	  border-bottom-color: var(--gold-color)
	}
	.sub-nav-dropdown, .primary-dropdown {
	  overflow: scroll;
	  overscroll-behavior: contain;
	  left: 0;
	  right: 0;
	  max-width: 100vw;
	  height: 200px;
	  -webkit-overflow-scrolling: touch;
	  display: none;
	  position: fixed;
	  margin: 0;
	  background: var(--cream);
	  min-width: 180px;
	  box-shadow: 0 8px 16px rgba(0, 0, 0, .1);
	  border-radius: 0;
	  padding: .5rem 0;
	  z-index: 999;
	}
	.sub-nav-dropdown.show {
	  display: block
	}
	.language-selector {
	  position: relative;
	  z-index: 2000;
	}
	.lang-button {
	  display: flex;
	  align-items: center;
	  gap: 0.5rem;
	  background-color: transparent;
	  border: 1px solid #d1d5db;
	  padding: 0.4rem; /* Smaller padding for mobile */
	  border-radius: 9999px;
	  cursor: pointer;
	  font-size: 0.7rem;
	  color: var(--text-secondary);
	}
	.lang-button .lang-text, .lang-button .lang-chevron {
	  display: none; /* Hide text and chevron on mobile */
	}
	.lang-button svg {
	  width: 1.25rem;
	  height: 1.25rem;
	}
	.lang-dropdown {
	  display: none;
	  position: absolute;
	  top: calc(100% + 0.5rem);
	  right: 0;
	  background-color: white;
	  border-radius: 0.5rem;
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	  border: 1px solid #d1d5db;
	  z-index: 2100;
	  min-width: 150px;
	  overflow: hidden;
	}
	.lang-dropdown.show {
	  display: block;
	}
	.lang-option {
	  display: block;
	  padding: 0.75rem 1rem;
	  text-decoration: none;
	  color: var(--text-primary);
	  font-size: 0.875rem;
	}
	.lang-option:hover {
	  background-color: #f9fafb;
	}
	.main-header, .header-container, .header-actions {
	  overflow: visible;
	}
	/* --- AI 客服 --- */
	.ai-chat-widget {
	  position: fixed;
	  bottom: 1.25rem;
	  right: 1.25rem;
	  z-index: 40;
	  display: flex;
	  flex-direction: column;
	  align-items: flex-end;
	  gap: 0.75rem;
	}
	.line-chat-button {
	  background-color: #06C755; /* LINE Green */
	  color: white;
	  width: 4rem;
	  height: 4rem;
	  border-radius: 9999px;
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  border: none;
	  cursor: pointer;
	  transition: all 0.3s;
	  text-decoration: none;
	}
	.line-chat-button:hover {
	  background-color: #05a546;
	  transform: scale(1.1);
	}
	.line-chat-button img {
	  width: 2.5rem;
	  height: 2.5rem;
	  object-fit: cover;
	  border-radius: 50%;
	}
	.ai-chat-container {
	  position: relative;
	}
	.ai-chat-button {
	  background-color: var(--gold-color);
	  color: white;
	  width: 4rem;
	  height: 4rem;
	  border-radius: 9999px;
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  border: none;
	  cursor: pointer;
	  transition: all 0.3s;
	}
	.ai-chat-button:hover {
	  background-color: var(--dark-gold-color);
	  transform: scale(1.1);
	}
	.ai-chat-button svg {
	  width: 2rem;
	  height: 2rem;
	}
	.ai-chat-window {
	  display: none;
	  position: absolute;
	  bottom: 5rem;
	  right: 0;
	  width: 20rem;
	  height: 24rem;
	  background-color: white;
	  border-radius: 0.5rem;
	  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
	  flex-direction: column;
	  border: 1px solid #e5e7eb;
	}
	.ai-chat-window.show {
	  display: flex;
	}
	.ai-chat-header {
	  padding: 1rem;
	  background-color: #f3f4f6;
	  border-top-left-radius: 0.5rem;
	  border-top-right-radius: 0.5rem;
	  border-bottom: 1px solid #e5e7eb;
	}
	.ai-chat-header h3 {
	  font-weight: 700;
	}
	.ai-chat-header p {
	  font-size: 0.75rem;
	  color: var(--text-secondary);
	}
	.ai-chat-body {
	  flex-grow: 1;
	  padding: 1rem;
	  overflow-y: auto;
	}
	.ai-chat-body .message {
	  background-color: #e5e7eb;
	  padding: 0.75rem;
	  border-radius: 0.5rem;
	  max-width: 83.333333%;
	  font-size: 0.875rem;
	}
	.ai-chat-footer {
	  padding: 0.5rem;
	  border-top: 1px solid #e5e7eb;
	}
	.ai-chat-footer input {
	  width: 100%;
	  padding: 0.5rem 0.75rem;
	  border: 1px solid #d1d5db;
	  border-radius: 0.375rem;
	  outline: none;
	}
	.ai-chat-footer input:focus {
	  border-color: var(--gold-color);
	  box-shadow: 0 0 0 2px rgba(192, 158, 109, 0.5);
	}
	/* --- Custom Select Component --- */
	.filter-container {
	  display: flex;
	  align-items: center;
	  gap: 0.5rem;
	}
	.filter-container label {
	  font-size: 0.9rem;
	  color: var(--text-thirdary);
	  white-space: nowrap;
	}
	.custom-select-wrapper {
	  position: relative;
	  width: 150px;
	  user-select: none; /* 防止文字被選取 */
	}
	.select-selected {
	  padding: 0.1rem 2.5rem 0.1rem 1rem;
	  border: 1px solid #d1d5db;
	  border-radius: 0.375rem;
	  background-color: white;
	  font-size: 0.9rem;
	  color: var(--text-primary);
	  cursor: pointer;
	  transition: all 0.2s;
	  position: relative;
	}
	.select-selected::after {
	  content: '▼';
	  font-size: 0.6rem;
	  color: var(--text-secondary);
	  position: absolute;
	  right: 1rem;
	  top: 50%;
	  transform: translateY(-50%);
	  transition: transform 0.3s;
	}
	/* 當選單展開時的樣式 */
	.custom-select-wrapper.open .select-selected {
	  border-color: var(--gold-color);
	  box-shadow: 0 0 0 2px rgba(192, 158, 109, 0.3);
	  border-bottom-left-radius: 0;
	  border-bottom-right-radius: 0;
	}
	.custom-select-wrapper.open .select-selected::after {
	  transform: translateY(-50%) rotate(180deg);
	}
	.select-options {
	  position: absolute;
	  top: 100%;
	  left: 0;
	  width: 100%;
	  background-color: white;
	  border: 1px solid #d1d5db;
	  border-top: none;
	  border-radius: 0 0 0.375rem 0.375rem;
	  z-index: 50;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
	  /* 動畫效果 */
	  opacity: 0;
	  visibility: hidden;
	  transform: translateY(-10px);
	  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s 0.2s;
	}
	.custom-select-wrapper.open .select-options {
	  opacity: 1;
	  visibility: visible;
	  transform: translateY(0);
	  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s 0s;
	}
	.select-option {
	  padding: 0.6rem 1rem;
	  cursor: pointer;
	  transition: background-color 0.2s;
	}
	.select-option:hover {
	  background-color: #f9fafb;
	  color: var(--gold-color);
	}
	/* --- Form Styles --- */
	.form-group {
	  margin-bottom: 1.5rem;
	}
	.form-group label {
	  display: block;
	  margin-bottom: 0.5rem;
	  font-weight: 500;
	  font-size: 0.9rem;
	  color: var(--text-thirdary);
	}
	.form-input {
	  width: 100%;
	  padding: 0.75rem 1rem;
	  border: 1px solid #d1d5db;
	  border-radius: 0.375rem;
	  font-size: 1rem;
	}
	.form-input[disabled] {
	  background-color: #f9fafb;
	  color: var(--text-thirdary);
	}
	.form-text-link {
	  display: inline-block;
	  font-size: 0.9rem;
	  color: var(--gold-color);
	  text-decoration: none;
	  margin-top: 0.5rem;
	}
	/* UPDATED: Password Group Style */
	.password-group {
	  position: relative;
	}
	.password-group .form-text-link {
	  display: block;
	  text-align: right;
	  margin-top: 0.25rem;
	}
	.info-grid {
	  display: grid;
	  grid-template-columns: 1fr 1fr;
	  gap: 1.5rem;
	}
	.info-grid .form-group {
	  margin-bottom: 0;
	}
	/* --- list List (Mobile) --- */
	.list-list {
	  display: flex;
	  flex-direction: column;
	  gap: 1.5rem;
	}
	.list-item {
	  border: 1px solid #e5e7eb;
	  border-radius: 0.5rem;
	  overflow: hidden;
	}
	.item-info {
	  padding: 1rem;
	}
	.item-info h3 {
	  font-size: 1.1rem;
	  font-weight: 600;
	  margin: 0 0 0.5rem 0;
	}
	.item-info p {
	  font-size: 0.9rem;
	  color: var(--text-thirdary);
	  margin: 0.25rem 0;
	}
	.item-actions {
	  padding: 1rem;
	  background-color: #f9fafb;
	  display: flex;
	  gap: 1rem;
	}
	/* --- list Table (Desktop) --- */
	.list-table {
	  display: none; /* Mobile first */
	  width: 100%;
	  border-collapse: collapse;
	}
	.list-table th, .list-table td {
	  padding: 1rem;
	  text-align: left;
	  border-bottom: 1px solid #e5e7eb;
	}
	.list-table th {
	  font-size: 0.875rem;
	  color: var(--text-thirdary);
	  font-weight: 500;
	}
	.list-table td {
	  font-size: 0.9rem;
	}
	.list-table .action-buttons {
	  margin-top: 0rem;
	  display: flex;
	  gap: 0.5rem;
	}
	/* --- 5. 美容展資訊 --- */
	.expo-grid {
	  display: grid;
	  grid-template-columns: repeat(1, 1fr);
	  gap: 2rem;
	}
	.expo-card {
	  background-color: white;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
	  overflow: hidden;
	  transition: all 0.3s;
	  text-align: left;
	  border-radius: 12px;
	}
	.expo-card:hover {
	  transform: translateY(-8px);
	  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
	}
	.expo-card img {
	  width: 100%;
	  height: 14rem;
	  object-fit: cover;
	}
	.expo-card-content {
	  padding: 1.5rem;
	}
	.expo-card-content .date {
	  font-size: 0.875rem;
	}
	.expo-card-content h3 {
	  margin-top: 0.5rem;
	  font-size: 1.25rem;
	  font-weight: 700;
	}
	.expo-card-content .location {
	  margin-top: 0.75rem;
	  color: var(--text-primary);
	}
	.expo-card-content .learn-more {
	  display: inline-block;
	  margin-top: 1rem;
	  color: var(--gold-color);
	  font-weight: 600;
	  text-decoration: none;
	  transition: color 0.3s;
	}
	.expo-card-content .learn-more:hover {
	  color: var(--dark-gold-color);
	}
	/* --- 產品頁面樣式 --- */
	.product-page-container {
	  max-width: 800px;
	  margin: 1rem auto;
	  background-color: white;
	  border-radius: 0.5rem;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
	  overflow: hidden;
	}
	.company-bar {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  padding: 1rem 1.5rem;
	  border-bottom: 1px solid #d1d5db;
	}
	.company-info {
	  display: flex;
	  align-items: center;
	  gap: 1rem;
	}
	.company-logo {
	  width: 80px;
	  height: auto;
	  object-fit: contain;
	}
	.company-name {
	  font-size: 1.1rem;
	  font-weight: 200;
	  line-height: 1.3;
	  padding: 0px 8px;
	}
	.store-button {
	  background-color: transparent;
	  border: 1px solid var(--gold-color);
	  color: var(--gold-color);
	  padding: 0.5rem 1rem;
	  border-radius: 0.25rem;
	  font-size: 0.875rem;
	  cursor: pointer;
	  transition: all 0.3s;
	  white-space: nowrap;
	}
	.store-button:hover {
	  background-color: var(--gold-color);
	  color: white;
	}
	.product-image-large_wrapper {
	  padding-top: 1rem;
	  position: relative;
	  text-align: center;
	  width: auto;
	}
	.product-image-large {
	  max-height: 200px; /* 自訂一個你想要的高度 */
	  width: auto;
	  align-content: center;
	}
	.product-title-section {
	  padding: 1rem;
	  text-align: center;
	}
	.product-title-section h1 {
	  font-size: 1.4rem;
	  font-weight: 700;
	  margin: 0;
	}
	.product-description-section {
	  padding: 0rem 2rem;
	  color: var(--text-thirdary);
	  line-height: 1.8;
	}
	/* ===== Mega dropdown（群組＋chips） ===== */
	/* 讓內容不被 920px 限制，真正填滿寬度 */
	.mega-dropdown {
	  width: auto;
	  background: var(--cream);
	  padding: 0.5rem;
	  overflow-y: scroll;
	}
	.mega-grid {
	  display: grid;
	  gap: .75rem
	}
	.mega-group {
	  border-radius: .75rem;
	  padding: .75rem .75rem
	}
	.mega-group + .mega-group {
	  border-top: 1px dashed #d1d5db
	}
	.mega-title {
	  font-weight: 700;
	  margin: 0 0 .5rem;
	  color: #222;
	  font-size: 1rem
	}
	.mega-title a {
	  font-weight: 700;
	  margin: 0 0 .5rem;
	  color: var(--primary-color);
	  font-size: 1rem;
	  text-decoration: none;
	}
	.mega-title a:hover {
	  color: var(--text-secondary);
	}
	.chips {
	  display: flex;
	  flex-wrap: wrap;
	  gap: .5rem
	}
	.chip {
	  display: inline-flex;
	  align-items: center;
	  padding: .4rem .75rem;
	  background: #fff;
	  border: 1px solid var(--chip-border);
	  border-radius: 9999px;
	  font-size: .875rem;
	  color: #374151;
	  text-decoration: none;
	  line-height: 1
	}
	.chip:hover {
	  border-color: var(--gold-color);
	  color: var(--gold-color);
	  background: #fffaf3;
	}
	/* ===== Banner ===== */
	.hero-banner {
	  position: relative;
	  width: 100%;
	  overflow: hidden;
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	  /*border-radius: 0.75rem;*/
	  aspect-ratio: auto;
	  height: clamp(130px, 34vw, 16px); /* 最小140px，最大200px，中間依視窗寬度縮放 */
	}
	.page-wrapper {
	  max-width: 960px;
	  margin: 2rem auto;
	}
	.company-profile-top {
	  background-color: white;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
	  /*border-radius: 0.75rem;*/
	  margin-bottom: 1rem;
	  overflow: hidden; /* Important for carousel */
	}
	.company-header {
	  padding: 1rem;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  gap: 1rem;
	}
	.company-header h1 {
	  font-size: 1.2rem;
	  font-weight: 700;
	  margin: 0;
	  text-align: left;
	}
	/* --- Media Carousel --- */
	.media-carousel-wrapper {
	  position: relative;
	}
	.media-carousel {
	  display: flex;
	  transition: transform 0.5s ease-in-out;
	}
	.media-slide {
	  flex: 0 0 100%;
	}
	.media-slide img, .media-slide video {
	  width: 100%;
	  height: auto;
	  aspect-ratio: 21 / 9;
	  object-fit: cover;
	  display: block;
	}
	.media-carousel-btn {
	  position: absolute;
	  top: 50%;
	  transform: translateY(-50%);
	  background-color: rgba(255, 255, 255, 0.7);
	  border: none;
	  border-radius: 50%;
	  width: 32px;
	  height: 32px;
	  font-size: 1.25rem;
	  cursor: pointer;
	  z-index: 10;
	  transition: background-color 0.3s;
	}
	.media-carousel-btn:hover {
	  background-color: white;
	}
	.media-carousel-btn.prev {
	  left: 1rem;
	}
	.media-carousel-btn.next {
	  right: 1rem;
	}
	.media-carousel-dots {
	  position: absolute;
	  bottom: 1rem;
	  left: 50%;
	  transform: translateX(-50%);
	  z-index: 15;
	}
	.media-dot {
	  display: inline-block;
	  width: 10px;
	  height: 10px;
	  border-radius: 50%;
	  background-color: rgba(255, 255, 255, 0.5);
	  margin: 0 5px;
	  cursor: pointer;
	  transition: background-color 0.3s;
	}
	.media-dot.active {
	  background-color: white;
	} /* Thumbnail Navigation (NEW) */
	.media-thumbnails {
	  display: flex;
	  overflow-x: auto;
	  gap: 0.5rem;
	  padding: 1rem 1.5rem;
	  background-color: #f9fafb; /* Light background */
	  -ms-overflow-style: none;
	  scrollbar-width: none;
	  scroll-behavior: smooth; /* Add for smooth scrolling */
	}
	.media-thumbnails::-webkit-scrollbar {
	  display: none;
	}
	.thumbnail-item {
	  flex: 0 0 80px;
	  height: 45px;
	  border-radius: 4px;
	  cursor: pointer;
	  border: 2px solid transparent;
	  transition: border-color 0.3s;
	  opacity: 0.6;
	}
	.thumbnail-item img {
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	  border-radius: 2px;
	}
	.thumbnail-item.active {
	  border-color: var(--gold-color);
	  opacity: 1;
	}
	.company-info-wrapper {
	  padding: 1rem 4rem;
	}
	.company-details h1 {
	  font-size: 1.2rem;
	  font-weight: 700;
	  margin: 0;
	}
	.company-details .country {
	  font-size: 1rem;
	  color: var(--text-primary);
	  margin-top: 0.25rem;
	}
	.company-stats {
	  /*display: flex;*/
	  gap: 1rem;
	  margin-top: 1rem;
	  color: var(--text-primary);
	  font-size: 0.875rem;
	}
	.company-stats span:not(:last-child) {
	  border-right: 1px solid #d1d5db;
	  padding-right: 1rem;
	}
	.contact-info-grid {
	  display: grid;
	  grid-template-columns: 1fr;
	  gap: 0.5rem;
	}
	.contact-info-item {
	  display: flex;
	  font-size: 0.8rem;
	}
	.contact-info-label {
	  width: 106px;
	  flex-shrink: 0;
	  font-weight: 600;
	  color: var(--text-primary);
	}
	.contact-info-value {
	  color: var(--text-thirdary);
	}
	.company-description {
	  padding: 0rem 0;
	  line-height: 1.8;
	  color: var(--text-thirdary);
	}
	/* --- Tabs (NEW) --- */
	.tab-nav {
	  display: flex;
	  border-bottom: 2px solid #d1d5db;
	}
	.tab-link {
	  padding: 0.75rem 1.5rem;
	  cursor: pointer;
	  white-space: nowrap;
	  background-color: transparent;
	  border: none;
	  border-bottom: 2px solid transparent;
	  margin-bottom: -2px; /* Overlap the main border */
	  font-size: 1rem;
	  font-weight: 600;
	  color: var(--text-thirdary);
	  transition: all 0.3s;
	}
	.tab-link.active {
	  color: var(--gold-color);
	  border-bottom-color: var(--gold-color);
	}
	.tab-content {
	  padding-top: 1rem;
	}
	.tab-pane {
	  display: none;
	}
	.tab-pane.active {
	  display: block;
	  padding: 0 1rem;
	}
	.section-divider {
	  border: 0;
	  height: 1px;
	  background-color: #d1d5db;
	  margin: 2rem 0;
	}
	.product-showcase h2 {
	  font-size: 1.25rem;
	  font-weight: 600;
	  margin-bottom: 1.5rem;
	  border-left: 4px solid var(--gold-color);
	  padding-left: 1rem;
	}
	.product-carousel {
	  position: relative;
	  overflow: hidden;
	  padding: 1rem;
	}
	.product-category {
	  font-size: 0.875rem;
	  color: var(--text-secondary);
	}
	.product-category_2 {
	  font-size: 0.8rem;
	  color: var(--text-thirdary);
	}
	.carousel-dots {
	  display: flex;
	  justify-content: center;
	  gap: 0.5rem;
	  margin-top: 1.5rem;
	}
	.carousel-dots .dot {
	  width: 10px;
	  height: 10px;
	  border-radius: 50%;
	  border-width: 0px;
	}
	.info-box {
	  margin: 1rem;
	}
	/* --- Expo Detail Page Styles (NEW) --- */
	.expo-detail-hero {
	  width: 100%;
	  height: 250px;
	  object-fit: cover;
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	  margin-top: 1rem;
	}
	.expo-detail-content {
	  background-color: white;
	  border-radius: 0.75rem;
	  padding: 1.5rem;
	  margin-top: -3rem;
	  position: relative;
	  z-index: 10;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
	}
	.expo-detail-title {
	  font-size: 1.75rem;
	  font-weight: 700;
	  margin-top: 0;
	  margin-bottom: 1.5rem;
	}
	.expo-meta-list {
	  list-style: none;
	  padding: 0;
	  margin: 0 0 2rem 0;
	  display: flex;
	  flex-wrap: wrap;
	  flex-direction: row;
	  gap: 1rem;
	}
	.expo-meta-list .meta-item {
	  display: flex;
	  align-items: center;
	  gap: 0.75rem;
	}
	.expo-meta-list .meta-item-icon {
	  flex-shrink: 0;
	  width: 20px;
	  height: 20px;
	  color: var(--gold-color);
	}
	.expo-meta-list .meta-item-text {
	  font-size: 0.9rem;
	  color: var(--text-thirdary);
	}
	.btn-full {
	  display: block;
	  width: 100%;
	  padding: 0.75rem;
	  font-size: 1rem;
	  font-weight: 600;
	  text-align: center;
	  text-decoration: none;
	  border-radius: 0.5rem;
	  background-color: var(--gold-color);
	  color: white;
	  transition: background-color 0.3s;
	}
	.btn-full:hover {
	  background-color: var(--dark-gold-color);
	}
	.content-divider {
	  border: none;
	  border-top: 1px solid #e5e7eb;
	  margin: 2rem 0;
	}
	.content-section h2 {
	  font-size: 1.25rem;
	  font-weight: 600;
	  margin-bottom: 1rem;
	}
	.content-section p, .content-section ul {
	  font-size: 0.95rem;
	  color: var(--text-thirdary);
	  line-height: 1.7;
	}
	.content-section ul {
	  list-style: disc;
	  padding-left: 1.5rem;
	}
	.map-container {
	  position: relative;
	  width: 100%;
	  height: 0;
	  padding-top: 56.25%; /* 16:9 Aspect Ratio */
	  border-radius: 0.5rem;
	  overflow: hidden;
	  border: 1px solid #e5e7eb;
	}
	.map-container iframe {
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  border: 0;
	}
	/* --- Article Styles (NEW) --- */
	.article-content {
	  max-width: 800px;
	  margin: 0 auto;
	}
	.article-header {
	  margin-bottom: 1rem;
	}
	.article-header h1 {
	  font-size: 2rem;
	  font-weight: 700;
	  color: var(--text-primary);
	  margin-bottom: 1rem;
	  line-height: 1.4;
	}
	.article-meta {
	  display: flex;
	  gap: 1.5rem;
	  font-size: 0.875rem;
	  color: var(--text-thirdary);
	}
	.article-hero-image {
	  width: 100%;
	  height: auto;
	  aspect-ratio: 16 / 9;
	  object-fit: cover;
	  border-radius: 0.5rem;
	}
	.article-body {
	  font-size: 1rem;
	  line-height: 1.7;
	  color: var(--text-primary);
	}
	.article-body p {
	  margin-bottom: 1.5rem;
	}
	.article-body h2 {
	  font-size: 1.25rem;
	  font-weight: 600;
	  margin-top: 2.5rem;
	  margin-bottom: 1rem;
	}
	.article-body ul {
	  padding-left: 1.5rem;
	  margin-bottom: 1.5rem;
	}
	.article-body li {
	  margin-bottom: 0.5rem;
	}
	.article-body a {
	  color: var(--gold-color);
	  text-decoration: underline;
	}
	.footer-grid {
	  grid-template-columns: repeat(4, 1fr);
	}
	.carousel-container {
	  position: relative;
	  height: 100%;
	}
	.carousel-item {
	  position: absolute;
	  top: 0;
	  right: 0;
	  bottom: 0;
	  left: 0;
	  opacity: 0;
	  transition: opacity 1s ease-in-out;
	}
	.carousel-item img {
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	}
	/*.carousel-btn {
	  position: absolute;
	  top: 50%;
	  transform: translateY(-50%);
	  background-color: rgba(255, 255, 255, 0.7);
	  padding: 0.2rem 0.3rem;
	  border-radius: 9999px;
	  border: none;
	  cursor: pointer;
	  z-index: 10;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
	  transition: background-color 0.3s;
	}*/
	.carousel-btn {
	  position: absolute;
	  transform: translateY(-50%);
	  top: 50%;
	  width: 34px;
	  height: 34px;
	  border-radius: 50%;
	  background: rgba(255, 255, 255, .9);
	  color: var(--gold-color);
	  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 8px 16px rgba(0, 0, 0, 0.15);
	  padding: 0;
	  border: 0;
	  cursor: pointer;
	  display: grid;
	  z-index: 3;
	  place-items: center;
	  transition: opacity .2s ease;
	  padding-left: 10px;
	}
	.carousel-btn svg {
	  display: block;
	}
	.carousel-btn:hover {
	  background-color: white;
	}
	.carousel-btn.prev {
	  left: 8px;
	}
	.carousel-btn.next {
	  right: 8px;
	}
	.carousel-btn[disabled] {
	  opacity: .4;
	  pointer-events: none;
	}
	.horizontal-scroll-wrapper .carousel-btn {
	  display: none;
	}
	.dots-container {
	  position: absolute;
	  bottom: .6rem;
	  left: 50%;
	  transform: translateX(-50%)scale(.9);
	  display: flex;
	  gap: 0.5rem;
	  z-index: 10;
	}
	/* 讓輪播點點可縮到很小仍是正圓 */
	.dots-container .dot {
	  display: inline-block;
	  width: 10px;
	  height: 10px;
	  border-radius: 50%;
	  background-color: #d1d5db;
	  border: 0;
	  padding: 0;
	  line-height: 0;
	  -webkit-appearance: none; /* 重置按鈕預設外觀 */
	  appearance: none;
	  min-width: 0;
	  min-height: 0;
	}
	.dot.active {
	  background-color: var(--gold-color);
	}
	/* ===== Product（靜態示意） ===== */
	.product-section-header {
	  display: flex;
	  justify-content: space-between;
	  align-items: center;
	  margin-bottom: 1.25rem
	}
	.product-section-header h2 {
	  font-size: 1.25rem;
	  font-weight: 700;
	  margin: 0
	}
	.product-section-header a {
	  font-size: 0.8rem;
	}
	.product-grid {
	  display: grid;
	  grid-template-columns: repeat(2, 1fr); /* Mobile: 2 columns */
	  gap: 1rem;
	}
	.product-grid a {
	  text-decoration: none;
	}
	.product-card {
	  display: block;
	  background: #fff;
	  border-radius: 12px;
	  box-shadow: 0 6px 20px rgba(0, 0, 0, .06);
	  transition: transform 0.3s ease, box-shadow 0.3s ease;
	  overflow: hidden;
	  position: relative;
	  padding-bottom: 20px;
	  text-decoration: none;
	}
	.product-card:hover {
	  transform: translateY(-5px);
	  border: solid 1px var(--light-gold-color);
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	}
	.product-card .product-image-wrapper {
	  position: relative;
	  width: 100%;
	  overflow: hidden;
	  padding: 0;
	  aspect-ratio: auto !important; /* 強制覆蓋舊規則 */
	}
	/* 有小輪播（>1 張）才加底部空間給圓點 */
	.product-card .product-image-wrapper.has-dots {
	  --dot-space: 24px; /* 手機圓點高度預留 */
	}
	.product-info {
	  padding: 1rem;
	}
	.pc-meta p {
	  margin-bottom: 0px;
	}
	.product-name {
	  font-size: 1rem;
	  font-weight: 600;
	  color: var(--text-primary);
	  margin: 0;
	  white-space: nowrap;
	  overflow: hidden;
	  text-overflow: ellipsis;
	}
	.product-company {
	  font-size: 0.8rem;
	  color: var(--text-gray);
	  margin-top: 0rem;
	  white-space: nowrap;
	}
	.product-price {
	  font-size: 1.2rem;
	  color: #c62635;
	  margin-top: 1rem;
	  white-space: nowrap;
	}
	/* --- Horizontal Scrollers --- */
	.horizontal-scroll-wrapper {
	  position: relative;
	}
	.horizontal-scroller {
	  display: flex;
	  gap: 1rem;
	  padding-bottom: 1.5rem;
	  margin-bottom: -1.5rem;
	  padding-left: 1.5rem;
	  padding-right: 1.5rem;
	  -ms-overflow-style: none;
	  scrollbar-width: none;
	}
	.horizontal-scroller::-webkit-scrollbar {
	  display: none;
	}
	.scroll-card {
	  flex: 0 0 calc(50% - 8px); /* 手機 2 欄 */
	  min-width: 0; /* 防止內容撐爆寬度 */
	  scroll-snap-align: start;
	}
	.carousel-dots-container {
	  display: flex;
	  justify-content: center;
	  text-align: center;
	  margin-top: 1.5rem;
	  gap: 0.5rem;
	}
	.carousel-dots-container .dot {
	  display: inline-block;
	  width: 10px;
	  height: 10px;
	  border-radius: 50%;
	  background-color: #d1d5db;
	  border: 0;
	  padding: 0;
	  line-height: 0;
	  -webkit-appearance: none; /* 重置按鈕預設外觀 */
	  appearance: none;
	  min-width: 0;
	  min-height: 0;
	}
	.carousel-dots-container .dot.active {
	  background-color: var(--gold-color);
	}
	/* === 產品卡片：多圖小輪播（軌道版） ====================== 
*/
.horizontal-scroll-wrapper {
	  position: relative;
	}
	.horizontal-scroller {
	  display: flex;
	  align-items: stretch; 
	  gap: 16px;
	  overflow-x: auto;
	  overflow-y: visible;
	  scroll-snap-type: x mandatory;
	  -webkit-overflow-scrolling: touch;
	  padding: 10px 6px 20px !important; 
	}
	
	.section.product-strip .horizontal-scroll-wrapper {
	  position: relative;
	}
	.section.product-strip .horizontal-scroller {
	  display: flex;
	  align-items: stretch; 
	  gap: 16px;
	  overflow-x: auto;
	  overflow-y: visible;
	  scroll-snap-type: x mandatory;
	  -webkit-overflow-scrolling: touch;
	  padding: 10px 6px 20px !important; 
	}
	.section.product-strip .horizontal-scroller::-webkit-scrollbar {
	  display: none;
	}
	.horizontal-scroller2 {
	  display: grid;
	  grid-template-columns: repeat(2, 1fr);
	  grid-gap: 1rem;
	}
	.product-card .pc-track {
	  display: flex;
	  width: 100%;
	  height: 100%;
	  /*transition: transform .35s ease;*/
	}
	.product-card .pc-slide {
	  flex: 0 0 100%;
	  height: 100%;
	  display: flex;
	  justify-content: center;
	  flex-direction: column;
	  align-items: center;
	  overflow: hidden;
	  padding: 0;
	}
	.product-card .pc-slide img, .product-strip .product-image-wrapper > img {
	  width: 100%;
	  height: 100%;
	  object-fit: contain;
	  display: block;
	}
	.product-card .pc-media {
	  position: relative;
	  width: 100%;
	  aspect-ratio: 1 / 1 !important; /* 關鍵：正方形舞台 */
	  flex: 0 0 auto; /* 固定舞台，不被彈性佔比壓縮 */
	  overflow: hidden;
	  display: grid;
	  place-items: center;
	  padding: 20px; /* 邊界緩衝，避免視覺貼邊 */
	  background: #fff;
	}
	.product-card .pc-media img {
	  width: 100% !important;
	  height: 100% !important;
	  object-fit: contain !important;
	  object-position: center center;
	  display: block;
	  max-width: none !important; /* 防止其他樣式影響 */
	  max-height: none !important;
	}
	.product-card .pc-meta {
	  flex: 0 0 auto;
	  padding: .75rem .9rem .9rem;
	  background: #fff;
	  text-align: center;
	}
	.product-card .pc-dots {
	  position: absolute;
	  bottom: -6px;
	  left: 50%;
	  right: auto;
	  height: 24px;
	  display: flex;
	  justify-content: center;
	  transform: translateX(-50%);
	  width: max-content;
	  align-items: center;
	  gap: 6px;
	  z-index: 3;
	}
	.product-card .pc-dot {
	  width: 7px;
	  height: 7px;
	  border-radius: 50%;
	  background: rgba(0, 0, 0, .25);
	  border: 0;
	  padding: 0;
	  cursor: pointer;
	  display: inline-block;
	  vertical-align: middle;
	}
	.product-card .pc-dot.active {
	  background: var(--gold-color, #aca561);
	}
	.product-card .pc-arrow {
	  position: absolute;
	  top: calc(50% - 12px); /* 垂直置中於被縮小的圖片區 (減去圓點預留高度的一半) */
	  transform: translateY(-50%);
	  width: 34px;
	  height: 34px;
	  border-radius: 50%;
	  background: rgba(255, 255, 255, .9);
	  color: var(--gold-color);
	  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 8px 16px rgba(0, 0, 0, 0.15);
	  display: grid;
	  place-items: center;
	  border: 0;
	  cursor: pointer;
	  z-index: 3;
	  opacity: 0;
	  transition: opacity .2s ease;
	}
	.product-card:hover .pc-arrow {
	  opacity: 1;
	}
	.product-card .pc-arrow.prev {
	  left: 8px;
	}
	.product-card .pc-arrow.next {
	  right: 8px;
	}
	/* --- News Card --- */
	.news-card {
	  background-color: white;
	  border-radius: 0.75rem;
	  overflow: hidden;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
	  text-decoration: none;
	  color: inherit;
	  display: block;
	}
	.news-card-media {
	  width: 100%;
	  aspect-ratio: 16 / 9;
	  object-fit: cover;
	}
	.news-card-info {
	  padding: 1rem;
	}
	.news-card-title {
	  font-weight: 600;
	}
	/* --- Trends List --- */
	.trends-list {
	  display: flex;
	  flex-direction: column;
	  gap: 2rem;
	}
	.trend-item {
	  display: flex;
	  gap: 1.5rem;
	  align-items: flex-start;
	  text-decoration: none;
	  color: inherit;
	  padding-bottom: 20px;
	  border-bottom: solid 1px var(--light-gold-color);
	}
	.trend-item-image {
	  width: 100px;
	  height: 100px;
	  object-fit: cover;
	  border-radius: 0.5rem;
	  flex-shrink: 0;
	}
	.trend-item-content .date {
	  font-size: 0.8rem;
	  color: var(--text-gray);
	}
	.trend-item-content h3 {
	  font-size: 1.1rem;
	  font-weight: 600;
	  margin: 0.25rem 0;
	  transition: color 0.3s;
	}
	.trend-item:hover .trend-item-content h3 {
	  color: var(--gold-color);
	}
	.trend-item-content p {
	  font-size: 0.9rem;
	  color: var(--text-primary);
	  margin: 0;
	}
	/* Horizontal scroller arrows (desktop only) */
	.hs-btn {
	  position: absolute;
	  top: 50%;
	  transform: translateY(-50%);
	  background-color: rgba(255, 255, 255, .9);
	  border: none;
	  border-radius: 9999px;
	  width: 34px;
	  height: 34px;
	  display: none; /* mobile 隱藏 */
	  align-items: center;
	  justify-content: center;
	  cursor: pointer;
	  z-index: 5;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1);
	}
	.hs-btn:hover {
	  background: #fff;
	}
	.hs-btn[disabled] {
	  opacity: .45;
	  cursor: default;
	}
	.hs-btn.prev {
	  left: .5rem;
	}
	.hs-btn.next {
	  right: .5rem;
	}
	/* --- 7. 熱門話題 --- */
	.topics-grid {
	  display: grid;
	  grid-template-columns: 1fr;
	  gap: 2rem;
	}
	.topic-card {
	  position: relative;
	  display: block;
	  background-color: #111827;
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	  overflow: hidden;
	  text-decoration: none;
	  border-radius: 0.5rem;
	}
	.topic-card-bg {
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	  opacity: 0.3;
	  transition: all 0.5s;
	}
	.topic-card:hover .topic-card-bg {
	  opacity: 0.4;
	  transform: scale(1.1);
	}
	.topic-card-content {
	  position: relative;
	  padding: 2rem;
	  color: white;
	}
	.topic-card-content h3 {
	  font-size: 1.5rem;
	  font-weight: 700;
	}
	.topic-card-content p {
	  margin-top: 0.5rem;
	  font-size: 0.875rem;
	  color: #d1d5db;
	}
	/* --- Concept Section --- */
	.concept-layout {
	  display: flex;
	  flex-direction: column; /* Mobile-first: stacked */
	  align-items: center;
	  gap: 1rem;
	}
	.concept-image {
	  width: 100%;
	  max-width: 200px; /* Limit image size on mobile */
	  margin-top: 1rem;
	}
	.concept-image img {
	  width: 100%;
	  height: auto;
	  border-radius: 0.5rem;
	}
	.concept-text {
	  text-align: center;
	  padding: 0 2rem;
	}
	.concept-text .section-title {
	  text-align: center;
	}
	.concept-text p {
	  text-align: left;
	}
	/* --- Pagination (UPDATED) --- */
	.pagination-wrapper {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  margin-top: 3rem;
	  gap: 1.5rem;
	}
	.pagination-btn {
	  padding: 0.5rem 1rem;
	  border: 1px solid #d1d5db;
	  border-radius: 0.375rem;
	  background-color: white;
	  color: var(--text-secondary);
	  cursor: pointer;
	  transition: all 0.3s;
	}
	.pagination-btn:hover {
	  border-color: var(--gold-color);
	  color: var(--gold-color);
	}
	.pagination-btn:disabled {
	  color: #d1d5db;
	  cursor: not-allowed;
	}
	.pagination-info {
	  font-size: 1rem;
	  color: var(--text-secondary);
	}
	/* --- Brands Grid --- */
	.brands-grid {
	  display: grid;
	  grid-template-columns: repeat(2, 1fr); /* Mobile: 2 columns */
	  gap: 1.5rem;
	  margin: 2rem;
	}
	.brand-card {
	  background-color: white;
	  border-radius: 0.75rem;
	  padding: 1.5rem;
	  text-align: center;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0);
	  transition: transform 0.3s ease, box-shadow 0.3s ease;
	  text-decoration: none;
	  color: inherit;
	}
	.brand-card:hover {
	  transform: translateY(-5px) scale(1.03);
	  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0);
	}
	.brand-logo-wrapper {
	  width: 100%;
	  aspect-ratio: 16 / 9;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	.brand-logo {
	  max-width: 90%;
	  max-height: 90%;
	  object-fit: contain;
	}
	.brand-name {
	  font-weight: 600;
	  color: var(--text-primary);
	  margin-top: 0.5rem;
	}
	/* --- 產品介紹頁面樣式 --- */
	.product-detail-layout {
	  display: grid;
	  grid-template-columns: 1fr; /* Mobile first */
	  gap: 2rem;
	  margin-top: 2rem;
	  padding: 2rem;
	  background-color: white;
	}
	.product-gallery-wrapper {
	  /* This is a wrapper to contain gallery and keywords */
	}
	.product-gallery {
	  display: flex;
	  flex-direction: row;
	  gap: 1rem;
	}
	.main-image-container {
	  position: relative;
	  flex-grow: 1;
	  aspect-ratio: 1 / 1;
	  background-color: white;
	  border-radius: 0.5rem;
	  overflow: hidden;
	  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
	}
	.main-image {
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	}
	.d_thumbnails {
	  display: flex;
	  flex-direction: column;
	  gap: 0.5rem;
	  justify-content: flex-start;
	  flex-shrink: 0;
	}
	.d_thumbnail-item {
	  width: 60px;
	  height: 60px;
	  border-radius: 0.375rem;
	  cursor: pointer;
	  border: 2px solid transparent;
	  transition: border-color 0.3s;
	  overflow: hidden;
	}
	.d_thumbnail-item img {
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	}
	.d_thumbnail-item.active {
	  border-color: var(--gold-color);
	}
	.product-keywords {
	  margin-top: 1rem;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 0.5rem;
	}
	.keyword-tag {
	  background-color: #e5e7eb;
	  color: var(--text-thirdary);
	  font-size: 0.8rem;
	  padding: 0.25rem 0.75rem;
	  border-radius: 9999px;
	}
	.product-info-panel {
	  border-radius: 0.75rem;
	}
	.product-title {
	  font-size: 1.75rem;
	  font-weight: 700;
	  margin: 0;
	}
	.d_company-info {
	  display: flex;
	  align-items: center;
	  gap: 0.75rem;
	  margin-top: 1rem;
	}
	.d_company-logo {
	  width: 32px;
	  height: 32px;
	  object-fit: contain;
	}
	.d_company-name {
	  font-size: 1rem;
	  font-weight: 500;
	  color: var(--text-primary);
	}
	.info-divider {
	  border-top: 1px solid #e5e7eb;
	  margin: 1.5rem 0;
	}
	.product-meta {
	  display: flex;
	  flex-direction: column;
	  gap: 1rem;
	}
	.meta-item {
	  display: flex;
	  align-items: center;
	  gap: 0.5rem;
	  color: var(--text-thirdary);
	}
	.meta-item svg {
	  width: 1.25rem;
	  height: 1.25rem;
	  flex-shrink: 0;
	}
	.interactive-meta {
	  display: flex;
	  align-items: center;
	  gap: 1rem;
	}
	.meta-button {
	  display: flex;
	  align-items: center;
	  gap: 0.5rem;
	  background: none;
	  border: none;
	  padding: 0;
	  cursor: pointer;
	  color: var(--text-thirdary);
	  font-size: 1rem;
	}
	.meta-buttn svg {
	  flex-shrink: 0;
	}
	.meta-divider {
	  width: 1px;
	  height: 20px;
	  background-color: #e5e7eb;
	}
	#favorite-icon {
	  transition: all 0.2s;
	}
	#favorite-icon.favorited {
	  fill: var(--gold-color);
	  stroke: var(--gold-color);
	}
	.action-buttons {
	  margin-top: 2rem;
	  display: grid;
	  grid-template-columns: 1fr 1fr;
	  gap: 1rem;
	}
	.main-footer {
	  background-color: var(--bg-dark);
	  color: white;
	  padding: 2rem;
	}
	.footer-grid {
	  display: grid;
	  grid-template-columns: repeat(2, 1fr);
	  gap: 2rem;
	}
	/* --- 8. Footer --- */
	.footer-grid h4 {
	  font-weight: 600;
	  color: #d1d5db;
	}
	.footer-grid ul {
	  list-style: none;
	  padding: 0;
	  margin-top: 1rem;
	  display: flex;
	  flex-direction: column;
	  gap: 0.5rem;
	}
	.footer-grid a {
	  color: #9ca3af;
	  text-decoration: none;
	  transition: color 0.3s;
	}
	.footer-grid a:hover {
	  color: var(--gold-color);
	}
	.social-links {
	  display: flex;
	  gap: 1rem;
	  margin-top: 1rem;
	}
	.footer-bottom {
	  margin-top: 2rem;
	  border-top: 1px solid #374151;
	  padding-top: 2rem;
	  text-align: center;
	  color: #6b7280;
	  font-size: 0.875rem;
	}
	@media (min-width:768px) {
	  .popup-content {
	    background-color: white;
	    max-width: 900px;
	    max-height: 90vh;
	    overflow-y: auto;
	  }
	  .popup-product-grid {
	    display: grid;
	    grid-template-columns: repeat(4, 1fr);
	    gap: 1.5rem;
	  }
	  .popup-header h2 {
	    font-size: 2rem;
	    font-weight: 200;
	    line-height: .5;
	  }
	  #countdown-timer {
	    margin-top: 0.5rem;
	    font-size: 1.4rem;
	    font-weight: 200;
	    width: 30%;
	  }
	  .popup-product-card h3 {
	    font-size: 1rem;
	    font-weight: 600;
	    margin: 0.75rem 0 0.25rem;
	  }
	  .popup-product-card .price {
	    font-size: 1.5rem;
	    line-height: .5;
	  }
	  .lang-dropdown {
	    left: 0;
	  }
	  .header-search {
	    display: flex;
	  }
	  .search-toggle {
	    display: none;
	  }
	  .search-panel {
	    display: none !important;
	  } /* 桌機不顯示手機面板 */
	  .mobile-menu-btn {
	    display: none
	  }
	  .search-desktop {
	    display: inline-flex;
	    width: clamp(240px, 24vw, 380px);
	  }
	  .search-desktop input {
	    width: 100%;
	    height: 38px;
	    border-radius: 9999px;
	    border: 1px solid #d1d5db;
	    background: #fff;
	    padding: 0 2.6rem 0 .9rem;
	    font-size: .95rem;
	    outline: none;
	  }
	  .search-desktop input:focus {
	    border-color: var(--gold-color);
	    box-shadow: 0 0 0 3px rgba(172, 165, 97, .15);
	  }
	  .search-desktop .search-desktop-icon {
	    position: absolute;
	    right: 4px;
	    top: 50%;
	    transform: translateY(-50%);
	    width: 32px;
	    height: 32px;
	    border: none;
	    background: transparent;
	    border-radius: 9999px;
	    cursor: pointer;
	    color: var(--text-secondary);
	  }
	  .search-desktop .search-desktop-icon:hover {
	    background: #f3f4f6;
	  }
	  .profile-button {
	    width: 40px;
	    height: 40px;
	  }
	  .cta-button {
	    display: block;
	  }
	  .main-nav {
	    display: flex;
	    gap: 1.5rem
	  }
	  .language-selector {
	    display: block;
	  }
	  .lang-button {
	    padding: 0.5rem 1rem;
	  }
	  .lang-button .lang-text, .lang-button .lang-chevron {
	    display: inline;
	  }
	  .header-subnav .sub-nav-list {
	    display: flex;
	    gap: .5rem;
	    list-style: none;
	    margin: 0;
	    padding: 0;
	    flex-wrap: wrap; /* 1. 在桌機上允許項目換行 */
	    overflow-x: visible; /* 2. 關鍵：在桌機上移除橫向捲動和內容裁剪 */
	  }
	  .hamburger-btn {
	    width: 40px;
	    height: 40px;
	  }
	  .hamburger-menu {
	    transform: none;
	    margin-left: 0;
	    position: fixed;
	    top: calc(var(--header-drop-top, 64px)); /* JS 會算位置；先給保底 */
	    right: clamp(.5rem, 2vw, 1rem);
	    left: auto;
	    width: 320px;
	    background: #fff;
	    border: 1px solid #d1d5db;
	    border-radius: .75rem;
	    box-shadow: var(--shadow);
	    padding: .5rem 0;
	  }
	  .hamburger-list {
	    padding: 0 .5rem .5rem;
	    background: transparent;
	  }
	  .menu-item {
	    background: #fff;
	    border: 0px;
	    border-radius: .5rem;
	    padding: .7rem .75rem;
	    transition: none;
	  }
	  .menu-item:hover {
	    border: 0px;
	    background: #f9fafb;
	  }
	  .has-sub .menu-item {
	    background: #fff;
	    border: 1px solid transparent;
	  }
	  .submenu {
	    padding-left: .5rem;
	  }
	  .submenu li {
	    border-bottom: solid 1px var(--line);
	  }
	  .submenu-item {
	    border: none;
	  }
	  .submenu-item:hover {
	    background: #f9fafb;
	  }
	  .contact-info-grid {
	    grid-template-columns: repeat(2, 1fr);
	  }
	  .primary-dropdown {
	    display: none;
	    position: absolute;
	    top: 100%;
	    left: 0;
	    min-width: 180px;
	    box-shadow: 0 8px 16px rgba(0, 0, 0, .1);
	    border-radius: .5rem;
	    padding: .5rem 0;
	    z-index: 999;
	  }
	  .primary-dropdown.show {
	    display: block;
	  }
	  .primary-nav .nav-list {
	    gap: 1.25rem;
	  }
	  .sub-nav-dropdown, .primary-dropdown {
	    display: none;
	    position: absolute;
	    top: 100%;
	    left: 0;
	    min-width: 180px;
	    box-shadow: 0 8px 16px rgba(0, 0, 0, .1);
	    border-radius: 0 0 .5rem .5rem;
	    padding: .5rem 1rem;
	    z-index: 999;
	    max-height: min(70vh, 560px);
	    overflow-y: scroll;
	    scrollbar-gutter: stable both-edges;
	    overscroll-behavior: contain;
	    -webkit-overflow-scrolling: touch;
	    scrollbar-width: thin;
	    scrollbar-color: rgba(0, 0, 0, .35) #f1f1f1
	  }
	  .sub-nav-dropdown.show {
	    display: block
	  }
	  .sub-nav-dropdown::-webkit-scrollbar, .primary-dropdown::-webkit-scrollbar {
	    width: 10px
	  }
	  .sub-nav-dropdown::-webkit-scrollbar-track, .primary-dropdown::-webkit-scrollbar-track {
	    background: #f1f1f1
	  }
	  .sub-nav-dropdown::-webkit-scrollbar-thumb, .primary-dropdown::-webkit-scrollbar-thumb {
	    background: rgba(0, 0, 0, .25);
	    border-radius: 8px;
	    border: 2px solid #f1f1f1
	  }
	  .sub-nav-dropdown::-webkit-scrollbar-thumb:hover, .primary-dropdown::-webkit-scrollbar-thumb {
	    background: rgba(0, 0, 0, .4)
	  }
	  .mega-dropdown {
	    width: min(92vw, 490px);
	  }
	  .sub-nav-label {
	    font-size: 1rem;
	  }
	  .sub-nav-chevron .nav-chevron {
	    width: 28px;
	    height: 28px;
	  }
	  .sub-nav-chevron svg {
	    width: 1rem;
	    height: 1rem;
	  }
	  .nav-chevron svg {
	    width: 1rem;
	    height: 1rem;
	  }
	  .nav-link {
	    font-size: 1rem;
	  }
	  .header-container {
	    display: flex;
	    align-items: center;
	    justify-content: space-between;
	    height: 5rem;
	  }
	  .hero-banner {
	    height: 350px;
	    width: 100%;
	    aspect-ratio: 16/9;
	  }
	  .scroll-container {
	    overflow: visible;
	  }
	  .logo img {
	    height: 50px; /* 依實際視覺調整 32~40px */
	    display: block; /* 移除行內圖片的下方空白 */
	    object-fit: contain;
	  }
	  .section-title {
	    font-size: 2rem;
	    font-weight: 700;
	  }
	  .section-subtitle {
	    font-size: 1.125rem;
	  }
	  .list-list {
	    display: none;
	  }
	  .list-table {
	    display: table;
	  }
	  .dots-container .dot {
	    width: 12px;
	    height: 12px;
	  }
	  .horizontal-scroll-wrapper.__has-pager .carousel-btn {
	    display: inline-flex;
	  }
	  .expo-grid {
	    grid-template-columns: repeat(3, 1fr);
	  }
	  .company-name {
	    font-size: 1.4rem;
	    font-weight: 200;
	    padding: 0px 8px;
	  }
	  .company-details h1 {
	    font-size: 1.75rem;
	  }
	  .product-grid {
	    grid-template-columns: repeat(4, 1fr);
	    grid-row-gap: 2rem;
	  }
	  .product-title-section h1 {
	    font-size: 1.75rem;
	    font-weight: 700;
	    margin: 0;
	  }
	  .product-image-large {
	    max-height: 300px; /* 自訂一個你想要的高度 */
	    width: auto;
	    align-content: center;
	  }
	  .product-name {
	    font-size: 1.05rem;
	  }
	  .product-company {
	    font-size: 0.8rem;
	    color: var(--text-gray);
	    margin-top: 0rem;
	  }
	  .product-price {
	    font-size: 1.4rem;
	  }
	  .product-section-header h2 {
	    font-size: 1.25rem;
	    font-weight: 700;
	    margin: 0
	  }
	  .product-section-header a {
	    font-size: 1rem;
	  }
	  .horizontal-scroller2 {
	    display: grid;
	    grid-template-columns: repeat(4, 1fr);
	    grid-gap: 1rem;
	  }
	  .scroll-card {
	    /* flex: 0 0 calc(25% - 1.125rem); 4 items with 1.5rem gap */
	    flex: 0 0 calc(25% - 12px); /* 或 calc(25% - 1.125rem) */
	  }
	  .trends-list {
	    display: grid;
	    grid-template-columns: 1fr 1fr;
	  }
	  .carousel-dots .dot {
	    width: 12px;
	    height: 12px;
	    border-radius: 50%;
	    border-width: 0px;
	  }
	  .header-subnav .sub-nav-list {
	    flex-wrap: wrap; /* 允許換行 */
	    row-gap: .25rem; /* 行距 */
	    gap: 1.25rem;
	  }
	  .header-subnav {
	    padding-left: var(--subnav-offset, 0px);
	  }
	  .company-logo {
	    width: 120px;
	    height: auto;
	    object-fit: contain;
	  }
	  .media-carousel-btn {
	    width: 40px;
	    height: 40px;
	    font-size: 1.5rem;
	  }
	  .media-dot {
	    width: 12px;
	    height: 12px;
	  }
	  .company-header h1 {
	    font-size: 2rem;
	  }
	  .contact-info-item {
	    display: flex;
	    font-size: 1rem;
	  }
	  .hs-btn {
	    display: inline-flex;
	  }
	  .btn-full {
	    display: inline-block;
	    width: auto;
	  }
	  .expo-detail-hero {
	    height: 400px;
	  }
	  #recommended-products .carousel-dots-container, #discounted-products .carousel-dots-container, #beauty-news .carousel-dots-container {
	    display: flex;
	  }
	  .topics-grid {
	    grid-template-columns: repeat(2, 1fr);
	  }
	  .brands-grid {
	    grid-template-columns: repeat(4, 1fr);
	  }
	  .product-detail-layout {
	    grid-template-columns: 1fr 1fr;
	    gap: 3rem;
	  }
	  .concept-text p {
	    padding: 0 100px;
	  }
	  .footer-grid {
	    display: grid;
	    grid-template-columns: repeat(4, 1fr);
	    gap: 2rem;
	  }
	}
	@media (min-width: 1024px) {
	  .product-grid {
	    grid-template-columns: repeat(4, 1fr);
	  }
	}