/**
 * 創八製衣 · Design System v3
 * 風格：Neo-Minimalism + Bento Grid + Liquid Glass（台灣年輕世代偏好）
 * SEO：語意結構不變，僅視覺層；保留 heading 層級與可讀 contrast
 */

:root {
  --c8-v3-bg: #f7f8fb;
  --c8-v3-bg-alt: #eef2f7;
  --c8-v3-surface: #ffffff;
  --c8-v3-glass: rgba(255, 255, 255, 0.78);
  --c8-v3-glass-border: rgba(255, 255, 255, 0.65);
  --c8-v3-mesh-1: rgba(15, 118, 110, 0.07);
  --c8-v3-mesh-2: rgba(17, 24, 39, 0.05);
  --c8-v3-mesh-3: rgba(36, 167, 140, 0.06);
  --c8-space-xs: 8px;
  --c8-space-sm: 16px;
  --c8-space-md: 24px;
  --c8-space-lg: 40px;
  --c8-space-xl: 64px;
  --c8-space-2xl: 96px;
  --c8-radius-sm: 12px;
  --c8-radius-md: 20px;
  --c8-radius-xl: 28px;
  --c8-shadow-soft: 0 8px 32px rgba(15, 23, 42, 0.06);
  --c8-shadow-card: 0 12px 40px rgba(15, 23, 42, 0.08);
  --c8-shadow-float: 0 20px 50px rgba(15, 23, 42, 0.12);
  --c8-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ── 全站背景（有層次、不搶內容） ── */
.page {
  background:
    radial-gradient(ellipse 80% 50% at 10% -10%, var(--c8-v3-mesh-1), transparent 55%),
    radial-gradient(ellipse 60% 40% at 95% 0%, var(--c8-v3-mesh-2), transparent 50%),
    radial-gradient(ellipse 50% 30% at 50% 100%, var(--c8-v3-mesh-3), transparent 45%),
    var(--c8-v3-bg) !important;
}

main {
  position: relative;
}

/* ── 區塊節奏 ── */
.c8-section {
  padding-block: var(--c8-space-xl);
  position: relative;
}

.c8-section--alt {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 100%);
}

.c8-section-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto var(--c8-space-lg);
  padding-inline: var(--c8-space-sm);
}

.c8-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  margin-bottom: var(--c8-space-lg);
  border-radius: 999px;
  background: linear-gradient(135deg, #ecfeff, #f0fdf4);
  border: 1px solid rgba(15, 118, 110, 0.15);
  color: var(--c8-accent);
  font-size: var(--c8-type-meta) !important;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: none;
}

.c8-section-head h1.upper {
  font-size: var(--c8-type-display) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.02em !important;
  color: var(--c8-ink) !important;
  margin: 0 0 14px !important;
}

.c8-section-head h2,
.c8-section-head h2.upper {
  font-size: var(--c8-type-section) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.02em !important;
  color: var(--c8-ink) !important;
  margin: 0 0 12px !important;
}

.c8-section-head .lead {
  font-size: var(--c8-type-body) !important;
  line-height: 1.7 !important;
  color: var(--c8-body) !important;
  margin: 0 auto !important;
  max-width: 640px;
  letter-spacing: normal !important;
  word-spacing: normal !important;
  text-align: center;
  text-wrap: pretty;
}

.c8-page-shell {
  max-width: 1120px;
  margin: 0 auto;
  padding: var(--c8-space-lg) var(--c8-space-md) var(--c8-space-xl);
}

