/* ============================================================
   Hanatimes Theme — 果乾水直銷站
   Warm White + Natural Green + Vibrant Orange
   System sans-serif fonts
   ============================================================ */

/* ── Variables ── */
[data-theme="hanatimes"] {
  --han-cream: #FFFDF9;
  --han-sand: #FFF8ED;
  --han-white: #FFFFFF;
  --han-orange: #E8723C;
  --han-green: #6BA337;
  --han-gold: #D4A017;
  --han-berry: #D25064;
  --han-dark-brown: #3C2A1A;
  --han-warm-gold: #D4A574;
  --han-dark: #2D3B1A;
  --han-text: #5A6B45;
  --han-text-light: #7A8A6B;
  --han-border: rgba(45, 59, 26, 0.08);
  --han-radius: 12px;
  --han-ff-body: system-ui, -apple-system, 'Noto Sans TC', sans-serif;

  --color-primary: #E8723C;
  --color-primary-dk: #D4631F;
  --color-primary-lt: #FFFDF9;
  --color-bg: #FFFDF9;
  --color-bg-alt: #FFF8ED;
  --color-text: #2D3B1A;
  --color-muted: #7A8A6B;
  --color-border: rgba(45, 59, 26, 0.08);
  --font-display: system-ui, -apple-system, 'Noto Sans TC', sans-serif;
  --font-ui: system-ui, -apple-system, 'Noto Sans TC', sans-serif;
  --radius: 12px;
  --shadow-card: 0 1px 4px rgba(0,0,0,0.04);
  --shadow-hover: 0 8px 24px rgba(0,0,0,0.08);
  --transition: 0.25s ease;
  --color-surface: #FFFDF9;
  --color-surface-alt: #FFF8ED;
  --color-primary-dark: #2D3B1A;
  --color-primary-light: #6BA337;
  --color-accent: #E8723C;
  --color-accent-light: #FFF8ED;
  --color-text-primary: #2D3B1A;
  --color-text-secondary: #5A6B45;
  --color-text-muted: #7A8A6B;
  --color-text-on-dark: #FFFFFF;
  --font-heading: system-ui, -apple-system, 'Noto Sans TC', sans-serif;
  --font-body: system-ui, -apple-system, 'Noto Sans TC', sans-serif;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --header-bg: #FFFDF9;
  --header-text: #2D3B1A;
  --footer-bg: #3C2A1A;
  --footer-text: rgba(255,255,255,0.5);
  --card-shadow: 0 1px 4px rgba(0,0,0,0.04);
  --card-shadow-hover: 0 8px 24px rgba(0,0,0,0.08);
  --reading-progress-color: #E8723C;
  --han-warm-brown: #E8723C;
  --han-rose: #6BA337;
  --han-sage: #6BA337;
}

