/* =============================================================
   hsst.hk · 共享頂級視覺層 (Premium Visual Layer)
   版本: 20260902f
   載入: 所有頁面 (154+) 透過 <link> 加載，body 加 class="premium"
   風格: Editorial 大地色 + 香檳金 + Playfair Display + Noto Serif TC
   原則: 純視覺疊加，0 內容刪改；只升級共享視覺 DNA
   ============================================================= */

/* ---------- 設計 token ---------- */
.premium { --pv-bg: #F6F3EE; --pv-ink: #14130F; --pv-muted: #5C574F; --pv-soft: #8A8176; --pv-gold: #C2A25E; --pv-hair: #DCD5CB; --pv-deep: #16150F; --pv-deep-2: #1E1C16; --pv-deep-text: #F4F1EA; --pv-deep-muted: #A7A091; --pv-warm: #E9E2D8; }

/* ---------- 1. 內頁背景：大米色（覆蓋 inner-page 純白）---------- */
body.premium.inner-page,
body.premium { background: var(--pv-bg) !important; }

/* ---------- 2. H1 / H2 / H3 升級（覆蓋 base 樣式）---------- */
.premium h1, body.premium h1 {
  font-family: 'Playfair Display', 'Noto Serif TC', serif !important;
  font-weight: 500 !important;
  color: var(--pv-ink) !important;
  line-height: 1.18 !important;
  letter-spacing: .01em !important;
}
.premium h2, body.premium h2 {
  font-family: 'Playfair Display', 'Noto Serif TC', serif !important;
  font-weight: 500 !important;
  color: var(--pv-ink) !important;
  line-height: 1.24 !important;
  letter-spacing: .01em !important;
  position: relative;
  padding-top: 22px;
}
.premium h2::before, body.premium h2::before {
  content: ''; position: absolute; top: 0; left: 0; width: 36px; height: 1px; background: var(--pv-gold);
}
.premium h2.centered::before, body.premium h2.centered::before { left: 50%; transform: translateX(-50%); }
.premium h3, body.premium h3 {
  font-family: 'Noto Serif TC', 'Playfair Display', serif !important;
  font-weight: 500 !important;
  color: var(--pv-ink) !important;
}
.premium h1 span, .premium h2 span, body.premium h1 span, body.premium h2 span { color: var(--pv-gold) !important; }
.premium h1 em, .premium h2 em, body.premium h1 em, body.premium h2 em { font-style: normal !important; color: var(--pv-gold) !important; }

/* ---------- 3. Section title/subtitle (index/about/solutions/contact/faq 等通用)---------- */
.premium .section-title, body.premium .section-title {
  font-family: 'Playfair Display', 'Noto Serif TC', serif !important;
  font-weight: 500 !important;
  color: var(--pv-ink) !important;
  font-size: clamp(28px, 3.2vw, 42px) !important;
  line-height: 1.2 !important;
  position: relative; padding-top: 22px; margin-bottom: 1rem !important;
}
.premium .section-title::before, body.premium .section-title::before {
  content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 36px; height: 1px; background: var(--pv-gold);
}
.premium .section-subtitle, body.premium .section-subtitle {
  font-family: 'Playfair Display', serif !important;
  font-style: italic !important;
  font-size: 14px !important;
  color: var(--pv-gold) !important;
  letter-spacing: .04em !important;
  text-transform: none !important;
  margin-bottom: 16px !important;
}
.premium .section-desc, body.premium .section-desc {
  color: var(--pv-muted) !important;
  font-size: 15.5px !important;
  line-height: 1.85 !important;
  max-width: 60ch !important;
  margin: 0 auto 1.5rem !important;
}

/* ---------- 4. 頂級 kicker / 標籤 (class-based)---------- */
.premium .kicker, body.premium .kicker {
  display: inline-block !important;
  font-family: 'Inter', 'Noto Sans TC', sans-serif !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  color: var(--pv-gold) !important;
  position: relative; padding-bottom: 8px; margin-bottom: 16px;
}
.premium .kicker::after, body.premium .kicker::after {
  content: ''; position: absolute; left: 0; bottom: 0; width: 36px; height: 1px; background: var(--pv-gold);
}
.premium .hero-badge, body.premium .hero-badge {
  display: inline-block !important;
  font-family: 'Inter', 'Noto Sans TC', sans-serif !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  color: var(--pv-gold) !important;
  border: 1px solid rgba(194,162,94,.4) !important;
  border-radius: 999px !important;
  padding: 8px 18px !important;
  margin-bottom: 22px !important;
}

/* ---------- 5. 頂級按鈕 (全部 4 變體)---------- */
.premium .btn, body.premium .btn {
  display: inline-flex !important; align-items: center; gap: 10px;
  padding: 14px 28px !important; border-radius: 2px !important;
  font-family: 'Inter', 'Noto Sans TC', sans-serif !important;
  font-size: 14px !important; letter-spacing: .08em !important;
  cursor: pointer;
  transition: background .3s, color .3s, border-color .3s, transform .25s !important;
  text-decoration: none !important;
}
.premium .btn-primary, body.premium .btn-primary {
  background: var(--pv-ink) !important; color: #F4F1EA !important; border: 1px solid var(--pv-ink) !important;
}
.premium .btn-primary:hover, body.premium .btn-primary:hover { background: #2a2822 !important; border-color: #2a2822 !important; transform: translateY(-1px); }
.premium .btn-gold, body.premium .btn-gold {
  background: var(--pv-gold) !important; color: var(--pv-ink) !important; border: 1px solid var(--pv-gold) !important; font-weight: 600 !important;
}
.premium .btn-gold:hover, body.premium .btn-gold:hover { background: #cdb074 !important; border-color: #cdb074 !important; }
.premium .btn-outline, body.premium .btn-outline {
  background: transparent !important; color: var(--pv-ink) !important; border: 1px solid var(--pv-hair) !important;
}
.premium .btn-outline:hover, body.premium .btn-outline:hover { border-color: var(--pv-gold) !important; color: var(--pv-gold) !important; }
.premium .btn-outline-light, body.premium .btn-outline-light {
  background: transparent !important; color: #fff !important; border: 1px solid rgba(255,255,255,.4) !important;
}
.premium .btn-outline-light:hover, body.premium .btn-outline-light:hover { background: #fff !important; color: var(--pv-ink) !important; border-color: #fff !important; }
.premium .btn-outline-white, body.premium .btn-outline-white {
  background: transparent !important; color: #fff !important; border: 1px solid rgba(255,255,255,.4) !important;
}
.premium .btn-outline-white:hover, body.premium .btn-outline-white:hover { background: #fff !important; color: var(--pv-ink) !important; border-color: #fff !important; }

/* ---------- 6. 頂級卡片（hover 浮起 + 金色描邊）---------- */
.premium .card, body.premium .card,
.premium .role-card, body.premium .role-card,
.premium .scenario-card, body.premium .scenario-card,
.premium .why-card, body.premium .why-card,
.premium .info-card, body.premium .info-card,
.premium .feature-card, body.premium .feature-card,
.premium .series-card, body.premium .series-card,
.premium .case-card, body.premium .case-card,
.premium .news-card, body.premium .news-card,
.premium .product-card, body.premium .product-card,
.premium .certificate-card, body.premium .certificate-card,
.premium .about-preview, body.premium .about-preview,
.premium .stat-item, body.premium .stat-item,
.premium .trust-item, body.premium .trust-item,
.premium .client-logo-item, body.premium .client-logo-item {
  background: #fff !important;
  border-radius: 4px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.04), 0 1px 2px rgba(0,0,0,.02) !important;
  transition: transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s ease !important;
  border: 1px solid rgba(220,213,203,.5) !important;
}
.premium .card:hover, body.premium .card:hover,
.premium .role-card:hover, body.premium .role-card:hover,
.premium .scenario-card:hover, body.premium .scenario-card:hover,
.premium .why-card:hover, body.premium .why-card:hover,
.premium .info-card:hover, body.premium .info-card:hover,
.premium .feature-card:hover, body.premium .feature-card:hover,
.premium .series-card:hover, body.premium .series-card:hover,
.premium .case-card:hover, body.premium .case-card:hover,
.premium .news-card:hover, body.premium .news-card:hover,
.premium .product-card:hover, body.premium .product-card:hover,
.premium .certificate-card:hover, body.premium .certificate-card:hover,
.premium .about-preview:hover, body.premium .about-preview:hover,
.premium .stat-item:hover, body.premium .stat-item:hover,
.premium .trust-item:hover, body.premium .trust-item:hover,
.premium .client-logo-item:hover, body.premium .client-logo-item:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.10), 0 2px 8px rgba(0,0,0,.04), 0 0 0 1px rgba(194,162,94,.22) !important;
  border-color: rgba(194,162,94,.4) !important;
}

/* ---------- 7. Stats 排版（編輯式 data 區）---------- */
.premium .stat-number, body.premium .stat-number,
.premium .trust-number, body.premium .trust-number,
.premium .about-stats .stat-num, body.premium .about-stats .stat-num {
  font-family: 'Playfair Display', 'Noto Serif TC', serif !important;
  font-weight: 600 !important;
  font-size: clamp(28px, 3.4vw, 44px) !important;
  color: var(--pv-ink) !important;
  line-height: 1.1 !important;
  display: block !important;
}
.premium .stat-label, body.premium .stat-label,
.premium .trust-label, body.premium .trust-label,
.premium .about-stats .stat-name, body.premium .about-stats .stat-name {
  font-family: 'Inter', 'Noto Sans TC', sans-serif !important;
  font-size: 12px !important;
  color: var(--pv-soft) !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  margin-top: 6px !important;
  display: block !important;
}

/* ---------- 8. Hero 文字（編輯式敘事）---------- */
.premium .hero-content h1, body.premium .hero-content h1 { font-size: clamp(34px, 4.4vw, 64px) !important; }
.premium .hero-content h1 span, body.premium .hero-content h1 span { color: var(--pv-gold) !important; }
.premium .hero-subtitle, body.premium .hero-subtitle {
  font-size: 15.5px !important;
  line-height: 1.85 !important;
  color: var(--pv-muted) !important;
  max-width: 60ch !important;
  margin: 22px 0 32px !important;
}

/* ---------- 9. Hairline divider 升級 ---------- */
.premium hr, body.premium hr {
  border: 0 !important; height: 1px !important;
  background: var(--pv-hair) !important;
  margin: clamp(32px, 4vw, 56px) 0 !important;
}

/* ---------- 10. Section 視覺節奏 (淺米→深色 切換)---------- */
.premium .section-light, body.premium .section-light,
.premium section.surface-light, body.premium section.surface-light { background: var(--pv-bg) !important; }
.premium .section-warm, body.premium .section-warm,
.premium section.surface-warm, body.premium section.surface-warm { background: var(--pv-warm) !important; }
.premium .section-dark, body.premium .section-dark,
.premium section.surface-dark, body.premium section.surface-dark {
  background: var(--pv-deep) !important; color: var(--pv-deep-text) !important;
}
.premium .section-dark h1, .premium .section-dark h2, .premium .section-dark h3,
body.premium .section-dark h1, body.premium .section-dark h2, body.premium .section-dark h3 { color: var(--pv-deep-text) !important; }
.premium .section-dark p, body.premium .section-dark p { color: var(--pv-deep-muted) !important; }
.premium .section-dark .kicker, .premium .section-dark .section-subtitle,
body.premium .section-dark .kicker, body.premium .section-dark .section-subtitle { color: var(--pv-gold) !important; }
.premium .section-dark .card,
.premium .section-dark .role-card,
.premium .section-dark .scenario-card,
.premium .section-dark .why-card,
.premium .section-dark .news-card,
.premium .section-dark .info-card,
body.premium .section-dark .card,
body.premium .section-dark .role-card,
body.premium .section-dark .scenario-card,
body.premium .section-dark .why-card,
body.premium .section-dark .news-card,
body.premium .section-dark .info-card {
  background: rgba(255,255,255,.04) !important;
  color: var(--pv-deep-text) !important;
  border-color: rgba(255,255,255,.08) !important;
}
.premium .section-dark .card:hover, body.premium .section-dark .card:hover { background: rgba(255,255,255,.07) !important; border-color: rgba(194,162,94,.4) !important; }
.premium .section-dark .stat-number, .premium .section-dark .trust-number,
body.premium .section-dark .stat-number, body.premium .section-dark .trust-number { color: var(--pv-deep-text) !important; }
.premium .section-dark .stat-label, .premium .section-dark .trust-label,
body.premium .section-dark .stat-label, body.premium .section-dark .trust-label { color: var(--pv-deep-muted) !important; }
.premium .section-dark hr, body.premium .section-dark hr { background: rgba(255,255,255,.13) !important; }

/* ---------- 11. CTA section 升級 ---------- */
.premium .cta-section, body.premium .cta-section {
  background: var(--pv-deep) !important;
  color: var(--pv-deep-text) !important;
  position: relative;
  overflow: hidden;
}
.premium .cta-section h2, body.premium .cta-section h2 { color: var(--pv-deep-text) !important; }
.premium .cta-section p, body.premium .cta-section p { color: var(--pv-deep-muted) !important; }
.premium .cta-section::after, body.premium .cta-section::after {
  content: ''; position: absolute; right: -100px; bottom: -100px;
  width: 360px; height: 360px; border-radius: 50%;
  background: radial-gradient(circle, rgba(194,162,94,.18) 0%, transparent 70%);
  pointer-events: none;
}

/* ---------- 12. Form 輸入框升級 ---------- */
.premium input[type="text"], .premium input[type="email"], .premium input[type="tel"],
.premium textarea, .premium select, body.premium input[type="text"],
body.premium input[type="email"], body.premium input[type="tel"],
body.premium textarea, body.premium select {
  border: 1px solid var(--pv-hair) !important;
  border-radius: 2px !important;
  padding: 12px 16px !important;
  font-family: 'Inter', 'Noto Sans TC', sans-serif !important;
  font-size: 14px !important;
  background: #fff !important;
  transition: border-color .3s, box-shadow .3s !important;
}
.premium input[type="text"]:focus, .premium input[type="email"]:focus, .premium input[type="tel"]:focus,
.premium textarea:focus, .premium select:focus,
body.premium input[type="text"]:focus, body.premium input[type="email"]:focus, body.premium input[type="tel"]:focus,
body.premium textarea:focus, body.premium select:focus {
  border-color: var(--pv-gold) !important;
  box-shadow: 0 0 0 3px rgba(194,162,94,.15) !important;
  outline: none !important;
}

/* ---------- 13. 頂級 Link 樣式：底線金動畫 ---------- */
.premium a, body.premium a { transition: color .25s ease; }
.premium .text-link, body.premium .text-link {
  color: var(--pv-ink) !important; text-decoration: none !important;
  border-bottom: 1px solid rgba(194,162,94,.4) !important;
  padding-bottom: 4px; transition: border-color .3s, color .3s !important;
}
.premium .text-link:hover, body.premium .text-link:hover { color: var(--pv-gold) !important; border-bottom-color: var(--pv-gold) !important; }

/* ---------- 14. 頂級 列表（編輯式行格）---------- */
.premium .editorial-list, .premium .v2-style-list, body.premium .editorial-list {
  list-style: none !important; margin: 0 !important; padding: 0 !important;
}
.premium .editorial-list li, body.premium .editorial-list li {
  display: grid !important; grid-template-columns: 60px 1.6fr 1fr 1fr 40px !important;
  align-items: center !important; gap: 18px !important;
  padding: 22px 6px !important; border-top: 1px solid var(--pv-hair) !important;
  transition: background .3s !important;
}
.premium .editorial-list li:last-child, body.premium .editorial-list li:last-child { border-bottom: 1px solid var(--pv-hair) !important; }
.premium .editorial-list li:hover, body.premium .editorial-list li:hover { background: rgba(194,162,94,.05) !important; }
.premium .editorial-list li .no, body.premium .editorial-list li .no { font-family: 'Inter', sans-serif !important; font-size: 13px !important; color: var(--pv-gold) !important; letter-spacing: .08em !important; }
.premium .editorial-list li .zh, body.premium .editorial-list li .zh { font-family: 'Noto Serif TC', serif !important; font-weight: 500 !important; font-size: 19px !important; color: var(--pv-ink) !important; }
.premium .editorial-list li .en, body.premium .editorial-list li .en { font-family: 'Playfair Display', serif !important; font-style: italic !important; font-size: 14px !important; color: var(--pv-soft) !important; }
.premium .editorial-list li .meta, body.premium .editorial-list li .meta { font-size: 13px !important; color: var(--pv-muted) !important; }
.premium .editorial-list li .arrow, body.premium .editorial-list li .arrow { font-size: 20px !important; color: var(--pv-gold) !important; text-align: right !important; }

.premium .section-dark .editorial-list li, body.premium .section-dark .editorial-list li { border-top-color: rgba(255,255,255,.13) !important; }
.premium .section-dark .editorial-list li:last-child, body.premium .section-dark .editorial-list li:last-child { border-bottom-color: rgba(255,255,255,.13) !important; }
.premium .section-dark .editorial-list li .zh, body.premium .section-dark .editorial-list li .zh { color: var(--pv-deep-text) !important; }
.premium .section-dark .editorial-list li .en, .premium .section-dark .editorial-list li .meta,
body.premium .section-dark .editorial-list li .en, body.premium .section-dark .editorial-list li .meta { color: var(--pv-deep-muted) !important; }

/* ---------- 15. Footer 升級（v3 極致緊湊 · 20% 高度 · 單行佈局） ---------- */

/* 15.1 頂部金線裝飾 + 深色基底 */
body.premium .footer {
  background: var(--pv-deep-2) !important;
  color: var(--pv-deep-muted) !important;
  border-top: none !important;
  position: relative;
  overflow: hidden;
}
body.premium .footer::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--pv-gold) 15%, var(--pv-gold) 85%, transparent 100%);
  opacity: 0.55;
}

/* 15.2 極致緊湊：單行 flex 佈局 */
body.premium .footer .container { padding-top: 0 !important; padding-bottom: 0 !important; }
body.premium .footer-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px 28px !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 18px 0 !important;
  border-bottom: none !important;
}

/* 重置舊的等高列/分隔線規則 */
body.premium .footer-grid > * {
  padding: 0 !important;
  border-right: none !important;
  align-self: center !important;
}

/* 15.3 隱藏冗餘導航列（頂部 mega menu 已涵蓋）；品牌簡介保留 */
body.premium .footer-grid > .footer-col:not(.footer-contact-info) { display: none !important; }