.c8-page-shell > .container {
  width: 100%;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

/* ── 首頁 intro ── */
.page-intro {
  padding-block: var(--c8-space-xl) var(--c8-space-lg);
}

.page-intro header {
  max-width: 820px;
  margin: 0 auto var(--c8-space-md);
  text-align: center;
  padding-inline: var(--c8-space-sm);
}

.page-intro .c8-section-head {
  margin-bottom: var(--c8-space-md);
  padding-block: var(--c8-space-sm);
}

.page-intro .c8-section-kicker {
  margin-top: var(--c8-space-xs);
  margin-bottom: var(--c8-space-md) !important;
}

.page-intro h1.upper {
  font-size: var(--c8-type-page-title) !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
  letter-spacing: -0.02em !important;
}

.page-intro .lead {
  font-size: var(--c8-type-body) !important;
  line-height: 1.7 !important;
  color: var(--c8-body) !important;
  max-width: 680px;
  margin: 0 auto !important;
  padding: 0 var(--c8-space-sm);
  letter-spacing: normal !important;
  word-spacing: normal !important;
  text-align: center;
  text-wrap: pretty;
}

.c8-trust-bar .c8-trust-item > strong {
  display: block;
  font-size: clamp(1.5rem, 3vw, 1.875rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  color: var(--c8-brand) !important;
  margin: 0 0 8px !important;
  letter-spacing: 0.02em;
}

.c8-trust-item__desc,
.c8-trust-item span:not(.c8-trust-item__icon) {
  display: block;
  font-size: var(--c8-type-meta) !important;
  line-height: 1.6 !important;
  color: var(--c8-muted) !important;
  margin: 0;
}

.c8-trust-item__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-bottom: 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, #0f766e, #24a78c);
  color: #fff;
  font-size: 22px;
  box-shadow: 0 8px 20px rgba(15, 118, 110, 0.22);
  transition: transform 0.35s var(--c8-ease), box-shadow 0.35s var(--c8-ease);
}

.c8-trust-item__icon .c8-trust-icon-svg {
  width: 26px;
  height: 26px;
  display: block;
}

.c8-trust-item:nth-child(2) .c8-trust-item__icon {
  background: linear-gradient(135deg, #1b2949, #334155);
  box-shadow: 0 8px 20px rgba(27, 41, 73, 0.22);
}

.c8-trust-item:nth-child(3) .c8-trust-item__icon {
  background: linear-gradient(135deg, #d97706, #e5992c);
  box-shadow: 0 8px 20px rgba(229, 153, 44, 0.25);
}

.c8-trust-item:nth-child(4) .c8-trust-item__icon {
  background: linear-gradient(135deg, #06c755, #00b900);
  box-shadow: 0 8px 20px rgba(6, 199, 85, 0.25);
}

/* ── Bento 信任條 ── */
.c8-trust-bar {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: var(--c8-space-md) 0 var(--c8-space-lg) !important;
}

.c8-trust-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.c8-trust-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  min-height: 100%;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border: 1px solid rgba(27, 41, 73, 0.08) !important;
  border-radius: 20px !important;
  padding: 26px 18px 22px !important;
  box-shadow: 0 4px 24px rgba(15, 23, 42, 0.05) !important;
  text-align: center;
  list-style: none !important;
  overflow: hidden;
  transition: transform 0.35s var(--c8-ease), box-shadow 0.35s var(--c8-ease), border-color 0.35s var(--c8-ease);
}

.c8-trust-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #0f766e, #24a78c);
  opacity: 0.85;
}

.c8-trust-item:nth-child(2)::before {
  background: linear-gradient(90deg, #1b2949, #475569);
}

.c8-trust-item:nth-child(3)::before {
  background: linear-gradient(90deg, #d97706, #e5992c);
}

.c8-trust-item:nth-child(4)::before {
  background: linear-gradient(90deg, #06c755, #00b900);
}

.c8-trust-item:hover {
  transform: translateY(-6px);
  box-shadow: var(--c8-shadow-float) !important;
  border-color: rgba(27, 41, 73, 0.14) !important;
}

.c8-trust-item:hover .c8-trust-item__icon {
  transform: scale(1.08);
}

@media (max-width: 768px) {
  .c8-trust-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .c8-trust-item {
    padding: 22px 14px 18px !important;
  }

  .c8-trust-item__icon {
    width: 46px;
    height: 46px;
    font-size: 20px;
    margin-bottom: 12px;
  }

  .c8-trust-item__icon .c8-trust-icon-svg {
    width: 22px;
    height: 22px;
  }
}

/* ── Bento 服務四格 ── */
.c8-services-section {
  margin-top: 0 !important;
  padding: var(--c8-space-xl) 0 !important;
  border-top: none !important;
  background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.6));
}

.c8-service-card {
  background: var(--c8-v3-surface) !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  border-radius: var(--c8-radius-md) !important;
  padding: var(--c8-space-md) !important;
  box-shadow: var(--c8-shadow-soft) !important;
  transition: transform 0.35s var(--c8-ease), box-shadow 0.35s var(--c8-ease), border-color 0.25s ease !important;
}

.c8-service-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--c8-shadow-float) !important;
  border-color: rgba(15, 118, 110, 0.25) !important;
}

.c8-service-card .c8-service-icon {
  width: 52px !important;
  height: 52px !important;
  font-size: 22px !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg, #ecfeff, #d1fae5) !important;
}

.c8-services-section .c8-section-head h2 {
  font-size: var(--c8-type-page-title) !important;
}

.c8-services-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 720px;
  margin: 0 auto var(--c8-space-md) !important;
  padding-inline: var(--c8-space-sm);
}

.c8-services-head .c8-section-kicker {
  margin: 0 0 16px !important;
}

.c8-services-head h2 {
  font-size: var(--c8-type-page-title) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.02em !important;
  color: var(--c8-brand) !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: none !important;
  width: 100%;
}

.c8-services-head__lead {
  font-size: var(--c8-type-body) !important;
  line-height: 1.75 !important;
  color: var(--c8-body) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  max-width: 620px;
  text-align: center !important;
  text-wrap: pretty;
}

.c8-services-section .c8-section-head.c8-services-head {
  margin-bottom: var(--c8-space-md) !important;
}

.c8-services-section .c8-section-head p {
  font-size: var(--c8-type-body) !important;
}

.c8-service-card h3 {
  font-size: var(--c8-type-service-title) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.02em !important;
  color: var(--c8-ink) !important;
  margin: 0 0 8px !important;
  border: none !important;
  padding: 0 !important;
}

@media (max-width: 767px) {
  .c8-service-card h3 {
    font-size: clamp(1.625rem, 5.5vw, 1.875rem) !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
  }
}

.c8-service-card p {
  font-size: var(--c8-type-caption) !important;
  line-height: 1.6 !important;
  color: var(--c8-muted) !important;
  margin: 0 0 14px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.c8-service-card .c8-service-link {
  font-size: 15px !important;
  font-weight: 600 !important;
}

/* ── 作品區 ── */
#blog {
  background: transparent !important;
  padding-block: var(--c8-space-xl) var(--c8-space-lg) !important;
}

#blog .section-title h2.upper {
  font-size: clamp(1.75rem, 3.5vw, 2.25rem) !important;
  letter-spacing: -0.02em !important;
}

#blog .section-title h2:after {
  width: 56px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, var(--c8-brand), var(--c8-accent)) !important;
}

.c8-portfolio-swiper .c8-portfolio-card {
  border-radius: var(--c8-radius-md) !important;
  box-shadow: var(--c8-shadow-soft) !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
}

/* ── CTA 區（Liquid glass） ── */
.c8-inline-cta,
.c8-cta-box {
  background: linear-gradient(135deg, rgba(236, 254, 255, 0.95), rgba(240, 253, 250, 0.92)) !important;
  border: 1px solid rgba(15, 118, 110, 0.18) !important;
  border-radius: var(--c8-radius-xl) !important;
  padding: var(--c8-space-lg) var(--c8-space-md) !important;
  box-shadow: var(--c8-shadow-card) !important;
  position: relative;
  overflow: hidden;
}

.c8-inline-cta::before,
.c8-cta-box::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 100% 0%, rgba(6, 199, 85, 0.08), transparent 45%);
  pointer-events: none;
}

