/* ============================================================
   意創趨術有限公司（MCTT）官方網站 — 共用設計系統
   ============================================================ */

:root{
  /* ---- MCTT 主品牌色（取自官方識別手冊） ---- */
  --mctt-blue: #519FC9;        /* Pantone 2389C */
  --mctt-blue-light: #A3CADD;  /* Pantone 2204C */
  --mctt-charcoal: #3E3A39;    /* Pantone Cool Gray 11C */
  --mctt-ink: #1F1D1C;
  --mctt-bg: #FAFBFC;
  --mctt-bg-alt: #F0F4F7;
  --mctt-line: #E2E8ED;
  --mctt-white: #FFFFFF;

  /* ---- 黃金館（金心珍意）品牌色 ---- */
  --gold-black: #141212;
  --gold-black-soft: #1D1A19;
  --gold-gold: #C9A227;
  --gold-gold-light: #E7CB6B;
  --gold-flame-1: #F4C430;
  --gold-flame-2: #F0812A;
  --gold-flame-3: #E13A2E;
  --gold-cream: #FBF6EA;

  /* ---- 玩具／日用館色（沿用MCTT淺色系＋暖點綴） ---- */
  --toy-accent: #FF7A59;
  --toy-accent-2: #37B893;

  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --shadow-sm: 0 2px 10px rgba(31,29,28,0.06);
  --shadow-md: 0 10px 30px rgba(31,29,28,0.10);
  --container: 1160px;
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",-apple-system,BlinkMacSystemFont,sans-serif;
  color: var(--mctt-ink);
  background: var(--mctt-bg);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0 0 .5em; font-weight:700; letter-spacing:.01em; }