/* 15.4 品牌欄：logo 在上 + 公司簡介在下（簡介保留，小字緊湊） */
body.premium .footer-brand {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  max-width: 560px !important;
}
body.premium .footer-brand .nav-logo {
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
body.premium .footer-brand .brand-intro {
  display: block !important;
  color: var(--pv-deep-muted) !important;
  font-size: 0.72rem !important;
  line-height: 1.55 !important;
  letter-spacing: 0.2px !important;
  margin: 8px 0 0 !important;
  max-width: 520px !important;
  word-wrap: normal !important;
  overflow: visible !important;
}
body.premium .footer-brand .nav-logo-text strong {
  color: var(--pv-deep-text) !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.02em !important;
}
body.premium .footer-brand .nav-logo-text small {
  color: var(--pv-deep-muted) !important;
  font-size: 0.58rem !important;
  letter-spacing: 1px !important;
}

/* 15.5 聯繫我們：隱藏標題，內聯緊湊排列 */
body.premium .footer-contact-info h4 { display: none !important; }
body.premium .footer-contact-info {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 8px 22px !important;
  align-items: center !important;
}
body.premium .footer-contact-info p {
  color: var(--pv-deep-muted) !important;
  font-size: 0.76rem !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  gap: 6px !important;
  align-items: center !important;
}
body.premium .footer-contact-info p .icon {
  color: var(--pv-gold) !important;
  width: 15px !important;
  font-size: 0.82rem !important;
}
body.premium .footer-contact-info p a {
  color: var(--pv-deep-muted) !important;
  transition: color .25s ease !important;
}
body.premium .footer-contact-info p a:hover { color: var(--pv-gold) !important; }

/* 15.6 Footer bottom：獨立底欄，居中顯示，不與上方欄位對齊 */
body.premium .footer-bottom {
  max-width: none !important;
  margin: 0 !important;
  padding: 12px 20px !important;
  background: rgba(0,0,0,0.18) !important;
  border-top: 1px solid rgba(255,255,255,0.06) !important;
  color: var(--pv-deep-muted) !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.4px !important;
  justify-content: center !important;
  text-align: center !important;
}
body.premium .footer-bottom p {
  color: var(--pv-deep-muted) !important;
  margin: 0 !important;
  text-align: center !important;
}

/* 15.7 響應式 */
@media (max-width: 768px) {
  body.premium .footer-grid {
    justify-content: flex-start !important;
    gap: 10px 16px !important;
    padding: 16px 0 !important;
  }
  body.premium .footer-contact-info { gap: 6px 14px !important; }
  body.premium .footer-brand,
  body.premium .footer-brand .brand-intro { max-width: 100% !important; }
}

/* ---------- 16. 修補 v2-products / v2-projects 內 section 寬度溢出（main-content 包覆）---------- */
/* v2 hero 修复：全宽 + 文字不超出栅格单元 */
body.premium.v2-products .v2-hero,
body.premium.v2-products .v2-archive,
body.premium.v2-products .v2-spotlight,
body.premium.v2-products .v2-quote,
body.premium.v2-products .v2-colours,
body.premium.v2-projects .v2-hero,
body.premium.v2-projects .v2-archive,
body.premium.v2-projects .v2-spotlight,
body.premium.v2-projects .v2-quote,
body.premium.v2-projects .v2-colours {
  position: relative !important;
}
/* 关键修复：base CSS 的 [class*="-hero"] 选择器误命中 v2-hero-text / v2-hero-media，
   把它们强制 width:100vw 撑破栅格。这里强制 auto，让栅格生效 */
body.premium.v2-products .v2-hero-text,
body.premium.v2-products .v2-hero-media,
body.premium.v2-projects .v2-hero-text,
body.premium.v2-projects .v2-hero-media {
  width: auto !important;
  max-width: none !important;
  margin-left: 0 !important; margin-right: 0 !important;
}
body.premium.v2-products .v2-hero .v2-hero-media,
body.premium.v2-projects .v2-hero .v2-hero-media { min-height: 460px !important; }
body.premium.v2-products, body.premium.v2-projects { background: #F6F3EE !important; }

/* ---------- 17. 響應式 ---------- */
@media (max-width: 900px) {
  .premium h1, body.premium h1 { font-size: clamp(28px, 7vw, 40px) !important; }
  .premium h2, body.premium h2 { font-size: clamp(22px, 5vw, 30px) !important; }
  .premium .section-title, body.premium .section-title { font-size: clamp(22px, 5.4vw, 32px) !important; }
  .premium .editorial-list li, body.premium .editorial-list li { grid-template-columns: 40px 1.4fr 1fr 30px !important; }
  .premium .editorial-list li .meta, body.premium .editorial-list li .meta { display: none !important; }
  body.premium.v2-products .v2-hero, body.premium.v2-projects .v2-hero { grid-template-columns: 1fr !important; }
}

/* ============================================================
   18. 表单统一：宽度对齐页面 + 引导文字反色 + 视觉增强
   ============================================================ */

/* —— 18.1 统一表单宽度为页面内容宽度 —— */
body.premium .hsst-form { max-width: 100% !important; }

/* —— 18.2 引导文字反色：浅色输入框 → 深色引导文字 —— */
body.premium .hsst-form-input::placeholder,
body.premium .hsst-form-textarea::placeholder,
body.premium .hsst-form-select::placeholder,
body.premium .inquiry-form input::placeholder,
body.premium .inquiry-form textarea::placeholder,
body.premium .inquiry-form select::placeholder {
  color: #5C574F !important; opacity: 1 !important;
}

/* —— 18.3 引导文字反色：深色输入框（解决方案页）→ 浅色引导文字 —— */
body.premium .solution-cta-input::placeholder,
body.premium .solution-cta-textarea::placeholder {
  color: rgba(244,241,234,0.66) !important; opacity: 1 !important;
}

/* —— 18.4 视觉增强：输入框边框统一 + 聚焦香槟金发光 —— */
body.premium .hsst-form-input,
body.premium .hsst-form-textarea,
body.premium .hsst-form-select,
body.premium .inquiry-form input,
body.premium .inquiry-form textarea,
body.premium .inquiry-form select {
  border-color: #DCD5CB !important;
}
body.premium .hsst-form-input:focus,
body.premium .hsst-form-textarea:focus,
body.premium .hsst-form-select:focus,
body.premium .inquiry-form input:focus,
body.premium .inquiry-form textarea:focus,
body.premium .inquiry-form select:focus {
  border-color: #C2A25E !important;
  box-shadow: 0 0 0 3px rgba(194,162,94,0.18) !important;
}

/* —— 18.5 表单标签统一视觉 —— */
body.premium .hsst-form-label { color: #14130F !important; letter-spacing: 0.02em; }

/* ---------- 19. 產品視頻展示（石材實拍 / Stone Video Showcase）---------- */
/* 讓 <video> 填滿 16:9 佔位容器，object-fit 裁剪呈現電影感構圖 */
body.premium .product-video-el {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  background: #0b0a08 !important;
  display: block !important;
}
body.premium .product-video-placeholder {
  background: #0b0a08 !important;
}
/* 卡片懸浮微動效，強化視覺衝擊 */
body.premium .product-video-card {
  transition: transform 0.35s ease, box-shadow 0.35s ease !important;
}
body.premium .product-video-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 40px rgba(20,19,15,0.16) !important;
}

/* ---------- 20. 產品系列頁 · 頂部操作條（雙 CTA 視覺升級）---------- */
/* 場景：每個系列頁 Hero 之下的 .product-action-bar，含「索取樣板 / 立即諮詢」雙按鈕
   設計語言：編輯式居中 CTA 帶 · 香檳金漸變 + 米白描邊 · 帶 arrow 動畫 + 光暈 */

body.premium .product-action-bar {
  background: linear-gradient(180deg, #FBF8F2 0%, #F2EEE6 100%) !important;
  padding: 36px 0 40px !important;
  border-bottom: 1px solid var(--pv-hair) !important;
  position: relative;
  overflow: hidden;
}
body.premium .product-action-bar::before {
  content: '';
  position: absolute; top: 0; left: 50%;
  width: 80px; height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--pv-gold) 50%, transparent 100%);
  transform: translateX(-50%);
}
body.premium .product-action-bar .container {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
  max-width: var(--max-width) !important;
}
body.premium .product-action-bar .product-action-btn {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 220px;
  padding: 16px 38px !important;
  font-family: 'Inter', 'Noto Sans TC', 'Noto Serif TC', sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  border-radius: 2px !important;
  text-decoration: none !important;
  cursor: pointer;
  overflow: hidden;
  transition: all .35s cubic-bezier(.34,1.4,.64,1) !important;
}
/* 共用 ::after 箭頭（hover 時滑入） */
body.premium .product-action-bar .product-action-btn::after {
  content: '→';
  font-size: 18px;
  font-weight: 400;
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .35s ease, transform .35s ease;
}
body.premium .product-action-bar .product-action-btn:hover::after {
  opacity: 1;
  transform: translateX(0);
}

/* —— 索取樣板（次級 CTA）—— 米白底 + 金邊 + 懸停金填充 —— */
body.premium .product-action-bar .product-action-btn.sample {
  background: rgba(255,255,255,.92) !important;
  color: var(--pv-ink) !important;
  border: 1.5px solid var(--pv-gold) !important;
  box-shadow: 0 2px 8px rgba(20,19,15,.06), 0 0 0 0 rgba(194,162,94,0) !important;
}
body.premium .product-action-bar .product-action-btn.sample:hover {
  background: linear-gradient(135deg, #E5D3A6 0%, #C2A25E 100%) !important;
  color: #14130F !important;
  border-color: var(--pv-gold) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 24px rgba(194,162,94,.32), 0 0 0 4px rgba(194,162,94,.14) !important;
}

/* —— 立即諮詢（主 CTA）—— 金色漸變實底 + 光暈 + 懸停放大 —— */
body.premium .product-action-bar .product-action-btn.inquire {
  background: linear-gradient(135deg, #D4B47A 0%, #C2A25E 45%, #A8884A 100%) !important;
  color: #14130F !important;
  border: 1.5px solid #A8884A !important;
  font-weight: 700 !important;
  box-shadow:
    0 4px 14px rgba(194,162,94,.32),
    0 1px 0 rgba(255,255,255,.35) inset,
    0 -1px 0 rgba(0,0,0,.08) inset,
    0 0 0 0 rgba(194,162,94,0) !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.25);
}
body.premium .product-action-bar .product-action-btn.inquire:hover {
  background: linear-gradient(135deg, #E5CC8A 0%, #D4B47A 45%, #B89250 100%) !important;
  border-color: #8C6D38 !important;
  transform: translateY(-4px) scale(1.02) !important;
  box-shadow:
    0 14px 32px rgba(194,162,94,.45),
    0 2px 0 rgba(255,255,255,.4) inset,
    0 0 0 6px rgba(194,162,94,.14) !important;
}
body.premium .product-action-bar .product-action-btn.inquire::after {
  content: '→';
  font-weight: 700;
}

/* —— 響應式：手機端按鈕拉寬並堆疊 —— */
@media (max-width: 640px) {
  body.premium .product-action-bar { padding: 24px 0 28px !important; }
  body.premium .product-action-bar .product-action-btn {
    min-width: 0 !important;
    width: 100%;
    padding: 14px 22px !important;
    font-size: 14px !important;
  }
  body.premium .product-action-bar .product-action-btn::after { font-size: 16px; }
}

/* ============================================================
   模块 21 · 全站卡片统一自适应 (v2, 2026-09-03)
   Flex + 均分拉伸：行不满时卡片自动铺满整行（无右侧留白）；
   列数档位由 main.js 按实卡数注入 --c(桌面)/--c-t(平板)：
     4卡→桌面4/平板2 绝不出3列; 5卡→3(3+2,次行铺满)/2; 6卡→3/2; 3卡→整行3
   特色区(v2错落画廊/视频墙/logo墙/资讯长列表/技术参数大卡)不在此列。
   ============================================================ */
body.premium :is(
  .trust-items, .why-choose-grid, .about-stats, .scenarios-grid, .role-cards,
  .certificates-grid, .info-cards, .service-cards, .advantage-cards, .solutions-grid,
  .service-grid, .pain-point-grid, .application-grid,
  .related-cases-grid, .related-products-grid, .product-video-grid,
  .contact-core-grid,
  .art-related-grid, .overview-grid, .stone-grid, .gallery-grid, .network-grid
) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  column-gap: var(--gx, 24px) !important;
  row-gap: var(--gy, 36px) !important;
}

body.premium :is(
  .trust-items, .why-choose-grid, .about-stats, .scenarios-grid, .role-cards,
  .certificates-grid, .info-cards, .service-cards, .advantage-cards, .solutions-grid,
  .service-grid, .pain-point-grid, .application-grid,
  .related-cases-grid, .related-products-grid, .product-video-grid,
  .contact-core-grid,
  .art-related-grid, .overview-grid, .stone-grid, .gallery-grid, .network-grid
) > * {
  flex-grow: 1 !important;
  flex-shrink: 0 !important;
  flex-basis: calc((100% - (var(--c, 3) - 1) * var(--gx, 24px)) / var(--c, 3)) !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  width: auto !important;
  box-sizing: border-box;
}

@media (max-width: 1024px) {
  body.premium :is(
    .trust-items, .why-choose-grid, .about-stats, .scenarios-grid, .role-cards,
    .certificates-grid, .info-cards, .service-cards, .advantage-cards, .solutions-grid,
    .service-grid, .pain-point-grid, .application-grid,
    .related-cases-grid, .related-products-grid, .product-video-grid,
    .contact-core-grid,
    .art-related-grid, .overview-grid, .stone-grid, .gallery-grid, .network-grid
  ) > * {
    flex-basis: calc((100% - (var(--c-t, 2) - 1) * var(--gx, 24px)) / var(--c-t, 2)) !important;
  }
}

@media (max-width: 640px) {
  body.premium :is(
    .trust-items, .why-choose-grid, .about-stats, .scenarios-grid, .role-cards,
    .certificates-grid, .info-cards, .service-cards, .advantage-cards, .solutions-grid,
    .service-grid, .pain-point-grid, .application-grid,
    .related-cases-grid, .related-products-grid, .product-video-grid,
    .contact-core-grid,
    .art-related-grid, .overview-grid, .stone-grid, .gallery-grid, .network-grid
  ) > * {
    flex-basis: 100% !important;
  }
}

/* 卡片内部横向溢出兜底 */
body.premium :is(
  .trust-items, .why-choose-grid, .about-stats, .scenarios-grid, .role-cards,
  .certificates-grid, .info-cards, .service-cards, .advantage-cards, .solutions-grid,
  .service-grid, .pain-point-grid, .application-grid,
  .related-cases-grid, .related-products-grid, .product-video-grid,
  .contact-core-grid,
  .art-related-grid, .overview-grid, .stone-grid, .gallery-grid, .network-grid
) > * img {
  max-width: 100% !important;
  height: auto;
}

/* ============================================================
   模块 22 · contact 页 联系/理念/到访/网络/生态 区块重排 (2026-09-03)
   目标：消除无效留白、图文均衡方正、图文混合不套卡片网格
   ============================================================ */
/* --- 02 在线询盘区：表单 + 其他联系方式 并排双栏 --- */
body.premium .contact-inquiry-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 440px !important;
  gap: 26px !important;
  align-items: stretch !important;
}
/* 右栏内部纵向铺满：卡片拉伸均分 */
body.premium .contact-channel-col { justify-content: space-between; }
body.premium .contact-channel-card { flex: 1 1 auto; }
body.premium .contact-channel-card p { line-height: 1.7; }
body.premium .contact-inquiry-form {
  background: #fff;
  border: 1px solid #eee6da;
  border-radius: 16px;
  padding: 28px;
  box-sizing: border-box;
}
body.premium .contact-inquiry-form form {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px 20px !important;
  width: 100% !important;
  box-sizing: border-box;
}
body.premium .contact-inquiry-form .form-full { grid-column: 1 / -1 !important; }
body.premium .contact-inquiry-form form > div { min-width: 0; }
@media (max-width: 960px) {
  body.premium .contact-inquiry-row { grid-template-columns: 1fr !important; }
}

/* --- 其他联系方式 侧栏卡组 --- */
body.premium .contact-channel-col { display: flex !important; flex-direction: column; gap: 16px !important; }
body.premium .contact-channel-card {
  background: #fff;
  border: 1px solid #eee6da;
  border-radius: 14px;
  padding: 20px 22px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  box-sizing: border-box;
}
body.premium .contact-channel-card .cc-icon {
  width: 42px; height: 42px; flex-shrink: 0; border-radius: 10px;
  background: linear-gradient(135deg, #E5D3A6, #C2A25E);
  display: flex; align-items: center; justify-content: center; font-size: 20px;
}
body.premium .contact-channel-card h5 { margin: 0 0 6px; font-size: 1rem; color: #14130F; font-weight: 600; }
body.premium .contact-channel-card p { margin: 0; font-size: 0.85rem; line-height: 1.6; color: #5C574F; }
body.premium .contact-channel-card a { color: #A8884A; font-weight: 600; }
body.premium .contact-channel-note {
  background: linear-gradient(135deg, #FBF8F2, #F2EEE6);
  border: 1px dashed #D8CDB8;
  border-radius: 14px; padding: 16px 20px;
  font-size: 0.85rem; line-height: 1.7; color: #5C574F;
}
body.premium .contact-channel-note strong { color: #14130F; }

/* --- 04 服务承诺：改为竖列四行（消除四窄列） --- */
body.premium .contact-commitments {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
  margin-top: 18px !important;
}
@media (max-width: 1024px) {
  body.premium .contact-commitments { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 640px) {
  body.premium .contact-commitments { grid-template-columns: minmax(0, 1fr) !important; }
}
body.premium .contact-commitment-item {
  background: #fff !important;
  padding: 14px 16px !important;
  border: 1px solid #eee6da !important;
  border-radius: 10px !important;
  align-items: center !important;
}
body.premium .contact-commitment-text { color: #14130F !important; }
body.premium .contact-commitment-text em { display: block; font-style: normal; font-size: 0.78rem; color: #8a8277; margin-top: 3px; line-height: 1.5; }

/* --- 05/06/08：双栏等高铺满 --- */
body.premium .contact-visit-grid,
body.premium .contact-network-grid,
body.premium .contact-eco-grid {
  align-items: stretch !important;
}
body.premium .contact-visit-info,
body.premium .contact-visit-map {
  display: flex; flex-direction: column;
}
body.premium .contact-visit-info { box-sizing: border-box; }
body.premium .contact-visit-map { box-sizing: border-box; }
body.premium .contact-visit-grid { grid-template-columns: minmax(0, 46fr) minmax(0, 54fr) !important; }
body.premium .contact-visit-map .v-map-top {
  display: flex; gap: 16px; padding: 16px; align-items: center;
  border-bottom: 1px solid #eee6da;
}
body.premium .contact-visit-map .v-map-top img { width: 34%; height: auto; min-width: 0; object-fit: cover; border-radius: 10px; display: block; }
body.premium .contact-visit-map .v-addr { flex: 1; min-width: 0; }
body.premium .contact-visit-map .v-addr strong { display: block; font-size: 0.95rem; color: #14130F; margin-bottom: 6px; }
body.premium .contact-visit-map .v-addr span { display: block; font-size: 0.82rem; line-height: 1.6; color: #5C574F; margin-bottom: 8px; }
body.premium .contact-visit-map .v-addr a { font-size: 0.8rem; color: #A8884A; font-weight: 600; }
body.premium .contact-visit-map iframe {
  flex: none !important; width: 100%; border: none;
  height: 330px; min-height: 0 !important; background: #F2EDE6;
}
@media (max-width: 1024px) { body.premium .contact-visit-map iframe { height: 330px; } }
body.premium .contact-visit-map .v-map-bar {
  padding: 12px 16px; border-bottom: 1px solid #eee6da;
}
body.premium .contact-visit-map .v-map-bar div {
  display: flex; gap: 8px; font-size: 0.84rem; line-height: 1.6; color: #4a443c;
  padding: 3px 0;
}
body.premium .contact-visit-map .v-map-bar .ico { flex: none; }
body.premium .contact-visit-grid { align-items: stretch !important; }
body.premium .contact-visit-info { justify-content: space-between; }
body.premium .contact-visit-map .v-map-top img { height: 165px; width: auto; max-width: 40%; }
/* 到访信息条目加说明小字 */
body.premium .contact-visit-item { flex-wrap: wrap; }
body.premium .contact-visit-item .v-note {
  width: 100%; margin-top: 2px; padding-left: 90px;
  font-size: 0.82rem; color: #8a8277; line-height: 1.55;
  box-sizing: border-box;
}
@media (max-width: 640px) { body.premium .contact-visit-item .v-note { padding-left: 0; } }
/* 06 底部服务保障小卡 */
body.premium .contact-network-perks {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin-top: 24px !important;
}
@media (max-width: 900px) { body.premium .contact-network-perks { grid-template-columns: 1fr !important; } }
body.premium .contact-network-perks > div {
  background: #FBF8F2; border: 1px solid #eee6da; border-radius: 12px;
  padding: 16px 18px;
}
body.premium .contact-network-perks h5 { margin: 0 0 6px; font-size: 0.95rem; color: #14130F; }
body.premium .contact-network-perks p { margin: 0; font-size: 0.82rem; line-height: 1.6; color: #5C574F; }
/* 区域条目副说明 */
body.premium .contact-region-item .r-sub { display: block; font-size: 0.78rem; color: #8a8277; margin-top: 2px; }
body.premium .contact-region-item { align-items: flex-start; }
/* 08 生态 扩充小样式 */
body.premium .contact-eco-direction-item { align-items: flex-start; flex-wrap: wrap; }
body.premium .contact-eco-direction-item .d-sub {
  width: 100%; padding-left: 38px; font-size: 0.8rem; color: #8a8277; line-height: 1.55;
  box-sizing: border-box;
}
body.premium .contact-eco-vision { justify-content: space-between; }
body.premium .contact-eco-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
body.premium .contact-eco-tags span {
  background: rgba(255,255,255,.85); border: 1px solid #E0D6C4; color: #5C574F;
  border-radius: 999px; padding: 5px 12px; font-size: 0.78rem;
}
@media (max-width: 640px) {
  body.premium .contact-eco-direction-item .d-sub { padding-left: 0; }
  body.premium .contact-eco-tags span { font-size: 0.72rem; }
}

/* 模块22补充：04理念要点 / 区域副注 */
body.premium .contact-principles { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
body.premium .contact-principles li { position: relative; padding-left: 16px; font-size: 0.9rem; line-height: 1.65; color: #4a443c; }
body.premium .contact-principles li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 6px; height: 6px; border-radius: 50%; background: #C2A25E; }
body.premium .contact-commitment-item { display: flex; align-items: flex-start !important; }
body.premium .contact-region-card h4, body.premium .contact-eco-directions h4, body.premium .contact-visit-info h4 { letter-spacing: 0.02em; }
body.premium .contact-eco-vision p { margin-bottom: 12px; }

/* 模块22补充2：联系卡说明 / 合作流程步进 */
body.premium .contact-core-card-desc { font-size: 0.78rem; line-height: 1.55; color: #8a8277; margin-top: 6px; font-weight: 400; }
body.premium .contact-process-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 18px !important;
  margin: 4px 0 24px !important;
}
@media (max-width: 1024px) { body.premium .contact-process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 640px) { body.premium .contact-process-grid { grid-template-columns: minmax(0, 1fr) !important; } }
body.premium .contact-process-step {
  background: #FBF8F2; border: 1px solid #eee6da; border-radius: 12px;
  padding: 18px 20px; display: flex; gap: 14px; align-items: flex-start; box-sizing: border-box;
}
body.premium .contact-process-step .ps-num {
  width: 38px; height: 38px; flex-shrink: 0; border-radius: 50%;
  background: linear-gradient(135deg,#E5D3A6,#C2A25E); color:#14130F;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 1rem;
}
body.premium .contact-process-step h5 { margin: 2px 0 6px; font-size: 0.98rem; color: #14130F; }
body.premium .contact-process-step p { margin: 0; font-size: 0.82rem; line-height: 1.6; color: #5C574F; }

/* 模块22补充3：map 顶栏 文字垂直排布微调 */
body.premium .contact-visit-map { display: flex; flex-direction: column; }

/* 模块22 到访·最终版：flex 等高 + 地图弹性填满（替换 grid stretch 方案） */
body.premium .contact-visit-grid {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: stretch !important;
  gap: 26px !important;
}
body.premium .contact-visit-info { flex: 0 0 46% !important; min-width: 0 !important; width: 46% !important; box-sizing: border-box; }
body.premium .contact-visit-map {
  flex: 1 1 auto !important; min-width: 0 !important; width: auto !important;
  box-sizing: border-box; display: flex; flex-direction: column; overflow: hidden;
}
body.premium .contact-visit-map > * { min-width: 0; }
body.premium .contact-visit-map iframe {
  flex: 1 1 auto !important;
  height: auto !important;
  width: 100%;
  min-height: 220px !important;
  border: none;
  background: #F2EDE6;
}
@media (max-width: 900px) {
  body.premium .contact-visit-grid { flex-direction: column !important; }
  body.premium .contact-visit-info,
  body.premium .contact-visit-map { flex-basis: auto !important; width: 100% !important; }
}
/* ============================================================
   模块 23 · 全站页脚 v2：5 列均分网格（品牌/导航/产品矩阵/客户服务/联络渠道）
   ============================================================ */
body.premium .ft-grid5 {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 40px !important;
  align-items: start !important;
}
body.premium .ft-grid5 > div { min-width: 0; }

body.premium .ft-brand .nav-logo { margin-bottom: 2px; }
body.premium .ft-brand .nav-logo img { max-height: 40px; width: auto; }
body.premium .ft-brand p { margin: 10px 0 12px; font-size: 0.78rem; line-height: 1.75; color: rgba(255,255,255,.7); }
body.premium .ft-brand .ft-tags { display: flex; flex-wrap: wrap; gap: 6px; }
body.premium .ft-brand .ft-tags span {
  font-size: 0.66rem; color: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.22); border-radius: 999px; padding: 2px 9px;
  letter-spacing: .04em; white-space: nowrap;
}

body.premium .ft-h {
  margin: 4px 0 15px !important;
  font-size: 0.78rem; font-weight: 600; color: #D4B47A;
  text-transform: uppercase; letter-spacing: .14em;
}
body.premium .ft-grid5 ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; gap: 9px; }
body.premium .ft-grid5 ul li { margin: 0 !important; line-height: 1.35; }
body.premium .ft-grid5 ul a {
  font-size: 0.8rem; color: rgba(255,255,255,.78);
  text-decoration: none; display: inline-flex; align-items: baseline;
}
body.premium .ft-grid5 ul a:hover { color: #E5CC8A; }
body.premium .ft-grid5 .ft-contact li a, body.premium .ft-grid5 .ft-contact li span { font-size: 0.78rem; }
body.premium .ft-grid5 .ft-contact .ft-c-line { font-size: 0.8rem; color: rgba(255,255,255,.92); font-weight: 500; }
body.premium .ft-grid5 .ft-contact .ft-c-note { font-size: 0.68rem; color: rgba(255,255,255,.45); line-height: 1.5; display: block; }

body.premium .ft-bottom {
  border-top: 1px solid rgba(255,255,255,.12) !important;
  margin-top: 34px !important; padding-top: 18px !important;
  display: flex !important; flex-wrap: wrap; justify-content: space-between; align-items: center;
  font-size: 0.76rem; color: rgba(255,255,255,.6);
}
body.premium .ft-bottom .ft-legal { display: flex; flex-wrap: wrap; gap: 20px; }
body.premium .ft-bottom .ft-legal a { font-size: 0.74rem; color: rgba(255,255,255,.55); text-decoration: none; }
body.premium .ft-bottom .ft-legal a:hover { color: #E5CC8A; }

@media (max-width: 1180px) {
  body.premium .ft-grid5 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; column-gap: 32px; row-gap: 32px; }
}
@media (max-width: 900px) {
  body.premium .ft-grid5 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 28px; row-gap: 28px; }
}
@media (max-width: 700px) {
  body.premium .ft-grid5 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 20px; row-gap: 24px; }
  body.premium .ft-grid5 > div:first-child { grid-column: 1 / -1 !important; }
  body.premium .ft-bottom { flex-direction: column; gap: 10px; text-align: center; }
}
/* 页脚版权行居中 */
body.premium .ft-bottom { justify-content: center !important; text-align: center !important; }
/* 页脚高度紧凑化 */
body.premium .ft-grid5 ul { gap: 7px !important; }
body.premium .ft-h { margin: 2px 0 12px !important; }
body.premium .ft-brand p { display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 8px 0 10px !important; }
body.premium .ft-brand .nav-logo img { max-height: 34px; }
body.premium .ft-bottom { margin-top: 26px !important; padding-top: 14px !important; }

/* ============ 模块 24 · 产品中心十系列旗舰卡墙 ============ */
body.premium .v2-series { padding: 84px 0 96px; background: #F5F1EA; }
body.premium .v2-series .v2-series-title { font-size: clamp(28px, 3.2vw, 42px); margin: 6px 0 14px; color: #14130F; font-weight: 500; letter-spacing: .02em; }
body.premium .v2-series .v2-series-lead { max-width: 640px; color: #5C574F; font-size: 15px; line-height: 1.85; margin: 0 0 42px; }
body.premium .v2-series-grid { display: flex !important; flex-wrap: wrap; gap: 22px; }
body.premium .v2-series-grid > * {
  flex: 1 1 calc((100% - 66px) / 4); min-width: 0;
  position: relative; border-radius: 16px; overflow: hidden;
  background: #fff; box-shadow: 0 10px 30px rgba(17,16,15,.06);
  transition: transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s;
  text-decoration: none; display: block; aspect-ratio: 3/2.2;
}
body.premium .v2-series-grid > *:hover { transform: translateY(-8px); box-shadow: 0 26px 60px rgba(17,16,15,.18); }
body.premium .v2-series-card .vsc-img { position: absolute; inset: 0; overflow: hidden; }
body.premium .v2-series-card .vsc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s cubic-bezier(.2,.8,.2,1); }
body.premium .v2-series-card:hover .vsc-img img { transform: scale(1.09); }
body.premium .v2-series-card .vsc-cap {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 52px 22px 20px;
  background: linear-gradient(180deg, rgba(12,10,8,0) 0%, rgba(12,10,8,.55) 46%, rgba(12,10,8,.88) 100%);
  color: #F4F1EA;
}
body.premium .v2-series-card .vsc-cap i { display: block; font-style: normal; font-size: 10px; letter-spacing: .22em; color: #D9C089; text-transform: uppercase; margin-bottom: 6px; }
body.premium .v2-series-card .vsc-cap b { display: block; font-size: 22px; font-weight: 600; letter-spacing: .04em; }
body.premium .v2-series-card .vsc-cap .vsc-d { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; line-height: 1.6; color: rgba(244,241,234,.86); margin: 8px 0 10px; }
body.premium .v2-series-card .vsc-go {
  display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #E5CC8A; font-style: normal;
  opacity: .0; transform: translateY(6px); transition: all .4s ease;
}
body.premium .v2-series-card:hover .vsc-go { opacity: 1; transform: translateY(0); }
@media (max-width: 1180px) { body.premium .v2-series-grid > * { flex-basis: calc((100% - 22px) / 2); } }
@media (max-width: 700px) { body.premium .v2-series-grid > * { flex-basis: 100%; aspect-ratio: 16/11; } }

/* 模块 26 · products 下方 spotlight/quote 与全站 premium 统一(1200对齐/配色/层次) */
body.premium .v2-spotlight { background: #F5F1EA !important; }
body.premium .v2-spot-in {
  max-width: 1200px !important; margin: 0 auto !important;
  padding: 78px 24px !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) !important;
  gap: 54px !important; align-items: center !important;
}
body.premium .v2-spot-media img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block;
  border-radius: 16px !important; box-shadow: 0 26px 60px rgba(17,16,15,.16);
}
body.premium .v2-spot-text .v2-kicker { justify-content: flex-start; }
body.premium .v2-spot-text h2 { font-size: clamp(26px, 3vw, 38px) !important; color: #14130F; margin: 10px 0 16px; }
body.premium .v2-spot-text p { color: #5C574F !important; font-size: 15px; line-height: 1.85; max-width: 46ch; }
body.premium .v2-btn { border-radius: 2px !important; }
body.premium .v2-btn.gold { background: linear-gradient(135deg,#D4B47A,#C2A25E 45%,#A8884A) !important; }
body.premium .v2-quote { background: #111110 !important; }
body.premium .v2-quote > * { max-width: 1200px; margin-left: auto !important; margin-right: auto !important; }
body.premium .v2-quote .v2-kicker { color: #D9C089; }
body.premium .v2-quote h2 { color: #F4F1EA !important; }
body.premium .v2-quote p { color: rgba(244,241,234,.66) !important; }
body.premium .v2-qbtns .v2-btn { border: 1px solid transparent; }
body.premium .v2-qbtns .v2-btn:not(.gold) { background: transparent !important; border-color: rgba(244,241,234,.35) !important; color: #F4F1EA !important; }
body.premium .v2-qbtns .v2-btn:not(.gold):hover { border-color: #C2A25E; color: #E5CC8A !important; background: rgba(194,162,94,.08) !important; }
@media (max-width: 960px) {
  body.premium .v2-spot-in { grid-template-columns: minmax(0,1fr) !important; padding: 56px 20px !important; gap: 26px !important; }
  body.premium .v2-spot-media img { aspect-ratio: 16/10; }
  body.premium .v2-spot-text p { max-width: none; }
}

/* 模块 28 · Let's Talk Stone CTA: 取消全屏深底, 白底墨字与全站一致, 内容1200 */
body.premium .v2-quote { background: #F5F1EA !important; padding: 88px 24px !important; }
body.premium .v2-quote .v2-kicker { color: #A8884A !important; }
body.premium .v2-quote h2 { color: #14130F !important; }
body.premium .v2-quote p { color: #5C574F !important; max-width: 56ch !important; }
body.premium .v2-qbtns .v2-btn:not(.gold) {
  background: transparent !important; border-color: #C7BFA9 !important; color: #14130F !important;
}
body.premium .v2-qbtns .v2-btn:not(.gold):hover { border-color: #C2A25E; color: #A8884A !important; background: rgba(194,162,94,.08) !important; }

/* 模块 29 · 首页『開始合作』CTA: 取消全屏深底, 与上下同色浅米; 表单卡片化+合规间距+隐私同意(收口 .cta-home, 不影响他页) */
body.premium .cta-section.cta-home { background: #F5F1EA !important; color: #14130F !important; padding-top: 84px !important; padding-bottom: 84px !important; }
body.premium .cta-section.cta-home h2 { color: #14130F !important; }
body.premium .cta-section.cta-home .section-desc { color: #5C574F !important; max-width: 620px; margin-left: auto; margin-right: auto; }
body.premium .cta-section.cta-home .section-subtitle { color: var(--pv-gold) !important; }
body.premium .cta-section.cta-home .form-scene-desc { color: #6b6358 !important; }
body.premium .cta-section.cta-home .hsst-form-divider { display: none !important; }
body.premium .cta-section.cta-home .hsst-form {
  max-width: 720px !important; margin: 28px auto 0 !important;
  background: #FFFFFF; border: 1px solid #ECE4D7; border-radius: 16px;
  padding: 30px 30px 26px; box-shadow: 0 24px 60px rgba(17,16,15,.07);
  display: grid !important; gap: 18px; text-align: left;
}
body.premium .cta-section.cta-home .hsst-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 0; }
body.premium .cta-section.cta-home .hsst-form-group { margin-bottom: 0; }
body.premium .cta-section.cta-home .hsst-form-group--full { grid-column: 1 / -1; }
body.premium .cta-section.cta-home .hsst-form-label { color: #5C574F !important; font-size: .8rem; margin-bottom: 7px; }
body.premium .cta-section.cta-home .hsst-form-input,
body.premium .cta-section.cta-home .hsst-form-textarea,
body.premium .cta-section.cta-home .hsst-form-select {
  background: #FCFAF6 !important; border: 1px solid #E3D9C9 !important; border-radius: 8px !important; color: #14130F !important;
  transition: border-color .25s, box-shadow .25s, background .25s;
}
body.premium .cta-section.cta-home .hsst-form-input:focus,
body.premium .cta-section.cta-home .hsst-form-textarea:focus,
body.premium .cta-section.cta-home .hsst-form-select:focus { border-color: #C2A25E !important; box-shadow: 0 0 0 3px rgba(194,162,94,.16) !important; background: #FFFFFF !important; }
body.premium .cta-section.cta-home .hsst-form-btn { width: 100% !important; border-radius: 8px !important; margin-top: 4px; }
body.premium .cta-section.cta-home .hsst-form-consent { display: flex; align-items: flex-start; gap: 10px; font-size: .82rem; color: #5C574F; line-height: 1.6; grid-column: 1 / -1; cursor: pointer; }
body.premium .cta-section.cta-home .hsst-form-consent input { width: 16px; height: 16px; margin-top: 2px; accent-color: #C2A25E; flex: none; }
body.premium .cta-section.cta-home .hsst-form-consent a { color: #A8884A; text-decoration: underline; }
body.premium .cta-section.cta-home .hsst-form-error--consent { grid-column: 1 / -1; margin-top: -10px; }
body.premium .cta-section.cta-home .hsst-form-privacy { display: flex; align-items: center; justify-content: center; gap: 6px; color: #8a8277 !important; margin-top: 2px; font-size: .76rem; }
body.premium .cta-section.cta-home .hsst-form-privacy svg { width: 13px; height: 13px; flex: none; opacity: .85; }
body.premium .cta-section.cta-home .hsst-form-success { background: #F4F1EA !important; border-color: #E3D9C9 !important; }
body.premium .cta-section.cta-home .hsst-form-success-icon { color: #C2A25E; font-size: 1.6rem; font-weight: 700; }
@media (max-width: 640px) {
  body.premium .cta-section.cta-home .hsst-form-row { grid-template-columns: 1fr; }
  body.premium .cta-section.cta-home .hsst-form { padding: 22px 18px; }
}

/* 模块 30 · 首页 cta 拆左右两栏: 表单(左)+認證與合作(右), 同高同宽不留白(收口 .cta-home) */
body.premium .cta-section.cta-home .container { text-align: left; }
body.premium .cta-section.cta-home .cta-home-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 28px; align-items: stretch; max-width: 1200px; margin: 10px auto 0; }
body.premium .cta-section.cta-home .cta-form-col { display: flex; flex-direction: column; min-width: 0; }
body.premium .cta-section.cta-home .cta-form-col .form-scene-desc { text-align: left; margin-bottom: 18px; }
body.premium .cta-section.cta-home .hsst-form { max-width: 100% !important; margin: 0 !important; height: 100%; }
body.premium .cta-section.cta-home .cta-cert-panel { background: #FFFFFF; border: 1px solid #ECE4D7; border-radius: 16px; padding: 30px; box-shadow: 0 24px 60px rgba(17,16,15,.07); display: flex; flex-direction: column; min-width: 0; }
body.premium .cta-section.cta-home .cta-cert-kicker { display: inline-block; font-family: 'Inter Tight', sans-serif; font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #A8884A; margin-bottom: 10px; }
body.premium .cta-section.cta-home .cta-cert-head h3 { font-family: 'Noto Serif TC', serif; font-size: 1.35rem; color: #14130F; margin: 0 0 8px; }
body.premium .cta-section.cta-home .cta-cert-head p { color: #5C574F; font-size: .86rem; line-height: 1.7; margin: 0; }
body.premium .cta-section.cta-home .cta-cert-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 14px; margin: 22px 0; }
body.premium .cta-section.cta-home .cta-cert-item { display: flex; gap: 12px; align-items: flex-start; background: #FBF8F2; border: 1px solid #F0E9DC; border-radius: 12px; padding: 14px; min-width: 0; }
body.premium .cta-section.cta-home .cta-cert-badge { flex: none; min-width: 76px; text-align: center; font-family: 'Inter Tight', sans-serif; font-weight: 700; font-size: .8rem; letter-spacing: .01em; color: #14130F; background: #fff; border: 1px solid #E3D9C9; border-radius: 8px; padding: 9px 6px; line-height: 1.2; }
body.premium .cta-section.cta-home .cta-cert-txt strong { display: block; color: #14130F; font-size: .84rem; margin-bottom: 3px; }
body.premium .cta-section.cta-home .cta-cert-txt p { margin: 0; color: #8a8277; font-size: .74rem; line-height: 1.5; overflow-wrap: anywhere; min-width: 0; }
body.premium .cta-section.cta-home .cta-cert-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; padding: 18px 0; border-top: 1px solid #EDE6DA; border-bottom: 1px solid #EDE6DA; }
body.premium .cta-section.cta-home .cta-cert-stats strong { display: block; font-family: 'Noto Serif TC', serif; font-size: 1.5rem; color: #A8884A; line-height: 1; }
body.premium .cta-section.cta-home .cta-cert-stats span { display: block; margin-top: 6px; color: #5C574F; font-size: .74rem; }
body.premium .cta-section.cta-home .cta-cert-link { margin-top: auto; align-self: flex-start; font-size: .82rem; font-weight: 600; color: #A8884A; text-decoration: none; padding-top: 8px; }
body.premium .cta-section.cta-home .cta-cert-link:hover { color: #C2A25E; }
@media (max-width: 960px) {
  body.premium .cta-section.cta-home .cta-home-grid { grid-template-columns: 1fr; gap: 22px; }
  body.premium .cta-section.cta-home .cta-cert-panel { padding: 24px 20px; }

/* 模块 31 · 资讯动态『订阅资讯』CTA: 与首页同色浅米 + 紧凑双栏表单卡片 + 隐私同意(收口 .cta-sub, 不影响他页) */
body.premium .cta-section.cta-sub { background: #F5F1EA !important; color: #14130F !important; padding-top: 72px !important; padding-bottom: 72px !important; }
body.premium .cta-section.cta-sub h2 { color: #14130F !important; }
body.premium .cta-section.cta-sub h2::before { left: 50% !important; transform: translateX(-50%) !important; }
body.premium .cta-section.cta-sub .section-subtitle { color: var(--pv-gold) !important; }
body.premium .cta-section.cta-sub .section-desc { color: #5C574F !important; max-width: 600px; margin: 0 auto; }
body.premium .cta-section.cta-sub .hsst-form-divider { display: none !important; }
body.premium .cta-section.cta-sub .hsst-form {
  max-width: 760px !important; margin: 24px auto 0 !important;
  background: #FFFFFF; border: 1px solid #ECE4D7; border-radius: 14px;
  padding: 24px 28px 22px; box-shadow: 0 18px 44px rgba(17,16,15,.06);
  display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 20px !important; text-align: left; align-items: start;
}
body.premium .cta-section.cta-sub .hsst-form-group { margin-bottom: 0; }
body.premium .cta-section.cta-sub .hsst-form-group--full { grid-column: 1 / -1; }
body.premium .cta-section.cta-sub .hsst-form-section-title { grid-column: 1 / -1; display: flex; align-items: center; gap: 9px; font-size: .82rem; font-weight: 600; letter-spacing: 1px; color: #A8884A; margin: 14px 0 4px; padding-bottom: 8px; border-bottom: 1px solid #ECE4D7; }
body.premium .cta-section.cta-sub .hsst-form-section-title::before { content: ''; width: 4px; height: 15px; background: #C2A25E; border-radius: 2px; }
body.premium .cta-section.cta-sub .hsst-form-label .required { color: #C0392B !important; }
body.premium .cta-section.cta-sub .hsst-form-hint { font-size: .72rem; color: #9a9388; margin-top: 3px; line-height: 1.5; }
body.premium .cta-section.cta-sub .hsst-form-label { color: #5C574F !important; font-size: .78rem; margin-bottom: 6px; font-weight: 500; }
body.premium .cta-section.cta-sub .hsst-form-input,
body.premium .cta-section.cta-sub .hsst-form-textarea,
body.premium .cta-section.cta-sub .hsst-form-select {
  width: 100%; background: #FCFAF6 !important; border: 1px solid #E3D9C9 !important; border-radius: 8px !important; color: #14130F !important;
  padding: 11px 13px; font-size: .9rem; font-family: 'Noto Sans TC', 'Inter', sans-serif;
  transition: border-color .25s, box-shadow .25s, background .25s;
}
body.premium .cta-section.cta-sub .hsst-form-input:focus,
body.premium .cta-section.cta-sub .hsst-form-textarea:focus,
body.premium .cta-section.cta-sub .hsst-form-select:focus { border-color: #C2A25E !important; box-shadow: 0 0 0 3px rgba(194,162,94,.16) !important; background: #FFFFFF !important; }
body.premium .cta-section.cta-sub .hsst-form-textarea { min-height: 84px; resize: vertical; }
body.premium .cta-section.cta-sub .hsst-form-btn { grid-column: auto; width: auto !important; min-width: 200px; justify-self: start; border-radius: 8px !important; margin-top: 6px; padding: 13px 28px; font-size: .95rem; }
body.premium .cta-section.cta-sub .hsst-form-consent { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 9px; font-size: .8rem; color: #5C574F; line-height: 1.55; cursor: pointer; margin-top: 2px; }
body.premium .cta-section.cta-sub .hsst-form-consent input { width: 15px; height: 15px; margin-top: 2px; accent-color: #C2A25E; flex: none; }
body.premium .cta-section.cta-sub .hsst-form-consent a { color: #A8884A; text-decoration: underline; }
body.premium .cta-section.cta-sub .hsst-form-error--consent { grid-column: 1 / -1; margin-top: -8px; }
body.premium .cta-section.cta-sub .hsst-form-privacy { grid-column: 1 / -1; text-align: center; color: #9a9388 !important; margin-top: 4px; font-size: .72rem; }
body.premium .cta-section.cta-sub .hsst-form-privacy svg { display: none !important; }
body.premium .cta-section.cta-sub .hsst-form-success { grid-column: 1 / -1; background: #F4F1EA !important; border-color: #E3D9C9 !important; }
body.premium .cta-section.cta-sub .hsst-form-success-icon { color: #C2A25E; font-size: 1.5rem; font-weight: 700; }
@media (max-width: 640px) {
  body.premium .cta-section.cta-sub .hsst-form { grid-template-columns: 1fr; padding: 22px 18px; }
}
}

/* ============================================================
   32. 全站表單配色統一（表單區塊 = 頁面米黃底 + 黑字 + 米白輸入框）
   僅作用於帶 .hsst-form-zone 的表單區塊，不影響頁面 hero 等其他區塊
   ============================================================ */

/* —— 32.1 表單區塊底色 → 頁面米黃 #F6F3EE —— */
body.premium .hsst-form-zone {
  background: #F6F3EE !important;
  color: #14130F !important;
}

/* —— 32.2 區塊內標題／正文／標籤 → 黑 #14130F（保留金色小標籤與必填星號）—— */
body.premium .hsst-form-zone h1,
body.premium .hsst-form-zone h2,
body.premium .hsst-form-zone h3,
body.premium .hsst-form-zone h4,
body.premium .hsst-form-zone p:not(.section-subtitle):not(.form-subtitle),
body.premium .hsst-form-zone label,
body.premium .hsst-form-zone li,
body.premium .hsst-form-zone td {
  color: #14130F !important;
}

/* —— 32.3 輸入框／文本域／下拉 → 米白 #FCFAF6 + 黑字
       用 background-color 而非 background，避免清掉 select 的箭頭圖 —— */
body.premium .hsst-form-zone input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not(.error),
body.premium .hsst-form-zone textarea,
body.premium .hsst-form-zone select {
  background-color: #FCFAF6 !important;
  color: #14130F !important;
  border-color: #DED9D3 !important;
}

/* —— 32.4 引導文字（placeholder）—— */
body.premium .hsst-form-zone input::placeholder,
body.premium .hsst-form-zone textarea::placeholder,
body.premium .hsst-form-zone select::placeholder {
  color: #5C574F !important;
  opacity: 1 !important;
}

/* —— 32.5 聚焦態：香檳金描邊 + 光暈 —— */
body.premium .hsst-form-zone input:not([type="submit"]):not([type="button"]):focus,
body.premium .hsst-form-zone textarea:focus,
body.premium .hsst-form-zone select:focus {
  border-color: #C2A25E !important;
  box-shadow: 0 0 0 3px rgba(194,162,94,0.18) !important;
  background-color: #FCFAF6 !important;
}

/* —— 32.6 下拉選項本體 —— */
body.premium .hsst-form-zone select option {
  background: #FCFAF6 !important;
  color: #14130F !important;
}

/* —— 32.7 表單卡片本體（原白卡）→ 與頁面同色米黃 —— */
body.premium .hsst-form-zone .hsst-form,
body.premium .hsst-form-zone .sample-form-container,
body.premium .hsst-form-zone .modal-content {
  background: #F6F3EE !important;
  color: #14130F !important;
}

/* —— 32.8 勾選／單選項的文字與底 —— */
body.premium .hsst-form-zone .stone-checkbox-item label,
body.premium .hsst-form-zone .radio-item label {
  color: #14130F !important;
}
body.premium .hsst-form-zone .stone-checkbox-item label {
  background: #FCFAF6 !important;
  border-color: #DED9D3 !important;
}

/* —— 32.9 隱私說明／提示文字 → 副文灰 #5C574F —— */
body.premium .hsst-form-zone .hsst-form-privacy,
body.premium .hsst-form-zone .hsst-form-hint,
body.premium .hsst-form-zone .sample-form-privacy,
body.premium .hsst-form-zone .form-scene-desc,
body.premium .hsst-form-zone .form-subtitle {
  color: #5C574F !important;
}

/* —— 32.10 提交成功提示塊 —— */
body.premium .hsst-form-zone .hsst-form-success {
  background: #FCFAF6 !important;
  border-color: #E3D9C9 !important;
}
body.premium .hsst-form-zone .hsst-form-success p,
body.premium .hsst-form-zone .sample-form-success p {
  color: #5C574F !important;
}

/* —— 32.11 提交按鈕文字色統一為深墨黑 #1A1A2E（模組 48 白底黑字金框規範）—— */
body.premium .hsst-form-zone button[type="submit"],
body.premium .hsst-form-zone .hsst-form-btn,
body.premium .hsst-form-zone .sample-submit-btn,
body.premium .hsst-form-zone .solution-cta-btn {
  color: #1A1A2E !important;
}

/* —— 32.11a 表單提交按鈕（背景/邊框已由模組 48 統一為白底金框，此處僅保留字重）—— */
body.premium .hsst-form-zone .inquiry-form button[type="submit"] {
  color: #1A1A2E !important;
  font-weight: 700 !important;
  justify-self: start;
}

/* —— 32.12 錯誤態保留粉底，不覆蓋 —— */
body.premium .hsst-form-zone input.error,
body.premium .hsst-form-zone textarea.error {
  background-color: #FEF5F5 !important;
  border-color: #E74C3C !important;
}

/* ============================================================
   33. 全站表單隱私條款勾選（.hsst-consent）
   統一勾選框 + 條款鏈接樣式，適配各表單體系（hsst / solution / sample / inquiry / products / modal）
   ============================================================ */
body.premium .hsst-consent {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  margin: 16px 0 14px;
  font-size: .82rem;
  line-height: 1.6;
  color: #5C574F;
  text-align: left;
  cursor: pointer;
  width: 100%;
  grid-column: 1 / -1;   /* 在 grid 表單（hsst-form / inquiry-form）中佔滿整行 */
  box-sizing: border-box;
}
body.premium .hsst-consent input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 2px 0 0;
  flex: none;
  accent-color: #C2A25E;
  cursor: pointer;
}
body.premium .hsst-consent a {
  color: #A8884A;
  text-decoration: underline;
}
body.premium .hsst-consent a:hover {
  color: #C2A25E;
}

/* —— 33.2 未勾選錯誤提示（內聯紅字 + 紅框高亮）—— */
body.premium .hsst-consent-error {
  display: none;
  color: #E74C3C !important;
  font-size: 12px;
  margin: 6px 0 10px;
  line-height: 1.4;
  grid-column: 1 / -1;
  width: 100%;
}
body.premium .hsst-consent-error.show { display: block !important; }
body.premium .hsst-consent input[type="checkbox"].error {
  outline: 2px solid #E74C3C;
  outline-offset: 1px;
}

/* ============================================================
   34. 页脚品牌区文字版（公司名 + 英文名 + 描述，全站中英统一）
   ============================================================ */
body.premium .ft-brand .ft-brand-name {
  display: block !important;
  -webkit-line-clamp: unset;
  margin: 0 0 4px !important;
  font-size: 1.02rem !important;
  line-height: 1.4 !important;
  color: #F4F1EA !important;
  font-weight: 600;
}
body.premium .ft-brand .ft-brand-name strong { font-weight: 600; letter-spacing: .01em; }
body.premium .ft-brand .ft-brand-en {
  display: block !important;
  -webkit-line-clamp: unset;
  margin: 0 0 12px !important;
  font-size: 0.7rem !important;
  line-height: 1.5 !important;
  color: rgba(255,255,255,.55) !important;
  letter-spacing: .05em;
}
body.premium .ft-brand .ft-brand-desc {
  display: block !important;
  -webkit-line-clamp: unset;
  margin: 0 !important;
  font-size: 0.78rem !important;
  line-height: 1.75 !important;
  color: rgba(255,255,255,.7) !important;
}

/* ============================================================
   35. 页脚五列：等宽均分 + 列内内容统一水平/垂直居中
   （等宽 repeat(5,minmax(0,1fr)) 与统一 gap 由模块 16 保证，此处仅调对齐）
   ============================================================ */
body.premium .ft-grid5 {
  align-items: stretch !important;
}
body.premium .ft-grid5 > div {
  min-width: 0;
  width: 100%;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
}
body.premium .ft-grid5 .ft-h {
  width: 100%;
  text-align: center !important;
}
body.premium .ft-grid5 ul {
  width: 100%;
  text-align: center !important;
}
body.premium .ft-grid5 ul li {
  text-align: center !important;
}
body.premium .ft-brand .ft-brand-name,
body.premium .ft-brand .ft-brand-en,
body.premium .ft-brand .ft-brand-desc {
  width: 100%;
  text-align: center !important;
}

/* ============================================================
   36. PWA 独立全屏模式：导航栏固定完整显示（仅鼠标设备）
   仅作用 display-mode:standalone + pointer:fine（桌面 PWA 独立窗口），
   普通浏览器（browser）与手机/触屏 PWA（pointer:coarse）不受影响，
   触屏继续走汉堡菜单，避免 hover 下拉在触屏上点不开
   ============================================================ */
@media (display-mode: standalone) and (pointer: fine) {
  /* 隐藏汉堡按钮 */
  body.premium .navbar .nav-toggle { display: none !important; }
  /* 导航菜单恢复桌面端横向布局（覆盖 ≤900px 折叠抽屉） */
  body.premium .navbar .nav-links {
    position: static !important;
    top: auto !important;
    right: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 18px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    pointer-events: auto !important;
    overflow: visible !important;
    z-index: auto !important;
    transition: none !important;
  }
  body.premium .navbar .nav-links > a,
  body.premium .navbar .nav-dropdown > a {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    padding: 0 !important;
    border-bottom: none !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    min-height: auto !important;
  }
  body.premium .navbar .nav-links a::after { display: block !important; }
  /* 恢复下拉菜单（mega panel）hover 展开 */
  body.premium .navbar .nav-dropdown { position: relative !important; }
  body.premium .navbar .mega-panel,
  body.premium .navbar .dropdown-panel {
    display: block !important;
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) translateY(8px) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  body.premium .navbar .nav-dropdown:hover .mega-panel,
  body.premium .navbar .nav-dropdown:hover .dropdown-panel {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) !important;
  }
}

/* ============================================================
   37. PWA 独立全屏：导航栏避开 iOS 刘海/状态栏安全区
   （触屏手机 PWA 也生效，避免汉堡按钮被刘海遮挡导致点不到）
   ============================================================ */
@media (display-mode: standalone) {
  body.premium .navbar {
    padding-top: env(safe-area-inset-top, 0px);
  }
  body.premium .navbar .nav-links.open {
    padding-top: calc(80px + env(safe-area-inset-top, 0px));
  }
}

/* ============================================================
   38. PWA 安装按钮（添加到桌面 / 添加到主屏幕）
   ============================================================ */
.pwa-install-btn {
  position: fixed;
  left: 20px;
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  z-index: 9990;
  display: none;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  background: #16150F;
  color: #F4F1EA;
  border: 1px solid rgba(194,162,94,.55);
  border-radius: 999px;
  font-size: .84rem;
  font-weight: 600;
  letter-spacing: .02em;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
  font-family: 'Noto Sans SC','Sarasa Gothic SC',sans-serif;
  transition: transform .2s, box-shadow .2s;
}
.pwa-install-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(0,0,0,.36); }
.pwa-install-btn.show { display: flex; }
.pwa-install-btn svg { width: 18px; height: 18px; flex: none; }

/* iOS 添加到主屏幕指引弹窗 */
.pwa-guide-mask {
  position: fixed; inset: 0;
  z-index: 10010;
  background: rgba(0,0,0,.56);
  display: none;
  align-items: center; justify-content: center;
  padding: 24px;
}
.pwa-guide-mask.show { display: flex; }
.pwa-guide-card {
  background: #fff;
  border-radius: 18px;
  max-width: 360px;
  width: 100%;
  padding: 30px 26px 24px;
  text-align: center;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}
.pwa-guide-icon { font-size: 2.2rem; margin-bottom: 12px; }
.pwa-guide-card h3 { margin: 0 0 8px; font-size: 1.1rem; color: #14130F; }
.pwa-guide-card p { margin: 0 0 16px; font-size: .86rem; color: #5C574F; line-height: 1.7; }
.pwa-guide-steps { text-align: left; margin: 0 0 20px; padding: 0; list-style: none; }
.pwa-guide-steps li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: .84rem; color: #14130F; line-height: 1.6;
  padding: 8px 0; border-bottom: 1px solid #EFE9E0;
}
.pwa-guide-steps li:last-child { border-bottom: none; }
.pwa-guide-num {
  flex: none; width: 22px; height: 22px;
  background: #C2A25E; color: #fff;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: .72rem; font-weight: 700;
}
.pwa-guide-close {
  width: 100%; padding: 12px;
  background: #16150F; color: #F4F1EA;
  border: none; border-radius: 10px;
  font-size: .9rem; font-weight: 600; cursor: pointer;
  font-family: inherit;
}

/* ============================================================
   34. 資訊中心訂閱表單雙欄重排（僅帶 .hsst-sub-grid 的表單生效）
   左欄＝基本資料，右欄＝訂閱偏好＋權益卡，下方補充說明＋按鈕通欄
   ============================================================ */
body.premium .cta-section.cta-sub .hsst-form.hsst-sub-form { max-width: 100% !important; gap: 22px !important; }
body.premium .cta-section.cta-sub .hsst-sub-grid {
  grid-column: 1 / -1 !important; display: grid !important;
  grid-template-columns: 1.05fr 0.95fr !important; gap: 24px !important; align-items: start;
}
body.premium .cta-section.cta-sub .hsst-sub-col {
  min-width: 0; background: #FBF8F1; border: 1px solid #EFE5D4; border-radius: 12px; padding: 18px 20px 20px;
}
body.premium .cta-section.cta-sub .hsst-sub-col--accent { border-top: 3px solid #C2A25E; }
body.premium .cta-section.cta-sub .hsst-sub-col .hsst-form-section-title { margin-top: 0; }
body.premium .cta-section.cta-sub .hsst-sub-col .hsst-form-group { margin-bottom: 15px; }
body.premium .cta-section.cta-sub .hsst-sub-col .hsst-form-group:last-child { margin-bottom: 0; }
body.premium .cta-section.cta-sub .hsst-sub-perks { margin-top: 18px; padding-top: 16px; border-top: 1px dashed #E0D4BE; }
body.premium .cta-section.cta-sub .hsst-sub-perks-title { font-size: .78rem; font-weight: 600; letter-spacing: 1px; color: #A8884A; margin-bottom: 9px; }
body.premium .cta-section.cta-sub .hsst-sub-perks ul { list-style: none; margin: 0; padding: 0; }
body.premium .cta-section.cta-sub .hsst-sub-perks li { position: relative; padding-left: 20px; font-size: .82rem; color: #5C574F; line-height: 1.6; margin-bottom: 7px; }
body.premium .cta-section.cta-sub .hsst-sub-perks li::before { content: '✓'; position: absolute; left: 0; top: 0; color: #C2A25E; font-weight: 700; }
body.premium .cta-section.cta-sub .hsst-form.hsst-sub-form .hsst-form-btn { justify-self: center; min-width: 260px; }
@media (max-width: 760px) {
  body.premium .cta-section.cta-sub .hsst-sub-grid { grid-template-columns: 1fr !important; }
  body.premium .cta-section.cta-sub .hsst-form.hsst-sub-form .hsst-form-btn { width: 100%; }
}

/* ============================================================
   35. 首頁「國際品質認證」卡片重排（縱向緊湊卡 2026-09-04）
   徽章置頂、說明文字居下，四卡一行，消除大面積留白
   ============================================================ */
body.premium .certificates-grid { grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)) !important; gap: 20px !important; }
body.premium .certificate-card { flex-direction: column !important; align-items: stretch !important; gap: 0 !important; padding: 0 0 18px !important; overflow: hidden; }
body.premium .certificate-card .cert-badge { width: 100% !important; height: auto !important; border-radius: 0 !important; padding: 18px 16px 14px; }
body.premium .certificate-card .cert-badge h4 { font-size: 1.35rem; letter-spacing: .5px; }
body.premium .certificate-card .cert-badge p { font-size: .72rem; margin-top: 4px; }
body.premium .certificate-card .cert-info { padding: 16px 18px 0; }
body.premium .certificate-card .cert-info h5 { font-size: .95rem; margin: 0 0 8px; }
body.premium .certificate-card .cert-info p { font-size: .84rem; line-height: 1.75; color: #5C574F; margin: 0; }
@media (max-width: 560px) { body.premium .certificates-grid { grid-template-columns: 1fr !important; } }
@media (max-width: 640px) { body.premium .cta-section.cta-home .cta-cert-grid { grid-template-columns: 1fr; } }

/* ============================================================
   36. Hero「Since 1999 · Hong Kong」內容區重塑（2026-09-04）
   三亮點支柱 + 發展時間線 + 按鈕對比度修復（淺底場景）
   ============================================================ */
body.premium .hero-grid-video .hero-content { max-width: 1080px !important; }
body.premium .hero-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 980px; margin: 4px auto 0; text-align: left; }
body.premium .hero-pillar { background: rgba(255,255,255,.72); border: 1px solid var(--pv-hair); border-radius: 10px; padding: 20px 22px 18px; transition: transform .25s, border-color .25s, box-shadow .25s; }
body.premium .hero-pillar:hover { transform: translateY(-3px); border-color: var(--pv-gold); box-shadow: 0 10px 26px rgba(20,19,15,.07); }
body.premium .hero-pillar .hp-icon { font-size: 22px; }
body.premium .hero-pillar h3 { font-size: .98rem; font-weight: 600; margin: 10px 0 6px; letter-spacing: .04em; }
body.premium .hero-pillar p { font-size: .82rem; color: var(--pv-muted); line-height: 1.75; margin: 0; }
body.premium .hero-timeline { display: grid; grid-template-columns: repeat(4, 1fr); max-width: 980px; margin: 24px auto 0; padding: 18px 8px 0; border-top: 1px solid var(--pv-hair); }
body.premium .hero-timeline .ht-item { text-align: center; position: relative; padding: 0 10px; }
body.premium .hero-timeline .ht-item::before { content: ''; position: absolute; top: -21.5px; left: 50%; transform: translateX(-50%); width: 7px; height: 7px; border-radius: 50%; background: var(--pv-gold); box-shadow: 0 0 0 3px rgba(194,162,94,.18); }
body.premium .hero-timeline .ht-year { display: block; font-family: 'Playfair Display', 'Noto Serif TC', serif; font-size: 1.18rem; font-weight: 700; color: #A8884A; }
body.premium .hero-timeline .ht-text { display: block; font-size: .76rem; color: var(--pv-muted); margin-top: 3px; letter-spacing: .02em; }
/* 按鈕對比度修復：淺色 hero 底上 → 金底深字（主）+ 深墨底米字（副） */
body.premium .hero-grid-video .hero-buttons .btn-primary { background: var(--pv-gold) !important; color: #1A160F !important; border-color: var(--pv-gold) !important; font-weight: 600 !important; box-shadow: 0 6px 18px rgba(194,162,94,.35); }
body.premium .hero-grid-video .hero-buttons .btn-primary:hover { background: #AF8E4A !important; border-color: #AF8E4A !important; transform: translateY(-1px); }
body.premium .hero-grid-video .hero-buttons .btn-outline-light { background: rgba(20,19,15,.88) !important; color: #F4F1EA !important; border: 1px solid rgba(20,19,15,.88) !important; }
body.premium .hero-grid-video .hero-buttons .btn-outline-light:hover { background: #2A2822 !important; border-color: #2A2822 !important; color: #fff !important; transform: translateY(-1px); }
@media (max-width: 860px) {
  body.premium .hero-pillars { grid-template-columns: 1fr; max-width: 560px; }
  body.premium .hero-timeline { grid-template-columns: repeat(2, 1fr); gap: 16px 0; border-top: 0; padding-top: 6px; }
  body.premium .hero-timeline .ht-item::before { display: none; }
  body.premium .hero-timeline .ht-item { padding: 10px 12px; background: rgba(255,255,255,.72); border: 1px solid var(--pv-hair); border-radius: 8px; margin: 0 5px; }
}
body.premium .hero-grid-video .hero-buttons { margin-top: 32px !important; }

/* section 37: 導航下拉系列縮略圖取景（避開圖內頂部文字區，顯示石材主體） */
body.premium .mega-panel-icon img { object-position: center 72%; }


/* ============================================================
   37. 內頁 Hero 垂直居中——消除 min-height 造成的底部留白（2026-09-05）
   ============================================================ */
body.inner-page .hero { display: flex !important; align-items: center !important; }
body.inner-page .hero > .container { width: 100% !important; }
body.inner-page .hero .hero-content { width: 100% !important; }

/* ============================================================
   39. 全站布局补丁层——修复未定义类 + 收紧留白（2026-09-05）
   ============================================================ */

/* ---- Cookie 同意条（全站） ---- */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:2000;display:none;background:rgba(26,26,46,0.96);border-top:1px solid rgba(201,168,76,0.35);box-shadow:0 -8px 24px rgba(0,0,0,0.18);}
.cookie-banner-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 0;flex-wrap:wrap;}
.cookie-banner-text{margin:0;color:#F5F0EB;font-size:0.85rem;line-height:1.6;}
.cookie-banner-btns{display:flex;gap:10px;}
.cookie-btn-accept,.cookie-btn-decline{border:1px solid #C9A84C;background:transparent;color:#C9A84C;border-radius:20px;padding:6px 18px;font-size:0.82rem;cursor:pointer;transition:all .2s;}
.cookie-btn-accept:hover,.cookie-btn-decline:hover{background:#C9A84C;color:#fff;}

/* ---- 浮动按钮（合规类页面） ---- */
.wpp-float.whatsapp-float,.whatsapp-float{position:fixed;bottom:26px;right:22px;width:54px;height:54px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(37,211,102,0.4);z-index:1500;transition:transform .3s ease,box-shadow .3s ease;text-decoration:none;}
.whatsapp-float:hover{transform:scale(1.08);}
.btt.back-to-top{position:fixed;bottom:92px;right:25px;width:44px;height:44px;background:rgba(26,26,46,0.9);color:#C9A84C;border:1px solid rgba(201,168,76,0.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:17px;text-decoration:none;z-index:1500;opacity:0;visibility:hidden;transition:all .3s ease;}
.btt.back-to-top.visible{opacity:1;visibility:visible;}

/* ---- FAQ 列表容器 ---- */
.faq-item-list{max-width:920px;margin:0 auto;display:grid;gap:14px;}

/* ---- 内页 hero 变体 ---- */
.honors-hero{min-height:400px;}

/* ---- 页脚变体（careers/honors/manufacturing/mines 等 12 页） ---- */
.site-footer{background:#1A1A2E;color:#cfc9bd;padding:54px 0 0;}
.site-footer a{color:#cfc9bd;text-decoration:none;}
.site-footer a:hover{color:#C9A84C;}
.site-footer .footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:30px;padding-bottom:34px;}
.site-footer h4{color:#C9A84C;font-size:0.98rem;margin:0 0 12px;letter-spacing:0.02em;}
.site-footer ul{list-style:none;margin:0;padding:0;}
.site-footer li{margin-bottom:8px;font-size:0.86rem;line-height:1.65;}
.site-footer p{font-size:0.86rem;line-height:1.7;margin:0 0 8px;}
.premium-footer{border-top:2px solid #C9A84C;}

/* ---- 按钮排 / 信息标签 ---- */
.cta-buttons{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px;}
.info-tags,.info-tags-flex{display:flex;flex-wrap:wrap;gap:10px;}
.info-tag{background:#FAF8F5;border:1px solid rgba(26,26,46,0.12);border-radius:20px;padding:6px 14px;font-size:0.8rem;color:#4a443c;}
.info-tag-highlight{background:#C9A84C;border-color:#C9A84C;color:#fff;}

/* ---- 卡片网格通用 ---- */
.why-grid,.honor-grid,.partner-grid,.manufacturing-grid,.mines-grid,.jobs-grid,.region-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:22px;}
.why-card,.honor-card,.partner-card,.equip-card,.mine-region,.job-card,.region-card{background:#fff;border:1px solid rgba(26,26,46,0.10);border-radius:14px;padding:24px 24px 22px;box-shadow:0 4px 18px rgba(26,26,46,0.05);transition:transform .25s ease,box-shadow .25s ease;}
.why-card:hover,.honor-card:hover,.partner-card:hover,.equip-card:hover,.mine-region:hover,.job-card:hover,.region-card:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(26,26,46,0.10);}
.why-card h4,.honor-card h3,.partner-card h4,.mine-region h3,.region-card h4,.job-card h4{margin:0 0 10px;color:#1A1A2E;font-size:1.05rem;}
.why-card p,.honor-card p,.partner-card p,.equip-card p,.mine-region p,.region-card p,.job-card p{margin:0;font-size:0.88rem;line-height:1.75;color:#5c574f;}
.equip-icon{font-size:30px;line-height:1;margin-bottom:10px;}

/* ---- 荣誉页专属 ---- */
.honor-card-badge{display:inline-block;background:#C9A84C;color:#fff;font-weight:700;font-size:0.78rem;letter-spacing:0.05em;border-radius:16px;padding:4px 14px;margin-bottom:12px;}
.honor-meta{list-style:none;margin:12px 0 0;padding:12px 0 0;border-top:1px dashed rgba(26,26,46,0.15);font-size:0.82rem;color:#6b6558;}
.honor-meta li{margin-bottom:4px;}
.media-list{list-style:none;padding:0;margin:0;display:grid;gap:12px;}
.media-list li{background:#fff;border:1px solid rgba(26,26,46,0.08);border-left:3px solid #C9A84C;border-radius:0 10px 10px 0;padding:14px 18px;font-size:0.9rem;line-height:1.75;color:#4a443c;}

/* ---- 制造基地页：质检漏斗 + 工艺分类 ---- */
.qc-funnel{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;}
.qc-step{background:#fff;border:1px solid rgba(26,26,46,0.10);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:6px;}
.qc-num{font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:700;color:#C9A84C;line-height:1;}
.qc-name{font-weight:700;color:#1A1A2E;font-size:0.92rem;}
.qc-detail{font-size:0.8rem;color:#6b6558;line-height:1.6;}
.craft-categories{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
.craft-card{background:#fff;border:1px solid rgba(26,26,46,0.10);border-radius:14px;padding:22px;box-shadow:0 4px 18px rgba(26,26,46,0.05);}
.craft-card h4{margin:0 0 8px;color:#1A1A2E;}
.craft-card ul{list-style:none;padding:0;margin:10px 0 0;font-size:0.85rem;color:#5c574f;display:grid;gap:6px;}
.craft-card ul li::before{content:'◆ ';color:#C9A84C;font-size:0.7em;}

/* ---- 矿山页：ESG 数据 ---- */
.esg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px;}
.esg-card{background:#1A1A2E;color:#fff;border-radius:14px;padding:22px 16px;text-align:center;transition:transform .25s ease;}
.esg-card:hover{transform:translateY(-3px);}
.esg-num{font-family:'Playfair Display',serif;font-size:1.7rem;font-weight:700;color:#C9A84C;line-height:1.2;}
.esg-label{font-size:0.82rem;color:#cfc9bd;margin-top:6px;line-height:1.5;}

/* ---- 招聘页：申请步骤 ---- */
.apply-steps{list-style:none;counter-reset:step;padding:0;margin:0;display:grid;gap:14px;max-width:880px;}
.apply-steps li{counter-increment:step;position:relative;padding:16px 18px 16px 62px;background:#fff;border:1px solid rgba(26,26,46,0.10);border-radius:12px;font-size:0.9rem;line-height:1.75;color:#5c574f;}
.apply-steps li::before{content:counter(step,decimal-leading-zero);position:absolute;left:18px;top:16px;font-family:'Playfair Display',serif;font-size:1.25rem;font-weight:700;color:#C9A84C;}
.job-loc{color:#B8860B;font-size:0.82rem;font-weight:600;margin:4px 0 10px;}

/* ---- 联系表单：复选框组 ---- */
.form-checkbox-group{display:flex;flex-wrap:wrap;gap:12px;}
.form-checkbox-item{display:inline-flex;align-items:center;gap:6px;font-size:0.88rem;color:#4a443c;cursor:pointer;}

/* ---- 新闻列表 ---- */
.news-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:22px;}

/* ---- 产品对比条标签 ----
   对比条本体（style.css .compare-panel）是 #1A1A2E 深底 + #FFFFFF 白字，
   此处若沿用同色 #1A1A2E 会与底色完全同色（全站实测「已選產品: / Selected:」
   在展开后不可见）→ 恢复为白色，与 .compare-panel-item 一致。 */
.compare-panel-label{font-weight:700;color:#FFFFFF;font-size:0.9rem;}

/* ---- 工程目录页：行业瓦片 + 区域卡 ---- */
.industry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;}
.industry-tile{display:flex;flex-direction:column;align-items:flex-start;gap:8px;background:#fff;border:1px solid rgba(26,26,46,0.10);border-radius:14px;padding:20px;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease;}
.industry-tile:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(26,26,46,0.10);}
.industry-tile > span:first-child{font-size:26px;line-height:1;}
.it-label{font-weight:700;color:#1A1A2E;font-size:0.95rem;}
.it-num{color:#B8860B;font-weight:700;font-family:'Playfair Display',serif;}

/* ---- 关于页：公司历程时间线 ---- */
.timeline-container{position:relative;max-width:880px;margin:0 auto;padding-left:34px;}
.timeline-container::before{content:'';position:absolute;left:10px;top:6px;bottom:6px;width:2px;background:rgba(201,168,76,0.4);}
.timeline-item{position:relative;padding:0 0 26px 14px;}
.timeline-item::before{content:'';position:absolute;left:-30px;top:5px;width:12px;height:12px;border-radius:50%;background:#C9A84C;border:2px solid #FAF8F3;box-shadow:0 0 0 2px rgba(201,168,76,0.35);}
.timeline-year{font-family:'Playfair Display',serif;font-size:1.15rem;font-weight:700;color:#B8860B;margin-bottom:4px;}
.timeline-title{font-weight:700;color:#1A1A2E;margin-bottom:6px;}
.timeline-desc{font-size:0.9rem;line-height:1.75;color:#5c574f;}
.about-video-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,26,46,0.25),rgba(26,26,46,0.65));}
.highlight-text{background:#FAF8F3;border-left:3px solid #C9A84C;border-radius:0 10px 10px 0;padding:16px 20px;color:#4a443c;font-size:0.95rem;line-height:1.85;}
.about-heading-pad{padding-top:6px;}

/* ---- 索取样板 hero ---- */
.sample-hero-content{max-width:900px;margin:0 auto;text-align:center;}

/* ---- FAQ 页按钮 ---- */
.hsst-btn{display:inline-flex;align-items:center;gap:8px;background:#C9A84C;color:#fff;border:none;border-radius:24px;padding:10px 26px;font-weight:600;font-size:0.9rem;text-decoration:none;transition:background .2s;}
.hsst-btn:hover{background:#B8860B;color:#fff;}

/* ============================================================
   模块 40 · 补丁层网格并入全站网格引擎 (2026-09-05)
   问题：why/honor/partner/manufacturing/mines/jobs/region/strength
   等网格原为 auto-fit 自适应，卡数与自动列数不匹配时末行出现
   孤卡+右侧空槽（如实例：honors 六大国际认证 4+2、about 八大
   核心实力 3+3+2），且各行卡宽不一致。
   方案：并入模块 21「按实卡数定列」引擎——main.js 依据实卡数
   注入 --c/--c-t（6卡→3列 3+3、8卡→4列 4+4、4卡→4列、5卡→3列
   次行铺满），末行无孤卡、全行等宽，与全站布局规范一致。
   ============================================================ */
body.premium :is(
  .why-grid,.honor-grid,.partner-grid,.manufacturing-grid,.mines-grid,
  .esg-grid,.industry-grid,.jobs-grid,.region-grid,.strength-grid
){
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  column-gap: var(--gx, 22px) !important;
  row-gap: var(--gy, 36px) !important;
}
body.premium :is(
  .why-grid,.honor-grid,.partner-grid,.manufacturing-grid,.mines-grid,
  .esg-grid,.industry-grid,.jobs-grid,.region-grid,.strength-grid
) > * {
  flex-grow: 1 !important;
  flex-shrink: 0 !important;
  flex-basis: calc((100% - (var(--c, 3) - 1) * var(--gx, 22px)) / var(--c, 3)) !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  width: auto !important;
  box-sizing: border-box;
}
@media (max-width: 1024px) {
  body.premium :is(
    .why-grid,.honor-grid,.partner-grid,.manufacturing-grid,.mines-grid,
    .esg-grid,.industry-grid,.jobs-grid,.region-grid,.strength-grid
  ) > * {
    flex-basis: calc((100% - (var(--c-t, 2) - 1) * var(--gx, 22px)) / var(--c-t, 2)) !important;
  }
}
@media (max-width: 640px) {
  body.premium :is(
    .why-grid,.honor-grid,.partner-grid,.manufacturing-grid,.mines-grid,
    .esg-grid,.industry-grid,.jobs-grid,.region-grid,.strength-grid
  ) > * {
    flex-basis: 100% !important;
  }
}

/* ============================================================
   模块 41 · 导航下拉面板零留白 (2026-09-05)
   问题：mega-panel-grid 固定 3 列，子项数非 3 倍数时（資訊動態
   2 项、關於我們 5 项、工程案例 17 项）末行右侧出现空槽。
   方案：改为弹性布局——每项基础宽度 1/3 行，末行自动等分铺满
   整行宽度，任何子项数都不再产生右侧空白（与模块 21 规范一致）。
   ============================================================ */
body.premium .mega-panel-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  column-gap: 6px !important;
  row-gap: 2px !important;
}
body.premium .mega-panel-grid > .mega-panel-link {
  flex-grow: 1 !important;
  flex-shrink: 0 !important;
  flex-basis: calc((100% - 12px) / 3) !important;
  box-sizing: border-box;
}

/* ============================================================
   模块 42 · 常見問題（FAQ）分類與快捷跳轉 (2026-09-05)
   10 大分類 / 112 條問答：分類標題 + 錨點 chips 區，chips 自動
   換行鋪滿整行（不產生右側留白），配色沿用全站金/深藍規範。
   ============================================================ */
.faq-intro { margin-bottom: 22px; }
.faq-intro-title { font-family: var(--font-heading, 'Playfair Display', serif); font-size: 1.5rem; font-weight: 700; color: #1A1A2E; margin: 0 0 8px; }
.faq-intro-desc { font-size: 0.92rem; color: #5c574f; line-height: 1.8; margin: 0; max-width: 100%; }

.faq-chips {
  display: flex; flex-wrap: wrap;
  column-gap: 10px; row-gap: 10px;
  margin: 0 0 34px;
}
.faq-chip {
  flex: 1 1 auto;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px;
  background: #FAF8F5;
  border: 1px solid rgba(26,26,46,0.10);
  border-radius: 24px;
  color: #1A1A2E;
  font-size: 0.85rem; font-weight: 600;
  text-decoration: none;
  transition: all .25s ease;
  white-space: nowrap;
}
.faq-chip:hover { background: #C9A84C; border-color: #C9A84C; color: #fff; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(201,168,76,0.22); }
.faq-chip-num { font-family: var(--font-heading, 'Playfair Display', serif); color: #C9A84C; font-weight: 700; font-size: 0.95rem; }
.faq-chip:hover .faq-chip-num { color: #fff; }

.faq-cat-title {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--font-heading, 'Playfair Display', serif);
  font-size: 1.22rem; font-weight: 700; color: #1A1A2E;
  margin: 42px 0 18px;
  padding-bottom: 12px;
  border-bottom: 2px solid rgba(201,168,76,0.55);
  scroll-margin-top: 100px;
}
.faq-cat-num { color: #C9A84C; font-size: 1.3rem; }
.faq-category { display: block; }
@media (max-width: 640px) {
  .faq-chip { flex: 1 1 100%; justify-content: flex-start; }
  .faq-cat-title { font-size: 1.06rem; }
}

/* ============================================================
   模块 43 · 产品画廊网格：5 列桌面 / 2 列手机 (2026-09-05)
   「石材鉴赏」12 子菜单已生成专属 11 张唯一高清大理石图，
   桌面排成 5 列、小屏自动降为 2 列，整行等宽无右侧留白。
   产品画廊不属于通用引擎（每页 11 张固定，主观设计 5×2），
   故显式 grid-template-columns 覆写，不依赖 --c 注入。
   ============================================================ */
.product-gallery-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 18px !important;
}
.product-gallery-grid > .product-gallery-item {
  margin: 0 !important;
  width: auto !important;
  flex: none !important;
  flex-basis: auto !important;
}
@media (max-width: 1024px) {
  .product-gallery-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 640px) {
  .product-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; }
}

/* ============================================================
   45. 苹果式导航栏（Apple-like Navbar，2026-09-06）
   - 顶部固定：毛玻璃背景 saturate+blur、发丝分割线、瘦条 48px
   - 滚动时正确定位顶部，不挤占/不跳动，锚点滚动留出导航高度
   - 桌面端（≥1161px）紧凑排版：窄窗口按 clamp 连续收缩，
     配合 EN 菜单标准简称，任何宽度全部菜单项可见可点
   - ≤1160px 启用右侧抽屉菜单（断点 900→1160，js/main 同步）
   ============================================================ */
html { scroll-padding-top: 64px; }
body.premium .navbar {
  height: 48px;
  background: rgba(245, 241, 234, 0.78);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  box-shadow: none;
  border-bottom: 1px solid rgba(26, 26, 46, 0.08);
}
body.premium .navbar.scrolled {
  background: rgba(245, 241, 234, 0.92);
  box-shadow: 0 1px 0 rgba(26, 26, 46, 0.06);
}
/* 桌面端：容器加宽 + 紧凑排版（12.5px 菜单字号，间距随视口收缩） */
@media (min-width: 1161px) {
  body.premium .navbar .container { max-width: 1400px; }
  body.premium .nav-links { gap: clamp(12px, 1.6vw, 26px); }
  body.premium .nav-links > a,
  body.premium .nav-dropdown > a { font-size: 12.5px; }
  body.premium .nav-logo { margin-right: 18px; gap: 8px; }
  body.premium .nav-logo img { height: 32px; }
  body.premium .nav-logo-text strong { font-size: 0.72rem; letter-spacing: 0.2px; }
  body.premium .nav-logo-text small { font-size: 0.52rem; }
  body.premium .nav-dropdown > a::after { font-size: 9px; }
  body.premium .lang-switch { margin-left: 6px; }
  body.premium .lang-switch a { font-size: 11.5px; }
}
/* ≤1160px：抽屉菜单（规则与原 900px 断点一致，断点提升） */
@media (max-width: 1160px) {
  body.premium .navbar .nav-toggle { display: flex !important; }
  body.premium .navbar .nav-links {
    position: fixed !important;
    top: 0; right: -100% !important;
    width: 300px; height: 100vh;
    background: #F5F0EB;
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 72px 24px 32px !important;
    gap: 0 !important;
    transition: right 0.4s ease;
    z-index: 999;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    pointer-events: none;
  }
  body.premium .navbar .nav-links.open { right: 0 !important; pointer-events: auto !important; }
  body.premium .navbar .nav-links a {
    color: var(--color-primary) !important;
    padding: 13px 0 !important;
    font-size: 15px !important;
    border-bottom: 1px solid rgba(26,26,46,0.08) !important;
    width: 100% !important;
  }
  body.premium .navbar .nav-links a::after { display: none !important; }
  body.premium .navbar .mega-panel,
  body.premium .navbar .dropdown-panel {
    display: none;
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    box-shadow: none;
    border: none;
    border-radius: 0;
    background: rgba(0,0,0,0.02);
    padding: 0 0 0 16px;
    margin: 0;
    min-width: 0;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
  }
  body.premium .navbar .nav-dropdown.mobile-open .mega-panel,
  body.premium .navbar .nav-dropdown.mobile-open .dropdown-panel {
    display: block;
    max-height: none;
    padding: 8px 0 8px 16px;
  }
  
  
  body.premium .navbar .nav-dropdown > a::after {
    display: inline-block !important;
    transition: transform 0.3s ease;
  }
  body.premium .navbar .nav-dropdown.mobile-open > a::after { transform: rotate(180deg) !important; }
  body.premium .navbar .mega-panel-grid { grid-template-columns: 1fr !important; gap: 0 !important; }
  body.premium .navbar .mega-panel-link { padding: 10px 0 !important; border-bottom: 1px solid rgba(0,0,0,0.06) !important; width: 100% !important; font-size: 14px !important; }
  body.premium .navbar .mega-panel-icon { width: 36px; height: 36px; }
  body.premium .navbar .mega-panel-icon img { width: 36px; height: 36px; }
  body.premium .navbar .mega-panel-text span { font-size: 0.7rem; }
  body.premium .navbar .dropdown-item { padding: 10px 0 !important; border-bottom: 1px solid rgba(0,0,0,0.06) !important; width: 100% !important; }
  body.premium .navbar .lang-switch {
    border: none;
    border-top: 1px solid rgba(26,26,46,0.1);
    padding-top: 20px !important;
    margin-left: 0 !important;
    margin-top: 16px;
  }
  body.premium .navbar .lang-switch a { font-size: 14px !important; }

  /* —— 45.1 移动抽屉修正（2026-09-06）：修复基础样式残留冲突 ——
     问题1 乱码：base .nav-links::after content 已在源头删除，此处双保险封杀
     问题2 对齐：base 将顶级 <a> 设为 flex 居中 + min-height 56px，
          导致「首頁/解決方案/聯繫我們」居中、其余左对齐、行高不一
     问题3 重叠：base .nav-links::before 自带黑幕与 .nav-overlay 遮罩双重叠加 */
  body.premium .navbar .nav-links::before,
  body.premium .navbar .nav-links::after { content: none !important; }

  body.premium .navbar .nav-links > a,
  body.premium .navbar .nav-links > .nav-dropdown > a {
    text-align: left !important;
    justify-content: flex-start !important;
    align-items: center !important;
    min-height: 0 !important;
    border-radius: 0 !important;
  }

  /* active/hover 态统一：金色文字 + 左侧金条，去掉胶囊底色与居中金线 */
  body.premium .navbar .nav-links > a.active,
  body.premium .navbar .nav-links > a:hover,
  body.premium .navbar .nav-links > .nav-dropdown > a.active,
  body.premium .navbar .nav-links > .nav-dropdown:hover > a {
    color: #C9A84C !important;
    background: transparent !important;
  }
  body.premium .navbar .nav-links > a.active::before {
    content: '' !important;
    position: absolute !important;
    left: -24px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 3px !important;
    height: 22px !important;
    background: #C9A84C !important;
    border-radius: 0 2px 2px 0 !important;
    bottom: auto !important;
  }

  /* 抽屉本体：dvh 适配移动端地址栏、限宽、轻阴影 */
  body.premium .navbar .nav-links {
    height: 100dvh;
    max-width: 86vw;
    box-shadow: -12px 0 40px rgba(26,26,46,0.18);
  }

  /* 语言切换：左对齐轻量文本式，替代 base 大药丸 */
  body.premium .navbar .lang-switch {
    justify-content: flex-start !important;
    gap: 4px !important;
    margin-left: 0 !important;
    margin-right: 24px !important;
  }
  body.premium .navbar .lang-switch a {
    min-width: 0 !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
  }
  body.premium .navbar .lang-switch a.active {
    color: #1A1A2E !important;
    background: rgba(201,168,76,0.18) !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   Module 46: FAQ v2 — 合并版常见问题页 (2026-09-06)
   solutions 侧 FAQ 已全部并入 faq.html / en/faq.html
   ═══════════════════════════════════════════════════════════ */
.faqv2-hero{background:linear-gradient(135deg,#15152b 0%,#1e1e3a 55%,#26264a 100%);position:relative;overflow:hidden;padding:88px 0 72px;text-align:center;color:#fff;}
.faqv2-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(600px 300px at 15% 20%,rgba(201,168,76,0.18),transparent 60%),radial-gradient(500px 260px at 85% 75%,rgba(201,168,76,0.12),transparent 60%);pointer-events:none;}
.faqv2-hero .container{position:relative;z-index:1;}
.faqv2-kicker{display:inline-block;font-size:12px;letter-spacing:3px;color:#C9A84C;border:1px solid rgba(201,168,76,0.4);border-radius:999px;padding:6px 16px;margin-bottom:18px;}
.faqv2-hero h1{font-size:clamp(30px,4.4vw,46px);font-weight:800;margin:0 0 14px;color:#fff;}
.faqv2-hero-sub{max-width:760px;margin:0 auto 30px;color:rgba(255,255,255,0.72);font-size:15.5px;line-height:1.8;}
.faqv2-hero-sub strong{color:#C9A84C;}
.faqv2-search{max-width:640px;margin:0 auto;display:flex;align-items:center;gap:10px;background:#fff;border-radius:999px;padding:6px 22px;box-shadow:0 10px 30px rgba(0,0,0,0.25);}
.faqv2-search svg{color:#9a938a;flex:none;}
.faqv2-search input{flex:1;border:none;outline:none;font-size:15px;padding:12px 0;background:transparent;color:#1A1A2E;min-width:0;}
.faqv2-search input::placeholder{color:#b3aca2;}
.faqv2-stats{display:flex;justify-content:center;gap:14px;margin-top:34px;flex-wrap:wrap;}
.faqv2-stat{background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.14);border-radius:14px;padding:14px 26px;min-width:120px;}
.faqv2-stat strong{display:block;font-size:26px;font-weight:800;color:#C9A84C;}
.faqv2-stat span{font-size:12.5px;color:rgba(255,255,255,0.65);letter-spacing:1px;}
.faqv2-subnav{position:sticky;top:48px;z-index:900;background:rgba(250,249,247,0.92);-webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px);border-bottom:1px solid rgba(26,26,46,0.08);padding:10px 0;}
.faqv2-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;}
.faqv2-chips::-webkit-scrollbar{display:none;}
.faqv2-chip{flex:none;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;border:1px solid rgba(26,26,46,0.12);background:#fff;color:#43404a;font-size:13px;text-decoration:none;transition:all .2s ease;white-space:nowrap;}
.faqv2-chip-num{font-size:11px;font-weight:700;color:#C9A84C;}
.faqv2-chip:hover{border-color:#C9A84C;color:#1A1A2E;transform:translateY(-1px);}
.faqv2-chip.active{background:#1A1A2E;border-color:#1A1A2E;color:#fff;}
.faqv2-chip.active .faqv2-chip-num{color:#C9A84C;}
.faqv2-body{background:#faf9f7;}
.faqv2-result-info{background:#fff;border:1px solid rgba(201,168,76,0.35);border-left:4px solid #C9A84C;border-radius:10px;padding:12px 18px;font-size:14px;color:#1A1A2E;margin:0 0 22px;}
.faqv2-cat{margin-bottom:46px;scroll-margin-top:120px;}
.faqv2-cat-head{display:flex;align-items:center;gap:16px;padding:20px 0 14px;border-bottom:2px solid #1A1A2E;margin-bottom:20px;}
.faqv2-cat-num{font-size:34px;font-weight:800;color:transparent;-webkit-text-stroke:1.5px #C9A84C;line-height:1;flex:none;}
.faqv2-cat-text h2{margin:0;font-size:22px;font-weight:700;color:#1A1A2E;}
.faqv2-cat-text p{margin:4px 0 0;font-size:12.5px;color:#8a847b;letter-spacing:.5px;}
.faqv2-cat-count{margin-left:auto;flex:none;font-size:12px;font-weight:600;color:#C9A84C;background:rgba(201,168,76,0.12);border:1px solid rgba(201,168,76,0.3);border-radius:999px;padding:4px 12px;}
.faqv2-items .faq-item{background:#fff;box-shadow:0 1px 3px rgba(26,26,46,0.05);}
.faqv2-empty{text-align:center;padding:40px 20px;background:#fff;border:1px dashed rgba(26,26,46,0.2);border-radius:14px;color:#6b665e;font-size:15px;}
.faqv2-empty a{color:#C9A84C;font-weight:600;text-decoration:none;}
.faqv2-channels{margin-top:56px;}
.faqv2-channels .section-header-center{margin-bottom:28px;}
.faqv2-channels .section-header-center p{color:#6b665e;font-size:14.5px;max-width:640px;margin:10px auto 0;line-height:1.7;}
.faqv2-channel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;}
.faqv2-channel{display:flex;flex-direction:column;gap:8px;background:#1A1A2E;color:#fff;border-radius:16px;padding:26px 22px;text-decoration:none;position:relative;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;}
.faqv2-channel::after{content:'';position:absolute;inset:0;background:radial-gradient(280px 160px at 85% -10%,rgba(201,168,76,0.25),transparent 65%);pointer-events:none;}
.faqv2-channel:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(26,26,46,0.25);}
.faqv2-ch-icon{font-size:30px;line-height:1;}
.faqv2-channel h3{margin:0;font-size:17px;color:#fff;}
.faqv2-channel p{margin:0;font-size:12.5px;color:rgba(255,255,255,0.66);line-height:1.7;}
.faqv2-ch-link{margin-top:auto;font-size:13px;font-weight:600;color:#C9A84C;}
.faqv2-cta{text-align:center;background:linear-gradient(135deg,#1A1A2E,#26264a);border-radius:20px;padding:48px 28px;margin-top:56px;color:#fff;position:relative;overflow:hidden;}
.faqv2-cta::before{content:'';position:absolute;inset:0;background:radial-gradient(420px 200px at 50% 0%,rgba(201,168,76,0.2),transparent 65%);}
.faqv2-cta>*{position:relative;}
.faqv2-cta h2{font-size:26px;font-weight:800;margin:0 0 10px;color:#fff;}
.faqv2-cta p{max-width:560px;margin:0 auto 24px;color:rgba(255,255,255,0.7);font-size:14.5px;line-height:1.8;}
.faqv2-cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.faqv2-cta .btn-primary{background:#C9A84C;color:#15152b;border:none;padding:12px 30px;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .2s;}
.faqv2-cta .btn-primary:hover{transform:translateY(-2px);}
.faqv2-cta .btn-outline{border:1px solid rgba(255,255,255,0.4);color:#fff;padding:12px 30px;border-radius:999px;font-weight:600;text-decoration:none;transition:border-color .2s;}
.faqv2-cta .btn-outline:hover{border-color:#C9A84C;color:#C9A84C;}
@media(max-width:768px){
  .faqv2-hero{padding:64px 0 52px;}
  .faqv2-cat-head{flex-wrap:wrap;gap:10px;}
  .faqv2-cat-num{font-size:26px;}
  .faqv2-stat{min-width:104px;padding:12px 18px;}
  .faqv2-stat strong{font-size:21px;}
  .faqv2-cta{padding:36px 18px;}
}
/* Module 46 补丁: hero 标题防全局样式覆盖 */
.faqv2-hero h1,.faqv2-cta h2{color:#fff !important;}
.faqv2-hero h1{font-weight:800 !important;}
/* Module 46 补丁2: 提升优先级压过 body.premium h1 */
body.premium .faqv2-hero h1,body.premium .faqv2-cta h2{color:#fff !important;}



/* ═══════════════════════════════════════════════════════════
   Module 47: 导航高亮修正 (2026-09-06) — 子菜单当前页条目
   ═══════════════════════════════════════════════════════════ */
.navbar .mega-panel-link.active .mega-panel-text strong{color:#C9A84C !important;}
.navbar .mega-panel-link.active{opacity:1;}

/* ═══════════════════════════════════════════════════════════
   Module 48: 全站按钮统一 — 白底黑字黄框 (2026-09-06)
   覆盖: .btn 系列 / .hsst-btn / .hsst-form-btn / .product-action-btn
         .compare-panel-btn / .cookie-btn-* / 筛选按钮 / PWA 按钮
         button[type=submit] / .back-to-top / .whatsapp-float
   状态: hover 高亮(边框加粗+金影+浮起, 保持白底黑字黄框)
         / active 按压 / focus-visible 双环焦点 / disabled 禁用。
   注: .faq-q(手风琴行)、.nav-toggle(汉堡)、.image-modal-close/
       prev/next(预览控件)为功能性控件, 非操作按钮, 不在统一范围。
   ═══════════════════════════════════════════════════════════ */
body.premium .btn, body.premium .btn-primary, body.premium .btn-gold, body.premium .btn-secondary,
body.premium .btn-outline, body.premium .btn-outline-light, body.premium .btn-outline-white, body.premium .btn-white,
body.premium .hsst-btn, body.premium .hsst-form-btn,
body.premium .product-action-btn, body.premium .compare-panel-btn,
body.premium .cookie-btn-accept, body.premium .cookie-btn-decline,
body.premium .filter-btn, body.premium .news-filter-btn,
body.premium .pwa-install-btn, body.premium .pwa-guide-close,
body.premium button[type="submit"], body.premium input[type="submit"], body.premium input[type="button"],
body.premium .back-to-top, body.premium .whatsapp-float,
body.premium .hero-grid-video .hero-buttons .btn-primary,
body.premium .hero-grid-video .hero-buttons .btn-outline-light,
body.premium .hsst-form-zone .inquiry-form button[type="submit"],
body.premium .products-cta button[type="submit"] {
  background: #fff !important;
  color: #1A1A2E !important;
  border: 1.5px solid #C9A84C !important;
  text-decoration: none !important;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}
/* hover: 边框加粗(box-shadow 模拟, 不引起布局位移) + 金色投影 + 浮起 */
body.premium .btn:hover, body.premium .btn-primary:hover, body.premium .btn-gold:hover, body.premium .btn-secondary:hover,
body.premium .btn-outline:hover, body.premium .btn-outline-light:hover, body.premium .btn-outline-white:hover, body.premium .btn-white:hover,
body.premium .hsst-btn:hover, body.premium .hsst-form-btn:hover,
body.premium .product-action-btn:hover, body.premium .compare-panel-btn:hover,
body.premium .cookie-btn-accept:hover, body.premium .cookie-btn-decline:hover,
body.premium .filter-btn:hover, body.premium .news-filter-btn:hover,
body.premium .pwa-install-btn:hover, body.premium .pwa-guide-close:hover,
body.premium button[type="submit"]:hover, body.premium input[type="submit"]:hover, body.premium input[type="button"]:hover,
body.premium .back-to-top:hover, body.premium .whatsapp-float:hover,
body.premium .hero-grid-video .hero-buttons .btn-primary:hover,
body.premium .hero-grid-video .hero-buttons .btn-outline-light:hover,
body.premium .hsst-form-zone .inquiry-form button[type="submit"]:hover,
body.premium .products-cta button[type="submit"]:hover {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  box-shadow: inset 0 0 0 1px #C9A84C, 0 8px 22px rgba(201, 168, 76, 0.35) !important;
  transform: translateY(-2px) !important;
}
/* active: 明确按压反馈 — 回缩贴底, 保留加粗边框 */
body.premium .btn:active, body.premium .btn-primary:active, body.premium .btn-gold:active,
body.premium .btn-outline:active, body.premium .btn-outline-light:active, body.premium .btn-outline-white:active,
body.premium .btn-white:active, body.premium .hsst-btn:active, body.premium .hsst-form-btn:active,
body.premium .product-action-btn:active, body.premium .compare-panel-btn:active,
body.premium .cookie-btn-accept:active, body.premium .cookie-btn-decline:active,
body.premium .filter-btn:active, body.premium .news-filter-btn:active,
body.premium .pwa-install-btn:active, body.premium .pwa-guide-close:active,
body.premium button[type="submit"]:active, body.premium input[type="submit"]:active, body.premium input[type="button"]:active,
body.premium .back-to-top:active, body.premium .whatsapp-float:active,
body.premium .hero-grid-video .hero-buttons .btn-primary:active,
body.premium .hero-grid-video .hero-buttons .btn-outline-light:active,
body.premium .hsst-form-zone .inquiry-form button[type="submit"]:active,
body.premium .products-cta button[type="submit"]:active {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  box-shadow: inset 0 0 0 1.5px #C9A84C !important;
  transform: scale(0.96) !important;
}
/* focus-visible: 白色内环 + 金色外环, 焦点指示清晰 */
body.premium .btn:focus-visible, body.premium .btn-primary:focus-visible, body.premium .btn-gold:focus-visible,
body.premium .btn-outline:focus-visible, body.premium .btn-outline-light:focus-visible, body.premium .btn-outline-white:focus-visible,
body.premium .btn-white:focus-visible, body.premium .hsst-btn:focus-visible, body.premium .hsst-form-btn:focus-visible,
body.premium .product-action-btn:focus-visible, body.premium .compare-panel-btn:focus-visible,
body.premium .cookie-btn-accept:focus-visible, body.premium .cookie-btn-decline:focus-visible,
body.premium .filter-btn:focus-visible, body.premium .news-filter-btn:focus-visible,
body.premium .pwa-install-btn:focus-visible, body.premium .pwa-guide-close:focus-visible,
body.premium button[type="submit"]:focus-visible, body.premium input[type="submit"]:focus-visible, body.premium input[type="button"]:focus-visible,
body.premium .back-to-top:focus-visible, body.premium .whatsapp-float:focus-visible,
body.premium .hero-grid-video .hero-buttons .btn-primary:focus-visible,
body.premium .hero-grid-video .hero-buttons .btn-outline-light:focus-visible,
body.premium .hsst-form-zone .inquiry-form button[type="submit"]:focus-visible,
body.premium .products-cta button[type="submit"]:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px #C9A84C !important;
}
/* disabled: 降低不透明度, 禁止交互反馈, 保持白底黑字黄框 */
body.premium .btn:disabled, body.premium .btn-primary:disabled, body.premium .btn-gold:disabled,
body.premium .btn-outline:disabled, body.premium .btn-outline-light:disabled, body.premium .btn-outline-white:disabled,
body.premium .btn-white:disabled, body.premium .hsst-btn:disabled, body.premium .hsst-form-btn:disabled,
body.premium .product-action-btn:disabled, body.premium .compare-panel-btn:disabled,
body.premium .filter-btn:disabled, body.premium .news-filter-btn:disabled,
body.premium .pwa-install-btn:disabled, body.premium .pwa-guide-close:disabled,
body.premium button[type="submit"]:disabled, body.premium input[type="submit"]:disabled, body.premium input[type="button"]:disabled,
body.premium .hero-grid-video .hero-buttons .btn-primary:disabled,
body.premium .hsst-form-btn[disabled], body.premium button[disabled][type="submit"],
body.premium input[disabled][type="submit"], body.premium input[disabled][type="button"],
body.premium .hsst-form-zone .inquiry-form button[type="submit"]:disabled,
body.premium .products-cta button[type="submit"]:disabled {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}
/* .btn 扫光高亮层: 金色 → 淡金, 与新风格协调 */
body.premium .btn::after { background: rgba(201,168,76,0.10) !important; }
/* 浮动圆形按钮: 白底 + 黑色图标 + 黄色边框 */
body.premium .back-to-top { color: #1A1A2E !important; }
body.premium .back-to-top:hover { transform: translateY(-3px) !important; }
body.premium .whatsapp-float { color: #1A1A2E !important; }
body.premium .back-to-top svg, body.premium .whatsapp-float svg { fill: currentColor !important; }

/* ── Module 48 补遗: 高优先级按钮家族 (v2-btn / product-action-bar) ── */
body.premium .v2-btn, body.premium .v2-btn.gold, body.premium .v2-qbtns .v2-btn, body.premium .v2-qbtns .v2-btn:not(.gold),
body.premium .product-action-bar .product-action-btn, body.premium .product-action-bar .product-action-btn.sample,
body.premium .product-action-bar .product-action-btn.inquire, body.premium .product-action-bar .product-action-btn.compare {
  background: #fff !important;
  color: #1A1A2E !important;
  border: 1.5px solid #C9A84C !important;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}
body.premium .v2-btn:hover, body.premium .v2-btn.gold:hover, body.premium .v2-qbtns .v2-btn:hover, body.premium .v2-qbtns .v2-btn:not(.gold):hover,
body.premium .product-action-bar .product-action-btn:hover, body.premium .product-action-bar .product-action-btn.sample:hover,
body.premium .product-action-bar .product-action-btn.inquire:hover, body.premium .product-action-bar .product-action-btn.compare:hover {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  box-shadow: inset 0 0 0 1px #C9A84C, 0 8px 22px rgba(201, 168, 76, 0.35) !important;
  transform: translateY(-2px) !important;
}
body.premium .v2-btn:active, body.premium .v2-btn.gold:active, body.premium .v2-qbtns .v2-btn:active,
body.premium .product-action-bar .product-action-btn:active, body.premium .product-action-bar .product-action-btn.sample:active,
body.premium .product-action-bar .product-action-btn.inquire:active, body.premium .product-action-bar .product-action-btn.compare:active {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  box-shadow: inset 0 0 0 1.5px #C9A84C !important;
  transform: scale(0.96) !important;
}
body.premium .v2-btn:focus-visible, body.premium .v2-btn.gold:focus-visible, body.premium .v2-qbtns .v2-btn:focus-visible,
body.premium .product-action-bar .product-action-btn:focus-visible, body.premium .product-action-bar .product-action-btn.sample:focus-visible,
body.premium .product-action-bar .product-action-btn.inquire:focus-visible, body.premium .product-action-bar .product-action-btn.compare:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px #C9A84C !important;
}
body.premium .v2-btn:disabled, body.premium .v2-btn.gold:disabled,
body.premium .product-action-bar .product-action-btn:disabled, body.premium .product-action-bar .product-action-btn.sample:disabled,
body.premium .product-action-bar .product-action-btn.inquire:disabled, body.premium .product-action-bar .product-action-btn.compare:disabled {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}
/* v2 页深色板块内的 action-bar 覆盖层(金色扫光)重置 */
body.premium .product-action-bar .product-action-btn::after,
body.premium .product-action-bar .product-action-btn.inquire::after { background: rgba(201,168,76,0.10) !important; }

/* ── Module 48 补遗 2: 页内 style 定义的按钮家族 ── */
body.premium .btn-filled, body.premium .btn-ghost,
body.premium .filter-tag, body.premium .filter-tag.active,
body.premium .compare-panel-clear,
body.premium .cta-section.cta-home .hsst-form-btn, body.premium .hsst-form-zone .hsst-form-btn, body.premium .v2-quote .hsst-form-btn {
  background: #fff !important;
  color: #1A1A2E !important;
  border: 1.5px solid #C9A84C !important;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}
body.premium .btn-filled:hover, body.premium .btn-ghost:hover,
body.premium .filter-tag:hover, body.premium .filter-tag.active:hover,
body.premium .compare-panel-clear:hover,
body.premium .cta-section.cta-home .hsst-form-btn:hover, body.premium .hsst-form-zone .hsst-form-btn:hover, body.premium .v2-quote .hsst-form-btn:hover {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  box-shadow: inset 0 0 0 1px #C9A84C, 0 8px 22px rgba(201, 168, 76, 0.35) !important;
  transform: translateY(-2px) !important;
}
body.premium .btn-filled:active, body.premium .btn-ghost:active, body.premium .filter-tag:active, body.premium .filter-tag.active:active,
body.premium .compare-panel-clear:active,
body.premium .cta-section.cta-home .hsst-form-btn:active, body.premium .hsst-form-zone .hsst-form-btn:active, body.premium .v2-quote .hsst-form-btn:active {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  box-shadow: inset 0 0 0 1.5px #C9A84C !important;
  transform: scale(0.96) !important;
}
body.premium .btn-filled:focus-visible, body.premium .btn-ghost:focus-visible, body.premium .filter-tag:focus-visible,
body.premium .compare-panel-clear:focus-visible,
body.premium .cta-section.cta-home .hsst-form-btn:focus-visible, body.premium .hsst-form-zone .hsst-form-btn:focus-visible, body.premium .v2-quote .hsst-form-btn:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px #C9A84C !important;
}
body.premium .btn-filled:disabled, body.premium .btn-ghost:disabled, body.premium .filter-tag:disabled,
body.premium .cta-section.cta-home .hsst-form-btn:disabled, body.premium .hsst-form-zone .hsst-form-btn:disabled, body.premium .v2-quote .hsst-form-btn:disabled {
  background: #fff !important;
  color: #1A1A2E !important;
  border-color: #C9A84C !important;
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}


/* ============================================================
   Module 50: 移动抽屉子菜单双列化 (2026-09-06)
   - 修复：產品中心(12项)/工程案例(17项)单列展开后「瀏覽全部」被推出
     视口，点击落空或错位（现象为跳转到错误页面）
   - 双列紧凑网格使全部子项 + viewall 在一屏内完整可见、可点
   - touch-action: manipulation 消除移动端点击延迟/缩放干扰
   ============================================================ */
@media (max-width: 1160px) {
  body.premium .navbar .mega-panel-grid {
    display: grid !important; /* 覆盖 base ≤900px 的 display:flex，否则双列模板无效 */
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0 10px !important;
  }
  body.premium .navbar .nav-links .mega-panel-link {
    padding: 9px 10px !important;
    width: auto !important;
  }
  body.premium .navbar .nav-links .mega-panel-icon,
  body.premium .navbar .nav-links .mega-panel-icon img {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 8px;
  }
  body.premium .navbar .mega-panel-text { gap: 2px; }
  body.premium .navbar .mega-panel-text strong { font-size: 0.82rem !important; }
  body.premium .navbar .mega-panel-text span { font-size: 0.6rem !important; }
  body.premium .navbar .nav-links .dropdown-item {
    padding: 9px 10px !important;
    width: auto !important;
  }
  /* 触摸优化：消除点击延迟，避免滚动/动画中的 tap 错位 */
  body.premium .navbar .nav-links a,
  body.premium .navbar .mega-panel-viewall a {
    touch-action: manipulation;
  }
}

/* ============================================================
   Module 50.1: 抽屉打开时隐藏底部浮层 (2026-09-06)
   - cookie-banner z-index 2000、pwa-install-btn 9990、whatsapp-float 1500
     均高于抽屉(999)，固定在底部会拦截「瀏覽全部」等抽屉底部元素点击
   - 抽屉打开期间统一隐藏，关闭后恢复
   ============================================================ */
body.drawer-open .cookie-banner,
body.drawer-open .whatsapp-float,
body.drawer-open .back-to-top,
body.drawer-open .pwa-install-btn {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 0.25s ease;
}

/* ============================================================
   Module 51: 移动抽屉子菜单末行单项铺满 (2026-09-06)
   - viewall 入口已全站删除（子项全量直出），此处同步移除其样式依赖
   - 双列网格中若最后一行只剩一项（奇数位末项），横向铺满整行，
     与上一行对齐协调；整行/整对排列不受影响
   ============================================================ */
@media (max-width: 1160px) {
  body.premium .navbar .mega-panel-grid .mega-panel-link:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
  /* 触屏粘滞 hover 会触发桌面下划线动画 :hover::after{width:100%}，
     把箭头三角形拉成长条并挤换行 trigger 文字——此处锁死箭头尺寸 */
  body.premium .navbar .nav-links .nav-dropdown > a::after {
    width: 0 !important;
    height: 0 !important;
    flex: none !important;
    align-self: center !important;
    border-left: 5px solid transparent !important;
    border-right: 5px solid transparent !important;
    border-top: 5px solid currentColor !important;
    border-bottom: 0 !important;
    background: transparent !important;
    position: static !important;
    margin: 0 0 0 6px !important;
  }
  body.premium .navbar .nav-links > .nav-dropdown > a {
    white-space: nowrap;
  }
}

/* ============================================================
   Module 52: 工程案例页 v2 视觉系统 (2026-09-06)
   - 七大板块（概览/选材/实景/施工/安装/产品/技术）统一视觉语言
   - 深色数据带 + 金色点缀 + 图片悬停缩放 + 编号卡片，视觉冲击力优先
   ============================================================ */
.cs2-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:3px;color:#C9A84C;text-transform:uppercase;}
.cs2-kicker::before{content:'';width:28px;height:2px;background:#C9A84C;}
.cs2-head{text-align:center;max-width:820px;margin:0 auto 52px;}
.cs2-title{font-size:clamp(28px,3.4vw,42px);font-weight:800;color:#1A1A2E;margin:14px 0 16px;letter-spacing:.5px;}
.cs2-desc{font-size:15.5px;line-height:1.9;color:#5c5a66;margin:0;}
.cs2-facts{display:grid;grid-template-columns:repeat(4,1fr);background:linear-gradient(135deg,#15152b,#232346);border-radius:18px;overflow:hidden;box-shadow:0 20px 50px rgba(21,21,43,.25);}
.cs2-fact{padding:30px 18px;text-align:center;border-right:1px solid rgba(255,255,255,.07);}
.cs2-fact:last-child{border-right:none;}
.cs2-fact .ic{font-size:24px;}
.cs2-fact .num{font-size:26px;font-weight:800;color:#C9A84C;margin:8px 0 4px;font-family:'Inter Tight',sans-serif;}
.cs2-fact .lab{font-size:12.5px;color:rgba(255,255,255,.65);letter-spacing:1px;}
.cs2-overview-hero{display:grid;grid-template-columns:1.15fr 1fr;border-radius:20px;overflow:hidden;box-shadow:0 24px 60px rgba(26,26,46,.18);margin-top:44px;background:#fff;}
.cs2-overview-media{position:relative;min-height:380px;}
.cs2-overview-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.cs2-overview-media .tag{position:absolute;left:22px;bottom:22px;background:rgba(21,21,43,.82);color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;backdrop-filter:blur(6px);}
.cs2-overview-media .tag strong{color:#C9A84C;}
.cs2-overview-body{padding:44px 42px;display:flex;flex-direction:column;justify-content:center;}
.cs2-overview-body h3{font-size:21px;font-weight:800;color:#1A1A2E;margin:0 0 14px;}
.cs2-overview-body p{font-size:14.5px;line-height:2;color:#55525e;margin:0 0 12px;}
.cs2-chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px;}
.cs2-chip{font-size:12.5px;font-weight:600;color:#1A1A2E;background:rgba(201,168,76,.14);border:1px solid rgba(201,168,76,.45);border-radius:999px;padding:7px 15px;}
.cs2-mat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.cs2-mat-card{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 12px 34px rgba(26,26,46,.10);transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column;}
.cs2-mat-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(26,26,46,.16);}
.cs2-mat-card .ph{position:relative;aspect-ratio:4/3;overflow:hidden;}
.cs2-mat-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.cs2-mat-card:hover .ph img{transform:scale(1.07);}
.cs2-mat-card .ph .badge{position:absolute;top:14px;left:14px;background:rgba(21,21,43,.85);color:#C9A84C;font-size:11.5px;font-weight:700;letter-spacing:1px;padding:6px 12px;border-radius:8px;}
.cs2-mat-body{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1;}
.cs2-mat-body .nm{font-size:19px;font-weight:800;color:#1A1A2E;}
.cs2-mat-body .og{font-size:12.5px;color:#8a8794;margin:5px 0 14px;}
.cs2-mat-spec{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;font-size:12.8px;margin-bottom:14px;}
.cs2-mat-spec .k{color:#9a97a3;font-weight:600;}
.cs2-mat-spec .v{color:#3c3a46;font-weight:600;}
.cs2-mat-body .ds{font-size:13.5px;line-height:1.9;color:#55525e;margin-bottom:18px;}
.cs2-mat-body .lk{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:#A8863B;text-decoration:none;}
.cs2-mat-body .lk:hover{color:#8A6D2F;}
.cs2-gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.cs2-gal{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3;cursor:zoom-in;display:block;}
.cs2-gal img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.cs2-gal:hover img{transform:scale(1.08);}
.cs2-gal .cap{position:absolute;inset:auto 0 0 0;padding:34px 18px 14px;background:linear-gradient(180deg,transparent,rgba(21,21,43,.88));color:#fff;font-size:13px;font-weight:600;letter-spacing:.3px;}
.cs2-gal .cap span{display:block;font-weight:400;font-size:11.5px;color:rgba(255,255,255,.72);margin-top:3px;}
.cs2-gal .cap .no{color:#C9A84C;font-family:'Inter Tight',sans-serif;font-weight:800;margin-right:6px;}
.cs2-proc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.cs2-proc{background:#fff;border-radius:18px;padding:30px 28px;box-shadow:0 12px 34px rgba(26,26,46,.10);position:relative;overflow:hidden;}
.cs2-proc::before{content:'';position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#C9A84C,#E8D9AE);}
.cs2-proc .stage{font-size:44px;font-weight:800;color:transparent;-webkit-text-stroke:1.5px #C9A84C;font-family:'Inter Tight',sans-serif;line-height:1;}
.cs2-proc h4{font-size:17px;font-weight:800;color:#1A1A2E;margin:14px 0 10px;}
.cs2-proc .ph{border-radius:12px;overflow:hidden;margin-bottom:16px;aspect-ratio:16/10;}
.cs2-proc .ph img{width:100%;height:100%;object-fit:cover;}
.cs2-proc p{font-size:13.2px;line-height:1.85;color:#5c5966;margin:0;}
.cs2-inst-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.cs2-inst{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(26,26,46,.09);display:grid;grid-template-columns:200px 1fr;transition:transform .3s ease;}
.cs2-inst:hover{transform:translateY(-4px);}
.cs2-inst .ph{height:100%;min-height:150px;}
.cs2-inst .ph img{width:100%;height:100%;object-fit:cover;}
.cs2-inst .tx{padding:20px 22px;}
.cs2-inst .tx h4{font-size:15.5px;font-weight:800;color:#1A1A2E;margin:0 0 8px;}
.cs2-inst .tx p{font-size:12.8px;line-height:1.8;color:#5c5966;margin:0;}
.cs2-rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.cs2-rel{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 12px 34px rgba(26,26,46,.10);transition:transform .3s ease,box-shadow .3s ease;text-decoration:none;display:flex;flex-direction:column;}
.cs2-rel:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(26,26,46,.16);}
.cs2-rel .ph{aspect-ratio:4/3;overflow:hidden;}
.cs2-rel .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.cs2-rel:hover .ph img{transform:scale(1.07);}
.cs2-rel .tx{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1;}
.cs2-rel .tx .nm{font-size:18px;font-weight:800;color:#1A1A2E;}
.cs2-rel .tx .og{font-size:12px;color:#8a8794;margin:4px 0 10px;}
.cs2-rel .tx p{font-size:13px;line-height:1.8;color:#55525e;margin:0 0 14px;}
.cs2-rel .tx .go{margin-top:auto;font-size:13.5px;font-weight:700;color:#A8863B;}
.cs2-tech-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;}
.cs2-tech{background:#fff;border-radius:18px;padding:32px 30px;box-shadow:0 12px 34px rgba(26,26,46,.10);border-left:4px solid #C9A84C;}
.cs2-tech .h{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.cs2-tech .h .ic{font-size:26px;}
.cs2-tech .h .tg{font-size:11.5px;font-weight:800;letter-spacing:2px;color:#C9A84C;}
.cs2-tech .h h4{font-size:17.5px;font-weight:800;color:#1A1A2E;margin:0;}
.cs2-tech .ch{font-size:13.8px;line-height:1.85;color:#55525e;margin:0 0 14px;}
.cs2-tech .so{background:rgba(201,168,76,.10);border-radius:12px;padding:16px 18px;font-size:13.2px;line-height:1.85;color:#4a4754;}
.cs2-tech .so strong{color:#8A6D2F;}
.cs2-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:30px;}
.cs2-metric{background:linear-gradient(135deg,#15152b,#232346);border-radius:14px;padding:22px 16px;text-align:center;}
.cs2-metric .n{font-size:28px;font-weight:800;color:#C9A84C;font-family:'Inter Tight',sans-serif;}
.cs2-metric .l{font-size:12px;color:rgba(255,255,255,.7);margin-top:6px;letter-spacing:1px;}
@media (max-width: 1024px){
  .cs2-facts{grid-template-columns:repeat(2,1fr);}
  .cs2-fact:nth-child(2){border-right:none;}
  .cs2-fact:nth-child(1),.cs2-fact:nth-child(2){border-bottom:1px solid rgba(255,255,255,.07);}
  .cs2-mat-grid,.cs2-gal-grid,.cs2-proc-grid,.cs2-rel-grid{grid-template-columns:repeat(2,1fr);}
  .cs2-tech-grid{grid-template-columns:1fr;}
  .cs2-metrics{grid-template-columns:repeat(2,1fr);}
  .cs2-overview-hero{grid-template-columns:1fr;}
  .cs2-overview-media{min-height:280px;}
}
@media (max-width: 640px){
  .cs2-mat-grid,.cs2-gal-grid,.cs2-proc-grid,.cs2-rel-grid,.cs2-inst-grid{grid-template-columns:1fr;}
  .cs2-facts{grid-template-columns:repeat(2,1fr);}
  .cs2-overview-body{padding:28px 24px;}
}

/* ============================================================
   iPad / 触屏导航修复（2026-09-09）
   问题：1) 抽屉菜单仅在 ≤1160px 生效，iPad Air/Pro 横屏
   （1180 / 1194 / 1366px）显示的是桌面导航，而下拉面板纯靠 :hover 展开；
   2) JS 点击拦截写死 innerWidth>1160 直接 return，触屏点按只会跳转到栏目页。
   方案：新增 .nav-open 点击态，所有断点通用；触屏禁用 :hover 展开。
   ============================================================ */

/* 1) 触屏设备不再使用 hover 展开/悬停态，避免点击后 hover 残留
   （2026-09-09 八次修复：补 :not(.nav-open)——真机 iPad 上该媒体查询命中，
   原版会把 JS 已展开（nav-open）的面板重新藏掉 = 「展开约一秒后消失」） */
@media (hover: none), (pointer: coarse) {
  .navbar .nav-dropdown:hover:not(.nav-open) > .mega-panel,
  .navbar .nav-dropdown:hover:not(.nav-open) > .dropdown-panel,
  body.premium .navbar .nav-dropdown:hover:not(.nav-open) > .mega-panel,
  body.premium .navbar .nav-dropdown:hover:not(.nav-open) > .dropdown-panel {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(-50%) translateY(8px) !important;
    -webkit-transform: translateX(-50%) translateY(8px) !important;
  }
  .navbar .nav-dropdown:hover > a::after,
  body.premium .navbar .nav-dropdown:hover > a::after {
    width: auto !important;
    transform: none !important;
  }
  .navbar .nav-links > a:hover::after { width: 0 !important; }
}

/* 2) 点击展开态 .nav-open —— 桌面区间（>1160px，浮层样式） */
.navbar .nav-dropdown.nav-open > .mega-panel,
.navbar .nav-dropdown.nav-open > .dropdown-panel,
body.premium .navbar .nav-dropdown.nav-open > .mega-panel,
body.premium .navbar .nav-dropdown.nav-open > .dropdown-panel {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) !important;
  -webkit-transform: translateX(-50%) translateY(0) !important;
  transition-delay: 0s !important;
}
.navbar .nav-dropdown.nav-open > a::after,
body.premium .navbar .nav-dropdown.nav-open > a::after {
  transform: rotate(180deg) !important;
}

/* 3) 抽屉区间（≤1160px）跟随原有 mobile-open 样式 */
@media (max-width: 1160px) {
  .navbar .nav-dropdown.nav-open > .mega-panel,
  .navbar .nav-dropdown.nav-open > .dropdown-panel,
  body.premium .navbar .nav-dropdown.nav-open > .mega-panel,
  body.premium .navbar .nav-dropdown.nav-open > .dropdown-panel {
    display: block !important;
    position: static !important;
    transform: none !important;
    -webkit-transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none !important;
    padding: 8px 0 8px 16px !important;
  }
  /* 抽屉高度用 dvh，修 iOS Safari 100vh 被地址栏遮挡导致底部点不到 */
  body.premium .navbar .nav-links {
    height: 100dvh !important;
    max-height: 100dvh !important;
  }
}

/* 4) 触屏热区 ≥44px + 消除 300ms 点击延迟与灰色高亮残留 */
@media (hover: none), (pointer: coarse) {
  body.premium .navbar .nav-links > a,
  body.premium .navbar .nav-dropdown > a,
  .navbar .nav-links > a,
  .navbar .nav-dropdown > a {
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(201, 168, 76, 0.18);
  }
}
@media (pointer: coarse) and (min-width: 1161px) {
  body.premium .navbar .nav-links > a,
  body.premium .navbar .nav-dropdown > a {
    padding: 14px 10px !important;
    min-height: 44px !important;
  }
  body.premium .navbar .nav-dropdown > a { gap: 4px; font-size: 13px !important; }
}
/* 面板本身在触屏上给足点击面积 */
@media (hover: none), (pointer: coarse) {
  body.premium .navbar .mega-panel-link,
  body.premium .navbar .dropdown-item { min-height: 44px; display: flex; align-items: center; }
}

/* ------------------------------------------------------------
   2026-09-09 二次修复：iPadOS「子菜单闪现后消失」
   原因：iPadOS 以桌面模式呈现时媒体查询报 (hover:hover)+(pointer:fine)，
   点按会触发模拟 hover 使面板闪现，随后 click 跳转让面板消失。
   JS 在真实触屏交互后给 <html> 加 .touch-nav，CSS 据此彻底禁用 hover 展开。
   注意 :not(.nav-open)：已展开的面板不受 hover 禁用影响。
   ------------------------------------------------------------ */
html.touch-nav .navbar .nav-dropdown:hover:not(.nav-open) > .mega-panel,
html.touch-nav .navbar .nav-dropdown:hover:not(.nav-open) > .dropdown-panel,
body.premium html.touch-nav .navbar .nav-dropdown:hover:not(.nav-open) > .mega-panel,
body.premium html.touch-nav .navbar .nav-dropdown:hover:not(.nav-open) > .dropdown-panel {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateX(-50%) translateY(8px) !important;
  -webkit-transform: translateX(-50%) translateY(8px) !important;
}
html.touch-nav .navbar .nav-dropdown:hover:not(.nav-open) > a::after {
  transform: none !important;
  width: auto !important;
}
html.touch-nav .navbar .nav-links > a:hover::after { width: 0 !important; }
html.touch-nav .navbar .nav-links a,
html.touch-nav .navbar .nav-dropdown > a,
html.touch-nav .navbar .nav-toggle { touch-action: manipulation; }

/* ------------------------------------------------------------
   2026-09-09 三次修复： iPad 触屏「点开即被关闭」兜底
   ① 导航触发器无条件禁用双击缩放——iPadOS 桌面模式媒体查询报
      (hover:hover)+(pointer:fine)，上面带 .touch-nav / (hover:none)
      条件的 touch-action 不生效，快速第二次点按会被系统判为
      双击缩放而吞掉；touch-action 对鼠标无副作用，直接无条件声明。
   ------------------------------------------------------------ */
/* 十一次修复（2026-09-09）：双击缩放根除——
   此前 touch-action: manipulation 只盖住触发器和面板链接；用户点开面板后约一秒
   内的第二次点按若落在面板容器/文字/格子上（无 touch-action 覆盖），iPadOS 会
   判定为双击并缩放页面：面板其实还开着（JS 日志干净），但视口跳位 = 眼中「子菜单
   消失」。现将 manipulation 无条件覆盖导航栏整个子树，双击缩放在导航区域内物理不可能。 */
.navbar,
.navbar * {
  touch-action: manipulation;
}
.navbar .nav-links a,
.navbar .nav-dropdown > a,
.navbar .nav-toggle,
.navbar .mega-panel-link,
.navbar .dropdown-item {
  -webkit-tap-highlight-color: rgba(201, 168, 76, 0.18);
}

/* ============================================================
   54. 移动端密度收紧层（2026-09-10 v20260910a）
   ------------------------------------------------------------
   全站手机端（≤768px）排版审查结论：留白过大主要来自 premium 层
   各专题区块的固定大 padding（84/96/88/72/56px 系）在手机上未收缩。
   本模块统一收紧为「26px 区块节距 + 20-28px 组件内距 + 14-16px 网格间距」
   的紧凑节奏；hero 类一律 pt/mt 同步等量收缩，净距不变（fixed 导航不遮字）。
   全部带 !important + 文件末尾位置，稳定压过前文同名规则。
   ============================================================ */
@media (max-width: 768px) {

  /* ── 通用节距 ── */
  body.premium .section-padding { padding: 26px 0 !important; }
  body.premium .section-padding.pt-40 { padding: 22px 0 18px !important; }
  body.premium .hero-buttons { margin-top: 18px !important; }

  /* ── Hero 族：pt/mt 同步收缩，净距不变（导航 fixed 48px 瘦条不遮字）── */
  body.premium .hero.hero-grid-video { padding-top: 66px !important; margin-top: -50px !important; padding-bottom: 14px !important; }
  body.premium .hero.honors-hero { padding-top: 66px !important; margin-top: -50px !important; min-height: 300px !important; }
  body.premium .news-hero { padding-top: 68px !important; margin-top: -56px !important; padding-bottom: 16px !important; }
  body.premium .product-hero { padding-top: 56px !important; }
  body.premium .v2-hero .v2-hero-media { min-height: 250px !important; }
  body.premium .v2-hero .v2-hero-text { padding: 24px 20px 22px !important; }
  body.premium .v2-hero-full { min-height: 400px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
  body.premium .v2-hero-full .v2-hero-content { padding: 120px 0 30px !important; }

  /* ── 首页 CTA / 表单区 ── */
  body.premium .cta-section.section-padding { padding: 38px 0 40px !important; }
  body.premium .cta-section.cta-home { padding-top: 38px !important; padding-bottom: 42px !important; }
  body.premium .cta-section.cta-home .cta-home-grid { gap: 16px !important; margin-top: 6px !important; }
  body.premium .cta-section.cta-home .cta-cert-panel { padding: 20px 16px !important; }
  body.premium .cta-section.cta-home .cta-cert-grid { margin: 14px 0 !important; gap: 10px !important; }
  body.premium .hsst-form-success { padding: 20px 16px !important; }

  /* ── 产品中心 v2 ── */
  body.premium .v2-series { padding: 34px 0 38px !important; }
  body.premium .v2-series .v2-series-lead { margin: 0 0 18px !important; }
  body.premium .v2-series-card .vsc-cap { padding: 22px 16px 16px !important; }
  body.premium .v2-spot-in { padding: 26px 20px 24px !important; }
  body.premium .v2-spot-text { padding: 24px 20px 22px !important; }
  body.premium .v2-spot-media { min-height: 230px !important; }
  body.premium .v2-quote { padding: 42px 20px 34px !important; }
  body.premium .v2-colours { padding: 34px 0 !important; }
  body.premium .v2-archive { padding: 36px 0 !important; }

  /* ── 工程案例 v2 ── */
  body.premium .v2-card { margin-bottom: 14px !important; }
  body.premium .v2-card .v2-card-img img { aspect-ratio: 4 / 3 !important; object-fit: cover !important; }
  body.premium .v2-gallery { padding: 32px 0 14px !important; }
  body.premium .v2-record { padding: 30px 0 26px !important; margin-top: 14px !important; }

  /* ── 产品/制造详情页 ── */
  body.premium .product-content-section { padding: 26px 0 !important; }
  body.premium .tech-specs-table { margin-top: 18px !important; }
  body.premium .stats-row { margin-top: 12px !important; }

  /* ── 新闻 ── */
  body.premium .news-spotlight { margin-bottom: 18px !important; }
  body.premium .news-grid { margin-top: 20px !important; gap: 14px !important; }

  /* ── 新闻文章正文（art-*，样式原在各页内联）── */
  body.premium .art-body { padding: 30px 20px 8px !important; }
  body.premium .art-hero-content { padding-bottom: 24px !important; }
  body.premium .art-body p { font-size: 16px !important; line-height: 1.85 !important; margin: 0 0 16px !important; }
  body.premium .art-h2 { margin: 24px 0 12px !important; padding-top: 0 !important; }
  body.premium .art-hook { padding: 20px 18px !important; margin: 22px 0 !important; }
  body.premium .art-facts { margin-top: 20px !important; }
  body.premium .art-cta { padding: 28px 20px !important; margin-top: 22px !important; }

  /* ── FAQ v2 ── */
  body.premium .faqv2-hero { padding: 42px 0 30px !important; }
  body.premium .faqv2-cat { margin-bottom: 24px !important; }
  body.premium .faqv2-cat-head { padding: 14px 0 10px !important; margin-bottom: 12px !important; }
  body.premium .faqv2-cta { padding: 22px 16px !important; margin-top: 26px !important; }

  /* ── 关于我们 ── */
  body.premium .section-padding.before-video { padding-top: 40px !important; }
  body.premium .timeline-section { padding: 24px 0 20px !important; }
  body.premium .timeline { padding: 20px 0 16px !important; }
  body.premium .about-text-block { padding-top: 22px !important; margin-top: 12px !important; }
  body.premium .about-stats { margin-top: 22px !important; }
  body.premium .why-choose-grid { margin-top: 22px !important; }
  body.premium .role-entry-section { padding: 26px 0 24px !important; }
  body.premium .scenarios-grid-hs { margin-top: 14px !important; gap: 14px !important; }
  body.premium .sustainability-grid { gap: 14px !important; }
}

/* ≤480px 再压一档（小屏手机） */
@media (max-width: 480px) {
  body.premium .section-padding { padding: 22px 0 !important; }
  body.premium .cta-section.section-padding { padding: 32px 0 34px !important; }
  body.premium .v2-series { padding: 28px 0 32px !important; }
  body.premium .v2-quote { padding: 34px 18px 28px !important; }
  body.premium .v2-hero .v2-hero-media { min-height: 210px !important; }
  body.premium .v2-spot-media { min-height: 200px !important; }
  body.premium .v2-hero-full { min-height: 340px !important; }
}

/* ═══ 移动端留白收敛 + 断点统一 (2026-09-13) ═══
   标准断点基线：1160(抽屉导航) / 1024 / 768 / 640 / 480 / 360
   仅做约束型收口，与 style.css 全局加固协同；不放大任何元素，零回归风险 */
@media (max-width: 480px) {
  :root { --gutter: 14px; }
  body.premium .section-padding { padding: 20px 0 !important; }
}
@media (max-width: 360px) {
  :root { --gutter: 12px; }
}


/* ═══════════════════════════════════════════════════════════
   MBL-OVERFLOW-20260913 · Module 51 移动端窄屏横向溢出治理
   目标：手机端无横向滚动条、内容完整可见且不被裁切；桌面端布局/交互/视觉保持原样。
     1) FAQ 筛选 chip：原 overflow-x:auto + 隐滚动条，窄屏多数标签不可见 → 换行全展示
     2) .tech-specs-table：表格 min-content 撑破容器被裁切 → 容器可横向滚动
     3) .vtl-card（about 里程碑）：width:100% 叠加 margin-left:36px 溢出 → width:auto
     4) 页脚 .ft-grid5：≤560px 单列 + 长联系串允许折行
     5) 按钮：nowrap 被裁切 → 允许换行/断字
     6) 兜底：媒体/代码块/长单词不越界
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* 1) FAQ chips 换行，全部可见 */
  .faqv2-chips { flex-wrap: wrap !important; overflow-x: visible !important; row-gap: 8px; }
  .faqv2-chip  { flex: 0 1 auto; max-width: 100%; }

  /* 2) 参数表容器可横向滚动，内容可完整查看 */
  .tech-specs-table {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    max-width: 100%;
  }
  .tech-specs-table th,
  .tech-specs-table td { padding: 10px 12px !important; font-size: 13px !important; }
  .tech-specs-table th { width: auto !important; min-width: 104px; }

  /* 3) 里程碑卡片：width:auto 吸收 margin-left，消除 36px 溢出 */
  .vtl-card  { width: auto !important; max-width: 100% !important; }
  .vtl-track { min-width: 0 !important; }

  /* 5) 按钮标签不被裁切 */
  .btn, .hsst-btn, .btn-primary, .btn-outline-light, .btn-outline-gold,
  .hsst-form-btn, .product-action-btn {
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  /* 6) 兜底：媒体/代码块/长单词不越界 */
  img, video, iframe, embed, object { max-width: 100%; }
  pre, code { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  p, li, td, th { overflow-wrap: break-word; }
}

/* 4) 页脚 ≤560px：维持两列（2026-09-14 Stone 指令：手机端不要单列，两列起），
   保留折行与 min-width:0 防裁切（当年单列是为了治裁切，实测两列 + 下方折行规则即可） */
@media (max-width: 560px) {
  body.premium .ft-grid5 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 18px !important;
    row-gap: 26px !important;
  }
  body.premium .ft-grid5 > div { min-width: 0 !important; }
  body.premium .ft-grid5 ul    { min-width: 0 !important; }
  body.premium .ft-grid5 ul li,
  body.premium .ft-grid5 .ft-contact li,
  body.premium .ft-grid5 .ft-contact li a,
  body.premium .ft-grid5 .ft-contact li span {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    min-width: 0 !important;
  }
}


/* ═══════════════════════════════════════════════════════════
   MBL-OVERFLOW2-20260913 · Module 52 窄屏残余横向溢出修复（第二轮）
   针对终检暴露、组件级根因：
     A) .jd-grid：1fr 轨道自动最小值被 .jd-box 的 min-content 撑到 320px（容器仅 288px）
                  → 改 minmax(0,1fr) + 子项 min-width:0 + 允许断词
     B) .cs2-inst / .cs2-facts：双列固定轨道(200px+143px / 195px+131px)超出容器
                  → ≤767px 收成单列堆叠
     C) 表单区(.hsst-form-zone)：控件最小宽度导致 320px 下溢出 → 控件可收缩
     D) .section-subtitle：窄容器内容不下长单词导致文字溢出 → 允许断词
   注意：SEO 隐藏容器(.seo-text-container-hide)为刻意隐藏，不在修复范围。
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* A) 招聘页 JD 网格 */
  .jd-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 24px !important; }
  .jd-grid > * { min-width: 0 !important; }
  .jd-box, .jd-box * { min-width: 0 !important; overflow-wrap: anywhere; }

  /* B) 工程案例 v2 双列 → 单列 */
  .cs2-inst, .cs2-facts, .cs2-mat-card {
    grid-template-columns: minmax(0, 1fr) !important;
    row-gap: 18px;
  }
  .cs2-inst > *, .cs2-facts > *, .cs2-mat-card > * { min-width: 0 !important; }
  .cs2-inst *, .cs2-facts *, .cs2-mat-card * { overflow-wrap: anywhere; }
  .cs2-inst img, .cs2-mat-card img, .cs2-rel img, .project-hero img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* D) 小徽标/副标题不断词导致溢出 */
  .section-subtitle { overflow-wrap: anywhere; }
}

/* C) 表单区控件可收缩（≤480px） */
@media (max-width: 480px) {
  body.premium .hsst-form-zone .hsst-form,
  body.premium .hsst-form-zone .sample-form-container,
  body.premium .hsst-form-zone form { min-width: 0 !important; max-width: 100% !important; }
  body.premium .hsst-form-zone input,
  body.premium .hsst-form-zone select,
  body.premium .hsst-form-zone textarea,
  body.premium .hsst-form-zone button {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body.premium .hsst-form-zone * { overflow-wrap: anywhere; }
  body.premium .hsst-form-zone .stone-checkbox-item label,
  body.premium .hsst-form-zone .radio-item label { min-width: 0 !important; }
}


/* ═══════════════════════════════════════════════════════════
   MBL-OVERFLOW3-20260913 · Module 53 窄屏残余溢出（第三轮）
     A) .cs2-metrics：多列指标网格在 320px 下溢出 20~55px（5 个工程页横向滚动的根因）→ 单列
     B) .solution-hero：320px 下内部溢出 80px → 容器可收缩 + 内边距收敛
     C) .cta-section：320px 下内部溢出 40px → 子项 min-width:0、容器不超宽
     D) .jd-grid 加固：允许断词，避免 min-content 继续撑破轨道
   统一思路：grid/flex 子项默认 min-width:auto 会被 min-content 撑破 → minmax(0,1fr) + min-width:0
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* A) 指标网格 → 单列 */
  .cs2-metrics { grid-template-columns: minmax(0, 1fr) !important; row-gap: 14px; }
  .cs2-metrics > * { min-width: 0 !important; }
  .cs2-metrics * { overflow-wrap: anywhere; }
  .cs2-metric, .cs2-metric * { min-width: 0 !important; }

  /* D) JD 网格加固 */
  .jd-grid, .jd-box, .jd-box * { min-width: 0 !important; word-break: break-word; }
}

@media (max-width: 480px) {
  /* B) 方案页 hero */
  .solution-hero { padding-left: 16px !important; padding-right: 16px !important; }
  .solution-hero > .container { padding-left: 0 !important; padding-right: 0 !important;
                                max-width: 100% !important; min-width: 0 !important; }
  .solution-hero * { min-width: 0 !important; }
  .solution-hero img, .solution-hero video, .solution-hero iframe { max-width: 100% !important; height: auto !important; }

  /* C) CTA 区（含 cta-home / cta-sub / hsst-form-zone） */
  .cta-section { padding-left: 16px !important; padding-right: 16px !important; }
  .cta-section > .container { padding-left: 0 !important; padding-right: 0 !important;
                              max-width: 100% !important; min-width: 0 !important; }
  .cta-section * { min-width: 0 !important; overflow-wrap: anywhere; }
  .cta-section input, .cta-section select, .cta-section textarea, .cta-section button {
    max-width: 100% !important;
  }
}


/* ═══════════════════════════════════════════════════════════
   Module 52: iPhone / iOS 窄屏专修 (2026-09-13)  [IOS-IPHONE-FIX-20260913]
   ───────────────────────────────────────────────────────────
   依据：全站 255 页 × 320/375/430 三宽度实测扫描。
     · 页面级横向滚动全站为 0（解除 overflow-x 掩饰后测得）；
     · 但存在「元素被裁切且不可达」的硬缺陷 + iOS 独占行为缺陷。
   本模块逐条对应修复。桌面端(>768px)不受任何影响。
   ═══════════════════════════════════════════════════════════ */

/* ── 1) iOS 聚焦自动放大 —— 真机横向滚动的头号原因 ──────────────
   根因：premium 主题用 !important 把输入控件字号钉死在 14px
        （本文件 "12. Form 輸入框升級"），style.css 的 .inquiry-form
        用 0.95rem(≈15.2px)，两者都 < 16px。
   后果：iOS Safari 聚焦 font-size<16px 的输入框时会「整页放大」，
        布局视口随之变宽 → 立刻出现横向滚动条，且失焦后常残留。
   实测影响 84 个页面（联系我们 10 个控件、在线应聘 12 个）。
   修复：窄屏统一抬到 16px（须同样 !important 才能覆盖原 !important）。 */
@media (max-width: 768px) {
  body.premium input[type="text"],
  body.premium input[type="email"],
  body.premium input[type="tel"],
  body.premium input[type="number"],
  body.premium input[type="search"],
  body.premium input[type="url"],
  body.premium input[type="date"],
  body.premium input[type="password"],
  body.premium textarea,
  body.premium select,
  .premium input[type="text"],
  .premium input[type="email"],
  .premium input[type="tel"],
  .premium textarea,
  .premium select,
  .inquiry-form input,
  .inquiry-form select,
  .inquiry-form textarea,
  .hsst-form-zone input,
  .hsst-form-zone select,
  .hsst-form-zone textarea,
  form input:not([type="checkbox"]):not([type="radio"])
             :not([type="hidden"]):not([type="submit"]):not([type="button"]),
  form textarea,
  form select {
    font-size: 16px !important;
  }
}

/* ── 2) overflow-x:clip 的旧引擎回退 ──────────────────────────
   style.css 的 html{overflow-x:clip} 在 iOS 15 及以下不被支持，
   不支持时整条声明被丢弃 → 原本被静默裁掉的溢出变成真实横向滚动条。
   只给「不支持 clip」的浏览器补 hidden 回退；
   现代浏览器保留 clip（不创建滚动容器，不影响 position:sticky）。 */
@supports not (overflow-x: clip) {
  html { overflow-x: hidden; }
}

/* ── 3) 100vw 在 iOS 上可能大于可视宽度 ─────────────────────
   iOS Safari 的 100vw 计算偶发大于 window.innerWidth，
   用于 width 时会把元素顶出屏幕。改用 100% / auto（语义等价且无风险）。 */
@media (max-width: 900px) {  /* 已有 left/right:16px !important 定位 */
}
.image-modal-content { width: 100% !important; max-width: 100% !important; }
.image-modal-content img { max-width: 100% !important; }

/* ── 4) 长文本 / 长链接 / 邮箱断行兜底 ───────────────────────
   用 break-word（不改动 min-content 尺寸，避免波及 flex/grid 布局）。 */
@media (max-width: 768px) {
  body.premium,
  body.premium p,
  body.premium li,
  body.premium td,
  body.premium th,
  body.premium span,
  body.premium a { overflow-wrap: break-word; }
}

/* ── 5) 媒体与嵌入元素兜底自适应 ──────────────────────────── */
@media (max-width: 768px) {
  body.premium img,
  body.premium video,
  body.premium iframe,
  body.premium embed,
  body.premium object,
  body.premium canvas { max-width: 100% !important; }
}

/* ── 6) 方案页 CTA 表单：grid 轨道写死 minmax(400px,1fr) ──────────
   根因：style.css 的 .solution-cta-grid 用
         grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
         每列最小 400px，窄屏容器只有 ~288px → 强制撑破 80px 并被裁切，
         输入框右侧一部分既看不见也点不到（实测 8 个方案页）。
   修复：窄屏改单列，轨道最小值归零，控件宽度 100%。 */
@media (max-width: 768px) {
  .solution-cta-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .solution-cta-form,
  .solution-cta-form > * { min-width: 0 !important; }
  .solution-cta-input,
  .solution-cta-textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ── 7) 里程碑时间轴：flex/grid 子项 min-width:auto 撑破 ──────────
   根因：.timeline-desc 作为弹性子项默认 min-width:auto，
        其 min-content（最长不可断词）大于分配到的 104px → 溢出 18px 被裁。
   修复：子项最小宽度归零 + 允许断词。 */
@media (max-width: 768px) {
  .timeline-item,
  .timeline-item > *,
  .timeline-content,
  .timeline-desc {
    min-width: 0 !important;
    overflow-wrap: break-word;
  }
}

/* ── 8) 宽表格：窄屏容器内可横滑 + iOS 惯性滚动 ────────────────
   规格表 / 资源表列数多，min-content 远大于 320px。
   保留「容器内横向滑动」这一标准响应式做法（内容完整可达），
   补 -webkit-overflow-scrolling:touch 让 iOS 滑动顺畅。 */
@media (max-width: 768px) {
  .tech-specs-table,
  .about-table-wrap,
  .rs-table-wrap,
  div[style*="overflow-x:auto"],
  div[style*="overflow-x: auto"] {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100% !important;
  }
  .tech-specs-table table,
  .about-table-wrap table,
  .rs-table {
    max-width: none;
  }
}


/* ═══════════════════════════════════════════════════════════
   Module 51: 内页 .container 水平 gutter 修复 (2026-09-13)
   ───────────────────────────────────────────────────────────
   问题：style.css 第 90 行
     .inner-page .section-padding .container { padding: 0; }
   本意是移除「白卡片」外观（background / border-radius / box-shadow），
   但 padding:0 把水平 gutter 一并清掉了。

   桌面 >1280px 时 .container 靠 max-width:1200px + margin:0 auto 兜底，
   所以看不出问题；但 ≤1280px 起 :root 把 --max-width 改成 100%，容器变满幅，
   于是所有内页内容（标题 / 正文 / 卡片）直接贴到屏幕两侧 —— 卡片边框正好
   落在屏幕边缘、右侧内容被裁，表现为「页面内容横向溢出、快要超出屏幕边界」。

   为什么只有内页中招：
     · 首页 index.html 的 body 没有 .inner-page，不受该规则影响 → 正常
     · 导航栏用 .navbar .container，是不同的选择器 → 页头正常
     这正是「截图里页头正常、正文贴边」的原因。

   修复：仅在容器满幅的区间(≤1280px)恢复水平 gutter，沿用各断点的 --gutter
        （≤480:16px / ≤768:20px / 768–1199:28px / 1200–1280:32px）。
        >1280px 完全不留痕迹 → 桌面端布局与视觉零改动。
        刻意不加 !important：.solution-hero / .cta-section 等真正需要满幅
        出血的容器其 padding-left/right:0 自带 !important，优先级更高，
        不会被本规则破坏。
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
  .inner-page .section-padding .container {
    padding-left: var(--gutter);
    padding-right: var(--gutter);
  }
}


/* ═══════════════════════════════════════════════════════════
   WDTH-UNIFY-20260913 · 全站内容宽度一致性治理 (2026-09-13)
   ───────────────────────────────────────────────────────────
   实测：Playwright 全站 255 页 × 390/768/1024/1440 四视口，
   量取每个 .container「内容带」（去掉 padding 后的左右边缘）。
   发现同一页内并存多种内容带，宽度互不一致：

     @1440  导航 1304 | 正常容器 1104 | 内页容器 1200 | tight 1120
     @1024  正常 904  | 内页 960      | tight 880
     @768   正常 728  | 内页 768      | tight 688
     @390   正常 358  | 内页 390(贴边) | tight 310

   来源共三处（其余规则均正常）：
     1. body.premium .navbar .container 在 ≥1161px 被固定为 1400px
        → 比正文容器宽 200px，页头左右与正文对不齐。
        实测导航真正只需 ~830–880px（余量 300–490px）→ 收窄零风险。
     2. style.css 第 90 行 .inner-page .section-padding .container{padding:0}
        → 内页内容带比首页/页脚每侧多一个 --gutter；
        Module 51 只在 ≤1280px 兜底，桌面 >1280px 仍然不一致。
        ⚠ 另：38 个页面曾重复引入 style.css（在 premium 之后），
          令该 padding:0 反超 premium 的兜底规则 —— 已在 HTML 侧去重。
     3. style.css .tight-section .container{padding:16px 40px !important}
        → 第三种水平内边距 40px，完全脱离 --gutter 体系。

   修复原则：全部回归 --max-width + --gutter 单一体系。
     · 导航 = 正文 = 页脚 = 内页 → 同一条内容带
     · 各断点水平内边距只由 --gutter 驱动
       （≤360:12 / ≤480:14 / ≤768:20 / 768–1199:28 / ≥1200:32–48）
     · 竖向留白、字号、任何元素尺寸均不改动 —— 零回归
     · ≤480px 的满幅出血规则（.solution-hero/.cta-section > .container
       带 !important）优先级更高，不受本模块影响
   ═══════════════════════════════════════════════════════════ */

/* 1) 导航容器与正文同宽（原先桌面固定 1400px） */

/* 2) 内页 section 容器恢复统一水平 gutter（消除 1200 vs 1104 差异） */
.inner-page .section-padding .container {
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}

/* 3) tight-section 的 40px 水平内边距回归 gutter（保留竖向 16px） */
.tight-section .container {
  padding-left: var(--gutter) !important;
  padding-right: var(--gutter) !important;
}

/* 4) 页内局部收窄文本块（.tech-lead 900px）回归内容带满宽
      注意：.inner-page / .premium 都挂在 <body> 自身，故必须写成
      body.premium.inner-page（复合），不能写成 body.premium .inner-page。 */
body.premium.inner-page .tech-lead { max-width: none; }
body.premium.inner-page .tech-steps,
body.premium.inner-page .tech-related { max-width: none; }

/* 5) ≤900px：style.css 里有一条硬编码
        @media (max-width:900px){ .nav-container,.container{padding:0 16px} }
      它绕开了 --gutter 体系（390 应为 14 / 768 应为 20 / 769–900 应为 28），
      导致同一页出现 14 与 16 两种内容带 → 统一回归 --gutter。 */
@media (max-width: 900px) {
  
  .container {
    padding-left: var(--gutter);
    padding-right: var(--gutter);
  }
}

/* 6) ≤768px / ≤480px 另有 .container{width:92%} 与 {width:94%}，
      会让部分容器比 --max-width 窄 6–8%，与同页其他容器宽度不一致。
      水平留白已由 --gutter 统一提供 → 宽度回归 100%。 */
@media (max-width: 900px) {
  .container { width: 100%; }
}

/* 7) ≤900px：.navbar 自身还带 16px 水平内边距，令导航内容比正文再多内缩 16px
      （导航内容带 30~360 vs 正文 14~376，顶部与主体左右对不齐）
      → 水平内边距归零，统一交由 .container 的 --gutter 决定。 */

/* 8) 首页 .about-preview 是一整块 <section>，被 premium「卡片样式」选择器列表
      误当成卡片套用了 border / 圆角 / 阴影 / hover 上浮：
        · ≤1200px 容器满幅时，1px 边框让内容少 2px（388 vs 390）
        · 满幅 section 的边框在屏幕左右边缘留下 1px 细线
        · 悬停整块区块会整体上移 4px
      → 还原为普通区块（仅 index.html / en/index.html 两处使用） */
body.premium section.about-preview {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  transform: none !important;
}

/* 9) sample-request（中英各 1 页）没有使用 .container，包装层接近满幅
      （@1440 实测正文 53~1387，全站标准内容带为 168~1272）
      → 包装层收敛到统一内容带（--max-width 减去两侧 --gutter）。
        层内文字的宽度上限（.sample-hero p 650px）与全站章节描述 token
        （cta-home 620 / cta-sub 600 / 默认 700px）同族，保持不变。 */
body.premium .sample-hero .sample-hero-content,
body.premium .sample-form-section > .sample-form-container {
  max-width: calc(var(--max-width) - 2 * var(--gutter)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}

/* ───────────────────────────────────────────────────────────
   10) 标题组内对齐统一
   ───────────────────────────────────────────────────────────
   style.css:142 全局写死 .section-title{text-align:center}，
   于是 .text-left 组里必然出现「副标题左 / 标题居中 / 描述左」的混用。
   全站实测语境分布（.section-title/.section-subtitle/.section-desc）：
     .text-left   208 处   ← 最多，且已存在 .text-left .section-subtitle::after
                             专用变体，说明设计本意即为左对齐组
     none         127 处
     .text-center 124 处
   其中「.text-left 组内标题被强制居中」78 处、「无语境组内标题居中」22 处。

   处理：标题与描述改为继承父级对齐 —— 与副标题行为一致，
        组内三者永远同向；.text-center 组原样保持居中，零影响。
        装饰线（::before 金色短线）与描述块外边距同步跟随。
   ─────────────────────────────────────────────────────────── */

/* 默认：跟随父级（.text-left / 无语境组 → 左对齐） */
body.premium .section-title { text-align: inherit; }
body.premium .section-title::before { left: 0; transform: none; }
body.premium .section-desc { margin-left: 0 !important; margin-right: 0 !important; }
body.premium .section-subtitle { text-align: inherit; }

/* 显式居中的标题组：完整保持居中（装饰线 / 描述块一并居中） */
body.premium .text-center .section-title,
body.premium .text-center .section-subtitle { text-align: center; }
body.premium .text-center .section-title::before { left: 50%; transform: translateX(-50%); }
body.premium .text-center .section-desc { margin-left: auto !important; margin-right: auto !important; }

/* 10.1 「居中但不是 .text-center」的标题组：装饰线同步居中
     上面把 .section-title::before 默认改到左端（配合左对齐标题），
     但仍有 16 页的标题是靠「自身内联样式」或「所属容器」居中的
     （index 客戶 logo 區 .client-logo-section、technology 頁尾 CTA 的
       <div class="container" style="text-align:center">、partnerships 的
       .solution-hero、以及 10 处内联 text-align:center 的标题）。
     这些标题文字居中、装饰线却在左端 → 视觉脱节，此处逐一还原为居中。
     实测：修复前 16 页错位，修复后 0 页。 */
body.premium .section-title[style*="text-align:center"]::before,
body.premium .section-title[style*="text-align: center"]::before,
body.premium .container[style*="text-align:center"] .section-title::before,
body.premium .container[style*="text-align: center"] .section-title::before,
body.premium .solution-hero .section-title::before,
body.premium .client-logo-section .section-title::before { left: 50%; transform: translateX(-50%); }

/* ───────────────────────────────────────────────────────────
   11) 项目案例页英雄区宽度对齐（34 页 / 中英各 17）
   ───────────────────────────────────────────────────────────
   页面内联样式用自有内边距取代 gutter 体系：
     .project-hero-overlay { padding: 0 48px 48px }
     .project-hero-content { max-width: var(--max-width) }
   → @1440 英雄区文字落在 120~1320，比正文内容带 168~1272 每侧宽 48px，
     页头大标题与下方正文左右对不齐。
   处理：水平内边距归零，交由 .project-hero-content 的 --gutter 统一。
        竖向内边距（48px / 移动 32px）原样保留。
   ─────────────────────────────────────────────────────────── */
body.premium .project-hero-overlay { padding-left: 0; padding-right: 0; }
body.premium .project-hero-content {
  padding-left: var(--gutter);
  padding-right: var(--gutter);
  box-sizing: border-box;
}

/* ───────────────────────────────────────────────────────────
   12) 深色底語境：修復 premium 全局 h1/h2/h3 墨色覆蓋造成的不可讀
   ───────────────────────────────────────────────────────────
   本檔第 2 節把 h1/h2/h3 一律設為 --pv-ink（#14130F 近黑）並帶 !important，
   於是「照片英雄區 / 深色漸層塊」上頁面自行聲明的白色標題全部失效，
   ink 蓋在深底上 → 標題幾乎不可見。

   全站實測判定方式（逐頁把字形設為 transparent、隱藏 fixed 浮層後截圖，
   取該文字框內真實渲染像素的中位亮度；底 < 0.30 且字 < 0.30 即判不可讀）：
     section.art-hero h1          90 頁  新聞內頁（深色照片 + 漸層遮罩）
     .project-hero-title          32 頁  案例頁（照片 brightness(.5) + 遮罩）
     .product-hero-title          20 頁  產品系列頁
     .jd-cta h3                   40 頁  招聘詳情頁 CTA（#1A1A2E→#2A2740 漸層卡）
     .news-hero-title             2 頁   新聞首頁（#1a1a2e→#2c2c3e 漸層）
     .news-hero 麵包屑             2 頁   同上（頁面自帶 #888/#555 深字，落在深底上）
     .v2-record h2                2 頁   工程實績（#16150F 黑底）
     .compare-panel-label         2 頁   產品對比條（已於第 1783 行同步修正）

   註：.cta-dark / .products-cta / .v2-quote / .trust-bar / .v2-btn 經實測已是
       「淺底深字」（premium 已把這些區塊的底色一併改成淺色），故不列入。
   ─────────────────────────────────────────────────────────── */

/* 12.1 照片英雄區（深色照片底）：標題恢復白色 */
body.premium .art-hero h1, body.premium .art-hero h2, body.premium .art-hero h3,
body.premium .project-hero h1, body.premium .project-hero h2, body.premium .project-hero h3,
body.premium .product-hero h1, body.premium .product-hero h2, body.premium .product-hero h3,
body.premium .news-hero h1, body.premium .news-hero h2, body.premium .news-hero h3,
body.premium .news-hero .section-title, body.premium .news-hero .section-subtitle {
  color: #FFFFFF !important;
}

/* 12.2 深色漸層卡 / 深色塊：標題恢復白色 */
body.premium .jd-cta h1, body.premium .jd-cta h2, body.premium .jd-cta h3, body.premium .jd-cta h4,
body.premium .v2-record h1, body.premium .v2-record h2, body.premium .v2-record h3 {
  color: #FFFFFF !important;
}

/* 12.3 新聞首頁英雄區內的麵包屑（深底上的深字） */
body.premium .news-hero .breadcrumb,
body.premium .news-hero .breadcrumb ol,
body.premium .news-hero .breadcrumb li { color: rgba(255,255,255,.72) !important; }
body.premium .news-hero .breadcrumb a { color: rgba(255,255,255,.9) !important; }
body.premium .news-hero .breadcrumb a:hover { color: var(--pv-gold) !important; }
body.premium .news-hero .breadcrumb li:not(:last-child)::after { color: rgba(255,255,255,.35) !important; }


body.premium .whatsapp-float,
body.premium .wpp-float.whatsapp-float {
  left: 22px !important;
  right: auto !important;
  bottom: 26px !important;
}
@media (max-width: 768px) {
  body.premium .whatsapp-float,
  body.premium .wpp-float.whatsapp-float {
    left: 16px !important;
    right: auto !important;
    bottom: 20px !important;
  }
}

/* ───────────────────────────────────────────────────────────
   14) 「返回顶部」与左下角 WhatsApp 镜像对齐（一左一右、同一底线）
   ───────────────────────────────────────────────────────────
   改动前（254 页全量实测一致）：252 页的内联 <style> 把 .back-to-top 放在
   right 24 / bottom 90（≤768：right 16 / bottom 80 / 38×38），
   那是「叠在 WhatsApp 正上方」的旧布局；WhatsApp 移到左下角后，右下角只剩它一个，
   仍悬在 90px 高处就显得不上不下。

   处理：与规则 13 完全镜像 —— 桌面 right 22 / bottom 26，≤768 right 16 / bottom 20，
        left 置 auto（防止个别页面用 left 定位）。
        尺寸（44 / 移动 38）、z-index（998）、样式、滚动显隐（.visible）逻辑一律不变。
   注：两球底边对齐（同为 bottom 26 / 20）。WhatsApp 54–56px、返回顶部 44px，
      若要「视觉居中对齐」需再各加半个高度差（约 +5px），未做，保持底边对齐这种确定性做法。
   ─────────────────────────────────────────────────────────── */
body.premium .back-to-top,
body.premium .btt.back-to-top {
  left: auto !important;
  right: 22px !important;
  bottom: 26px !important;
}
@media (max-width: 768px) {
  body.premium .back-to-top,
  body.premium .btt.back-to-top {
    left: auto !important;
    right: 16px !important;
    bottom: 20px !important;
  }
}

/* ───────────────────────────────────────────────────────────
   15) 居中 H2 的金色短线：与 .section-title 标准一致（线随文字整体居中）
   ───────────────────────────────────────────────────────────
   背景：premium 第 2 节给 h2 统一挂了 `::before` 金色短线（36×1px、--pv-gold、
   top:0、left:0，配 h2 的 padding-top:22px），这是「左对齐编辑式标题」的样式。
   但全站有 **478 处** 居中 H2（76 页）仍沿用这条「左端」短线 → 线在盒子最左、
   文字居中，两者相距可达数百像素，视觉完全脱节。

   盘点结论（全量脚本实测，非抽样）：
     · 478 处全部是 h2，全部为「文字居中 + 线在左端」，0 处例外；
     · 特殊结构为 0：无图标、无子元素、无自身底色/边框、无嵌套内联标签 → 无需白名单；
     · 居中来源只有 8 类容器 + 2 个自有 class：
         .cs2-head 224 | .section-header-center 120 | div.product-section-title 84
         .container(内联 text-align:center) 20 | .solution-hero .container 8
         h2.tech-heading 12 | h2.role-entry-title 4 | .wrap/.faqv2-cta/.v2-quote 各 2

   处理：只改「线的水平位置」（left/transform），线长·线粗·色值·与文字的垂直间距
        （padding-top:22px）全部沿用 .section-title 同一套 token，不新增任何变量，
        字号/字重/字体/上下边距一概不动（避免误伤这 478 处既有的自定义标题样式）。
        末尾 3 条为增量兜底：内联 text-align:center、Quill 的 .ql-align-center。
   ─────────────────────────────────────────────────────────── */
body.premium .cs2-head h2::before,
body.premium h2.cs2-title::before,
body.premium .section-header-center h2::before,
body.premium div.product-section-title h2::before,
body.premium .solution-hero .container h2::before,
body.premium .container[style*="text-align:center"] h2::before,
body.premium .container[style*="text-align: center"] h2::before,
body.premium .faqv2-cta h2::before,
body.premium .v2-quote h2::before,
body.premium .wrap h2::before,
body.premium h2.tech-heading::before,
body.premium h2.role-entry-title::before,
body.premium h2[style*="text-align:center"]::before,
body.premium h2[style*="text-align: center"]::before,
body.premium h2.ql-align-center::before,
/* 第二轮补漏（首轮实测 70 处未覆盖）：.text-center 18 处（CTA 区块）
   + 案例页尾 h2.project-section-title 32 处（在 div.project-container.text-center 内，
   已被 .text-center 命中）。注意 h2.project-section-title 与 .products-cta 这两个
   名字同时用于左对齐区块（en/projects/* 的「Build Your Premier」、en/products.html），
   不能做裸选择器，否则反向误伤——它们的居中场景交给下方 JS 兜底判定。 */
body.premium .text-center h2::before {
  left: 50%;
  transform: translateX(-50%);
}

/* 15b) 渲染层兜底：JS 判定「文字居中」的标题统一打 .pv-tick-center
   居中可能来自任意祖先继承（如 section.cta-section → div.container → h2），
   纯 CSS 选择器枚举不完，故由 main.js 按 computed text-align 自动打类。
   存量 478 处即使上面枚举有遗漏，以及 CMS 后续新建的居中标题，都自动生效。 */
body.premium h1.pv-tick-center::before,
body.premium h2.pv-tick-center::before,
body.premium h3.pv-tick-center::before {
  left: 50% !important;
  transform: translateX(-50%) !important;
}

/* ═══════════════════════════════════════════════════════════
   16) 手机端第二轮修复：竖排挤压与表格裁切（2026-09-14）
   ═══════════════════════════════════════════════════════════
   全站 254 页 × 390 视口实测，36 页命中三类问题：

   A) .timeline-*（about/honors/careers/technology × 中英 = 8 页）
      1024 断点给 .timeline-content 设了 width:calc(100%-50px)+margin-left:50px，
      与 768 断点的 .timeline-item{padding-left:50px} 叠加后，年份与内容被 flex
      压到 12–39px 宽 →「1999」竖排成 175px 高的一列数字。
      修复：≤768 改纵向堆叠（年份在卡上方），宽度全部释放。
   B) .contact-region-item（contact × 中英 = 2 页）
      flex 不换行，<strong>大中華區：</strong> 被压成 22px 宽竖排 → 允许换行 + 锁定不收缩。
   C) .cs2-tech .h .ic（18 个案例页 × 中英）
      emoji 图标被 flex 压到 26×44 → flex:none + line-height:1。
   D) .tech-specs-table（12 页，honors 最严重 744px vs 362px 可用宽）
      Module 51 的 th{min-width:104px} × 4 列 = 416px 是裁切根因 → 去掉强制列宽，
      表格 width:100% 自然换行收缩；真放不下的由 main.js 打 .pv-hscroll 显示滑动提示。
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* A) 时间线：纵向堆叠，年份不再被 flex 压缩 */
  .timeline-item { flex-direction: column !important; align-items: stretch !important; }
  .timeline-item:nth-child(even) { flex-direction: column !important; }
  .timeline-year {
    flex: 0 0 auto !important;
    width: auto !important;
    white-space: nowrap;
    margin: 0 0 10px !important;
    line-height: 1.2;
  }
  .timeline-content { width: auto !important; max-width: 100% !important; margin: 0 !important; }

  /* B) 联系页区域卡：允许换行，标签锁定不收缩 */
  .contact-region-item { flex-wrap: wrap !important; }
  .contact-region-item > strong { flex: 0 0 auto !important; white-space: nowrap; }
  .contact-region-item > .contact-region-dot { flex: 0 0 auto !important; }

  /* C) 案例页挑战卡图标：不收缩 */
  .cs2-tech .h .ic,
  .cs2-tech .h > div { flex: 0 0 auto; }
  .cs2-tech .h .ic { line-height: 1; }
  .cs2-tech .h > div { flex: 1 1 auto !important; min-width: 0 !important; }

  /* D) 参数表：去掉强制列宽，让表格自然收缩换行 */
  .tech-specs-table table { width: 100%; }
  .tech-specs-table th { min-width: 0 !important; width: auto !important; }
  .tech-specs-table th,
  .tech-specs-table td { padding: 8px 8px !important; font-size: 12.5px !important; }

  /* E) 设备参数行（about/en/about）：标签锁定不收缩，长内容整条换行 */
  .equip-specs { flex-wrap: wrap !important; }
  .equip-specs > span { flex: 0 1 auto; max-width: 100%; }
  .equip-specs > span > strong { flex-shrink: 0 !important; }

  /* F) 资源表 rs-table：表头取消 nowrap，6-7 列在 362px 内可自然收缩 */
  .rs-table th, .rs-table td { white-space: normal !important; }
}

/* D 补充：真放不下的表格由 main.js 打 .pv-hscroll，提示样式统一见下方「18d」段
   （2026-09-14：此处原定义已被模块 18d 取代——18d 支持表格/时间线/标签三种文案，
   保留占位说明以免后人重复定义时产生优先级冲突） */

/* ═══════════════════════════════════════════════════════════
   17) 统计数字条手机端横排（2026-09-14 Stone 指令：27+/4,200+/68/60+
       要横排，不要一列一个竖排下来）
   ═══════════════════════════════════════════════════════════
   17a) 内页「核心數據」.stats-row（about/manufacturing/projects-catalog/
        careers/partnerships 中英 10 页，各 4 项）
        style.css ≤768 把容器压成 width:40%，4 个数字被迫竖排。
        → 恢复整行：4 项一行均分，数字与短标签居中（标签最长 7 字放得下）。
   17b) 首页 .about-stats（4 项，标签较长）与 .trust-items（5 项）
        被「≤640 flex-basis:100%」压成单列 → 改两列横排。 */
@media (max-width: 768px) {
  body.premium .stats-row {
    width: 100% !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }
  body.premium .stats-row .stat-item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    text-align: center;
  }
  body.premium .stats-row .stat-number { font-size: 1.45rem !important; margin-bottom: 4px !important; }
  body.premium .stats-row .stat-label  { font-size: .68rem !important; line-height: 1.35 !important; }
}
@media (max-width: 360px) {
  body.premium .stats-row .stat-number { font-size: 1.25rem !important; }
  body.premium .stats-row .stat-label  { font-size: .62rem !important; }
}
@media (max-width: 640px) {
  body.premium .about-stats  { --gy: 20px; }
  body.premium .trust-items  { --gy: 20px; }
  body.premium .about-stats > *,
  body.premium .trust-items > * {
    flex-basis: calc((100% - var(--gx, 24px)) / 2) !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   18) iPad / 平板专项（2026-09-14 全站平板深度排查后的收口）
   ═══════════════════════════════════════════════════════════
   排查结论（WebKit 真内核，254 页 × 768/1024/1366 三断点）：
     0 处 JS 报错、0 次崩溃、0 处文档横向溢出、0 条中英文不一致；
     导航 14 组（7 尺寸 × 触屏/桌面网站两模式）点按展开与子项跳转全部通过；
     子菜单面板在 1180/1194/1366 均无边缘溢出（右溢出为负=完全在视口内）。
   因此本模块只补齐排查暴露的「体验与健壮性」缺口，不动已验证可用的交互链路：
     18a) 键盘焦点可见：Tab 聚焦导航项显示金色焦点环（iPad 外接键盘 / 无障碍）
     18b) 抽屉在平板加宽到 380px（原 300px 在 1024 屏上过窄）+ 100dvh 适配
          iPad Safari 动态工具栏，避免抽屉底部被工具栏吃掉
     18c) 悬浮球（WhatsApp / 返回顶部）加安全区内边距，横屏 home indicator 不遮挡
     18d) 横滑区提示文案通用化（.visual-timeline 里程碑 / .faqv2-chips 标签），
          由 main.js 实测 scrollWidth 后打 .pv-hscroll */

@supports (bottom: env(safe-area-inset-bottom)) {
  body.premium .whatsapp-float,
  body.premium .wpp-float.whatsapp-float {
    left: calc(22px + env(safe-area-inset-left, 0px)) !important;
    bottom: calc(26px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body.premium .back-to-top,
  body.premium .btt.back-to-top {
    right: calc(22px + env(safe-area-inset-right, 0px)) !important;
    bottom: calc(26px + env(safe-area-inset-bottom, 0px)) !important;
  }
  @media (max-width: 768px) {
    body.premium .whatsapp-float,
    body.premium .wpp-float.whatsapp-float {
      left: calc(16px + env(safe-area-inset-left, 0px)) !important;
      bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
    }
    body.premium .back-to-top,
    body.premium .btt.back-to-top {
      right: calc(16px + env(safe-area-inset-right, 0px)) !important;
      bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
    }
  }
}

/* 18d) 横滑提示：默认通用文案，表格沿用表格文案 */
.pv-hscroll { position: relative; }
.pv-hscroll::before {
  content: '← 左右滑動查看完整內容 →';
  display: block;
  font-size: 11px;
  color: #8a8277;
  text-align: right;
  padding: 0 2px 6px;
  letter-spacing: 1px;
}
.tech-specs-table.pv-hscroll::before,
.about-table-wrap.pv-hscroll::before,
.rs-table-wrap.pv-hscroll::before { content: '← 左右滑動查看完整表格 →'; }
html[lang="en"] .pv-hscroll::before { content: '← Swipe to view all →'; }
html[lang="en"] .tech-specs-table.pv-hscroll::before,
html[lang="en"] .about-table-wrap.pv-hscroll::before,
html[lang="en"] .rs-table-wrap.pv-hscroll::before { content: '← Swipe to view full table →'; }
@media (min-width: 769px) and (max-width: 1160px) {
  /* 平板：提示常显（此时导航为抽屉，宽度充裕） */
  .pv-hscroll::before { padding-bottom: 8px; }
}

/* ============================================================
   產品中心 · 石材種類 band（花崗岩/雲石/板石/人造石，2 一排）
   置於「十大系列」上方；本 band 與下方系列網格互不相干，
   下方系列仍維持 3 一排（由 .v2-series-grid 控制）。
   無專屬配圖，以色調色塊（swatch）+ 文字呈現，避免與系列卡圖重複使用。
   ============================================================ */
body.premium .v2-material-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 30px;
}
body.premium .v2-material-card {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 20px 22px;
  background: #fff;
  border: 1px solid rgba(26, 26, 46, 0.08);
  border-radius: 14px;
  text-decoration: none;
  transition: transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s;
}
body.premium .v2-material-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 60px rgba(17, 16, 15, 0.18);
}
body.premium .vmc-swatch {
  flex: 0 0 76px;
  width: 76px;
  height: 76px;
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.07);
}
body.premium .vmc-granite    { background: linear-gradient(135deg, #6b6f73 0%, #9aa0a4 45%, #4f5356 100%); }
body.premium .vmc-marble     { background: linear-gradient(135deg, #fbfaf7 0%, #ece7df 50%, #d9d2c6 100%); }
body.premium .vmc-slate      { background: linear-gradient(135deg, #3a4754 0%, #5b6b78 50%, #2b343d 100%); }
body.premium .vmc-engineered { background: linear-gradient(135deg, #e9e2d6 0%, #cdbfa6 50%, #b7a888 100%); }
body.premium .vmc-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
body.premium .vmc-body b {
  font-size: 1.16rem;
  color: var(--color-primary);
  display: flex;
  align-items: baseline;
  gap: 8px;
  line-height: 1.2;
}
body.premium .vmc-body b small {
  font-size: .72rem;
  font-weight: 400;
  color: var(--color-mid-gray);
  background: rgba(201, 168, 76, 0.12);
  padding: 1px 8px;
  border-radius: 999px;
}
body.premium .vmc-body i {
  font-style: normal;
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #C9A84C;
}
body.premium .vmc-d {
  font-size: .86rem;
  color: var(--color-mid-gray);
  line-height: 1.5;
  margin-top: 2px;
}
body.premium .vmc-go {
  font-size: .82rem;
  color: #C9A84C;
  font-weight: 600;
  margin-top: 4px;
  opacity: 0;
  transform: translateY(6px);
  transition: all .4s ease;
}
body.premium .v2-material-card:hover .vmc-go { opacity: 1; transform: translateY(0); }

@media (max-width: 760px) {
  body.premium .v2-material-grid { grid-template-columns: 1fr; }
  body.premium .v2-material-card { padding: 16px 18px; gap: 14px; }
  body.premium .vmc-swatch { flex-basis: 60px; width: 60px; height: 60px; }
}

/* ============================================================
   Module 54 — 麻石品種畫廊 Granite Varieties Gallery (2026-09-15)
   花崗岩（麻石）產品頁頂部：十大麻石品種，每款以 2×2
   四個樣本／視角拼圖呈現。圖片：images/products/granite-varieties/
   ============================================================ */
body.premium .granite-variety-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:20px;
  margin-top:10px;
}
body.premium .granite-variety-card{
  margin:0;
  background:#FFFFFF;
  border:1px solid var(--pv-hair,#DCD5CB);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 2px 14px rgba(16,14,10,.06);
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease, border-color .35s ease;
}
body.premium .granite-variety-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 34px rgba(16,14,10,.16);
  border-color:var(--pv-gold,#C2A25E);
}
body.premium .granite-variety-img{
  position:relative;
  aspect-ratio:1 / 1;
  overflow:hidden;
  background:#F1EEE8;
}
body.premium .granite-variety-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .5s cubic-bezier(.2,.7,.3,1);
}
body.premium .granite-variety-card:hover .granite-variety-img img{
  transform:scale(1.045);
}
body.premium .granite-variety-cap{
  display:block;
  padding:13px 10px 15px;
  text-align:center;
  font-size:15px;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--pv-ink,#14130F);
}
@media (max-width:1200px){
  body.premium .granite-variety-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:900px){
  body.premium .granite-variety-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
}
@media (max-width:560px){
  body.premium .granite-variety-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
  body.premium .granite-variety-cap{ font-size:13px; padding:9px 5px 11px; }
}


/* ============================================================
   Module 55 — 人造石品種 2-up 圖牆 Engineered Varieties Grid (2026-09-15)
   7 個人造石品種頁：每頁 2 張高清圖（各為 2×2 四樣本／視角拼圖）。
   卡片樣式沿用 Module 54 的 .granite-variety-card。
   ============================================================ */
body.premium .eng-variety-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
  margin-top:10px;
}
@media (max-width:900px){
  body.premium .eng-variety-grid{ gap:16px; }
}
@media (max-width:560px){
  body.premium .eng-variety-grid{ gap:11px; }
}

/* ============================================================
   Module 57 — 人造石（無縫石）品種：網格平鋪 + 點擊展開 (2026-09-15)
   Stone 指令：7 個品種不要全部展開；先以**網格式**平鋪，點哪個才展開哪個。
   兩層設計（漸進增強，避免 JS 失效時內容整批消失）：
     ① 基礎樣式（無 JS）＝ 全部展開的縱向堆疊，內容對 SEO／無 JS 友善，
        且與「其它系列頁一致的模式」相同（圖 → 技術參數 → 應用場景）。
     ② JS 給 .eng-vars-list 加 .is-ready → 切成網格 + 手風琴：
        未展開的 .eng-var-body 隱藏，被點開的那張 grid-column:1/-1 撐滿整行。
   卡片標題結構：<h3 class="eng-var-name"><span class="eng-var-idx">01</span>中文名
   <span class="eng-var-name-en">Quartz Stone</span></h3>
   —— 編號**行內**置於品名之前，這樣不論品名折幾行都與第一行對齊。
   為使同一列的卡片等高，.eng-var-name 有保留高度（見 .is-ready 段）。
   ============================================================ */

/* ---------- ① 基礎（＝無 JS 的完整展開版）---------- */
/* 註：原本此處有 `body.premium .eng-vars{ background:#fff; }`，
   但外層 section 已改用全站共用的 .product-content-section（本身即 #fff），
   該選擇器已無任何元素匹配 → 移除，避免死代碼。 */
body.premium .eng-vars-list{
  display:flex;
  flex-direction:column;
  gap:52px;
  margin-top:40px;
}
body.premium .eng-var{
  background:#faf8f4;
  border:1px solid #ece6da;
  border-radius:16px;
  padding:34px 34px 30px;
  scroll-margin-top:96px;
  transition:box-shadow .35s ease, border-color .35s ease;
}
body.premium .eng-var-head{
  display:block;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
body.premium .eng-var-head:focus-visible{
  outline:2px solid var(--pv-gold);
  outline-offset:4px;
  border-radius:14px;
}
body.premium .eng-var-media{
  display:block;
  border-radius:12px;
  overflow:hidden;
  margin-bottom:22px;
  background:#efece5;
  line-height:0;
}
body.premium .eng-var-media img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:3 / 2;
  object-fit:cover;
  transition:transform .55s cubic-bezier(.2,.8,.2,1);
}
body.premium .eng-var-head:hover .eng-var-media img{ transform:scale(1.04); }
body.premium .eng-var-meta{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:4px;
}
body.premium .eng-var-name{
  flex:1 1 auto;
  min-width:0;
  margin:0;
  font-size:24px;
  line-height:1.28;
}
body.premium .eng-var-idx{
  font-family:'Playfair Display', serif;
  font-size:26px;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--pv-gold);
  margin-right:13px;
}
body.premium .eng-var-name-en{
  display:block;
  margin-top:6px;
  font-family:'Inter', sans-serif;
  font-size:12.5px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--pv-gold) !important;
}
/* 無 JS 時沒有展開行為 → 不顯示 +/− 指示，避免誤導 */
body.premium .eng-var-caret{ display:none; }
body.premium .eng-var-desc{
  margin:0 0 4px;
  max-width:940px;
  font-size:15px;
  line-height:1.85;
  color:var(--pv-muted);
}
body.premium .eng-var-subhead{
  margin:32px 0 15px;
  padding-left:15px;
  position:relative;
  font-size:17px;
  font-weight:600;
  color:var(--pv-ink);
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:9px;
}
body.premium .eng-var-subhead::before{
  content:'';
  position:absolute;
  left:0; top:.42em;
  width:4px; height:15px;
  border-radius:1px;
  background:var(--pv-gold);
}
body.premium .eng-var-subhead span{
  font-family:'Inter', sans-serif;
  font-size:11px;
  font-weight:400;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--pv-soft);
}
body.premium .eng-var .surface-treatment-section{ margin-top:32px; }

/* ---------- ② JS 就緒：網格 + 手風琴 ---------- */
body.premium .eng-vars-list.is-ready{
  display:grid;
  /* 12 軌網格：欄位由卡片自行 span，才能做到「上四下三滿鋪」 */
  grid-template-columns:repeat(12, minmax(0,1fr));
  gap:18px;
  align-items:start;
}
body.premium .eng-vars-list.is-ready > .eng-var{
  padding:0;
  overflow:hidden;
}
/* 上排 4 張：各 span 3（＝1/4），與原本 4 欄佈局視覺完全等寬 */
body.premium .eng-vars-list.is-ready > .eng-var:nth-child(-n+4){
  grid-column:span 3;
}
/* 下排 3 張：各 span 4（＝1/3）→ 整行滿鋪，右緣與上排對齊 */
body.premium .eng-vars-list.is-ready > .eng-var:nth-child(n+5){
  grid-column:span 4;
}
body.premium .eng-vars-list.is-ready > .eng-var:hover{
  border-color:rgba(194,162,94,.5);
  box-shadow:0 10px 26px rgba(0,0,0,.07);
}
body.premium .eng-vars-list.is-ready > .eng-var.is-open{
  grid-column:1 / -1;
  border-color:rgba(194,162,94,.45);
  box-shadow:0 20px 50px rgba(0,0,0,.1);
}
body.premium .eng-vars-list.is-ready .eng-var-media{
  border-radius:15px 15px 0 0;
  margin-bottom:0;
}
body.premium .eng-vars-list.is-ready .eng-var-media img{ aspect-ratio:4 / 3; }
body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-media img{
  aspect-ratio:8 / 3;
  transform:none;
}
body.premium .eng-vars-list.is-ready .eng-var-meta{ padding:15px 18px 16px; margin-bottom:0; }
body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-meta{ padding:20px 34px 14px; }
body.premium .eng-vars-list.is-ready .eng-var-idx{ font-size:14px; margin-right:8px; }
body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-idx{ font-size:26px; margin-right:13px; }
/* 保留 2 行標題 + 2 行英文名的高度 → 同一列卡片必然等高 */
body.premium .eng-vars-list.is-ready .eng-var-name{ font-size:16.5px; min-height:74px; }
body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-name{ font-size:24px; min-height:0; }
body.premium .eng-vars-list.is-ready .eng-var-name-en{
  font-size:10.5px;
  line-height:1.3;
  min-height:2.6em;
  margin-top:4px;
}
body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-name-en{
  font-size:12.5px;
  line-height:1.35;
  min-height:0;
  margin-top:6px;
}
/* +/− 展開指示（僅 JS 就緒時出現） */
body.premium .eng-vars-list.is-ready .eng-var-caret{
  display:block;
  flex:0 0 auto;
  position:relative;
  width:24px; height:24px;
  border:1px solid rgba(194,162,94,.62);
  border-radius:50%;
}
body.premium .eng-vars-list.is-ready .eng-var-caret::before,
body.premium .eng-vars-list.is-ready .eng-var-caret::after{
  content:'';
  position:absolute;
  left:50%; top:50%;
  background:var(--pv-gold);
  transform:translate(-50%,-50%);
  transition:transform .3s ease, opacity .3s ease;
}
body.premium .eng-vars-list.is-ready .eng-var-caret::before{ width:10px; height:1.5px; }
body.premium .eng-vars-list.is-ready .eng-var-caret::after{ width:1.5px; height:10px; }
body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-caret::after{
  transform:translate(-50%,-50%) scaleY(.15);
  opacity:0;
}
/* ── 「查看詳情」CTA：與品名同列置於右側，右向箭頭＋文字，外觀恆定（減少縱向留白） ── */
body.premium .eng-var-cta{ display:none; }
body.premium .eng-vars-list.is-ready .eng-var-cta{
  display:inline-flex;
  position:relative;
  align-items:center;
  gap:5px;
  flex:0 0 auto;
  padding:6px 10px;
  border-radius:999px;
  background:var(--pv-gold,#C9A84C);
  border:1px solid var(--pv-gold,#C9A84C);
  color:#1A1A2E;
  font-size:12px;
  font-weight:700;
  letter-spacing:.03em;
  line-height:1;
  white-space:nowrap;
  box-shadow:0 3px 10px rgba(201,168,76,.30);
  transition:transform .25s ease,box-shadow .25s ease;
}
body.premium .eng-vars-list.is-ready .eng-var-cta:hover{ transform:translateY(-1px); }
body.premium .eng-vars-list.is-ready .eng-var-cta-icon{
  flex:0 0 auto;
  width:14px; height:14px;                /* 右向箭頭（→），外觀恆定不隨展開變化 */
}
/* meta 維持橫排：品名在左（flex:1）、CTA 在右，兩者並排同列 */
body.premium .eng-vars-list.is-ready .eng-var-meta{
  flex-direction:row;
  align-items:center;
  gap:10px;
  text-align:left;
}
/* ≤560 手機：卡片窄（meta≈174px），文字鈕會把長品名擠到不等高 → 降級為純箭頭圓鈕並排（保持低留白） */
@media (max-width:560px){
  body.premium .eng-vars-list.is-ready .eng-var-cta{ width:30px; height:30px; padding:0; border-radius:50%; justify-content:center; gap:0; }
  body.premium .eng-vars-list.is-ready .eng-var-cta .eng-var-cta-txt{ display:none; }
  body.premium .eng-vars-list.is-ready .eng-var-cta-icon{ width:13px; height:13px; }
}
/* 未展開 → 收起內容；展開 → 顯示並補內距 */
body.premium .eng-vars-list.is-ready .eng-var-body{ display:none; }
body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-body{
  display:block;
  padding:0 34px 32px;
}

@media (max-width:1200px){
  /* 每列 3 張：各 span 4（＝1/3）；落單的末項鋪滿整行（沿用 Module 51 慣例） */
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(-n+4){ grid-column:span 4; }
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(n+5){ grid-column:span 4; }
  body.premium .eng-vars-list.is-ready > .eng-var:last-child:nth-child(3n+1){
    grid-column:1 / -1;
  }
}
@media (max-width:900px){
  body.premium .eng-vars-list{ gap:34px; margin-top:30px; }
  body.premium .eng-vars-list.is-ready{ gap:14px; }
  /* 每列 2 張：各 span 6（＝1/2）；落單的末項鋪滿整行 */
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(-n+4){ grid-column:span 6; }
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(n+5){ grid-column:span 6; }
  body.premium .eng-vars-list.is-ready > .eng-var:last-child:nth-child(odd){
    grid-column:1 / -1;
  }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-meta{ padding:18px 22px 12px; }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-body{ padding:0 22px 26px; }
  body.premium .eng-var{ padding:24px 20px 22px; border-radius:14px; }
  body.premium .eng-var-idx{ font-size:22px; }
  body.premium .eng-var-name{ font-size:21px; }
}
@media (max-width:560px){
  body.premium .eng-vars-list{ gap:34px; }
  body.premium .eng-vars-list.is-ready{ gap:11px; margin-top:26px; }
  body.premium .eng-vars-list.is-ready .eng-var-meta{ padding:12px 13px 13px; gap:9px; }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-meta{ padding:15px 16px 11px; }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-body{ padding:0 16px 22px; }
  body.premium .eng-vars-list.is-ready .eng-var-media img{ aspect-ratio:1 / 1; }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-media img{ aspect-ratio:4 / 3; }
  body.premium .eng-vars-list.is-ready .eng-var-idx{ font-size:12px; margin-right:5px; }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-idx{ font-size:20px; margin-right:8px; }
  body.premium .eng-vars-list.is-ready .eng-var-name{ font-size:14px; min-height:78px; }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-name{ font-size:19px; min-height:0; }
  body.premium .eng-vars-list.is-ready .eng-var-name-en{ font-size:9.5px; margin-top:3px; }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-name-en{ font-size:11px; margin-top:4px; }
  body.premium .eng-vars-list.is-ready .eng-var-caret{ width:20px; height:20px; }
  body.premium .eng-var{ padding:20px 15px 18px; }
  body.premium .eng-var-media{ margin-bottom:16px; }
  body.premium .eng-var-idx{ font-size:19px; margin-right:8px; }
  body.premium .eng-var-name{ font-size:18px; }
  body.premium .eng-var-desc{ font-size:14px; line-height:1.8; }
  body.premium .eng-var-subhead{ font-size:15.5px; margin:24px 0 12px; }
}

/* 展開項必須整行鋪滿：本條刻意放在所有 span 規則與媒體查詢「之後」，
   以相同特異度靠來源順序取勝。⚠️ 勿上移，否則展開會被 span 規則壓掉。 */
body.premium .eng-vars-list.is-ready > .eng-var.is-open{
  grid-column:1 / -1;
}

/* ============================================================
   Module 58 — 人造石（無縫石）頁：內容擴充區塊 (2026-09-15)
   Stone 指令：頁面留白過多，需補充詳實內容、排版與全站一致、
   視覺衝擊力不得遜於其它系列頁、頁頭需有人造石背景圖。
   本模組只定義「站上原本沒有」的四類區塊；其餘一律沿用既有類
   （product-hero / product-action-bar / product-section-title /
   product-video-* / granite-variety-* / spec-* / application-* /
   surface-treatment-* / specs-dimensions-* / products-cta），
   以確保與其它系列頁的排版完全一致。
     A. .eng-adv-*     核心優勢 6 卡
     B. .eng-stat-*    數據條（手機維持橫排 2×2，站規）
     C. .eng-cmp-*     七品種橫向對比總表（≤760 轉卡片式）
     D. .eng-process-* 選材到安裝 4 步
     E. .eng-faq-*     常見問題（原生 <details>，零 JS 相依）
   ============================================================ */

/* ---------- A. 核心優勢 ---------- */
body.premium .eng-adv-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  margin-top:38px;
}
body.premium .eng-adv-card{
  position:relative;
  background:#fff;
  border:1px solid var(--pv-hair);
  border-radius:14px;
  padding:28px 26px 26px;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s;
}
body.premium .eng-adv-card::before{
  content:'';position:absolute;left:26px;top:0;width:34px;height:2px;
  background:var(--pv-gold);opacity:.85;
}
body.premium .eng-adv-card:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 50px rgba(20,19,15,.10);
  border-color:var(--pv-gold);
}
body.premium .eng-adv-icon{
  display:block;font-size:26px;line-height:1;margin-bottom:14px;
}
body.premium .eng-adv-title{
  font-size:17px;font-weight:700;margin:0 0 10px;letter-spacing:.01em;
  font-family:'Noto Serif TC',serif;
}
body.premium .eng-adv-text{
  font-size:14.5px;line-height:1.8;color:var(--pv-muted);margin:0;
}

/* ---------- B. 數據條 ---------- */
body.premium .eng-stat-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  margin-top:34px;
  background:var(--pv-deep);
  border-radius:14px;
  overflow:hidden;
}
body.premium .eng-stat{
  padding:26px 18px;
  text-align:center;
  border-right:1px solid rgba(255,255,255,.09);
}
body.premium .eng-stat:last-child{ border-right:0; }
body.premium .eng-stat-num{
  font-family:'Noto Serif TC',serif;
  font-size:32px;font-weight:700;line-height:1.1;
  color:var(--pv-gold) !important;
  letter-spacing:.01em;
}
body.premium .eng-stat-label{
  margin-top:8px;font-size:13px;line-height:1.5;
  color:var(--pv-deep-muted) !important;
}

/* ---------- C. 七品種對比總表 ---------- */
body.premium .eng-cmp-wrap{
  margin-top:34px;
  border:1px solid var(--pv-hair);
  border-radius:14px;
  overflow:auto;
  background:#fff;
  -webkit-overflow-scrolling:touch;
}
body.premium .eng-cmp-table{
  width:100%;
  min-width:940px;
  border-collapse:collapse;
  font-size:13.5px;
}
body.premium .eng-cmp-table thead th{
  background:var(--pv-deep);
  color:var(--pv-deep-text) !important;
  font-weight:600;
  font-size:12.5px;
  letter-spacing:.04em;
  text-align:left;
  padding:14px 14px;
  white-space:nowrap;
  border-right:1px solid rgba(255,255,255,.08);
}
body.premium .eng-cmp-table thead th:last-child{ border-right:0; }
body.premium .eng-cmp-table tbody tr{ border-top:1px solid var(--pv-hair); }
body.premium .eng-cmp-table tbody tr:nth-child(even){ background:#FBF9F6; }
body.premium .eng-cmp-table tbody th{
  text-align:left;
  padding:15px 14px;
  vertical-align:top;
  font-weight:600;
  white-space:nowrap;
  border-right:1px solid var(--pv-hair);
}
body.premium .eng-cmp-table tbody td{
  padding:15px 14px;
  color:var(--pv-muted) !important;
  vertical-align:top;
  border-right:1px solid rgba(220,213,203,.55);
}
body.premium .eng-cmp-table tbody td:last-child{ border-right:0; }
body.premium .eng-cmp-name{ display:block; font-size:14px; }
body.premium .eng-cmp-name-en{
  display:block;margin-top:3px;font-size:11px;font-weight:400;
  letter-spacing:.04em;color:var(--pv-soft) !important;
}

/* ---------- D. 服務流程 ---------- */
body.premium .eng-process-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  margin-top:38px;
  counter-reset:engstep;
}
body.premium .eng-process-step{
  position:relative;
  background:#fff;
  border:1px solid var(--pv-hair);
  border-radius:14px;
  padding:28px 24px 26px;
}
body.premium .eng-process-step::after{
  content:'';
  position:absolute;
  top:46px;
  right:-12px;
  width:22px;height:1px;
  background:var(--pv-hair);
}
body.premium .eng-process-step:last-child::after{ display:none; }
body.premium .eng-process-num{
  display:inline-block;
  font-family:'Noto Serif TC',serif;
  font-size:26px;
  font-weight:700;
  line-height:1;
  color:var(--pv-gold) !important;
  margin-bottom:12px;
}
body.premium .eng-process-title{
  font-size:16.5px;font-weight:700;margin:0 0 9px;
  font-family:'Noto Serif TC',serif;
}
body.premium .eng-process-text{
  font-size:14px;line-height:1.8;color:var(--pv-muted);margin:0;
}

/* ---------- E. 常見問題 ---------- */
body.premium .eng-faq-list{
  max-width:920px;
  margin:34px auto 0;
  display:grid;
  gap:12px;
}
body.premium .eng-faq-item{
  background:#fff;
  border:1px solid var(--pv-hair);
  border-radius:12px;
  transition:border-color .35s,box-shadow .35s;
}
body.premium .eng-faq-item:hover{ border-color:rgba(194,162,94,.55); }
body.premium .eng-faq-item[open]{
  border-color:var(--pv-gold);
  box-shadow:0 14px 34px rgba(20,19,15,.07);
}
body.premium .eng-faq-q{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:19px 22px;
  cursor:pointer;
  list-style:none;
  font-size:15.5px;
  font-weight:600;
  line-height:1.6;
  color:var(--pv-ink) !important;
}
body.premium .eng-faq-q::-webkit-details-marker{ display:none; }
body.premium .eng-faq-q::marker{ content:''; }
body.premium .eng-faq-icon{
  flex:0 0 auto;
  position:relative;
  width:20px;height:20px;
  margin-top:2px;
  border:1px solid var(--pv-hair);
  border-radius:50%;
  transition:transform .35s,border-color .35s;
}
body.premium .eng-faq-icon::before,
body.premium .eng-faq-icon::after{
  content:'';position:absolute;top:50%;left:50%;
  background:var(--pv-gold);
  transform:translate(-50%,-50%);
}
body.premium .eng-faq-icon::before{ width:9px;height:1.5px; }
body.premium .eng-faq-icon::after{ width:1.5px;height:9px; transition:opacity .3s; }
body.premium .eng-faq-item[open] .eng-faq-icon{ border-color:var(--pv-gold); transform:rotate(180deg); }
body.premium .eng-faq-item[open] .eng-faq-icon::after{ opacity:0; }
body.premium .eng-faq-a{
  padding:0 22px 20px;
  border-top:1px solid rgba(220,213,203,.6);
  margin-top:-1px;
}
body.premium .eng-faq-a p{
  margin:16px 0 0;
  font-size:14.5px;
  line-height:1.9;
  color:var(--pv-muted) !important;
}

/* ---------- 響應式 ---------- */
@media (max-width:1200px){
  body.premium .eng-adv-grid{ gap:18px; }
  body.premium .eng-process-grid{ gap:18px; }
}
@media (max-width:900px){
  body.premium .eng-adv-grid{ grid-template-columns:repeat(2,1fr); }
  body.premium .eng-process-grid{ grid-template-columns:repeat(2,1fr); }
  body.premium .eng-process-step::after{ display:none; }
  body.premium .eng-stat{ padding:22px 12px; }
  body.premium .eng-stat-num{ font-size:27px; }
}
@media (max-width:760px){
  /* 對比總表轉卡片式，避免手機橫向滾動 */
  body.premium .eng-cmp-wrap{ border:0; border-radius:0; overflow:visible; background:transparent; }
  body.premium .eng-cmp-table{ min-width:0; font-size:14px; }
  body.premium .eng-cmp-table thead{ display:none; }
  body.premium .eng-cmp-table,
  body.premium .eng-cmp-table tbody,
  body.premium .eng-cmp-table tr,
  body.premium .eng-cmp-table th,
  body.premium .eng-cmp-table td{ display:block; width:100%; }
  body.premium .eng-cmp-table tbody tr{
    background:#fff !important;
    border:1px solid var(--pv-hair);
    border-radius:12px;
    margin-bottom:14px;
    overflow:hidden;
  }
  body.premium .eng-cmp-table tbody th{
    background:var(--pv-warm);
    border-right:0;
    border-bottom:1px solid var(--pv-hair);
    padding:13px 16px;
    white-space:normal;
  }
  body.premium .eng-cmp-table tbody td{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:16px;
    padding:10px 16px;
    border-right:0;
    border-bottom:1px solid rgba(220,213,203,.45);
    text-align:right;
  }
  body.premium .eng-cmp-table tbody td:last-child{ border-bottom:0; }
  body.premium .eng-cmp-table tbody td::before{
    content:attr(data-label);
    flex:0 0 44%;
    text-align:left;
    font-size:12px;
    color:var(--pv-soft) !important;
  }
}
@media (max-width:560px){
  body.premium .eng-adv-grid{ grid-template-columns:1fr; gap:14px; }
  body.premium .eng-adv-card{ padding:24px 20px 22px; }
  body.premium .eng-adv-card::before{ left:20px; }
  /* 站規：數據條手機端必須橫排，不許一列一個 */
  body.premium .eng-stat-row{ grid-template-columns:repeat(2,1fr); margin-top:26px; }
  body.premium .eng-stat{ padding:20px 10px; }
  body.premium .eng-stat:nth-child(2){ border-right:0; }
  body.premium .eng-stat:nth-child(1),
  body.premium .eng-stat:nth-child(2){ border-bottom:1px solid rgba(255,255,255,.09); }
  body.premium .eng-stat-num{ font-size:24px; }
  body.premium .eng-stat-label{ font-size:12px; }
  body.premium .eng-process-grid{ grid-template-columns:1fr; gap:14px; }
  body.premium .eng-process-step{ padding:24px 20px 22px; }
  body.premium .eng-faq-q{ padding:17px 18px; font-size:14.5px; gap:12px; }
  body.premium .eng-faq-a{ padding:0 18px 18px; }
  body.premium .eng-faq-a p{ font-size:14px; }
}

/* ============================================================
   Module 59 — 全站網格「滿鋪」收尾：末行補齊 + 跨裝置等高 (2026-09-15)
   Stone 指令：① 參照全站網格對齊規則修正；② 「石材鑒賞」補圖使上下對應；
   ③ 七品種改「上四下三滿鋪」；④ 優化平板／手機排版，減少大面積留白，
      確保內容飽滿、跨螢幕一致。
   本模組只做「填補末行 + 讓補位圖與同列等高」，**不改任何欄數斷點**
   （欄數仍由 Module 54 / 57 決定），故對現有版面為純增量。
   做法沿用站上既有慣例（Module 51）：
     「多列網格中若最後一行未滿，末項橫向鋪滿整行」。

   A. .eng-gallery-grid（人造石頁「石材鑒賞」畫廊，10 張場景照）
        ⚠️ 只作用於人造石頁 —— 該頁畫廊是**單張場景照**，可安全裁成寬幅；
        花崗岩（麻石）頁的 .granite-variety-grid 是 **2×2 四樣本拼圖**，
        若同樣拉伸並改比例會把樣本裁掉，故刻意不含在內。
        5 欄 → 5+5            天然滿鋪
        4 欄 → 4+4+2          第 9、10 張各跨 2 欄；比例 2:1 使高度與上方一致
        3 欄 → 3+3+3+1        第 10 張跨滿整行；比例 3:1
        2 欄 → 2×5            天然滿鋪（須復原上面兩段的跨欄與比例）
   B. .eng-vars-list.is-ready（人造石七品種）
        4 欄 → 上四下三；下排 3 張較寬，比例 4:3 → 9:5 以與上排等高
        3 欄 → 3+3+1；末項跨滿整行，比例 4:1
        2 欄 → 2+2+2+1；末項跨滿整行，比例 8:3
        ≤560 → 直式縮圖 1:1；展開項 4:3

   ⚠️ 兩條維護鐵律：
     1. 本模組必須留在檔案最後 —— 它靠「同特異度、後出現者勝」覆蓋
        Module 54 / 57 的規則；搬前面就會失效。
     2. 每個在寬斷點新增的跨欄／比例規則，都要在更窄的斷點「明確復原」，
        否則會外溢（v1 就是漏了這兩處）。
   ============================================================ */

/* ---------- A. 圖片畫廊末行補齊 ---------- */

/* 4 欄：10 = 4+4+2 → 末行兩張各跨 2 欄（＝半寬），比例 2:1 與上方等高 */
@media (max-width:1200px){
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+1):nth-last-child(2),
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+2):last-child{
    grid-column:span 2;
  }
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+1):nth-last-child(2) .granite-variety-img,
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+2):last-child .granite-variety-img{
    aspect-ratio:2 / 1;
  }
}

/* 3 欄：10 = 3+3+3+1 → 末項跨滿整行，比例 3:1
   同時復原「4 欄那組」的跨欄與比例，否則 9、10 會各自換行 */
@media (max-width:900px){
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+1):nth-last-child(2),
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+2):last-child{
    grid-column:auto;
  }
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+1):nth-last-child(2) .granite-variety-img,
  body.premium .eng-gallery-grid > .granite-variety-card:nth-child(4n+2):last-child .granite-variety-img{
    aspect-ratio:1 / 1;
  }
  body.premium .eng-gallery-grid > .granite-variety-card:last-child:nth-child(3n+1){
    grid-column:1 / -1;
  }
  body.premium .eng-gallery-grid > .granite-variety-card:last-child:nth-child(3n+1) .granite-variety-img{
    aspect-ratio:3 / 1;
  }
}

/* 2 欄：10 = 2×5 天然滿鋪 → 全部復原 */
@media (max-width:560px){
  body.premium .eng-gallery-grid > .granite-variety-card:last-child:nth-child(3n+1){
    grid-column:auto;
  }
  body.premium .eng-gallery-grid > .granite-variety-card:last-child:nth-child(3n+1) .granite-variety-img{
    aspect-ratio:1 / 1;
  }
}

/* ---------- B. 人造石七品種：下排／末項比例對齊 ---------- */

/* 4 欄上四下三：下排 3 張較寬，比例 4:3 → 9:5 以維持與上排相同高度 */
body.premium .eng-vars-list.is-ready > .eng-var:nth-child(n+5) .eng-var-media img{
  aspect-ratio:9 / 5;
}

@media (max-width:1200px){
  /* 3 欄：下排分組不再存在 → 復原 9:5；末項跨滿整行改用 4:1 */
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(n+5) .eng-var-media img{
    aspect-ratio:4 / 3;
  }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-media img{
    aspect-ratio:8 / 3;
  }
  body.premium .eng-vars-list.is-ready > .eng-var:last-child:nth-child(3n+1) .eng-var-media img{
    aspect-ratio:4 / 1;
  }
}

@media (max-width:900px){
  /* 2 欄：末項跨滿整行 → 8:3（與同列卡片等高） */
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-media img{
    aspect-ratio:8 / 3;
  }
  body.premium .eng-vars-list.is-ready > .eng-var:last-child:nth-child(odd) .eng-var-media img{
    aspect-ratio:8 / 3;
  }
}

@media (max-width:560px){
  /* 手機為直式縮圖 1:1 → 復原 9:5；展開項維持 4:3 */
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(n+5) .eng-var-media img{
    aspect-ratio:1 / 1;
  }
  /* 末項（第 7 張）在 2 欄下鋪滿整行 → 需改 ~2:1 才與同列卡片等高。
     這條特異度 (0,6,1) 與上面 ≤900 的 :last-child:nth-child(odd) 相同，
     靠「後出現者勝」蓋掉它的 8:3（8:3 在手機太扁，會矮掉 39px）。 */
  body.premium .eng-vars-list.is-ready > .eng-var:last-child:nth-child(odd) .eng-var-media img{
    aspect-ratio:2 / 1;
  }
  body.premium .eng-vars-list.is-ready > .eng-var.is-open .eng-var-media img,
  body.premium .eng-vars-list.is-ready > .eng-var.is-open:last-child:nth-child(odd) .eng-var-media img{
    aspect-ratio:4 / 3;
  }
}

/* ============================================================
   Module 59-ext — 产品中心其余固定栏位网格「末行补齊」(2026-09-16)
   沿用 Module 51/59 既有惯例：「多列网格末行未满，末项横向铺满整行」。
   Module 59 已处理 .eng-gallery-grid 与 .eng-vars-list.is-ready，
   本段补齐其余固定栏位产品中心网格（优势卡 / 服务流程 / 品种样本墙 / 产品图库 / 参数表）。
   ⚠️ 与 Module 59 同铁律：本段必须留在档案最末，靠「同特异度、后出现者胜」覆盖既有栏数规则；
       只做末行补位增量，绝不改任何栏数断点。每个较宽断点新增的跨栏规则，
       都要在更窄断点「明确复原」，否则会外溢（见 Module 59 注释）。
   ============================================================ */

/* A. 核心优势卡（桌面 3 栏 / ≤900 2 栏 / ≤560 1 栏） */
body.premium .eng-adv-grid > .eng-adv-card:last-child:nth-child(3n+1){ grid-column:1 / -1; }
@media (max-width:900px){
  /* 2 栏时：先复原上面 3 栏的跨栏，再对「2+1」的末项（奇数位）铺满 */
  body.premium .eng-adv-grid > .eng-adv-card:last-child:nth-child(3n+1){ grid-column:auto; }
  body.premium .eng-adv-grid > .eng-adv-card:last-child:nth-child(odd){ grid-column:1 / -1; }
}
@media (max-width:560px){
  /* 1 栏天然满铺 → 复原 2 栏的跨栏 */
  body.premium .eng-adv-grid > .eng-adv-card:last-child:nth-child(odd){ grid-column:auto; }
}

/* B. 服务流程（桌面 4 栏 / ≤900 2 栏 / ≤560 1 栏） */
body.premium .eng-process-grid > .eng-process-step:last-child:nth-child(4n+1){ grid-column:1 / -1; }
@media (max-width:900px){
  body.premium .eng-process-grid > .eng-process-step:last-child:nth-child(4n+1){ grid-column:auto; }
  body.premium .eng-process-grid > .eng-process-step:last-child:nth-child(odd){ grid-column:1 / -1; }
}
@media (max-width:560px){
  body.premium .eng-process-grid > .eng-process-step:last-child:nth-child(odd){ grid-column:auto; }
}

/* C. 品种样本图墙（恒为 2 栏，栏数不变） */
body.premium .eng-variety-grid > .granite-variety-card:last-child:nth-child(odd){ grid-column:1 / -1; }

/* D. 产品图库（5 栏 / ≤1024 3 栏 / ≤640 2 栏；原规则带 !important，这里同加 !important） */
body.premium .product-gallery-grid > .product-gallery-item:last-child:nth-child(5n+1){ grid-column:1 / -1 !important; }
@media (max-width:1024px){
  body.premium .product-gallery-grid > .product-gallery-item:last-child:nth-child(5n+1){ grid-column:auto !important; }
  body.premium .product-gallery-grid > .product-gallery-item:last-child:nth-child(3n+1){ grid-column:1 / -1 !important; }
}
@media (max-width:640px){
  body.premium .product-gallery-grid > .product-gallery-item:last-child:nth-child(3n+1){ grid-column:auto !important; }
  body.premium .product-gallery-grid > .product-gallery-item:last-child:nth-child(odd){ grid-column:1 / -1 !important; }
}

/* ============================================================
   C-4-ext-2：品种手风琴 6 品種 → 桌面 3+3 滿鋪（2026-09-16）
   問題：Module 57 桌面規則（上四 span3 / 下排 span4）對 7 品種得 4+3（已批准），
   但對 20 個 6 品種頁得「4 + 2（各 span4＝8 軌，留 4 軌空）」→ 右下角空缺，
   Stone 判定「還是沒修復」。
   修法：僅在桌面（>1200px）對「恰好 6 張」的清單，把前 4 張也改 span 4
   （與 5/6 張同寬），形成 3+3 滿鋪；7 張清單（:nth-last-child 不匹配）完全不受影響，維持 4+3。
   ⚠️ 用 :nth-child(k):nth-last-child(7-k) 精準命中「恰 6 張」，不會外溢到 7 張；
      包在 min-width:1201px，避免污染 ≤900 的 2 欄（span6）布局。
   ============================================================ */
@media (min-width:1201px){
  /* 6 品種：前 4 張「未展開時」改 span 4 → 與 5/6 張同寬，整體 3+3 滿鋪。
     ⚠️ 必須加 :not(.is-open)：否則展開時這條 (0,6,1) 會壓過 .is-open 的 1/-1，
     導致 6 品種點開後仍卡在 1/3 寬、內文被擠成高窄條（Stone 說的「顯示錯誤」）。 */
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(1):nth-last-child(6):not(.is-open),
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(2):nth-last-child(5):not(.is-open),
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(3):nth-last-child(4):not(.is-open),
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(4):nth-last-child(3):not(.is-open){
    grid-column:span 4;
  }
  /* 1/3 寬卡片統一 9:5（同前，限未展開）；展開時回落到 .is-open 的 8:3，與 7 品種一致 */
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(1):nth-last-child(6):not(.is-open) .eng-var-media img,
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(2):nth-last-child(5):not(.is-open) .eng-var-media img,
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(3):nth-last-child(4):not(.is-open) .eng-var-media img,
  body.premium .eng-vars-list.is-ready > .eng-var:nth-child(4):nth-last-child(3):not(.is-open) .eng-var-media img{
    aspect-ratio:9 / 5;
  }
}

/* ============================================================
   模块 60 · 页脚重构 v2（2026-09-17 续做）
   设计目标：对称 / 大气 / 视觉冲击力 / 彰显大公司定位
   结构：CTA 吸睛条 + 四列等宽链接（品牌列加宽）+ 整行产品矩阵（6 列两排）+ 底栏
   ① 彻底消除旧版 5 列不规则 fr 导致的列高参差与「全部系列」箭头错位；
   ② 所有列标题统一样式、顶部对齐；矩阵标题行 flex 右对齐「全部系列 →」；
   ③ 产品矩阵整行 6 列网格（12 项 = 2 行 6 列），hover 为金边卡片，强对称性；
   ④ 保留深色底 + 金色标题体系；CTA 条用金色渐变描边制造视觉焦点。
   ⑤ 响应式：≤1180 品牌整行 + 3 列；≤900 CTA 竖排 + 2 列；≤700 矩阵 3 列；≤560 矩阵 2 列。
   ============================================================ */
/* 页脚整体留白（base .footer padding 仅 32 0 0，补底部） */
body.premium .ft-v2 { padding-bottom: 42px !important; }

/* ① CTA 吸睛条 */
body.premium .ft-v2 .ft-cta {
  display: flex; align-items: center; justify-content: space-between; gap: 32px;
  padding: 28px 34px; margin-bottom: 40px;
  background: linear-gradient(120deg, rgba(212,180,122,.16), rgba(212,180,122,.05));
  border: 1px solid rgba(212,180,122,.32);
  border-radius: 18px;
}
body.premium .ft-v2 .ft-cta-txt { min-width: 0; }
body.premium .ft-v2 .ft-cta-kicker {
  margin: 0 0 9px; font-size: .62rem; letter-spacing: .24em; text-transform: uppercase;
  color: rgba(229,204,138,.82); font-weight: 600;
}
body.premium .ft-v2 .ft-cta-title {
  margin: 0 0 7px; font-size: 1.32rem; font-weight: 700; color: #fff; letter-spacing: .01em;
}
body.premium .ft-v2 .ft-cta-sub { margin: 0; font-size: .85rem; line-height: 1.65; color: rgba(255,255,255,.66); }
body.premium .ft-v2 .ft-cta-actions { display: flex; gap: 14px; flex-shrink: 0; }
body.premium .ft-v2 .ft-cta-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 13px 28px; border-radius: 999px; font-size: .86rem; font-weight: 600;
  text-decoration: none; white-space: nowrap; transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
body.premium .ft-v2 .ft-cta-solid { background: #C9A84C; color: #1A1A2E; box-shadow: 0 6px 18px rgba(201,168,76,.28); }
body.premium .ft-v2 .ft-cta-solid:hover { background: #E5CC8A; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(229,204,138,.36); }
body.premium .ft-v2 .ft-cta-line { background: transparent; color: #E5CC8A; border: 1px solid rgba(229,204,138,.5); }
body.premium .ft-v2 .ft-cta-line:hover { background: rgba(229,204,138,.12); transform: translateY(-2px); }

/* ② 四列等宽链接 */
body.premium .ft-v2 .ft-cols {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.15fr;
  gap: 40px 32px; padding-bottom: 38px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}
body.premium .ft-v2 .ft-col { min-width: 0; }
body.premium .ft-v2 .ft-col .ft-h {
  margin: 0 0 16px !important; padding: 0 0 12px;
  font-size: .76rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  color: #D4B47A; border-bottom: 1px solid rgba(212,180,122,.22);
}
body.premium .ft-v2 .ft-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
body.premium .ft-v2 .ft-links li { line-height: 1.4; }
body.premium .ft-v2 .ft-links a {
  font-size: .84rem; color: rgba(255,255,255,.74); text-decoration: none;
  display: inline-block; transition: color .18s ease, transform .18s ease;
}
body.premium .ft-v2 .ft-links a:hover { color: #E5CC8A; transform: translateX(3px); }

/* 品牌列 */
body.premium .ft-v2 .ft-brand-name { margin: 0 0 4px; font-size: 1.04rem; font-weight: 700; color: #fff; letter-spacing: .01em; }
body.premium .ft-v2 .ft-brand-en { margin: 0 0 15px; font-size: .66rem; letter-spacing: .12em; color: rgba(229,204,138,.82); }
body.premium .ft-v2 .ft-brand-desc { margin: 0 0 16px; font-size: .8rem; line-height: 1.78; color: rgba(255,255,255,.6); }
body.premium .ft-v2 .ft-badges { display: flex; flex-wrap: wrap; gap: 7px; }
body.premium .ft-v2 .ft-badges span {
  font-size: .62rem; letter-spacing: .03em; white-space: nowrap;
  color: rgba(255,255,255,.66); border: 1px solid rgba(212,180,122,.34);
  background: rgba(212,180,122,.07); border-radius: 999px; padding: 4px 11px;
}
/* 联络列 */
body.premium .ft-v2 .ft-contact .ft-c-line { font-size: .8rem; color: rgba(255,255,255,.86); line-height: 1.5; }
body.premium .ft-v2 .ft-contact .ft-c-line a { color: inherit; text-decoration: none; }
body.premium .ft-v2 .ft-contact .ft-c-line a:hover { color: #E5CC8A; }
body.premium .ft-v2 .ft-contact .ft-c-note { display: block; margin-top: 3px; font-size: .68rem; color: rgba(255,255,255,.42); }

/* ③ 产品矩阵整行 */
body.premium .ft-v2 .ft-matrix { padding-top: 34px; }
body.premium .ft-v2 .ft-matrix-head {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px;
}
body.premium .ft-v2 .ft-matrix-head .ft-h {
  margin: 0 !important; padding: 0; border: 0; font-size: .82rem; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: #D4B47A;
}
body.premium .ft-v2 .ft-h-more {
  font-size: .8rem; font-weight: 500; color: #E5CC8A; text-decoration: none;
  white-space: nowrap; display: inline-flex; align-items: center; gap: 6px;
  transition: gap .18s ease, color .18s ease;
}
body.premium .ft-v2 .ft-h-more:hover { color: #fff; gap: 10px; }
body.premium .ft-v2 .ft-matrix-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px 18px;
}
body.premium .ft-v2 .ft-matrix-grid li a {
  display: flex; align-items: center; gap: 8px;
  font-size: .82rem; color: rgba(255,255,255,.78); text-decoration: none;
  padding: 10px 13px; border-radius: 11px;
  border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03);
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease;
}
body.premium .ft-v2 .ft-matrix-grid li a::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: rgba(212,180,122,.5); flex-shrink: 0; transition: background .18s ease;
}
body.premium .ft-v2 .ft-matrix-grid li a:hover {
  color: #fff; border-color: rgba(212,180,122,.45); background: rgba(212,180,122,.10); transform: translateY(-2px);
}
body.premium .ft-v2 .ft-matrix-grid li a:hover::before { background: #E5CC8A; }

/* ④ 底欄：版權左 / 法律連結右 */
body.premium .ft-v2 .ft-bottom {
  display: flex; justify-content: space-between !important; align-items: center; flex-wrap: wrap; gap: 12px;
  margin-top: 34px !important; padding-top: 18px !important; border-top: 1px solid rgba(255,255,255,.10);
  font-size: .74rem; color: rgba(255,255,255,.5); text-align: left !important;
}
body.premium .ft-v2 .ft-legal { display: flex; flex-wrap: wrap; gap: 20px; }
body.premium .ft-v2 .ft-legal a { font-size: .74rem; color: rgba(255,255,255,.55); text-decoration: none; transition: color .18s ease; }
body.premium .ft-v2 .ft-legal a:hover { color: #E5CC8A; }

/* ⑤ 影片卡片下方說明（本系列加工工藝實錄） */
body.premium .product-video-cap {
  margin: 12px 2px 0; font-size: .82rem; line-height: 1.6;
  color: #5C574F; letter-spacing: .01em;
}

/* 响应式 */
@media (max-width: 1180px) {
  body.premium .ft-v2 .ft-cols { grid-template-columns: 1.4fr 1fr 1fr; gap: 36px 28px; }
  body.premium .ft-v2 .ft-col-brand { grid-column: 1 / -1; }
  body.premium .ft-v2 .ft-matrix-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  body.premium .ft-v2 .ft-cta { flex-direction: column; align-items: flex-start; gap: 20px; padding: 24px; }
  body.premium .ft-v2 .ft-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.premium .ft-v2 .ft-col-brand { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  body.premium .ft-v2 .ft-matrix-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.premium .ft-v2 .ft-bottom { flex-direction: column !important; align-items: flex-start !important; }
}
@media (max-width: 560px) {
  body.premium .ft-v2 .ft-matrix-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 12px; }
  body.premium .ft-v2 .ft-cta-actions { width: 100%; }
  body.premium .ft-v2 .ft-cta-btn { flex: 1; }
  body.premium .ft-v2 .ft-badges span { font-size: .6rem; }
}