.c8-detail-cta.bg-primary,
.c8-detail-cta.c8-detail-cta {
  background: linear-gradient(135deg, #0f766e 0%, #115e59 45%, #24a78c 100%) !important;
  border-radius: 0 !important;
  padding-block: var(--c8-space-lg) !important;
  margin-bottom: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

/* ── 內頁列表卡片 ── */
#device:not(.swiper-wrapper) article.sep-bottom-lg {
  background: var(--c8-v3-glass) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(15, 23, 42, 0.07) !important;
  border-radius: var(--c8-radius-xl) !important;
  padding: var(--c8-space-md) !important;
  margin-bottom: var(--c8-space-md) !important;
  box-shadow: var(--c8-shadow-soft) !important;
}

#device:not(.swiper-wrapper) article.sep-bottom-lg .col-md-5 img,
#device:not(.swiper-wrapper) article.sep-bottom-lg .img-responsive {
  border-radius: var(--c8-radius-md) !important;
}

/* 列表模式：標題、日期、摘要、詳細閱讀間距 */
#device:not(.swiper-wrapper) article.sep-bottom-lg:not(.c8-article--prose) h2.upper {
  margin-bottom: 0.4rem !important;
}

#device:not(.swiper-wrapper) article.sep-bottom-lg:not(.c8-article--prose) time {
  display: block;
  margin: 0 !important;
  font-size: var(--c8-text-sm) !important;
  color: var(--c8-muted) !important;
  line-height: 1.4 !important;
}

#device:not(.swiper-wrapper) article.sep-bottom-lg:not(.c8-article--prose) .sep-top-md {
  padding-top: 0.7rem !important;
}

#device:not(.swiper-wrapper) article.sep-bottom-lg:not(.c8-article--prose) [itemprop="description"] p {
  margin: 0 !important;
}

/* ── Masonry 作品牆 Bento 化 ── */
.masonry-grid {
  gap: var(--c8-space-sm) !important;
}

.masonry-item article {
  border-radius: var(--c8-radius-md) !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  box-shadow: var(--c8-shadow-soft) !important;
  transition: transform 0.35s var(--c8-ease), box-shadow 0.35s var(--c8-ease) !important;
}

.masonry-item .article-body-content {
  padding: var(--c8-space-sm) !important;
}

/* ── 聯絡頁 Hero ── */
.c8-contact-hero {
  background: var(--c8-v3-glass) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--c8-v3-glass-border) !important;
  border-radius: var(--c8-radius-xl) !important;
  padding: var(--c8-space-lg) var(--c8-space-md) !important;
  box-shadow: var(--c8-shadow-soft) !important;
  margin-bottom: var(--c8-space-lg) !important;
}

.icon-box.icon-gradient .icon-content.img-circle {
  border-radius: 14px !important;
}

.icon-box.icon-xs {
  padding: var(--c8-space-sm) 0 !important;
}

.c8-contact-info .icon-box.icon-xs {
  padding: 0.5rem 0 !important;
}

.c8-contact-info .icon-box.icon-xs.sep-top-xs {
  padding-top: 0.75rem !important;
}

.c8-contact-info .icon-box.icon-xs:first-child {
  padding-top: 0.25rem !important;
}

.c8-contact-info .icon-box.icon-xs .icon-box-content h6 {
  margin: 0 0 0.3rem !important;
}

.c8-contact-info .icon-box.icon-xs:has(.fa-envelope) .icon-box-content p,
.c8-contact-info .icon-box.icon-xs:has(.fa-envelope) .icon-box-content p a,
.c8-contact-info .icon-box.icon-xs:has(.fa-envelope) .icon-box-content p span,
.c8-contact-info .icon-box.icon-xs:has(.fa-clock-o) .icon-box-content p,
.c8-contact-info .icon-box.icon-xs:has(.fa-clock-o) .icon-box-content p span {
  font-size: var(--c8-text-lg) !important;
  line-height: 1.65 !important;
}

/* ── 頁尾 ── */
#footer {
  background: var(--c8-ink) !important;
  color: #e5e7eb !important;
  border-top: none !important;
  margin-top: 0 !important;
}

.call-to-action.c8-detail-cta + #footer {
  margin-top: 0 !important;
}

#footer .inner {
  background: transparent !important;
  padding-top: var(--c8-space-xl) !important;
}

#footer .widget-title {
  color: #fff !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
  opacity: 0.9;
}

/* 主區塊：主導覽 */
#footer .inner .widget-post li a {
  font-size: var(--c8-text-base) !important;
  line-height: 1.65 !important;
  color: #cbd5e1 !important;
}

/* 中文簡介：略小 */
#footer .inner .c8-footer-intro {
  display: block;
  margin: 0 0 12px;
  font-size: var(--c8-footer-intro) !important;
  line-height: 1.65 !important;
  color: #cbd5e1 !important;
}

/* 聯絡資訊：統一字級 + icon 與文字垂直置中 */
#footer .inner .widget-address {
  margin: 0;
  padding-left: 0;
  list-style: none;
}

#footer .inner .widget-address.sep-top-xs,
#footer .inner .widget-post.sep-top-xs {
  padding-top: 1.5em !important;
}

#footer .inner .widget-address li {
  display: flex !important;
  align-items: center !important;
  gap: 12px;
  position: static !important;
  padding: 0 0 14px 0 !important;
  margin: 0 !important;
  font-size: var(--c8-footer-contact) !important;
  line-height: 1.7 !important;
}

#footer .inner .widget-address li:last-child {
  padding-bottom: 0 !important;
}

#footer .inner .widget-address li i,
#footer .inner .widget-address li i.fa-lg {
  position: static !important;
  top: auto !important;
  left: auto !important;
  flex-shrink: 0;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 22px !important;
  min-height: 22px;
  margin: 0 !important;
  font-size: 17px !important;
  line-height: 1 !important;
  text-align: center;
}

#footer .inner .widget-address small {
  display: block;
  flex: 1;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  color: #cbd5e1 !important;
}

#footer .inner .widget-address small a,
#footer .inner .widget-address li a,
#footer .inner .widget-address small *,
#footer .inner .widget-address li * {
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: inherit !important;
  color: inherit !important;
}

#footer .inner .widget-post li a:hover {
  color: #fff !important;
}

/* 英文簡介：小字 */
#footer .inner .c8-footer-intro-en {
  display: block;
  font-size: var(--c8-footer-text) !important;
  line-height: var(--c8-footer-line) !important;
  color: #94a3b8 !important;
}