[data-theme="hanatimes"] { background: #FFFDF9; }
html, body { overflow-x: hidden; }

/* ── Reading progress ── */
[data-theme="hanatimes"] .reading-progress-bar { background: var(--han-orange); height: 3px; }

/* ── Breadcrumb ── */
[data-theme="hanatimes"] .breadcrumb,
[data-theme="hanatimes"] .breadcrumb a {
  font-family: var(--han-ff-body); font-size: 12px; font-weight: 400; color: var(--han-text-light); text-decoration: none;
}
[data-theme="hanatimes"] .breadcrumb a:hover { color: var(--han-orange); }

/* ── Pill tag ── */
[data-theme="hanatimes"] .pill-tag {
  display: inline-block; font-family: var(--han-ff-body); font-size: 11px; font-weight: 500;
  color: var(--han-orange); background: rgba(232,114,60,0.08); border: 1px solid rgba(232,114,60,0.2);
  padding: 4px 14px; border-radius: 999px;
}

/* ── Article prose ── */
[data-theme="hanatimes"] .prose-premium {
  font-family: var(--han-ff-body); font-size: 15.5px; font-weight: 400; line-height: 1.9; color: #3D4A2E;
}
[data-theme="hanatimes"] .prose-premium h2 {
  font-family: var(--han-ff-body); font-size: 22px; font-weight: 500;
  margin-top: 36px; margin-bottom: 16px; padding-top: 8px;
  border-top: 1px solid var(--han-border); color: var(--han-dark);
}
[data-theme="hanatimes"] .prose-premium h3 {
  font-family: var(--han-ff-body); font-size: 18px; font-weight: 500;
  margin-top: 28px; margin-bottom: 12px; color: var(--han-dark);
}
[data-theme="hanatimes"] .prose-premium p { margin-bottom: 16px; }
[data-theme="hanatimes"] .prose-premium ul,
[data-theme="hanatimes"] .prose-premium ol { font-size: 14.5px; line-height: 1.8; margin-left: 20px; margin-bottom: 16px; }
[data-theme="hanatimes"] .prose-premium blockquote {
  border-left: 3px solid var(--han-green); padding: 16px 24px; background: rgba(107,163,55,0.06);
  font-style: italic; font-size: 15px; margin: 24px 0; color: var(--han-text); border-radius: 0 8px 8px 0;
}
[data-theme="hanatimes"] .prose-premium a { color: var(--han-orange); text-decoration: none; }
[data-theme="hanatimes"] .prose-premium a:hover { text-decoration: underline; }
[data-theme="hanatimes"] .prose-premium img { max-width: 100%; border-radius: 12px; }

/* ── Scroll reveal ── */
[data-theme="hanatimes"] .reveal { opacity: 0; transform: translateY(16px); transition: opacity 0.5s ease, transform 0.5s ease; }
[data-theme="hanatimes"] .reveal.visible { opacity: 1; transform: translateY(0); }

/* ── Hero fallback ── */
[data-theme="hanatimes"] .hero-no-image {
  position: relative; min-height: 460px; display: flex; align-items: center; padding-top: 70px;
  overflow: hidden; background: linear-gradient(135deg, #FFF8ED 0%, #FFF0DB 50%, #FFEACC 100%);
}
[data-theme="hanatimes"] .hero-text-center { position: relative; z-index: 1; padding: 0 2rem; max-width: 800px; margin: 0 auto; width: 100%; }
[data-theme="hanatimes"] .hero-eyebrow { font-family: var(--han-ff-body); font-size: 11px; font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase; color: var(--han-orange); margin-bottom: 1rem; }
[data-theme="hanatimes"] .hero-stat { font-family: var(--han-ff-body); font-size: 14px; color: var(--han-text-light); }

/* ── Article hero ── */
[data-theme="hanatimes"] .article-hero-no-img { height: 200px; background: #FFF8ED; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
[data-theme="hanatimes"] .article-hero-with-img { height: 400px; position: relative; overflow: hidden; }
[data-theme="hanatimes"] .article-hero-with-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
[data-theme="hanatimes"] .article-hero-with-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(45,59,26,0.5) 0%, transparent 50%); }

/* ── Stats bar ── */
[data-theme="hanatimes"] .stats-bar { background: #FFFDF9; border-top: 1px solid var(--han-border); border-bottom: 1px solid var(--han-border); padding: 2.5rem 2rem; }
[data-theme="hanatimes"] .stat-number { font-family: var(--han-ff-body); font-size: 32px; font-weight: 500; color: var(--han-dark); line-height: 1; }
[data-theme="hanatimes"] .stat-label { font-family: var(--han-ff-body); font-size: 11px; font-weight: 400; color: var(--han-text-light); margin-top: 0.4rem; }

/* ── Section titles ── */
[data-theme="hanatimes"] .section-eyebrow { font-family: var(--han-ff-body); font-size: 11px; font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase; color: var(--han-orange); margin-bottom: 0.4rem; }
[data-theme="hanatimes"] .section-title { font-family: var(--han-ff-body); font-size: 28px; font-weight: 500; color: var(--han-dark); margin-bottom: 0.5rem; }
[data-theme="hanatimes"] .section-rule { display: none; }

/* ── Card ── */
[data-theme="hanatimes"] .article-card { display: block; text-decoration: none; background: #fff; border: 1px solid var(--han-border); border-radius: 12px; overflow: hidden; transition: transform var(--transition), box-shadow var(--transition); }
[data-theme="hanatimes"] .article-card::before { display: none; }
[data-theme="hanatimes"] .article-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.06); }
[data-theme="hanatimes"] .card-img-wrap { position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: #FFF8ED; }
[data-theme="hanatimes"] .card-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
[data-theme="hanatimes"] .article-card:hover .card-img-wrap img { transform: scale(1.03); }
[data-theme="hanatimes"] .card-category-pill { position: absolute; bottom: 10px; left: 10px; z-index: 1; background: rgba(255,255,255,0.9); color: var(--han-orange); font-family: var(--han-ff-body); font-size: 10px; font-weight: 500; letter-spacing: 0.08em; padding: 3px 10px; border-radius: 999px; }
[data-theme="hanatimes"] .card-img-placeholder { width: 100%; height: 100%; background: #FFF8ED; display: flex; align-items: center; justify-content: center; }
[data-theme="hanatimes"] .card-body { padding: 16px 16px 20px; }
[data-theme="hanatimes"] .card-title { font-family: var(--han-ff-body); font-size: 15px; font-weight: 500; color: var(--han-dark); line-height: 1.4; margin-bottom: 0.4rem; }
[data-theme="hanatimes"] .card-excerpt { font-family: var(--han-ff-body); font-size: 13px; font-weight: 400; color: var(--han-text-light); line-height: 1.6; }
[data-theme="hanatimes"] .card-date { font-family: var(--han-ff-body); font-size: 11px; font-weight: 400; color: var(--han-text-light); margin-top: 0.6rem; }

/* ── Category Cards ── */
[data-theme="hanatimes"] .cat-card { background: #fff !important; border-color: var(--han-border) !important; border-radius: 12px !important; }
[data-theme="hanatimes"] .cat-card:hover { border-color: var(--han-orange) !important; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.06); }
[data-theme="hanatimes"] .cat-card .cat-card-number { color: var(--han-text-light) !important; font-size: 10px !important; }
[data-theme="hanatimes"] .cat-card .cat-card-name { font-family: var(--han-ff-body) !important; font-size: 16px !important; font-weight: 500 !important; color: var(--han-dark) !important; }
[data-theme="hanatimes"] .cat-card .cat-card-count { color: var(--han-text-light) !important; font-size: 12px !important; }
[data-theme="hanatimes"] .cat-card:hover .cat-card-arrow { color: var(--han-orange) !important; }

/* ── Hover states ── */
.han-cat-card:hover { border-color: var(--han-orange, #E8723C) !important; transform: translateY(-2px); }
.han-cat-card:hover .han-cat-arrow { opacity: 1 !important; }
.han-article-row:hover h3 { color: var(--han-orange, #E8723C) !important; }
.hana-product-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,0.08); }
.hana-partner-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,0.06); }

/* ── Mobile ── */
@media (max-width: 768px) {
  [data-theme="hanatimes"] .hero-no-image { min-height: 380px; }
  .hana-hero { grid-template-columns: 1fr !important; min-height: auto !important; }
  .hana-hero > div:first-child { padding: 32px 24px !important; }
  .hana-hero > div:last-child { height: 260px; }
  .hana-hero h1 { font-size: 32px !important; }
  .hana-trust-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .hana-trust-grid > div { border-right: none !important; }
  .hana-trust-grid > div:nth-child(odd) { border-right: 1px solid rgba(45,59,26,0.06) !important; }
  .hana-trust-grid > div:nth-child(1), .hana-trust-grid > div:nth-child(2) { border-bottom: 1px solid rgba(45,59,26,0.06); }
  .hana-product-grid { display: flex !important; overflow-x: auto !important; scroll-snap-type: x mandatory; gap: 16px !important; padding-bottom: 12px; -webkit-overflow-scrolling: touch; }
  .hana-product-grid > div { min-width: 280px; flex-shrink: 0; scroll-snap-align: start; }
  .hana-howto-layout { grid-template-columns: 1fr !important; gap: 40px !important; }
  .hana-partner-grid { grid-template-columns: 1fr !important; }
  .han-category-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .han-featured-grid { grid-template-columns: 1fr !important; }
  .han-stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .han-stats-grid > div { border-right: none !important; border-bottom: 1px solid var(--han-border, rgba(45,59,26,0.08)); }
  .han-stats-grid > div:nth-child(odd) { border-right: 1px solid var(--han-border, rgba(45,59,26,0.08)) !important; }
  .han-related-grid { grid-template-columns: 1fr !important; }
  .hana-footer-grid { grid-template-columns: 1fr 1fr !important; gap: 32px !important; }
  .han-article-row { grid-template-columns: 1fr !important; }
  .han-article-row > div:first-child { width: 100% !important; height: 200px !important; }
}

@media (max-width: 480px) {
  .han-category-grid { grid-template-columns: 1fr !important; }
  .hana-footer-grid { grid-template-columns: 1fr !important; }
  .hana-trust-grid { grid-template-columns: 1fr !important; }
  .hana-trust-grid > div { border-right: none !important; border-bottom: 1px solid rgba(45,59,26,0.06); }
}