p{ margin:0 0 1em; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; }
.container{ max-width: var(--container); margin:0 auto; padding:0 24px; }
.section{ padding: 72px 0; }
.section-tight{ padding: 40px 0; }
.eyebrow{
  display:inline-block; font-size:13px; font-weight:700; letter-spacing:.14em;
  color: var(--mctt-blue); text-transform:uppercase; margin-bottom:14px;
}
.lead{ font-size:18px; color:#5B5654; max-width:620px; }
.center{ text-align:center; margin-left:auto; margin-right:auto; }

/* ---- Buttons ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding: 13px 28px; border-radius: 999px; border:1.5px solid transparent;
  font-weight:700; font-size:15px; transition: all .18s ease; white-space:nowrap;
}
.btn-primary{ background: var(--mctt-blue); color:#fff; }
.btn-primary:hover{ background:#3f88b3; transform: translateY(-1px); }
.btn-outline{ border-color: var(--mctt-charcoal); color: var(--mctt-charcoal); background:transparent; }
.btn-outline:hover{ background: var(--mctt-charcoal); color:#fff; }
.btn-block{ width:100%; }
.btn-sm{ padding:9px 18px; font-size:14px; }
.btn[disabled]{ opacity:.5; cursor:not-allowed; }
.btn-line{ background:#06C755; color:#fff; }
.btn-line:hover{ background:#05a648; transform: translateY(-1px); }
.btn-line svg{ flex:none; }
.btn-ghost{ background:transparent; color:inherit; border-color: transparent; text-decoration:underline; padding:8px 4px; }

/* ---- LINE contact block ---- */
.line-cta{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:20px 22px; border-radius:var(--radius-md);
  background:#EAFBF1; border:1px solid #BFEFD3;
}
.line-cta .icon-badge{ width:42px;height:42px;border-radius:50%;background:#06C755;display:flex;align-items:center;justify-content:center;flex:none; }
.line-cta .text b{ display:block; font-size:14.5px; }
.line-cta .text span{ font-size:12.5px; color:#4E7A5F; }
body.theme-gold .line-cta{ background:#1B2620; border-color:#2B3A31; }
body.theme-gold .line-cta .text b{ color:#fff; }
body.theme-gold .line-cta .text span{ color:#9FC7AE; }
.copy-list-btn{ background:none; border:1.5px solid var(--mctt-line); border-radius:999px; padding:9px 16px; font-size:13px; font-weight:700; color:var(--mctt-charcoal); }
.copy-list-btn.copied{ background:#EAF6EF; border-color:#BFEFD3; color:#1E7C4C; }
.divider-or{ display:flex; align-items:center; gap:12px; color:#B0AAA6; font-size:12.5px; margin:22px 0; }
.divider-or::before, .divider-or::after{ content:""; flex:1; height:1px; background:var(--mctt-line); }

/* ---- Site Header ---- */
.site-header{
  position: sticky; top:0; z-index:100;
  background: rgba(250,251,252,.92); backdrop-filter: blur(8px);
  border-bottom:1px solid var(--mctt-line);
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; height:76px; gap:10px; }
.brand{ display:flex; align-items:center; gap:12px; min-width:0; }
.brand-mark{ width:34px; height: 30px; flex:none; }
.brand-text{ line-height:1.15; min-width:0; overflow:hidden; }
.brand-text .zh, .brand-text .en{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.brand-text .zh{ font-size:16px; font-weight:700; color:var(--mctt-ink); display:block; }
.brand-text .en{ font-size:10.5px; letter-spacing:.06em; color:#8A8481; display:block; }

.main-nav{ display:flex; align-items:center; gap:6px; }
.main-nav a{
  padding:10px 16px; border-radius:999px; font-weight:600; font-size:14.5px; color:#514C4A;
  transition: all .15s ease;
}
.main-nav a:hover, .main-nav a.active{ background: var(--mctt-bg-alt); color: var(--mctt-blue); }
.header-actions{ display:flex; align-items:center; gap:10px; }
.cart-btn{
  position:relative; display:flex; align-items:center; gap:8px; flex:none; white-space:nowrap;
  padding:10px 16px; border-radius:999px; background:var(--mctt-ink); color:#fff; font-weight:700; font-size:14px;
}
.cart-btn .cart-label{ white-space:nowrap; }
.cart-count{
  background: var(--mctt-blue); color:#fff; border-radius:999px; min-width:20px; height:20px;
  display:inline-flex; align-items:center; justify-content:center; font-size:11.5px; padding:0 5px;
}
.nav-toggle{ display:none; background:none; border:0; padding:8px; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:''; display:block; width:22px; height:2px; background:var(--mctt-ink); position:relative; transition:.2s;
}
.nav-toggle span::before{ position:absolute; top:-7px; }
.nav-toggle span::after{ position:absolute; top:7px; }

/* 導覽列文字（尤其「黃金珠寶．金心珍意」）在約 861–1080px 這段寬度會擠成兩行，
   所以行動版選單的斷點拉到 1080px，讓平板／小筆電也走漢堡選單，避免擠壓換行。 */
@media (max-width: 1080px){
  .main-nav{
    position:fixed; inset:76px 0 0 0; background:#fff; flex-direction:column; align-items:stretch;
    padding:16px; gap:2px; transform:translateY(-8px); opacity:0; pointer-events:none; transition:.2s;
    height: calc(100vh - 76px); overflow:auto;
  }
  .main-nav.open{ transform:none; opacity:1; pointer-events:auto; }
  .main-nav a{ padding:14px 16px; border-radius:12px; font-size:16px; }
  .nav-toggle{ display:block; }
}

@media (max-width: 480px){
  .brand-text .en{ display:none; }
  .site-header .container{ height:64px; }
  .cart-btn{ padding:8px 12px; font-size:13px; gap:5px; }
  .cart-btn .cart-label{ display:none; }
}

/* ---- Hero halls grid (home) ---- */
.hero{
  padding: 88px 0 56px; background:
    radial-gradient(1200px 400px at 85% -10%, rgba(81,159,201,.14), transparent 60%),
    linear-gradient(180deg, #fff, var(--mctt-bg));
}
.hero h1{ font-size: clamp(30px,4.4vw,48px); max-width:780px; }
.hero .lead{ font-size:19px; }
.hero-actions{ display:flex; gap:14px; margin-top:28px; flex-wrap:wrap; }

.halls-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:48px; }
@media (max-width: 980px){ .halls-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .halls-grid{ grid-template-columns:1fr; } }

.hall-card{
  position:relative; overflow:hidden; border-radius: var(--radius-lg);
  padding:28px 24px; min-height:230px; display:flex; flex-direction:column; justify-content:flex-end;
  color:#fff; box-shadow: var(--shadow-sm); transition:.2s;
}
.hall-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-md); }
.hall-card .tag{ font-size:12px; letter-spacing:.1em; opacity:.85; font-weight:700; text-transform:uppercase; margin-bottom:10px; }
.hall-card h3{ font-size:22px; margin-bottom:6px; }
.hall-card p{ font-size:13.5px; opacity:.9; margin-bottom:0; }
.hall-card .go{ margin-top:14px; font-size:13px; font-weight:700; display:inline-flex; align-items:center; gap:6px; }
.hall-consulting{ background: linear-gradient(160deg,#274A63,#3E3A39); }
.hall-agency{ background: linear-gradient(160deg,#519FC9,#2E6C8E); }
.hall-gold{ background: linear-gradient(160deg,#141212,#3A2A12); }
.hall-toys{ background: linear-gradient(160deg,#FF7A59,#E1523A); }

/* ---- Generic content blocks ---- */
.grid-2{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
@media (max-width: 860px){ .grid-2{ grid-template-columns:1fr; gap:32px; } }

.stat-row{ display:flex; gap:36px; flex-wrap:wrap; margin-top:32px; }
.stat-row .stat b{ font-size:30px; display:block; color:var(--mctt-blue); }
.stat-row .stat span{ font-size:13px; color:#8A8481; }

.card{ background:#fff; border:1px solid var(--mctt-line); border-radius: var(--radius-md); padding:28px; box-shadow: var(--shadow-sm); }
.feature-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:36px; }
@media (max-width: 860px){ .feature-grid{ grid-template-columns:1fr; } }
.feature-grid .card .icon{
  width:46px;height:46px;border-radius:14px;background:var(--mctt-bg-alt);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;color:var(--mctt-blue);font-size:20px;font-weight:800;
}

.section-head{ max-width:640px; margin-bottom:8px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

/* ---- Forms ---- */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:640px){ .form-grid{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:7px; margin-bottom:18px; }
.field.full{ grid-column:1 / -1; }
.field label{ font-size:13.5px; font-weight:700; color:var(--mctt-charcoal); }
.field .hint{ font-size:12px; color:#9B948F; font-weight:400; }
.field input, .field select, .field textarea{
  padding:13px 14px; border:1.5px solid var(--mctt-line); border-radius:12px; font-size:15px;
  font-family:inherit; background:#fff; color:var(--mctt-ink);
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color: var(--mctt-blue); }
.field textarea{ resize:vertical; min-height:110px; }
.radio-row{ display:flex; gap:12px; flex-wrap:wrap; }
.radio-chip{
  border:1.5px solid var(--mctt-line); border-radius:12px; padding:12px 16px; cursor:pointer; font-size:14px;
  display:flex; align-items:flex-start; gap:8px; flex:1; min-width:180px;
}
.radio-chip input{ margin-top:3px; }
.radio-chip.checked{ border-color: var(--mctt-blue); background: var(--mctt-bg-alt); }
.form-msg{ padding:14px 16px; border-radius:12px; font-size:14px; margin-top:14px; display:none; }
.form-msg.ok{ background:#EAF6EF; color:#1E7C4C; display:block; }
.form-msg.err{ background:#FCEBEA; color:#B3261E; display:block; }

/* ---- Footer ---- */
.site-footer{ background: var(--mctt-ink); color:#D8D3D0; padding:56px 0 28px; margin-top:64px; }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr 1.1fr; gap:28px; }
@media (max-width:980px){ .footer-grid{ grid-template-columns:1fr 1fr 1fr; } }
@media (max-width:780px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
.footer-grid h4{ color:#fff; font-size:14px; letter-spacing:.04em; }
.footer-grid a, .footer-grid li{ color:#B7B1AE; font-size:13.5px; margin-bottom:10px; display:block; }
.footer-grid a:hover{ color:#fff; }
.footer-bottom{ border-top:1px solid #3A3634; margin-top:40px; padding-top:22px; font-size:12.5px; color:#8B857F; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }

/* ---- Product grid ---- */
.toolbar{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin:8px 0 28px; flex-wrap:wrap; }
.chip-row{ display:flex; gap:8px; flex-wrap:wrap; }
.chip{ padding:8px 16px; border-radius:999px; border:1.5px solid var(--mctt-line); font-size:13.5px; font-weight:600; background:#fff; }
.chip.active{ background: var(--mctt-ink); color:#fff; border-color:var(--mctt-ink); }
.product-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width:980px){ .product-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .product-grid{ grid-template-columns:1fr 1fr; gap:12px; } }

.product-card{ background:#fff; border:1px solid var(--mctt-line); border-radius:var(--radius-md); overflow:hidden; display:flex; flex-direction:column; transition:.18s; }
.product-card:hover{ box-shadow: var(--shadow-md); transform:translateY(-3px); }
.product-card .thumb{ aspect-ratio:1/1; overflow:hidden; background:var(--mctt-bg-alt); }
.product-card .thumb img{ width:100%; height:100%; object-fit:cover; }
.product-card .body{ padding:16px; display:flex; flex-direction:column; gap:6px; flex:1; }
.product-card .cat{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--mctt-blue); }
.product-card h4{ font-size:15.5px; margin:0; }
.product-card .price{ font-weight:800; font-size:16px; margin-top:auto; }
.product-card .price small{ font-weight:500; font-size:11.5px; color:#9B948F; }
.product-card .add-btn{ margin-top:10px; }

/* ---- Gold hall theme ---- */
body.theme-gold{ background: var(--gold-cream); }
body.theme-gold .site-header{ background: rgba(20,18,18,.92); border-bottom:1px solid #2B2725; }
body.theme-gold .main-nav a{ color:#D8CFC2; }
body.theme-gold .main-nav a:hover, body.theme-gold .main-nav a.active{ background:#2B2725; color: var(--gold-gold-light); }
body.theme-gold .brand-text .zh{ color:#fff; }
body.theme-gold .brand-text .en{ color:#9C948A; }
body.theme-gold .cart-btn{ background: linear-gradient(120deg,var(--gold-flame-1),var(--gold-flame-2)); color:#1a1103; }
body.theme-gold .nav-toggle span, body.theme-gold .nav-toggle span::before, body.theme-gold .nav-toggle span::after{ background:#fff; }
body.theme-gold .hero-gold{
  background: radial-gradient(1000px 340px at 80% -10%, rgba(201,162,39,.22), transparent 60%), linear-gradient(180deg,#181513,var(--gold-cream) 120%);
  color:#fff; padding:72px 0 48px;
}
body.theme-gold .hero-gold .eyebrow{ color: var(--gold-gold-light); }
body.theme-gold .hero-gold h1{ color:#fff; }
body.theme-gold .hero-gold .lead{ color:#C9C0B4; }
body.theme-gold .btn-primary{ background: linear-gradient(120deg,var(--gold-flame-1),var(--gold-flame-2)); color:#1a1103; }
body.theme-gold .btn-primary:hover{ filter:brightness(1.05); }
body.theme-gold .hero-gold .btn-outline{ border-color:#fff; color:#fff; }
body.theme-gold .hero-gold .btn-outline:hover{ background:#fff; color:#141212; }
body.theme-gold .btn-outline{ border-color: var(--gold-black); color: var(--gold-black); }
body.theme-gold .btn-outline:hover{ background: var(--gold-black); color:#fff; }
body.theme-gold .chip.active{ background: var(--gold-black); }
body.theme-gold .product-card{ background:#fff; border-color:#EADFC6; }
body.theme-gold .product-card .cat{ color: var(--gold-gold); }
body.theme-gold .price-note{
  margin-top:10px; padding:10px 14px; background:#FFF6E0; border:1px solid #F1DFA8; border-radius:10px;
  font-size:12.5px; color:#8A6A15;
}
body.theme-gold .site-footer{ background:#0F0D0C; }

/* ---- Toys hall accent ---- */
body.theme-toy .hero-toy{
  background: radial-gradient(1000px 340px at 80% -10%, rgba(255,122,89,.14), transparent 60%), linear-gradient(180deg,#fff,var(--mctt-bg));
  padding:72px 0 48px;
}
body.theme-toy .eyebrow{ color: var(--toy-accent); }
body.theme-toy .btn-primary{ background: var(--toy-accent); }
body.theme-toy .btn-primary:hover{ background:#e5613f; }
body.theme-toy .chip.active{ background: var(--toy-accent); border-color: var(--toy-accent); }
body.theme-toy .product-card .cat{ color: var(--toy-accent); }

/* ---- Cart / Checkout ---- */
.cart-layout{ display:grid; grid-template-columns: 1.6fr 1fr; gap:32px; align-items:start; }
@media (max-width:900px){ .cart-layout{ grid-template-columns:1fr; } }
.cart-line{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--mctt-line); align-items:center; }
.cart-line img{ width:76px; height:76px; object-fit:cover; border-radius:12px; background:var(--mctt-bg-alt); flex:none; }
.cart-line .info{ flex:1; min-width:0; }
.cart-line .info .cat{ font-size:11px; color:var(--mctt-blue); font-weight:700; text-transform:uppercase; }
.cart-line .info h4{ margin:2px 0 4px; font-size:15px; }
.qty-control{ display:flex; align-items:center; border:1.5px solid var(--mctt-line); border-radius:999px; overflow:hidden; }
.qty-control button{ width:30px; height:30px; border:0; background:#fff; font-size:16px; }
.qty-control input{ width:36px; text-align:center; border:0; font-size:14px; }
.cart-line .line-price{ font-weight:800; width:96px; text-align:right; }
.remove-link{ font-size:12.5px; color:#B3261E; margin-top:6px; display:inline-block; }
.summary-row{ display:flex; justify-content:space-between; padding:8px 0; font-size:14.5px; color:#5B5654; }
.summary-row.total{ font-size:18px; font-weight:800; color:var(--mctt-ink); border-top:1px solid var(--mctt-line); margin-top:8px; padding-top:14px; }
.empty-state{ text-align:center; padding:80px 20px; color:#9B948F; }

.order-box{ background:#fff; border:1.5px dashed var(--mctt-blue); border-radius:var(--radius-md); padding:26px; }
.order-box h3{ margin-bottom:6px; }
.order-id{ font-size:26px; font-weight:800; letter-spacing:.03em; color:var(--mctt-blue); }
.info-list{ margin-top:18px; }
.info-list li{ display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px dashed var(--mctt-line); font-size:14px; }
.badge-pay{ display:inline-block; padding:6px 12px; border-radius:999px; background:var(--mctt-bg-alt); font-size:12.5px; font-weight:700; }

/* ---- misc ---- */
.breadcrumb{ font-size:13px; color:#9B948F; margin-bottom:18px; }
.breadcrumb a:hover{ color: var(--mctt-blue); }
.pd-layout{ display:grid; grid-template-columns:1fr 1fr; gap:48px; }
@media (max-width:860px){ .pd-layout{ grid-template-columns:1fr; gap:24px; } }
.pd-gallery{ border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:1/1; background:var(--mctt-bg-alt); }
.pd-price{ font-size:30px; font-weight:800; margin:14px 0; }
.pd-meta{ display:flex; gap:10px; flex-wrap:wrap; margin:14px 0 22px; }
.pd-meta .chip{ pointer-events:none; }
.qty-buy-row{ display:flex; gap:12px; align-items:center; margin-top:22px; }

.table-simple{ width:100%; border-collapse:collapse; font-size:14px; }
.table-simple th,.table-simple td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--mctt-line); }
.table-simple th{ color:#8A8481; font-weight:700; font-size:12.5px; text-transform:uppercase; letter-spacing:.04em; }

.login-box{ max-width:380px; margin:80px auto; }
.tag-pill{ display:inline-flex; padding:4px 10px; border-radius:999px; background:var(--mctt-bg-alt); font-size:11.5px; font-weight:700; }

/* ============================================================
   館別性格分眾 — 黃金館：歐美精品編輯感／
   玩具日用館：在地化貼紙感／顧問代操館：科技效率感
   ============================================================ */

/* ---- 黃金館：改用襯線字表現精品雜誌感，加大字距、更多留白 ---- */
body.theme-gold{ background: var(--gold-cream); }
body.theme-gold h1, body.theme-gold h2,
body.theme-gold .product-card h4, body.theme-gold #pd-root h1{
  font-family: "Noto Serif TC", "Times New Norm", serif; font-weight:600; letter-spacing:.01em;
}
body.theme-gold .eyebrow{ letter-spacing:.26em; font-weight:600; }
body.theme-gold .hero-gold{
  position:relative; overflow:hidden;
  background:
    radial-gradient(900px 480px at 82% -20%, rgba(201,162,39,.20), transparent 60%),
    radial-gradient(700px 400px at 10% 110%, rgba(225,58,46,.10), transparent 60%),
    linear-gradient(180deg,#161311,var(--gold-cream) 128%);
}
body.theme-gold .hero-gold::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--gold-gold-light), transparent);
}
body.theme-gold .pd-price{ font-family:"Noto Serif TC", serif; }
body.theme-gold .product-card{ border-color:#EADFC6; }
body.theme-gold .product-card .thumb{ position:relative; }

/* ---- 玩具日用館：在地貼紙／插畫感，粗outline、硬陰影、微微歪斜 ---- */
body.theme-toy .product-card{
  border:2.5px solid #211D1B; border-radius:20px;
  box-shadow: 5px 5px 0 rgba(33,29,27,.14);
  transition: transform .16s ease, box-shadow .16s ease;
}
body.theme-toy .product-card:nth-child(3n+1){ transform: rotate(-0.6deg); }
body.theme-toy .product-card:nth-child(3n+2){ transform: rotate(0.5deg); }
body.theme-toy .product-card:nth-child(3n+3){ transform: rotate(-0.3deg); }
body.theme-toy .product-card:hover{ transform: translateY(-4px) rotate(0deg); box-shadow: 7px 7px 0 rgba(33,29,27,.18); }
body.theme-toy .chip{ border-width:2px; border-color:#211D1B; font-weight:800; }
body.theme-toy .chip.active{ box-shadow: 3px 3px 0 rgba(33,29,27,.2); }
body.theme-toy .btn-primary{ border:2px solid #211D1B; box-shadow: 3px 3px 0 rgba(33,29,27,.22); font-weight:800; }
body.theme-toy .btn-primary:hover{ transform: translate(-1px,-1px); box-shadow: 4px 4px 0 rgba(33,29,27,.22); }
body.theme-toy .hero-toy{ position:relative; }

/* ---- 顧問／代操館：務實科技感 — 網格背景、mono字、方正卡片 ---- */
body.theme-tech .hero{ position:relative; overflow:hidden; }
body.theme-tech .hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(81,159,201,.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(81,159,201,.16) 1px, transparent 1px);
  background-size: 42px 42px;
  -webkit-mask-image: radial-gradient(560px 420px at 82% 0%, black, transparent 72%);
  mask-image: radial-gradient(560px 420px at 82% 0%, black, transparent 72%);
}
body.theme-tech .eyebrow{ font-family:"JetBrains Mono", ui-monospace, monospace; letter-spacing:.08em; }
body.theme-tech .feature-grid .card{ border-radius:10px; }
body.theme-tech .feature-grid .icon{
  border-radius:6px; background: var(--mctt-ink); color:#fff;
  font-family:"JetBrains Mono", ui-monospace, monospace; font-size:14px;
}
body.theme-tech .card{ border-radius:12px; }
body.theme-tech .field input, body.theme-tech .field select, body.theme-tech .field textarea{ border-radius:8px; }
body.theme-tech .btn{ border-radius:8px; }
body.theme-tech .radio-chip{ border-radius:8px; }

/* ============================================================
   後台管理：分頁 Tabs／商品管理表格／庫存同步
   ============================================================ */
.admin-tabs{ display:flex; gap:6px; flex-wrap:wrap; border-bottom:1px solid var(--mctt-line); margin-bottom:28px; padding-bottom:0; }
.admin-tab{
  background:none; border:0; padding:11px 18px; font-weight:700; font-size:14px; color:#8A8481;
  border-bottom:2.5px solid transparent; margin-bottom:-1px;
}
.admin-tab:hover{ color:var(--mctt-ink); }
.admin-tab.active{ color:var(--mctt-blue); border-bottom-color:var(--mctt-blue); }
.admin-panel{ display:none; }
.admin-panel.active{ display:block; }
.panel-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.panel-head h3{ margin:0; }
.search-box{
  width:100%; max-width:320px; padding:10px 14px; margin-bottom:14px; border-radius:10px;
  border:1px solid var(--mctt-line); font-size:14px; font-family:inherit;
}
.btn-ghost{ background:none; border:0; color: var(--mctt-blue); font-weight:700; font-size:13px; padding:4px 6px; text-decoration:none; }
.btn-ghost:hover{ text-decoration:underline; }

/* ============================================================
   顧客資料閘門（加入購物車前彈窗）
   ============================================================ */
.gate-backdrop{
  position:fixed; inset:0; background:rgba(20,18,17,.55); z-index:2000;
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; pointer-events:none; transition:opacity .18s ease;
}
.gate-backdrop.open{ opacity:1; pointer-events:auto; }
.gate-modal{
  width:100%; max-width:420px; position:relative; max-height:90vh; overflow:auto;
  transform: translateY(10px); transition: transform .18s ease;
}
.gate-backdrop.open .gate-modal{ transform:translateY(0); }
.gate-modal h3{ margin-bottom:8px; padding-right:24px; }
.gate-close{
  position:absolute; top:14px; right:16px; background:none; border:0; font-size:22px;
  line-height:1; color:#9B948F; padding:4px;
}
.gate-close:hover{ color:var(--mctt-ink); }

/* ============================================================
   後台：訂單物流狀態更新彈窗（樣式沿用顧客資料閘門的彈窗語彙）
   ============================================================ */
.order-modal-backdrop{
  position:fixed; inset:0; background:rgba(20,18,17,.55); z-index:2000;
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; pointer-events:none; transition:opacity .18s ease;
}
.order-modal-backdrop.open{ opacity:1; pointer-events:auto; }
.order-modal{
  width:100%; max-width:460px; position:relative; max-height:90vh; overflow:auto;
  transform: translateY(10px); transition: transform .18s ease;
}
.order-modal-backdrop.open .order-modal{ transform:translateY(0); }
.order-modal h3{ margin-bottom:14px; padding-right:24px; }
.order-modal-close{
  position:absolute; top:14px; right:16px; background:none; border:0; font-size:22px;
  line-height:1; color:#9B948F; padding:4px;
}
.order-modal-close:hover{ color:var(--mctt-ink); }

/* ============================================================
   後台：LINE AI 客服對話彈窗（樣式沿用同一套彈窗語彙）
   ============================================================ */
.tab-badge{
  display:inline-flex; min-width:18px; height:18px; padding:0 5px; border-radius:999px;
  background:#B3261E; color:#fff; font-size:11px; font-weight:800; align-items:center; justify-content:center;
  margin-left:4px; vertical-align:middle;
}
.chat-modal-backdrop{
  position:fixed; inset:0; background:rgba(20,18,17,.55); z-index:2000;
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; pointer-events:none; transition:opacity .18s ease;
}
.chat-modal-backdrop.open{ opacity:1; pointer-events:auto; }
.chat-modal{
  width:100%; max-width:520px; position:relative; max-height:88vh; overflow:auto;
  transform: translateY(10px); transition: transform .18s ease;
  display:flex; flex-direction:column;
}
.chat-modal-backdrop.open .chat-modal{ transform:translateY(0); }
.chat-modal h3{ margin-bottom:10px; padding-right:24px; }
.chat-ai-toggle{ display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; margin-bottom:14px; }
.chat-ai-toggle input{ width:auto; }
.chat-thread{
  display:flex; flex-direction:column; gap:10px; max-height:280px; overflow-y:auto;
  padding:12px; background:var(--mctt-bg-alt); border-radius:10px; margin-bottom:16px;
}
.chat-bubble{ max-width:82%; padding:8px 12px; border-radius:12px; font-size:13.5px; line-height:1.5; }
.chat-bubble-label{ font-size:11px; opacity:.65; margin-bottom:2px; }
.chat-bubble-text{ white-space:pre-wrap; word-break:break-word; }
.chat-bubble.user{ align-self:flex-start; background:#fff; border:1px solid var(--mctt-line); }
.chat-bubble.ai{ align-self:flex-end; background:#E7F0FB; color:#2C5C8A; }
.chat-bubble.admin{ align-self:flex-end; background:#EAF6EF; color:#1E7C4C; }

/* ============================================================
   訂單物流查詢頁：進度階梯（stepper）與歷程列表
   ============================================================ */
.track-stepper{ display:flex; align-items:flex-start; margin:20px 0 8px; }
.track-step{ display:flex; flex-direction:column; align-items:center; gap:8px; flex:none; width:88px; }
.track-dot{
  width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; background:#E8E4E1; color:#9B948F; flex:none;
}
.track-step.done .track-dot{ background: var(--mctt-blue); color:#fff; }
.track-step.current .track-dot{ background: var(--mctt-ink); color:#fff; box-shadow:0 0 0 4px rgba(31,29,28,.12); }
.track-label{ font-size:12px; text-align:center; color:#8A8481; line-height:1.4; }
.track-step.done .track-label, .track-step.current .track-label{ color:var(--mctt-ink); font-weight:700; }
.track-line{ flex:1; height:2px; background:#E8E4E1; margin-top:15px; min-width:12px; }
@media (max-width:560px){
  .track-stepper{ flex-wrap:wrap; }
  .track-step{ width:auto; flex:1 1 40%; }
  .track-line{ display:none; }
}
.track-history{ display:flex; flex-direction:column; gap:10px; }
.track-history-item{ display:flex; gap:12px; flex-wrap:wrap; font-size:13.5px; padding-bottom:10px; border-bottom:1px dashed var(--mctt-line); }
.track-history-time{ color:#9B948F; flex:none; min-width:150px; }
.track-history-status{ font-weight:700; }
.track-history-note{ color:#5B5654; }