/* 版權與 SEO 區：小字 */
#footer .copyright,
#footer .copyright small,
#footer .copyright a,
#footer .copyright p,
#footer .copyright .col-md-12,
#footer .copyright .col-md-12[style*="ABABAB"],
#footer .copyright .col-md-12[style*="#ababab"],
#footer .copyright .col-md-12[itemscope],
#footer .copyright .col-md-12[itemscope] span,
#footer .copyright [itemprop="description"] {
  font-size: var(--c8-footer-text) !important;
  line-height: var(--c8-footer-line) !important;
}

#footer .copyright {
  background: rgba(0, 0, 0, 0.25) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#footer .copyright small,
#footer .copyright a {
  color: #94a3b8 !important;
}

#footer .col-md-12[style*="ABABAB"],
#footer .copyright .col-md-12[itemscope] {
  color: #94a3b8 !important;
}

#footer .col-md-12[style*="ABABAB"] strong,
#footer .copyright .col-md-12[itemscope] strong {
  color: #cbd5e1 !important;
  font-size: inherit !important;
}

#footer .logo {
  filter: brightness(1.05);
}

/* ── 按鈕系統 ── */
.btn-primary {
  background: linear-gradient(135deg, var(--c8-accent), var(--c8-teal)) !important;
  border: none !important;
  box-shadow: 0 8px 24px rgba(15, 118, 110, 0.28) !important;
  letter-spacing: 0.02em;
}

.btn-primary:hover {
  box-shadow: 0 12px 32px rgba(15, 118, 110, 0.38) !important;
}

.c8-contact-line {
  box-shadow: 0 10px 28px rgba(6, 199, 85, 0.35) !important;
}

/* ══════════════════════════════════════
   CMS 編輯器內容 · c8-prose / c8-page
   （貼在後台文字編輯器即可自動套用）
   ══════════════════════════════════════ */
.c8-prose,
.c8-page,
.c8-cms-content {
  font-size: var(--c8-text-base) !important;
  line-height: 1.8 !important;
  color: var(--c8-body) !important;
  letter-spacing: 0.01em;
}

.c8-prose > *:first-child,
.c8-page > *:first-child,
.c8-cms-content > *:first-child {
  margin-top: 0 !important;
}

.c8-prose > *:last-child,
.c8-page > *:last-child,
.c8-cms-content > *:last-child {
  margin-bottom: 0 !important;
}

.c8-prose h1,
.c8-page h1,
.c8-cms-content h1,
.c8-page-title {
  font-size: clamp(1.875rem, 3.2vw, 2.375rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
  color: var(--c8-ink) !important;
  margin: 0 0 0.75em !important;
}

.c8-prose h2,
.c8-page h2,
.c8-cms-content h2 {
  font-size: clamp(1.5rem, 2.6vw, 1.875rem) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: var(--c8-ink) !important;
  margin: 1.75em 0 0.65em !important;
  padding-bottom: 0.35em;
  border-bottom: 2px solid rgba(15, 118, 110, 0.12);
}

.c8-prose h3,
.c8-page h3,
.c8-cms-content h3,
.c8-faq-q {
  font-size: clamp(1.2rem, 2vw, 1.375rem) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: var(--c8-ink) !important;
  margin: 1.5em 0 0.5em !important;
}

/* SEO 文章：數字標題同一行（如 1 少量客製最怕的…） */
.c8-prose .number-card,
.c8-page .number-card,
.c8-cms-content .number-card {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35em 0.5em;
  margin: 2rem 0 1rem !important;
}

.c8-prose .number-card .number-label,
.c8-page .number-card .number-label,
.c8-cms-content .number-card .number-label {
  flex: 0 0 auto;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: var(--c8-brand, #1b2949) !important;
}

.c8-prose .number-card > h3,
.c8-page .number-card > h3,
.c8-cms-content .number-card > h3 {
  flex: 1 1 0;
  min-width: 0;
  display: block !important;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  color: var(--c8-ink) !important;
  margin: 0 !important;
}

.c8-prose .number-card > h3 strong,
.c8-page .number-card > h3 strong,
.c8-cms-content .number-card > h3 strong {
  font-weight: inherit !important;
}

.c8-prose .number-card > p,
.c8-prose .number-card > .note-box,
.c8-prose .number-card > .key-box,
.c8-page .number-card > p,
.c8-page .number-card > .note-box,
.c8-page .number-card > .key-box,
.c8-cms-content .number-card > p,
.c8-cms-content .number-card > .note-box,
.c8-cms-content .number-card > .key-box {
  flex: 1 1 100%;
  width: 100%;
  margin-top: 0.85em !important;
}

.c8-prose h4,
.c8-prose h5,
.c8-prose h6,
.c8-page h4,
.c8-page h5,
.c8-page h6 {
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  color: var(--c8-ink) !important;
  margin: 1.25em 0 0.4em !important;
}

.c8-prose p,
.c8-page p,
.c8-cms-content p,
.c8-faq-a p {
  margin: 0 0 1.1em !important;
}

.c8-prose ul,
.c8-prose ol,
.c8-page ul,
.c8-page ol,
.c8-cms-content ul,
.c8-cms-content ol {
  margin: 0 0 1.25em !important;
  padding-left: 1.35em !important;
}

.c8-prose li,
.c8-page li,
.c8-cms-content li {
  margin-bottom: 0.45em !important;
  line-height: 1.75 !important;
}

.c8-prose ul li::marker,
.c8-page ul li::marker {
  color: var(--c8-accent);
}

.c8-prose a:not(.c8-btn-main):not(.c8-contact-line),
.c8-page a:not(.c8-btn-main):not(.c8-contact-line),
.c8-cms-content a:not(.btn):not(.c8-btn-main):not(.c8-contact-line) {
  color: var(--c8-accent) !important;
  text-decoration: none !important;
  font-weight: 500;
}

.c8-prose a:not(.c8-btn-main):not(.c8-contact-line):hover,
.c8-page a:not(.c8-btn-main):not(.c8-contact-line):hover,
.c8-cms-content a:not(.btn):not(.c8-btn-main):not(.c8-contact-line):hover {
  color: var(--c8-brand) !important;
}

.c8-prose img,
.c8-page img,
.c8-cms-content img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: var(--c8-radius-md) !important;
  box-shadow: var(--c8-shadow-soft);
  margin: 1.25em 0 !important;
}

.c8-prose blockquote,
.c8-page blockquote,
.c8-cms-content blockquote {
  margin: 1.5em 0 !important;
  padding: var(--c8-space-sm) var(--c8-space-md) !important;
  border-left: 4px solid var(--c8-accent) !important;
  background: linear-gradient(90deg, rgba(15, 118, 110, 0.06), transparent) !important;
  border-radius: 0 var(--c8-radius-sm) var(--c8-radius-sm) 0 !important;
  font-size: var(--c8-text-lg) !important;
  color: var(--c8-ink) !important;
}

.c8-prose hr,
.c8-page hr {
  border: none !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, var(--c8-border), transparent) !important;
  margin: 2em 0 !important;
}

.c8-prose table,
.c8-page table,
.c8-cms-content table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 1.5em 0 !important;
  font-size: var(--c8-text-sm) !important;
  border-radius: var(--c8-radius-sm);
  overflow: hidden;
  box-shadow: var(--c8-shadow-soft);
}

.c8-prose th,
.c8-prose td,
.c8-page th,
.c8-page td {
  padding: 12px 16px !important;
  border: 1px solid var(--c8-border) !important;
}

.c8-prose th,
.c8-page th {
  background: var(--c8-v3-bg-alt) !important;
  font-weight: 700 !important;
  color: var(--c8-ink) !important;
}

/* 編輯器可用元件 class */
.c8-page-tag,
.c8-badge {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ecfeff, #f0fdf4);
  border: 1px solid rgba(15, 118, 110, 0.15);
  color: var(--c8-accent);
  font-size: var(--c8-text-sm);
  font-weight: 700;
  margin-bottom: 12px;
}

.c8-page-hero,
.c8-prose-hero {
  text-align: center;
  margin-bottom: var(--c8-space-lg);
  padding: var(--c8-space-md) 0;
}

.c8-page-sub,
.c8-prose-lead {
  font-size: var(--c8-text-lg) !important;
  color: var(--c8-muted) !important;
  max-width: 640px;
  margin: 0 auto 1em !important;
  line-height: 1.75 !important;
}

.c8-card-grid,
.c8-bento-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--c8-space-sm);
  margin: var(--c8-space-md) 0;
}

@media (max-width: 768px) {
  .c8-card-grid,
  .c8-bento-grid {
    grid-template-columns: 1fr;
  }
}

.c8-card,
.c8-bento-card {
  background: var(--c8-v3-surface);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: var(--c8-radius-md);
  padding: var(--c8-space-md);
  box-shadow: var(--c8-shadow-soft);
  transition: transform 0.3s var(--c8-ease), box-shadow 0.3s var(--c8-ease);
}

.c8-card:hover,
.c8-bento-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--c8-shadow-card);
}

.c8-card h3,
.c8-bento-card h3 {
  margin-top: 0 !important;
  border: none !important;
  padding: 0 !important;
  font-size: 1.125rem !important;
}

.c8-callout {
  padding: var(--c8-space-md);
  margin: var(--c8-space-md) 0;
  border-radius: var(--c8-radius-md);
  background: linear-gradient(135deg, #fff7ed, #fffbeb);
  border: 1px solid rgba(229, 153, 44, 0.25);
}

.c8-callout--tip {
  background: linear-gradient(135deg, #ecfdf5, #f0fdfa);
  border-color: rgba(15, 118, 110, 0.2);
}

.c8-btn-main {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--c8-accent), var(--c8-teal)) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: var(--c8-text-base) !important;
  text-decoration: none !important;
  box-shadow: 0 10px 28px rgba(15, 118, 110, 0.3) !important;
  transition: transform 0.25s var(--c8-ease), box-shadow 0.25s ease !important;
}

.c8-btn-main:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(15, 118, 110, 0.38) !important;
  color: #fff !important;
}

.c8-faq-item {
  padding: var(--c8-space-md) 0 !important;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
}

.c8-faq-item:last-child {
  border-bottom: none !important;
}

.c8-faq-q {
  margin-top: 0 !important;
  border: none !important;
  padding: 0 !important;
}

/* 純文字頁：外包一層即可 */
.c8-prose-wrap {
  max-width: 920px;
  margin: 0 auto;
  padding: var(--c8-space-lg);
  background: var(--c8-v3-glass);
  backdrop-filter: blur(12px);
  border: 1px solid var(--c8-v3-glass-border);
  border-radius: var(--c8-radius-xl);
  box-shadow: var(--c8-shadow-soft);
}

/* 內頁文章詳情：標題 + 內文統一置中 */
.c8-detail-layout > .container > .c8-breadcrumb-nav {
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.5rem;
  font-size: 20px !important;
}

.c8-detail-layout > .container > .row {
  margin-left: 0;
  margin-right: 0;
}

.c8-detail-layout .c8-detail-inner {
  width: 100%;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

.c8-detail-layout #device {
  margin-bottom: var(--c8-space-md);
}

.c8-detail-layout .c8-detail-header {
  text-align: left;
  margin-bottom: var(--c8-space-md);
}

.c8-detail-layout .c8-detail-header h1.upper {
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.c8-detail-layout .c8-detail-meta {
  margin-top: 8px !important;
  color: var(--c8-muted) !important;
  font-size: var(--c8-text-sm) !important;
}

.c8-detail-layout .c8-detail-share {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  margin: var(--c8-space-sm) 0;
}

.c8-detail-layout .submain-detail-content,
.c8-detail-layout .article-content {
  padding: 0;
  margin-top: var(--c8-space-md);
}

.c8-detail-layout .submain-detail-content > .c8-prose-wrap,
.c8-detail-layout .submain-detail-content > section.c8-page.c8-prose-wrap {
  width: 100%;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.c8-detail-layout .submain-detail-content + .video-container,
.c8-detail-layout .video-container {
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

.c8-detail-layout .sep-top-md {
  text-align: left;
}

.c8-detail-layout [style*="margin-top: 40px"] {
  max-width: 920px;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}

/* Banner 語意：分類標籤（非 h1，SEO 保留內文 h1） */
.c8-banner-label {
  display: block;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: #fff;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.35);
  margin: 0;
}

/* 404 */
.c8-error-page {
  padding-block: var(--c8-space-xl);
}

.c8-error-page .c8-inline-cta {
  margin-top: var(--c8-space-md) !important;
}

/* 動效：尊重 prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .c8-trust-item,
  .c8-service-card,
  .c8-card,
  .masonry-item article,
  .btn-primary,
  .c8-btn-main {
    transition: none !important;
  }
}

/* 內頁文章主標 */
section.sep-bottom-2x > .container > .row > .col-md-12 h1.upper,
section.sep-bottom-2x .container h1.upper:first-of-type {
  font-size: clamp(1.625rem, 3vw, 2.125rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  color: var(--c8-ink) !important;
  margin-bottom: 0.75em !important;
}

.order-title h6,
.page-title-line h6 {
  font-size: var(--c8-text-sm) !important;
  color: var(--c8-ink) !important;
}

.order-title p {
  font-size: var(--c8-text-sm) !important;
  color: var(--c8-muted) !important;
}

.c8-cms-content .c8-page-tag,
.c8-cms-content .c8-badge {
  font-size: var(--c8-text-sm) !important;
}

.c8-cms-content .c8-btn-main {
  font-size: var(--c8-text-base) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.c8-cms-content .c8-btn-main:hover {
  color: #fff !important;
}

.c8-cms-content .c8-page-sub,
.c8-cms-content .c8-prose-lead {
  font-size: var(--c8-text-lg) !important;
}

.c8-cms-content .c8-card h3,
.c8-cms-content .c8-faq-q {
  font-size: clamp(1.2rem, 2vw, 1.375rem) !important;
}

/* ══════════════════════════════════════
   CMS 內容區塊 · 視覺化元件（首頁／內頁通用）
   ══════════════════════════════════════ */
.c8-cms-content .pricing-area,
.c8-cms-content .c8-page {
  margin: 0;
  padding: 0;
}

.c8-cms-content .pricing-area > .container {
  width: 100%;
  max-width: none;
  padding: 0;
}

.c8-cms-content .pricing-area .row {
  margin-left: 0;
  margin-right: 0;
}

.c8-cms-content .pricing-area [class*="col-"] {
  float: none;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.c8-cms-content .pricing-area img {
  border-radius: var(--c8-radius-md);
  margin: 0 0 var(--c8-space-md) !important;
  box-shadow: var(--c8-shadow-soft);
}

/* Hero */
.c8-hero {
  text-align: center;
  padding: var(--c8-space-md) 0 var(--c8-space-lg);
}

.c8-hero-tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  margin-bottom: 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ecfeff, #f0fdf4);
  border: 1px solid rgba(15, 118, 110, 0.18);
  color: var(--c8-accent);
  font-size: var(--c8-text-sm) !important;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.c8-hero-title {
  font-size: clamp(1.75rem, 3.2vw, 2.25rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  color: var(--c8-ink) !important;
  margin: 0 0 12px !important;
  border: none !important;
  padding: 0 !important;
}

.c8-hero-sub {
  font-size: var(--c8-text-lg) !important;
  color: var(--c8-muted) !important;
  max-width: 720px;
  margin: 0 auto 20px !important;
  line-height: 1.75 !important;
}

.c8-hero-note {
  font-size: var(--c8-text-base) !important;
  color: var(--c8-body) !important;
  max-width: 680px;
  margin: 0 auto var(--c8-space-md) !important;
  line-height: 1.75 !important;
}

.c8-hero-cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: var(--c8-space-md);
}

.c8-btn-secondary {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 14px 28px !important;
  border-radius: 999px !important;
  border: 2px solid var(--c8-accent) !important;
  background: #fff !important;
  color: var(--c8-accent) !important;
  font-weight: 700 !important;
  font-size: var(--c8-text-base) !important;
  text-decoration: none !important;
  transition: all 0.25s var(--c8-ease);
}

.c8-btn-secondary:hover {
  background: var(--c8-accent) !important;
  color: #fff !important;
}

/* 服務標籤列 */
.c8-service-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 0 0 var(--c8-space-md);
  padding: 0;
  list-style: none;
}

.c8-service-badges .c8-badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px !important;
  margin: 0 !important;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: var(--c8-shadow-soft);
  color: var(--c8-ink) !important;
  font-size: var(--c8-text-sm) !important;
  font-weight: 600;
  transition: transform 0.2s ease, border-color 0.2s ease;
}

.c8-service-badges .c8-badge:hover {
  transform: translateY(-2px);
  border-color: rgba(15, 118, 110, 0.35);
}

/* 區塊標題 */
.c8-cms-content .c8-section {
  padding: var(--c8-space-lg) 0;
  margin-top: var(--c8-space-md);
  border-top: 1px solid rgba(15, 23, 42, 0.06);
}

.c8-section-title {
  font-size: clamp(1.5rem, 2.8vw, 2rem) !important;
  font-weight: 800 !important;
  text-align: center;
  color: var(--c8-ink) !important;
  margin: 0 0 10px !important;
  border: none !important;
  padding: 0 !important;
}

.c8-section-sub {
  text-align: center;
  font-size: var(--c8-text-lg) !important;
  color: var(--c8-muted) !important;
  max-width: 640px;
  margin: 0 auto var(--c8-space-lg) !important;
  line-height: 1.7 !important;
}

/* 三格特色卡 */
.c8-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--c8-space-sm);
  margin-bottom: var(--c8-space-lg);
}

.c8-feature-card {
  background: var(--c8-v3-surface);
  border: 1px solid rgba(15, 23, 42, 0.07);
  border-radius: var(--c8-radius-md);
  padding: var(--c8-space-md);
  box-shadow: var(--c8-shadow-soft);
  transition: transform 0.3s var(--c8-ease), box-shadow 0.3s var(--c8-ease);
  height: 100%;
}

.c8-feature-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--c8-shadow-card);
}

.c8-feature-header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.c8-feature-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: linear-gradient(145deg, #ecfeff, #d1fae5);
  color: var(--c8-accent);
  font-size: 20px;
  font-weight: 700;
}

.c8-feature-card:nth-child(2) .c8-feature-icon {
  background: linear-gradient(145deg, #fef3c7, #fde68a);
  color: #b45309;
}

.c8-feature-card:nth-child(3) .c8-feature-icon {
  background: linear-gradient(145deg, #ede9fe, #ddd6fe);
  color: #6d28d9;
}

.c8-feature-title {
  font-size: 1.125rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: var(--c8-ink) !important;
  margin: 0 !important;
  border: none !important;
  padding: 0 !important;
}

.c8-feature-body {
  font-size: var(--c8-text-sm) !important;
  line-height: 1.75 !important;
  color: var(--c8-body) !important;
  margin: 0 !important;
}

.c8-feature-tagline {
  display: block;
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(15, 118, 110, 0.06);
  color: var(--c8-accent);
  font-weight: 600;
  font-size: var(--c8-text-sm) !important;
}

/* 三大保證 */
.c8-guarantee-row {
  background: linear-gradient(135deg, rgba(15, 118, 110, 0.06), rgba(36, 167, 140, 0.04));
  border: 1px solid rgba(15, 118, 110, 0.12);
  border-radius: var(--c8-radius-xl);
  padding: var(--c8-space-lg) var(--c8-space-md);
  margin-bottom: var(--c8-space-lg);
}

.c8-guarantee-title {
  font-size: clamp(1.375rem, 2.5vw, 1.75rem) !important;
  font-weight: 800 !important;
  text-align: center;
  color: var(--c8-ink) !important;
  margin: 0 0 var(--c8-space-md) !important;
  border: none !important;
  padding: 0 !important;
}

.c8-guarantee-badges {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--c8-space-sm);
}

.c8-guarantee-badge {
  background: #fff;
  border-radius: var(--c8-radius-md);
  padding: var(--c8-space-md);
  box-shadow: var(--c8-shadow-soft);
  border: 1px solid rgba(15, 23, 42, 0.06);
  text-align: center;
  transition: transform 0.25s var(--c8-ease);
}

.c8-guarantee-badge:hover {
  transform: translateY(-3px);
}

.c8-guarantee-badge .c8-guarantee-icon {
  width: 52px;
  height: 52px;
  margin: 0 auto 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 24px;
  background: linear-gradient(135deg, var(--c8-accent), var(--c8-teal));
  color: #fff;
}

.c8-guarantee-badge--quality .c8-guarantee-icon {
  background: linear-gradient(135deg, #1b2949, #374151);
}

.c8-guarantee-badge--style .c8-guarantee-icon {
  background: linear-gradient(135deg, #e5992c, #f59e0b);
}

.c8-guarantee-badge h3,
.c8-guarantee-badge [itemprop="name"]:not(p) {
  display: block;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  color: var(--c8-ink) !important;
  margin: 0 0 8px !important;
  border: none !important;
  padding: 0 !important;
}

.c8-guarantee-badge p,
.c8-guarantee-badge [itemprop="description"] {
  display: block;
  font-size: var(--c8-text-sm) !important;
  line-height: 1.7 !important;
  color: var(--c8-body) !important;
  margin: 0 !important;
}

/* 圖文分欄 + 圖片占位 */
.c8-split-media {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--c8-space-md);
  align-items: center;
  margin: var(--c8-space-lg) 0;
  padding: var(--c8-space-md);
  background: var(--c8-v3-surface);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: var(--c8-radius-xl);
  box-shadow: var(--c8-shadow-soft);
}

.c8-split-media--reverse .c8-split-media__media {
  order: 2;
}

.c8-split-media--reverse .c8-split-media__body {
  order: 1;
}

.c8-split-media__body h3 {
  font-size: 1.375rem !important;
  font-weight: 800 !important;
  margin: 0 0 10px !important;
  border: none !important;
  padding: 0 !important;
}

.c8-split-media__body p {
  margin: 0 0 12px !important;
  line-height: 1.75 !important;
}

.c8-media-slot {
  margin: 0;
  border-radius: var(--c8-radius-md);
  overflow: hidden;
}

.c8-media-slot img {
  display: block;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  margin: 0 !important;
  border-radius: var(--c8-radius-md) !important;
}

.c8-media-caption {
  margin-top: 8px;
  font-size: 13px !important;
  color: var(--c8-muted) !important;
  text-align: center;
  line-height: 1.5 !important;
}

.c8-media-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 220px;
  padding: 24px;
  text-align: center;
  background: linear-gradient(145deg, #f1f5f9, #e2e8f0);
  border: 2px dashed rgba(15, 118, 110, 0.35);
  border-radius: var(--c8-radius-md);
  color: var(--c8-muted);
}

.c8-media-placeholder strong {
  font-size: var(--c8-text-base) !important;
  color: var(--c8-accent) !important;
}

.c8-media-placeholder span {
  font-size: var(--c8-text-sm) !important;
  line-height: 1.6 !important;
}

.c8-media-placeholder::before {
  content: "🖼";
  font-size: 2rem;
  opacity: 0.7;
}

/* 工法 chip */
.c8-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: var(--c8-space-md) 0;
  padding: 0;
  list-style: none;
}

.c8-chip {
  display: inline-flex;
  align-items: center;
  padding: 10px 16px;
  border-radius: 999px;
  background: linear-gradient(135deg, #fff, #f8fafc);
  border: 1px solid rgba(15, 23, 42, 0.1);
  box-shadow: var(--c8-shadow-soft);
  font-weight: 700;
  font-size: var(--c8-text-sm) !important;
  color: var(--c8-ink) !important;
}

.c8-chip--accent {
  background: linear-gradient(135deg, #ecfeff, #ccfbf1);
  border-color: rgba(15, 118, 110, 0.25);
  color: var(--c8-accent) !important;
}

a.c8-chip {
  text-decoration: none !important;
}

a.c8-chip:hover {
  transform: translateY(-1px);
  box-shadow: var(--c8-shadow-soft);
}

/* 舊 CMS 別名 */
.c8-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--c8-space-md);
  align-items: center;
  margin: var(--c8-space-lg) 0;
}

@media (max-width: 991px) {
  .c8-two-col {
    grid-template-columns: 1fr;
  }
}

/* 重點色帶 */
.c8-band {
  margin: var(--c8-space-lg) 0;
  padding: var(--c8-space-md) var(--c8-space-lg);
  border-radius: var(--c8-radius-md);
  background: linear-gradient(135deg, #0f766e, #24a78c);
  color: #fff;
  text-align: center;
  box-shadow: var(--c8-shadow-card);
}

.c8-band strong,
.c8-band p {
  color: #fff !important;
  margin: 0 !important;
  font-size: var(--c8-text-lg) !important;
  line-height: 1.65 !important;
}

.c8-text-block {
  padding: var(--c8-space-md);
  background: #fff;
  border-radius: var(--c8-radius-md);
  border: 1px solid rgba(15, 23, 42, 0.06);
}

.c8-highlight {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 8px;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  color: #92400e !important;
  font-weight: 700;
}

/* 門市卡片 */
.c8-cms-content .section-title-tag {
  display: inline-block;
  padding: 6px 14px;
  margin-bottom: 10px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.08);
  color: var(--c8-brand);
  font-size: var(--c8-text-sm) !important;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.c8-cms-content .section-title {
  text-align: center;
  margin: var(--c8-space-xl) 0 var(--c8-space-lg);
}

.c8-home-content .c8-home-stores .section-title,
.c8-home-cms .c8-home-stores .section-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto 12px !important;
  text-align: center !important;
  max-width: 720px;
}

.c8-home-content .c8-home-stores .section-title h2,
.c8-home-cms .c8-home-stores .section-title h2,
.c8-home-content .c8-home-stores .section-title-sub,
.c8-home-cms .c8-home-stores .section-title-sub,
.c8-home-content .c8-home-stores .section-title-tag,
.c8-home-cms .c8-home-stores .section-title-tag,
.c8-home-content .c8-home-stores .section-title .c8-section-kicker,
.c8-home-cms .c8-home-stores .section-title .c8-section-kicker {
  text-align: center !important;
}

.c8-home-content .c8-home-stores .section-title-sub,
.c8-home-cms .c8-home-stores .section-title-sub {
  margin-left: auto !important;
  margin-right: auto !important;
  white-space: normal;
}

.c8-home-content .c8-home-stores > .row:first-of-type,
.c8-home-cms .c8-home-stores > .row:first-of-type {
  margin-bottom: var(--c8-space-md) !important;
}

.c8-cms-content .section-title h2 {
  font-size: clamp(1.5rem, 2.8vw, 2rem) !important;
  font-weight: 800 !important;
  border: none !important;
  padding: 0 !important;
}

.c8-cms-content .section-title-sub {
  color: var(--c8-muted) !important;
  max-width: 640px;
  margin: 8px auto 0 !important;
}

@media (min-width: 992px) {
  .c8-cms-content .section-title-sub {
    max-width: 820px;
    white-space: nowrap;
  }
}

.c8-cms-content .single-pricing-box {
  background: #fff;
  padding-bottom: 0;
  margin-bottom: var(--c8-space-md);
  height: auto;
}

.c8-home-content .c8-home-stores .single-pricing-box,
.c8-home-cms .c8-home-stores .single-pricing-box {
  height: auto !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.c8-cms-content .pricing-header img {
  width: 100% !important;
  margin: 0 !important;
  border-radius: var(--c8-radius-md) var(--c8-radius-md) 0 0 !important;
}

.c8-cms-content .single-pricing-box h3 {
  padding: 16px 16px 8px !important;
  margin: 0 !important;
  font-size: var(--c8-type-display) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.01em !important;
  border: none !important;
}

.c8-cms-content .pricing-features-list {
  list-style: none;
  padding: 0 16px 12px;
  margin: 0;
}

.c8-cms-content .pricing-features-list li {
  padding: 9px 0;
  border-bottom: 1px solid #f3f4f6;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

@media (max-width: 991px) {
  .c8-feature-grid,
  .c8-guarantee-badges {
    grid-template-columns: 1fr;
  }

  .c8-split-media,
  .c8-split-media--reverse .c8-split-media__media,
  .c8-split-media--reverse .c8-split-media__body {
    grid-template-columns: 1fr;
    order: unset;
  }
}

@media (max-width: 767px) {
  .c8-hero-cta {
    flex-direction: column;
    align-items: stretch;
  }

  .c8-hero-cta .c8-btn-main,
  .c8-hero-cta .c8-btn-secondary {
    width: 100%;
    justify-content: center;
  }
}

/* 瀏覽人數等小字 */
.c8-meta-muted,
.page .center-block.text-center {
  font-size: var(--c8-text-sm) !important;
  color: var(--c8-muted) !important;
}

@media (max-width: 767px) {
  .c8-section {
    padding-block: var(--c8-space-lg);
  }

  .c8-detail-layout > .container > .c8-breadcrumb-nav {
    font-size: 18px !important;
    padding: 0.5rem 0.85rem;
    margin-bottom: 1.15rem;
  }

  .c8-breadcrumb-item:last-child [aria-current="page"] {
    word-break: break-word;
  }

  .c8-page-shell {
    padding-inline: var(--c8-space-sm);
  }

  .page-intro .c8-cms-content {
    padding: var(--c8-space-md);
    border-radius: var(--c8-radius-md);
  }
}

/* 全站連結：無底線 */
.page a,
.page a:hover,
.page a:focus,
.page a:active,
.page a:visited {
  text-decoration: none !important;
}
