/* =====================================================================
   Genlight – 新版介面
   文字大小以 rem 為單位，<html> 的 gl-fs-0~3 class 控制整體縮放（長者友善）
   ===================================================================== */
:root {
  --gl-ink: #17271d;
  --gl-ink-2: #364a3d;
  --gl-muted: #56685c;
  --gl-bg: #f5f9f6;
  --gl-surface: #ffffff;
  --gl-line: #d9e7dd;
  --gl-navy: #062a16;
  --gl-navy-2: #0b3d20;
  --gl-cyan: #6fb92c;
  --gl-indigo: #007e34;
  --gl-violet: #6fb92c;
  --gl-accent: #007e34;
  --gl-accent-ink: #005c27;
  --gl-grad: linear-gradient(120deg, #1d9a3f 0%, #007e34 55%, #006a2c 100%);
  --gl-leaf: #6fb92c;
  --gl-brand: #007e34;
  --gl-tint: #eff7f2;
  --gl-grad-line: linear-gradient(90deg, #6fb92c 0%, #007e34 100%);
  --gl-radius: 18px;
  --gl-radius-sm: 12px;
  --gl-shadow: 0 1px 2px rgba(10, 30, 18, .06), 0 8px 24px -8px rgba(10, 30, 18, .14);
  --gl-shadow-lg: 0 24px 60px -20px rgba(6, 42, 22, .35);
  --gl-focus: 0 0 0 3px #fff, 0 0 0 6px #007e34;
  --gl-font: "Inter", "Segoe UI", "Noto Sans TC", "Microsoft JhengHei", Arial, sans-serif;
  --gl-display: "Space Grotesk", "Inter", "Segoe UI", Arial, sans-serif;
}

/* ---------- 文字縮放（覆蓋 bootstrap 的 html{font-size:10px}） ---------- */
html.gl { font-size: 16px; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html.gl.gl-fs-1 { font-size: 18px; }
html.gl.gl-fs-2 { font-size: 20px; }
html.gl.gl-fs-3 { font-size: 23px; }
@media (prefers-reduced-motion: reduce) { html.gl { scroll-behavior: auto; } }

.gl body {
  margin: 0;
  font-family: var(--gl-font);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--gl-ink);
  background: var(--gl-bg);
  -webkit-font-smoothing: antialiased;
}
.gl h1, .gl h2, .gl h3, .gl h4 { font-family: var(--gl-display); color: inherit; letter-spacing: -.01em; line-height: 1.25; margin-top: 0; }
.gl a { color: var(--gl-accent); text-decoration: none; }
.gl a:hover { color: var(--gl-accent-ink); text-decoration: underline; }
.gl img { max-width: 100%; height: auto; }
.gl :focus-visible { outline: none; box-shadow: var(--gl-focus); border-radius: 8px; }
.gl button { font: inherit; cursor: pointer; }
.gl input, .gl textarea, .gl select { font: inherit; }

.gl-container { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.gl-narrow { max-width: 880px; }
.gl-center { text-align: center; }
.gl-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.gl-skip { position: absolute; left: 12px; top: -200px; z-index: 10000; background: #fff; color: var(--gl-ink); padding: 10px 16px; border-radius: 10px; font-weight: 700; }
.gl-skip:focus { top: 12px; }
.gl-lead { font-size: 1.2rem; color: var(--gl-ink-2); }
.gl-h3 { font-size: 1.45rem; margin: 0 0 .9rem; }
.gl-empty { color: var(--gl-muted); padding: 2rem 0; font-size: 1.1rem; }
[hidden] { display: none !important; }

/* ---------- 閱讀輔助列（品牌深綠） ---------- */
.gl-a11y { background: #005c27; color: #e6f2ea; font-size: .9375rem; position: relative; z-index: 1001; }
.gl-a11y__inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 50px; flex-wrap: wrap; }
.gl-a11y__label { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: #fff; }
.gl-a11y__tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.gl-fontctl { display: inline-flex; align-items: center; gap: 4px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; padding: 3px; }
.gl-a11y__btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; height: 40px; padding: 0 12px; border: 0; border-radius: 999px; background: transparent; color: #fff; font-weight: 700; font-size: 1rem; line-height: 1; transition: background .2s; }
.gl-a11y__btn span { font-size: .85em; margin-left: 1px; }
.gl-a11y__btn--lg { font-size: 1.2rem; }
.gl-a11y__btn:hover { background: rgba(255, 255, 255, .18); }
.gl-a11y__btn--wide { border: 1px solid rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .08); font-weight: 600; font-size: .9375rem; }
.gl-a11y__btn[aria-pressed="true"] { background: #fff; border-color: #fff; color: #005c27; }
.gl-a11y__btn:disabled { opacity: .4; cursor: not-allowed; }
.gl-a11y__level { min-width: 48px; text-align: center; font-variant-numeric: tabular-nums; color: #c8e8a4; font-weight: 700; font-size: .875rem; }

/* ---------- 頁首（白底，完整呈現 Logo） ---------- */
.gl-topbar { position: sticky; top: 0; z-index: 1000; }
@media (max-height: 520px) { .gl-topbar { position: relative; } }
.gl-header { position: relative; z-index: 1000; background: rgba(255, 255, 255, .97); -webkit-backdrop-filter: saturate(160%) blur(12px); backdrop-filter: saturate(160%) blur(12px); color: var(--gl-ink); box-shadow: 0 6px 24px -14px rgba(0, 60, 25, .35); }
.gl-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--gl-grad-line); }
.gl-header__inner { display: flex; align-items: center; gap: 24px; min-height: 84px; }
.gl-brand { display: inline-flex; align-items: center; flex-shrink: 0; }
.gl-brand:hover { text-decoration: none !important; }
.gl .gl-brand__logo { height: 52px; width: auto; max-width: 100%; display: block; }
.gl-nav { display: flex; align-items: center; gap: 16px; flex: 1; justify-content: flex-end; }
.gl-nav__list { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.gl-nav__item { position: relative; display: flex; align-items: center; }
.gl-nav__link { position: relative; display: block; padding: 10px 14px; color: var(--gl-ink) !important; font-weight: 700; font-size: 1rem; border-radius: 10px; white-space: nowrap; letter-spacing: .01em; }
.gl-nav__link::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 2px; border-radius: 2px; background: var(--gl-leaf); transform: scaleX(0); transition: transform .2s; }
.gl-nav__link:hover { color: var(--gl-brand) !important; text-decoration: none !important; }
.gl-nav__link:hover::after, .gl-nav__item:focus-within > .gl-nav__link::after { transform: scaleX(1); }
.gl-nav__link--cta { background: var(--gl-brand); color: #fff !important; margin-left: 8px; padding: 10px 20px; border-radius: 999px; box-shadow: 0 8px 20px -10px rgba(0, 126, 52, .9); }
.gl-nav__link--cta::after { display: none; }
.gl-nav__link--cta:hover { background: #006a2c; color: #fff !important; }
.gl-nav__sub-toggle { display: none; background: transparent; border: 0; color: var(--gl-brand); width: 44px; height: 44px; border-radius: 10px; }
.gl-nav__sub { position: absolute; top: 100%; left: 0; min-width: 240px; list-style: none; margin: 8px 0 0; padding: 8px; background: #fff; border-radius: 14px; border-top: 3px solid var(--gl-leaf); box-shadow: var(--gl-shadow-lg); opacity: 0; visibility: hidden; transform: translateY(6px); transition: .18s ease; z-index: 20; }
.gl-nav__sub::before { content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px; }
.gl-nav__item.has-sub:hover .gl-nav__sub, .gl-nav__item.has-sub:focus-within .gl-nav__sub, .gl-nav__item.is-open .gl-nav__sub { opacity: 1; visibility: visible; transform: none; }
.gl-nav__sub a { display: block; padding: 10px 14px; color: var(--gl-ink) !important; border-radius: 10px; font-size: 1rem; font-weight: 500; }
.gl-nav__sub a:hover { background: var(--gl-tint); color: var(--gl-brand) !important; text-decoration: none !important; }

.gl-search { position: relative; display: flex; align-items: center; background: var(--gl-tint); border: 1.5px solid #cfe6d7; border-radius: 999px; padding: 4px 4px 4px 6px; min-width: 220px; transition: .2s; }
.gl-search:focus-within { background: #fff; border-color: var(--gl-brand); box-shadow: 0 0 0 4px rgba(0, 126, 52, .12); }
.gl-search__ai { font-family: var(--gl-display); font-weight: 700; font-size: .7rem; letter-spacing: .06em; padding: 4px 7px; border-radius: 999px; background: var(--gl-leaf); color: #fff; }
.gl-search__input { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--gl-ink); padding: 8px 10px; font-size: 1rem; outline: none; }
.gl-search__input::placeholder { color: #6f8476; }
.gl-search__btn { width: 38px; height: 38px; border: 0; border-radius: 50%; background: var(--gl-brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.gl-navtoggle { display: none; margin-left: auto; width: 48px; height: 48px; border-radius: 12px; border: 1.5px solid #cfe6d7; background: var(--gl-tint); flex-direction: column; justify-content: center; align-items: center; gap: 5px; }
.gl-navtoggle__bar { width: 22px; height: 2px; background: var(--gl-brand); border-radius: 2px; transition: .2s; }
.gl-navtoggle[aria-expanded="true"] .gl-navtoggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.gl-navtoggle[aria-expanded="true"] .gl-navtoggle__bar:nth-child(2) { opacity: 0; }
.gl-navtoggle[aria-expanded="true"] .gl-navtoggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* 智慧搜尋下拉 */
.gl-finder-pop { position: absolute; top: calc(100% + 10px); left: 0; right: 0; min-width: 300px; background: #fff; color: var(--gl-ink); border-radius: 16px; box-shadow: var(--gl-shadow-lg); padding: 8px; z-index: 50; border: 1px solid var(--gl-line); text-align: left; }
.gl-finder-pop--wide { top: calc(100% + 8px); }
.gl-finder-pop__head { display: flex; align-items: center; gap: 8px; padding: 6px 10px 8px; font-size: .8125rem; color: var(--gl-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.gl-finder-pop__head i { width: 8px; height: 8px; border-radius: 50%; background: var(--gl-grad); display: inline-block; }
.gl-finder-opt { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 12px; color: var(--gl-ink) !important; text-decoration: none !important; }
.gl-finder-opt img { width: 48px; height: 48px; object-fit: cover; border-radius: 10px; background: #eef4f0; flex-shrink: 0; }
.gl-finder-opt strong { display: block; font-size: 1rem; line-height: 1.3; }
.gl-finder-opt small { color: var(--gl-muted); font-size: .85rem; }
.gl-finder-opt mark { background: #d4ecdc; color: inherit; padding: 0 2px; border-radius: 3px; }
.gl-finder-opt:hover, .gl-finder-opt.is-active { background: #eaf5ee; }
.gl-finder-opt--all { justify-content: center; font-weight: 700; color: var(--gl-accent) !important; border-top: 1px solid var(--gl-line); border-radius: 0 0 12px 12px; margin-top: 4px; padding: 12px; }
.gl-finder-none { padding: 12px; color: var(--gl-muted); }

/* ---------- 按鈕 / 標籤 ---------- */
.gl-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 999px; font-weight: 700; font-size: 1rem; border: 2px solid transparent; text-decoration: none !important; transition: transform .15s, box-shadow .2s, background .2s, filter .2s; line-height: 1.2; text-align: center; }
.gl-btn:active { transform: translateY(1px); }
.gl-btn--lg { min-height: 56px; padding: 0 30px; font-size: 1.0625rem; }
.gl-btn--primary { background: var(--gl-grad); color: #fff !important; box-shadow: 0 10px 30px -10px rgba(0, 110, 45, .7); }
.gl-btn--primary:hover { filter: brightness(1.08); box-shadow: 0 14px 34px -10px rgba(0, 110, 45, .85); }
.gl-btn--ghost { background: rgba(255, 255, 255, .08); color: #fff !important; border-color: rgba(255, 255, 255, .45); }
.gl-btn--ghost:hover { background: rgba(255, 255, 255, .18); }
.gl-btn--outline { background: #fff; color: var(--gl-accent) !important; border-color: #bfdfcc; }
.gl-btn--outline:hover { border-color: var(--gl-accent); background: #eaf5ee; }
.gl-btn--light { background: #fff; color: var(--gl-accent-ink) !important; }
.gl-btn--leaf { background: var(--gl-leaf); color: #06260f !important; box-shadow: 0 10px 26px -12px rgba(111, 185, 44, .9); }
.gl-btn--leaf:hover { background: #82c946; }
.gl-btn[disabled] { opacity: .6; cursor: progress; }
.gl-iconbtn { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--gl-line); background: #fff; font-size: 1.5rem; line-height: 1; color: var(--gl-ink); }
.gl-iconbtn:hover { border-color: var(--gl-accent); color: var(--gl-accent); }

.gl-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--gl-line); color: var(--gl-ink-2) !important; font-size: .9375rem; font-weight: 600; text-decoration: none !important; transition: .15s; }
.gl-chip small { color: var(--gl-muted); font-weight: 600; }
a.gl-chip:hover { border-color: #8fc7a5; background: #eaf5ee; color: var(--gl-accent-ink) !important; }
.gl-chip--soft { background: #eaf5ee; border-color: transparent; color: var(--gl-accent-ink) !important; font-size: .8125rem; padding: 4px 12px; }
.gl-chip--glow { background: rgba(255, 255, 255, .08); border-color: rgba(185, 224, 143, .4); color: #e3f3e8 !important; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.gl-pulse { width: 9px; height: 9px; border-radius: 50%; background: #6fb92c; box-shadow: 0 0 0 0 rgba(111, 185, 44, .7); animation: gl-pulse 2s infinite; }
@keyframes gl-pulse { 70% { box-shadow: 0 0 0 10px rgba(111, 185, 44, 0); } 100% { box-shadow: 0 0 0 0 rgba(111, 185, 44, 0); } }
.gl-eyebrow { display: inline-block; font-family: var(--gl-display); font-weight: 700; font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; background: var(--gl-grad); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: .4rem; }

/* ---------- HERO ---------- */
.gl-hero { position: relative; min-height: min(78vh, 680px); display: flex; align-items: center; overflow: hidden; background: radial-gradient(1200px 600px at 80% 0%, #0d5a2a 0%, transparent 60%), radial-gradient(900px 500px at 0% 100%, #3f8f1f 0%, transparent 55%), var(--gl-navy); color: #fff; isolation: isolate; }
.gl-hero__slides { position: absolute; inset: 0; z-index: -3; }
.gl-hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.1s ease; }
.gl-hero__slide.is-active { opacity: 1; }
.gl-hero__slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 7s ease-out; }
.gl-hero__slide.is-active img { transform: scale(1); }
.gl-hero__net { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.gl-hero__shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(3, 26, 13, .92) 0%, rgba(4, 34, 17, .72) 45%, rgba(4, 34, 17, .25) 100%), linear-gradient(0deg, rgba(3, 26, 13, .6), transparent 40%); }
.gl-hero__content { padding: 96px 20px 140px; max-width: 1240px; }
.gl-hero__title { font-size: clamp(2.1rem, 4.6vw, 3.6rem); font-weight: 700; margin: 1.1rem 0 1rem; max-width: 760px; color: #fff; text-shadow: 0 2px 24px rgba(0, 0, 0, .35); }
.gl-hero__title.is-active { animation: gl-rise .7s ease both; }
@keyframes gl-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.gl-hero__lead { font-size: 1.2rem; color: #cfe0d4; max-width: 620px; margin: 0 0 2rem; }
.gl-hero__ctas { display: flex; flex-wrap: wrap; gap: 14px; }
.gl-hero__controls { position: absolute; right: 24px; bottom: 120px; display: flex; align-items: center; gap: 10px; }
.gl-hero__arrow { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .08); color: #fff; font-size: 1.3rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.gl-hero__arrow[data-gl-hero="pause"] { font-size: .8rem; letter-spacing: -2px; }
.gl-hero__arrow:hover { background: rgba(255, 255, 255, .2); }
.gl-hero__dots { display: flex; gap: 8px; }
.gl-hero__dot { width: 12px; height: 12px; border-radius: 999px; border: 0; background: rgba(255, 255, 255, .4); padding: 0; transition: .3s; }
.gl-hero__dot.is-active { width: 34px; background: var(--gl-cyan); }

/* ---------- 智慧搜尋卡 ---------- */
.gl-finder { position: relative; z-index: 5; margin-top: -88px; }
.gl-finder__card { position: relative; background: rgba(255, 255, 255, .96); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-radius: 24px; padding: 28px; box-shadow: var(--gl-shadow-lg); border: 1px solid rgba(255, 255, 255, .7); }
.gl-finder__card::before { content: ""; position: absolute; inset: -1px; border-radius: 25px; padding: 1px; background: var(--gl-grad); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: .55; pointer-events: none; }
.gl-finder__head { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.gl-finder__icon { width: 54px; height: 54px; border-radius: 16px; background: var(--gl-grad); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 10px 24px -10px rgba(0, 126, 52, .9); }
.gl-finder__title { font-size: 1.5rem; margin: 0; }
.gl-finder__sub { margin: 2px 0 0; color: var(--gl-muted); }
.gl-finder__form { position: relative; display: flex; gap: 10px; }
.gl-finder__form--page { margin-bottom: 1.5rem; max-width: 820px; }
.gl-finder__input { flex: 1; min-width: 0; height: 60px; padding: 0 22px; font-size: 1.125rem; border: 2px solid var(--gl-line); border-radius: 16px; background: #fff; color: var(--gl-ink); transition: .2s; }
.gl-finder__input:focus { outline: none; border-color: var(--gl-indigo); box-shadow: 0 0 0 5px rgba(0, 126, 52, .15); }
.gl-finder__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }

/* ---------- 區塊 ---------- */
.gl-section { padding: 72px 0; }
.gl-section--tight { padding: 24px 0 8px; }
.gl-section--alt { background: linear-gradient(180deg, #eaf3ed 0%, #f5f9f6 100%); }
.gl-sechead { text-align: center; margin-bottom: 36px; }
.gl-sechead--row { display: flex; align-items: flex-end; justify-content: space-between; text-align: left; gap: 16px; }
.gl-sechead__title { font-size: clamp(1.75rem, 3vw, 2.4rem); margin: 0; color: var(--gl-ink); }
.gl-sechead:not(.gl-sechead--row) .gl-sechead__title::after { content: ""; display: block; width: 56px; height: 4px; border-radius: 4px; margin: 14px auto 0; background: var(--gl-grad-line); }
.gl-sechead--row .gl-sechead__title::after { content: ""; display: block; width: 48px; height: 4px; border-radius: 4px; margin-top: 12px; background: var(--gl-grad-line); }
.gl-sechead__sub { color: var(--gl-muted); margin: .4rem 0 0; }

.gl-tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; max-width: 980px; margin: 0 auto; }
.gl-tile { position: relative; display: block; border-radius: var(--gl-radius); overflow: hidden; box-shadow: var(--gl-shadow); background: #fff; }
.gl-tile img { width: 100%; display: block; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s; }
.gl-tile:hover img { transform: scale(1.04); }
.gl-tile__label { position: absolute; left: 14px; right: 14px; bottom: 14px; padding: 12px 16px; border-radius: 14px; background: rgba(4, 34, 17, .78); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-weight: 700; font-size: 1.05rem; }
.gl-tile:hover { text-decoration: none !important; }

.gl-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.gl-feature { background: #fff; border-radius: var(--gl-radius); padding: 26px; border: 1px solid var(--gl-line); }
.gl-feature__icon { width: 52px; height: 52px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; background: #eaf5ee; color: var(--gl-accent); margin-bottom: 12px; }
.gl-feature h3 { font-size: 1.2rem; margin: 0 0 .35rem; }
.gl-feature p { margin: 0; color: var(--gl-muted); }

/* 商品卡 */
.gl-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-bottom: 32px; }
.gl-grid--3 { grid-template-columns: repeat(3, 1fr); }
.gl-card { background: var(--gl-surface); border-radius: var(--gl-radius); overflow: hidden; border: 1px solid var(--gl-line); display: flex; flex-direction: column; transition: transform .2s, box-shadow .2s, border-color .2s; }
.gl-card { position: relative; }
.gl-card::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--gl-grad-line); transform: scaleX(0); transform-origin: left; transition: transform .3s; }
.gl-card:hover { transform: translateY(-4px); box-shadow: var(--gl-shadow-lg); border-color: #bfdfcc; }
.gl-card:hover::after { transform: scaleX(1); }
.gl-card__media { display: block; aspect-ratio: 1 / 1; background: linear-gradient(135deg, #f0f5f1, #e6efe8); overflow: hidden; position: relative; }
.gl-card__media img { width: 100%; height: 100%; object-fit: contain; display: block; padding: 10px; box-sizing: border-box; transition: transform .4s; }
.gl-card:hover .gl-card__media img { transform: scale(1.05); }
.gl-card__file { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--gl-display); font-weight: 700; font-size: 2rem; color: var(--gl-accent); }
.gl-card__body { padding: 16px 18px 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; align-items: flex-start; }
.gl-card__title { font-size: 1.1rem; margin: 0; line-height: 1.35; }
.gl-card__title a { color: var(--gl-ink) !important; }
.gl-card__cta { margin-top: auto; font-weight: 700; font-size: .95rem; }

/* CTA */
.gl-cta { background: radial-gradient(800px 300px at 90% 0%, rgba(111, 185, 44, .55), transparent 60%), radial-gradient(700px 300px at 0% 100%, rgba(111, 185, 44, .4), transparent 60%), linear-gradient(120deg, #005c27 0%, #007e34 60%, #2f9a32 100%); color: #fff; padding: 64px 0; }
.gl-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.gl-cta__title { font-size: clamp(1.6rem, 3vw, 2.2rem); margin: 0 0 .4rem; color: #fff; }
.gl-cta p { color: #e3f1e7; margin: 0; max-width: 620px; }
.gl-cta__btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* ---------- 內頁 ---------- */
.gl-pagehero { position: relative; padding: 64px 0 56px; color: #fff; background: linear-gradient(100deg, rgba(3, 26, 13, .95) 0%, rgba(5, 52, 25, .85) 55%, rgba(0, 100, 40, .65) 100%), var(--gl-hero-img, none) center / cover no-repeat, var(--gl-navy); overflow: hidden; }
.gl-pagehero__grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 60%); mask-image: linear-gradient(90deg, transparent, #000 60%); }
.gl-pagehero .gl-container { position: relative; }
.gl-pagehero__title { font-size: clamp(1.9rem, 4vw, 2.9rem); margin: .6rem 0 0; color: #fff; }
.gl-crumbs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: .95rem; color: #9fb5a6; }
.gl-crumbs a { color: #b9e08f !important; }

.gl-layout { display: grid; grid-template-columns: 280px 1fr; gap: 32px; align-items: start; }
.gl-layout--single { grid-template-columns: 1fr; }
.gl-side { position: sticky; top: 150px; background: #fff; border-radius: var(--gl-radius); border: 1px solid var(--gl-line); padding: 20px; }
.gl-side__title { font-size: 1.1rem; margin: 0 0 .8rem; padding-bottom: .6rem; border-bottom: 2px solid #eaf5ee; }
.gl-side__list { list-style: none; margin: 0; padding: 0; }
.gl-side__list a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; color: var(--gl-ink-2) !important; font-weight: 500; }
.gl-side__list a:hover { background: #eef7f1; text-decoration: none !important; }
.gl-side__list a.is-active { background: var(--gl-grad); color: #fff !important; font-weight: 700; }
.gl-side__list a.is-active .gl-count { background: rgba(255, 255, 255, .25); color: #fff; }
.gl-count { font-size: .8rem; background: #eaf5ee; color: var(--gl-accent-ink); border-radius: 999px; padding: 2px 9px; font-weight: 700; }
.gl-panel { background: #fff; border-radius: var(--gl-radius); border: 1px solid var(--gl-line); padding: clamp(20px, 3vw, 36px); box-shadow: var(--gl-shadow); }

/* 後台內容：讓 CMS 內的固定字級跟著縮放 */
.gl-prose { color: var(--gl-ink-2); line-height: 1.8; overflow-wrap: anywhere; }
.gl-prose p, .gl-prose li, .gl-prose td, .gl-prose th, .gl-prose span, .gl-prose div, .gl-prose font { font-size: inherit !important; line-height: 1.8; }
.gl-prose h1, .gl-prose h2 { font-size: 1.6rem !important; }
.gl-prose h3, .gl-prose h4 { font-size: 1.3rem !important; }
.gl-prose img { border-radius: 12px; height: auto !important; }
.gl-prose table { width: 100% !important; border-collapse: collapse; display: block; overflow-x: auto; }
.gl-prose td, .gl-prose th { border: 1px solid var(--gl-line); padding: 10px; }
.gl-prose iframe { max-width: 100%; }

.gl-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--gl-line); }
.gl-pager__link { display: block; padding: 14px 16px; border: 1px solid var(--gl-line); border-radius: 14px; color: var(--gl-ink) !important; font-weight: 600; }
.gl-pager__link small { display: block; color: var(--gl-muted); font-weight: 600; }
.gl-pager__link:hover { border-color: var(--gl-indigo); text-decoration: none !important; }
.gl-pager__link--next { text-align: right; }

.gl-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.gl-toolbar__count { margin: 0; color: var(--gl-muted); }
.gl-filter input { height: 48px; border: 2px solid var(--gl-line); border-radius: 999px; padding: 0 18px; min-width: 240px; background: #fff; }
.gl-filter input:focus { outline: none; border-color: var(--gl-indigo); }
.gl-pagination { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.gl-pagination a { min-width: 46px; height: 46px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; border: 1px solid var(--gl-line); background: #fff; color: var(--gl-ink) !important; font-weight: 700; }
.gl-pagination a.is-active { background: var(--gl-grad); color: #fff !important; border-color: transparent; }

/* 產品明細 */
.gl-product { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: start; }
.gl-gallery__main { display: block; background: #fff; border-radius: 22px; border: 1px solid var(--gl-line); overflow: hidden; aspect-ratio: 1 / 1; box-shadow: var(--gl-shadow); cursor: zoom-in; }
.gl-gallery__main img { width: 100%; height: 100%; object-fit: contain; padding: 16px; box-sizing: border-box; }
.gl-gallery__thumbs { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.gl-gallery__thumb { width: 78px; height: 78px; padding: 0; border-radius: 12px; border: 2px solid var(--gl-line); overflow: hidden; background: #fff; }
.gl-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.gl-gallery__thumb.is-active { border-color: var(--gl-indigo); box-shadow: 0 0 0 3px rgba(0, 126, 52, .2); }
.gl-product__name { font-size: clamp(1.8rem, 3.2vw, 2.5rem); margin: .7rem 0 1rem; }
.gl-product__summary { font-size: 1.05rem; margin-bottom: 1.6rem; }
.gl-product__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 1.4rem; }
.gl-product__perks { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; color: var(--gl-ink-2); }
.gl-product__perks li { display: flex; align-items: center; gap: 10px; }
.gl-product__perks li::before { content: "✓"; width: 26px; height: 26px; border-radius: 50%; background: #e3f3e8; color: #007e34; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: .85rem; flex-shrink: 0; }

.gl-tabs__list { display: flex; gap: 6px; background: #fff; padding: 6px; border-radius: 999px; border: 1px solid var(--gl-line); width: max-content; max-width: 100%; margin-bottom: 20px; }
.gl-tabs__list [role="tab"] { border: 0; background: transparent; padding: 10px 24px; border-radius: 999px; font-weight: 700; color: var(--gl-ink-2); min-height: 46px; }
.gl-tabs__list [aria-selected="true"] { background: var(--gl-grad); color: #fff; }
.gl-tabs__panel { background: #fff; border-radius: var(--gl-radius); border: 1px solid var(--gl-line); padding: clamp(20px, 3vw, 36px); }

.gl-scroller { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 72px) / 4); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 4px 18px; scrollbar-width: thin; }
.gl-scroller > * { scroll-snap-align: start; }
.gl-scroller__nav { display: flex; gap: 8px; }

/* 表單 */
.gl-form__note { color: var(--gl-muted); font-size: .95rem; margin: 0 0 1rem; }
.gl-req { color: #dc2626; font-weight: 700; }
.gl-form__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px 16px; }
.gl-field { display: flex; flex-direction: column; gap: 6px; grid-column: span 6; }
.gl-field--half { grid-column: span 3; }
.gl-field--third { grid-column: span 2; }
.gl-field label { font-weight: 600; color: var(--gl-ink); font-size: 1rem; margin: 0; }
.gl-field input, .gl-field textarea { width: 100%; box-sizing: border-box; border: 2px solid var(--gl-line); border-radius: 12px; padding: 12px 14px; font-size: 1.0625rem; background: #fbfdfb; color: var(--gl-ink); min-height: 52px; transition: .15s; }
.gl-field textarea { min-height: 150px; resize: vertical; line-height: 1.6; }
.gl-field input:focus, .gl-field textarea:focus { outline: none; border-color: var(--gl-indigo); background: #fff; box-shadow: 0 0 0 4px rgba(0, 126, 52, .14); }
.gl-field.is-invalid input, .gl-field.is-invalid textarea { border-color: #dc2626; background: #fef2f2; }
.gl-field__err { color: #b91c1c; font-size: .9rem; font-weight: 600; }
.gl-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.gl-form__actions { display: flex; align-items: center; gap: 16px; margin-top: 22px; flex-wrap: wrap; }
.gl-form__privacy { color: var(--gl-muted); font-size: .9rem; }
.gl-alert { border-radius: 14px; padding: 16px 20px; margin-bottom: 18px; }
.gl-alert ul { margin: 6px 0 0; padding-left: 20px; }
.gl-alert--error { background: #fef2f2; border: 2px solid #fecaca; color: #991b1b; }

/* 搜尋結果 */
.gl-result-meta { font-size: 1.1rem; color: var(--gl-ink-2); margin-bottom: 1.5rem; }
.gl-results { list-style: none; padding: 0; margin: 0 0 2rem; display: grid; gap: 12px; }
.gl-results a { display: block; padding: 16px 20px; background: #fff; border: 1px solid var(--gl-line); border-radius: 14px; color: var(--gl-ink) !important; }
.gl-results a:hover { border-color: var(--gl-indigo); text-decoration: none !important; }
.gl-results span { display: block; color: var(--gl-muted); margin-top: 4px; }
.gl-emptybox { background: #fff; border: 1px dashed #bfdfcc; border-radius: var(--gl-radius); padding: 32px; text-align: center; }
.gl-sitemap { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.gl-sitemap ul { padding-left: 1.1rem; margin: 0; }
.gl-sitemap li { margin: .35rem 0; }

.gl-success { background: #fff; border-radius: 24px; padding: 48px 32px; box-shadow: var(--gl-shadow-lg); }
.gl-success__icon { width: 76px; height: 76px; border-radius: 50%; background: var(--gl-grad); color: #fff; font-size: 2.2rem; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; }

/* 聯絡 */
.gl-contact { display: grid; grid-template-columns: 1.6fr 1fr; gap: 24px; }
.gl-contact__map { position: relative; padding: 0; overflow: hidden; }
.gl-map { display: block; width: 100%; height: 100%; min-height: 400px; border: 0; }
.gl-map__open { position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: 999px; background: var(--gl-brand); color: #fff !important; font-weight: 700; box-shadow: 0 8px 20px -8px rgba(0, 60, 25, .6); text-decoration: none !important; }
.gl-map__open:hover { background: #006a2c; }
.gl-map--empty { display: flex; align-items: center; justify-content: center; background: repeating-linear-gradient(45deg, #f0f5f1, #f0f5f1 12px, #e6efe9 12px, #e6efe9 24px); }
.gl-contact__cards { display: grid; gap: 14px; align-content: start; }
.gl-infocard { display: flex; align-items: center; gap: 16px; background: #fff; border-radius: var(--gl-radius); border: 1px solid var(--gl-line); padding: 20px; color: var(--gl-ink) !important; font-weight: 600; overflow-wrap: anywhere; }
.gl-infocard i { width: 52px; height: 52px; border-radius: 14px; background: var(--gl-grad); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0; }
.gl-infocard small { display: block; color: var(--gl-muted); font-weight: 600; font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; }
.gl-infocard:hover { border-color: var(--gl-indigo); text-decoration: none !important; }

/* ---------- 頁尾 ---------- */
.gl-footer { position: relative; background: linear-gradient(180deg, #063a1c 0%, #042a14 100%); color: #d4e6da; padding: 0 0 28px; overflow: hidden; }
.gl-footer::before { content: ""; display: block; height: 4px; background: var(--gl-grad-line); margin-bottom: 64px; }
.gl-footer__glow { position: absolute; top: -160px; right: -120px; width: 620px; height: 420px; background: radial-gradient(closest-side, rgba(111, 185, 44, .22), transparent); pointer-events: none; }
.gl-footer .gl-container { position: relative; }
.gl-footer__grid { display: grid; grid-template-columns: 1.5fr .9fr 1fr; gap: 48px; }
.gl-footer__logo { display: inline-block; background: #fff; padding: 10px 14px; border-radius: 14px; margin-bottom: 22px; box-shadow: 0 10px 30px -14px rgba(0, 0, 0, .5); }
.gl .gl-footer__logo img { height: 44px; width: auto; display: block; }
.gl-footer__title { color: #fff; font-size: 1.1rem; margin: 0 0 1.1rem; padding-bottom: .7rem; position: relative; }
.gl-footer__title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 36px; height: 3px; border-radius: 3px; background: var(--gl-leaf); }
.gl .gl-footer__subtitle { color: #a9c9b3; font-size: .85rem; font-family: var(--gl-font); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin: 28px 0 12px; }
.gl-footer__contact, .gl-footer__links { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.gl-footer__contact li { display: flex; gap: 12px; align-items: flex-start; }
.gl-footer__contact i { flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; background: rgba(111, 185, 44, .16); color: #a6d96d; display: inline-flex; align-items: center; justify-content: center; font-size: .95rem; }
.gl-footer__contact a { padding-top: 4px; }
.gl-footer__links a { display: inline-flex; align-items: center; gap: 8px; }
.gl-footer__links a::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gl-leaf); opacity: .8; }
.gl-footer a { color: #eef6f0 !important; }
.gl-footer a:hover { color: #c8e8a4 !important; }
.gl-footer__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.gl-footer__tags .gl-chip { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .16); color: #eef6f0 !important; font-size: .85rem; padding: 5px 12px; font-weight: 500; }
.gl-footer__tags .gl-chip:hover { background: rgba(111, 185, 44, .2); border-color: rgba(111, 185, 44, .6); color: #fff !important; }
.gl-footer__text { color: #b9d2c1; margin: 0 0 18px; }
.gl-footer__badge { display: flex; width: max-content; margin-top: 22px; background: #fff; padding: 8px 12px; border-radius: 12px; }
.gl-footer__badge img { max-height: 40px; display: block; }
.gl-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 48px; padding-top: 22px; font-size: .9rem; color: #a9c9b3; }

/* ---------- 智慧助理 ---------- */
.gl-assist { position: fixed; right: 20px; bottom: 20px; z-index: 1200; }
.gl-assist__fab { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 62px; height: 62px; padding: 0; border: 0; border-radius: 999px; background: #fff; color: #fff; font-weight: 700; font-size: 1rem; box-shadow: 0 16px 36px -12px rgba(0, 90, 35, .55), inset 0 0 0 2px #cfe6d7, inset 0 0 0 1px rgba(255, 255, 255, .12); transition: transform .2s; }
.gl-assist__fab:hover { transform: translateY(-2px); }
.gl-assist__fab-text { position: absolute; right: 74px; top: 50%; transform: translateY(-50%); white-space: nowrap; background: var(--gl-navy); color: #fff; padding: 8px 14px; border-radius: 999px; font-size: .9rem; opacity: 0; pointer-events: none; transition: opacity .2s; box-shadow: var(--gl-shadow); }
.gl-assist__fab:hover .gl-assist__fab-text, .gl-assist__fab:focus-visible .gl-assist__fab-text { opacity: 1; }
.gl-assist__orb { width: 46px; height: 46px; border-radius: 50%; background: conic-gradient(from 0deg, #6fb92c, #007e34, #b9e08f, #6fb92c); position: relative; animation: gl-spin 6s linear infinite; flex-shrink: 0; }
.gl-assist__orb::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff 0 8%, #0b3d20 40%, #062a16 100%); }
.gl-assist__orb--sm { width: 34px; height: 34px; }
@keyframes gl-spin { to { transform: rotate(360deg); } }
.gl-assist__panel { position: absolute; right: 0; bottom: 74px; width: min(390px, calc(100vw - 32px)); max-height: min(620px, calc(100vh - 140px)); display: flex; flex-direction: column; background: #fff; border-radius: 22px; box-shadow: 0 30px 80px -20px rgba(10, 30, 18, .5); overflow: hidden; border: 1px solid var(--gl-line); animation: gl-rise .25s ease both; }
.gl-assist__head { display: flex; align-items: center; gap: 12px; padding: 16px 18px; background: var(--gl-navy); color: #fff; }
.gl-assist__head small { display: block; color: #9fb5a6; font-size: .85rem; }
.gl-assist__close { margin-left: auto; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .1); color: #fff; font-size: 1.5rem; line-height: 1; }
.gl-assist__log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: #f7faf8; min-height: 200px; }
.gl-msg { max-width: 88%; padding: 11px 14px; border-radius: 16px; font-size: 1rem; line-height: 1.55; }
.gl-msg--bot { background: #fff; border: 1px solid var(--gl-line); border-top-left-radius: 4px; align-self: flex-start; }
.gl-msg--me { background: var(--gl-grad); color: #fff; border-top-right-radius: 4px; align-self: flex-end; }
.gl-msg a { font-weight: 700; }
.gl-msg__list { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 6px; }
.gl-msg__list a { display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: 10px; background: #eef7f1; color: var(--gl-ink) !important; }
.gl-msg__list img { width: 40px; height: 40px; object-fit: cover; border-radius: 8px; }
.gl-typing { display: inline-flex; gap: 4px; padding: 14px 16px; }
.gl-typing i { width: 7px; height: 7px; border-radius: 50%; background: #9fb5a6; animation: gl-blink 1.2s infinite; }
.gl-typing i:nth-child(2) { animation-delay: .2s; } .gl-typing i:nth-child(3) { animation-delay: .4s; }
@keyframes gl-blink { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }
.gl-assist__chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 14px 0; background: #fff; }
.gl-assist__chips button { border: 1px solid #bfdfcc; background: #eaf5ee; color: var(--gl-accent-ink); border-radius: 999px; padding: 6px 12px; font-size: .875rem; font-weight: 600; }
.gl-assist__form { display: flex; gap: 8px; padding: 12px 14px 14px; background: #fff; }
.gl-assist__form input { flex: 1; min-width: 0; height: 48px; border: 2px solid var(--gl-line); border-radius: 999px; padding: 0 16px; font-size: 1rem; }
.gl-assist__form input:focus { outline: none; border-color: var(--gl-indigo); }
.gl-assist__form button { width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--gl-grad); color: #fff; display: inline-flex; align-items: center; justify-content: center; }

.gl-totop { position: fixed; left: 20px; bottom: 20px; z-index: 1100; width: 52px; height: 52px; border-radius: 50%; border: 0; background: #fff; color: var(--gl-ink); box-shadow: var(--gl-shadow-lg); }

/* ---------- 表單便利性 ---------- */
.gl-form__intro { color: var(--gl-muted); margin: -.4rem 0 1.2rem; }
.gl-form__progress { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; padding: 12px 16px; background: var(--gl-tint); border-radius: 14px; }
.gl-form__progress-bar { flex: 1; height: 8px; border-radius: 99px; background: #d6e9dc; overflow: hidden; }
.gl-form__progress-bar span { display: block; height: 100%; width: 0; border-radius: 99px; background: var(--gl-grad-line); transition: width .35s ease; }
.gl-form__progress-text { font-size: .9rem; font-weight: 700; color: var(--gl-brand); white-space: nowrap; }
.gl-form.is-complete .gl-form__progress { background: #e1f3d2; }
.gl-form__restore { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .95rem; color: var(--gl-ink-2); background: #fff; border: 1px dashed #bfdfcc; border-radius: 12px; padding: 10px 14px; margin: 0 0 18px; }
.gl-form__restore i { color: var(--gl-leaf); }
.gl-linkbtn { border: 0; background: none; padding: 0; color: var(--gl-brand); font-weight: 700; text-decoration: underline; cursor: pointer; }
.gl-step { border: 1px solid var(--gl-line); border-radius: 16px; padding: 22px 22px 6px; margin: 0 0 20px; min-width: 0; background: #fcfefc; }
.gl-step__title { display: flex; align-items: center; gap: 10px; font-family: var(--gl-display); font-weight: 700; font-size: 1.15rem; color: var(--gl-ink); padding: 0 8px; margin: 0 0 12px -8px; width: auto; border: 0; }
.gl-step__num { width: 30px; height: 30px; border-radius: 50%; background: var(--gl-brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .95rem; flex-shrink: 0; }
.gl-step__product { display: inline-flex; align-items: center; gap: 8px; background: var(--gl-tint); color: var(--gl-ink-2); padding: 8px 14px; border-radius: 999px; margin: 0 0 16px; font-size: .95rem; }
.gl-step__product i { color: var(--gl-brand); }
.gl-step .gl-field { margin-bottom: 16px; }
.gl-step .gl-form__grid { gap: 0 16px; }
.gl-field__label { font-weight: 600; color: var(--gl-ink); }
.gl-opt { font-weight: 400; color: var(--gl-muted); font-size: .9em; }
.gl-hint { color: var(--gl-muted); font-size: .875rem; }
.gl-hint--row { display: flex; justify-content: space-between; gap: 12px; }
.gl-checks { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.gl-check { position: relative; display: inline-flex; align-items: center; cursor: pointer; margin: 0; font-weight: 600; }
.gl-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.gl-check span { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 16px; border: 2px solid var(--gl-line); border-radius: 999px; background: #fff; color: var(--gl-ink-2); font-size: .975rem; transition: .15s; }
.gl-check span::before { content: ""; width: 18px; height: 18px; border-radius: 6px; border: 2px solid #9fbfaa; background: #fff; flex-shrink: 0; transition: .15s; }
.gl-check:hover span { border-color: #8fc7a5; }
.gl-check input:checked + span { border-color: var(--gl-brand); background: #eaf5ee; color: var(--gl-accent-ink); }
.gl-check input:checked + span::before { background: var(--gl-brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 16.2l-4.2-4.2-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center / 14px no-repeat; border-color: var(--gl-brand); }
.gl-check input:focus-visible + span { box-shadow: var(--gl-focus); }
.gl-check--plain span { border: 0; padding: 0; min-height: 0; background: none; font-weight: 500; }
.gl-remember { margin: 6px 0 0; }
.gl-input { position: relative; }
.gl-input__icon { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: #8aa996; pointer-events: none; font-size: .95rem; width: 18px; text-align: center; }
.gl-input .gl-input__icon + input { padding-left: 44px; }
.gl-field.is-valid .gl-input::after { content: "✓"; position: absolute; right: 14px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; border-radius: 50%; background: #e1f3d2; color: var(--gl-brand); font-weight: 800; font-size: .8rem; display: flex; align-items: center; justify-content: center; }
.gl-field.is-valid input { border-color: #a6d5b6; padding-right: 46px; }
.gl-field input:focus + .gl-input__icon, .gl-input:focus-within .gl-input__icon { color: var(--gl-brand); }
.gl-qty { display: flex; gap: 8px; }
.gl-qty input { flex: 1; min-width: 0; }
.gl-qty select, .gl-field select { min-height: 52px; border: 2px solid var(--gl-line); border-radius: 12px; padding: 0 38px 0 14px; font-size: 1.0625rem; background: #fbfdfb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23007e34' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") right 10px center / 22px no-repeat; color: var(--gl-ink); -webkit-appearance: none; appearance: none; max-width: 48%; }
.gl-qty select:focus { outline: none; border-color: var(--gl-brand); box-shadow: 0 0 0 4px rgba(0, 126, 52, .14); }
.gl-more { margin: 0 0 16px; }
.gl-more summary { cursor: pointer; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--gl-brand); padding: 6px 0 14px; list-style: none; }
.gl-more summary::-webkit-details-marker { display: none; }
.gl-more summary::before { content: "+"; width: 24px; height: 24px; border-radius: 50%; background: var(--gl-tint); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; }
.gl-more[open] summary::before { content: "−"; }
.gl-suggest { font-size: .925rem; color: #8a5a00; background: #fff8e6; border-radius: 10px; padding: 6px 12px; margin-top: 2px; }
.gl-field__err { display: flex; align-items: center; gap: 6px; }
.gl-spinner { width: 18px; height: 18px; border-radius: 50%; border: 3px solid rgba(255, 255, 255, .4); border-top-color: #fff; animation: gl-spin .8s linear infinite; display: inline-block; }
@media (max-width: 767px) {
  .gl-step { padding: 18px 14px 4px; }
  .gl-form__progress { flex-direction: column; align-items: stretch; gap: 8px; }
  .gl-form__actions .gl-btn { width: 100%; }
  .gl-check span { min-height: 44px; padding: 0 14px; }
}
html.gl-hc .gl-step, html.gl-hc .gl-form__progress, html.gl-hc .gl-form__restore, html.gl-hc .gl-check span, html.gl-hc .gl-step__product, html.gl-hc .gl-qty select { background: #000 !important; color: #fff !important; border-color: #fff !important; }
html.gl-hc .gl-check input:checked + span { background: #ffeb3b !important; color: #000 !important; }
html.gl-hc .gl-step__title, html.gl-hc .gl-hint, html.gl-hc .gl-opt, html.gl-hc .gl-form__progress-text, html.gl-hc .gl-field__label { color: #fff !important; }

/* ---------- 網站索引 ---------- */
.gl-sm { padding-top: 48px; }
.gl-sm__quick { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 28px; }
.gl-sm__tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 108px; padding: 16px; background: #fff; border: 1px solid var(--gl-line); border-radius: 18px; color: var(--gl-ink) !important; font-weight: 700; text-align: center; transition: .2s; text-decoration: none !important; }
.gl-sm__tile i { width: 46px; height: 46px; border-radius: 14px; background: var(--gl-tint); color: var(--gl-brand); display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; transition: .2s; }
.gl-sm__tile:hover { border-color: #8fc7a5; transform: translateY(-3px); box-shadow: var(--gl-shadow); }
.gl-sm__tile:hover i { background: var(--gl-brand); color: #fff; }
.gl-sm__tile--cta { background: var(--gl-grad); color: #fff !important; border-color: transparent; }
.gl-sm__tile--cta i { background: rgba(255, 255, 255, .18); color: #fff; }
.gl-sm__tools { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.gl-sm__filter { position: relative; flex: 1; max-width: 520px; margin: 0; }
.gl-sm__filter i { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); color: #8aa996; }
.gl-sm__filter input { width: 100%; box-sizing: border-box; height: 54px; padding: 0 20px 0 46px; border: 2px solid var(--gl-line); border-radius: 999px; background: #fff; font-size: 1.0625rem; }
.gl-sm__filter input:focus { outline: none; border-color: var(--gl-brand); box-shadow: 0 0 0 4px rgba(0, 126, 52, .12); }
.gl-sm__count { margin: 0; color: var(--gl-muted); font-weight: 600; }
.gl-sm__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 24px; align-items: start; }
.gl-sm__card { box-sizing: border-box; min-width: 0; background: #fff; border: 1px solid var(--gl-line); border-radius: 20px; padding: 22px 22px 14px; margin: 0; box-shadow: var(--gl-shadow); position: relative; overflow: hidden; }
.gl-sm__card::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 4px; background: var(--gl-grad-line); }
.gl-sm__card--wide { grid-column: 1 / -1; }
.gl-sm__head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.gl-sm__icon { width: 44px; height: 44px; border-radius: 13px; background: var(--gl-tint); color: var(--gl-brand); display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; flex-shrink: 0; }
.gl .gl-sm__title { font-size: 1.2rem; margin: 0; flex: 1; letter-spacing: .01em; }
.gl-sm__badge { font-size: .8rem; font-weight: 700; color: var(--gl-accent-ink); background: #eaf5ee; border-radius: 999px; padding: 2px 10px; }
.gl-sm__more { font-weight: 700; white-space: nowrap; }
.gl-sm__list { list-style: none; margin: 0; padding: 0; }
.gl-sm__list li + li { border-top: 1px solid #eef4f0; }
.gl-sm__list a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 6px; color: var(--gl-ink-2) !important; font-weight: 500; border-radius: 10px; text-decoration: none !important; transition: .15s; }
.gl-sm__list a i { color: #a9c7b3; font-size: .8rem; flex-shrink: 0; transition: .15s; }
.gl-sm__list a:hover { background: var(--gl-tint); color: var(--gl-brand) !important; padding-left: 12px; }
.gl-sm__list a:hover i { color: var(--gl-brand); }
.gl-sm__list--compact a { padding: 9px 6px; font-size: .975rem; }
.gl-sm__cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px 28px; margin-top: 6px; }
.gl .gl-sm__cattitle { display: flex; align-items: center; gap: 8px; font-size: 1.05rem; margin: 12px 0 4px; padding-bottom: 8px; border-bottom: 2px solid var(--gl-tint); }
.gl-sm__cattitle a { color: var(--gl-brand) !important; }
.gl-card.is-target { box-shadow: 0 0 0 4px var(--gl-leaf), var(--gl-shadow-lg); }
@media (max-width: 991px) { .gl-sm__quick { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) {
  .gl-sm__quick { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .gl-sm__tile { min-height: 92px; }
  .gl-sm__tile--cta { grid-column: 1 / -1; flex-direction: row; min-height: 64px; }
  .gl-sm__filter { max-width: none; flex-basis: 100%; }
}
html.gl-fs-2 .gl-sm__grid, html.gl-fs-3 .gl-sm__grid { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
@media (max-width: 400px) { .gl-sm__grid { grid-template-columns: 1fr; } }
html.gl-hc .gl-sm__card, html.gl-hc .gl-sm__tile, html.gl-hc .gl-sm__filter input { background: #000 !important; border: 2px solid #fff !important; color: #fff !important; }
html.gl-hc .gl-sm__list a, html.gl-hc .gl-sm__cattitle a, html.gl-hc .gl-sm__tile { color: #ffeb3b !important; }
html.gl-hc .gl-sm__icon, html.gl-hc .gl-sm__badge, html.gl-hc .gl-sm__tile i { background: #ffeb3b !important; color: #000 !important; }

/* ---------- 燈箱 ---------- */
html.gl-lb-open, html.gl-lb-open body { overflow: hidden; }
.gl-lb { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 64px 80px; box-sizing: border-box; animation: gl-fade .2s ease both; }
@keyframes gl-fade { from { opacity: 0; } to { opacity: 1; } }
.gl-lb__backdrop { position: absolute; inset: 0; background: rgba(3, 26, 13, .92); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.gl-lb__stage { position: relative; margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.gl-lb__media { display: flex; align-items: center; justify-content: center; min-width: 120px; min-height: 120px; }
.gl-lb__media img { max-width: min(1200px, calc(100vw - 160px)); max-height: calc(100vh - 190px); width: auto; height: auto; border-radius: 12px; background: #fff; box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .7); animation: gl-zoom .25s ease both; }
@keyframes gl-zoom { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }
.gl-lb__media.is-loading::after { content: ""; width: 44px; height: 44px; border-radius: 50%; border: 4px solid rgba(255, 255, 255, .2); border-top-color: #6fb92c; animation: gl-spin .8s linear infinite; position: absolute; }
.gl-lb__pdf { width: min(1000px, calc(100vw - 160px)); height: calc(100vh - 190px); border: 0; border-radius: 12px; background: #fff; }
.gl-lb__bar { display: flex; align-items: center; gap: 16px; color: #fff; font-size: 1.05rem; flex-wrap: wrap; justify-content: center; }
.gl-lb__title { font-weight: 700; }
.gl-lb__count { color: #9fb5a6; font-variant-numeric: tabular-nums; }
.gl-lb__btn { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 18px; border-radius: 999px; background: var(--gl-grad); color: #fff !important; font-weight: 700; text-decoration: none !important; }
.gl-lb__nav, .gl-lb__close { position: absolute; border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .1); color: #fff; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; line-height: 1; transition: background .2s; }
.gl-lb__nav:hover, .gl-lb__close:hover { background: rgba(255, 255, 255, .25); }
.gl-lb__nav { top: 50%; transform: translateY(-50%); width: 56px; height: 56px; font-size: 2rem; }
.gl-lb__prev { left: 16px; } .gl-lb__next { right: 16px; }
.gl-lb__close { top: 16px; right: 16px; width: 52px; height: 52px; font-size: 2rem; }
.gl-card__media { cursor: zoom-in; }
.gl-card--download .gl-card__media { position: relative; }
.gl-card__zoom { position: absolute; right: 10px; bottom: 10px; width: 40px; height: 40px; border-radius: 50%; background: rgba(4, 34, 17, .75); color: #fff; display: inline-flex; align-items: center; justify-content: center; opacity: 0; transform: translateY(4px); transition: .2s; }
.gl-card--download:hover .gl-card__zoom, .gl-card--download .gl-card__media:focus-visible .gl-card__zoom { opacity: 1; transform: none; }
.gl-card__actions { display: flex; gap: 18px; margin-top: auto; flex-wrap: wrap; }
@media (max-width: 767px) {
  .gl-lb { padding: 60px 8px 20px; }
  .gl-lb__media img { max-width: calc(100vw - 16px); max-height: calc(100vh - 180px); }
  .gl-lb__pdf { width: calc(100vw - 16px); height: calc(100vh - 180px); }
  .gl-lb__nav { top: auto; bottom: 16px; transform: none; width: 48px; height: 48px; }
  .gl-card__zoom { opacity: 1; transform: none; }
}
html.gl-hc .gl-lb__backdrop { background: #000; }
html.gl-hc .gl-lb__btn { background: #ffeb3b !important; color: #000 !important; }

/* ---------- 高對比模式 ---------- */
html.gl-hc body, html.gl-hc .gl-section--alt, html.gl-hc .gl-assist__log { background: #000 !important; color: #fff !important; }
html.gl-hc .gl-card, html.gl-hc .gl-panel, html.gl-hc .gl-feature, html.gl-hc .gl-side, html.gl-hc .gl-tabs__panel, html.gl-hc .gl-tabs__list, html.gl-hc .gl-infocard, html.gl-hc .gl-results a, html.gl-hc .gl-finder__card, html.gl-hc .gl-emptybox, html.gl-hc .gl-success, html.gl-hc .gl-gallery__main, html.gl-hc .gl-assist__panel, html.gl-hc .gl-assist__chips, html.gl-hc .gl-assist__form, html.gl-hc .gl-msg--bot, html.gl-hc .gl-finder-pop, html.gl-hc .gl-pager__link, html.gl-hc .gl-nav__sub, html.gl-hc .gl-tile { background: #000 !important; color: #fff !important; border: 2px solid #fff !important; box-shadow: none !important; }
html.gl-hc a, html.gl-hc .gl-card__title a, html.gl-hc .gl-side__list a, html.gl-hc .gl-nav__sub a, html.gl-hc .gl-finder-opt, html.gl-hc .gl-chip, html.gl-hc .gl-infocard, html.gl-hc .gl-results a, html.gl-hc .gl-pager__link { color: #ffeb3b !important; text-decoration: underline !important; }
html.gl-hc .gl-prose, html.gl-hc .gl-muted, html.gl-hc .gl-feature p, html.gl-hc .gl-finder__sub, html.gl-hc .gl-sechead__sub, html.gl-hc .gl-lead, html.gl-hc .gl-empty, html.gl-hc .gl-result-meta, html.gl-hc .gl-results span, html.gl-hc .gl-field label, html.gl-hc .gl-hero__lead, html.gl-hc .gl-footer__text, html.gl-hc .gl-toolbar__count { color: #fff !important; }
html.gl-hc .gl-btn--primary, html.gl-hc .gl-nav__link--cta, html.gl-hc .gl-side__list a.is-active, html.gl-hc .gl-tabs__list [aria-selected="true"], html.gl-hc .gl-pagination a.is-active, html.gl-hc .gl-msg--me, html.gl-hc .gl-a11y__btn[aria-pressed="true"] { background: #ffeb3b !important; color: #000 !important; text-decoration: none !important; box-shadow: none !important; }
html.gl-hc .gl-btn--outline, html.gl-hc .gl-btn--ghost, html.gl-hc .gl-btn--light, html.gl-hc .gl-chip { background: #000 !important; border: 2px solid #ffeb3b !important; color: #ffeb3b !important; }
html.gl-hc .gl-field input, html.gl-hc .gl-field textarea, html.gl-hc .gl-finder__input, html.gl-hc .gl-filter input, html.gl-hc .gl-assist__form input { background: #000 !important; color: #fff !important; border: 2px solid #fff !important; }
html.gl-hc .gl-hero__shade { background: rgba(0, 0, 0, .85) !important; }
html.gl-hc .gl-hero__net, html.gl-hc .gl-footer__glow, html.gl-hc .gl-pagehero__grid { display: none; }
html.gl-hc .gl-eyebrow { color: #ffeb3b; background: none; }
html.gl-hc .gl-pagehero, html.gl-hc .gl-cta, html.gl-hc .gl-header, html.gl-hc .gl-footer, html.gl-hc .gl-a11y { background: #000 !important; }
html.gl-hc :focus-visible { box-shadow: 0 0 0 4px #ffeb3b !important; }

/* ---------- RWD ---------- */
@media (max-width: 1100px) {
  .gl-grid { grid-template-columns: repeat(3, 1fr); }
  .gl-scroller { grid-auto-columns: calc((100% - 48px) / 3); }
  .gl-search { min-width: 0; }
}
@media (max-width: 991px) {
  .gl-navtoggle { display: inline-flex; }
  .gl-nav { position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 12px; padding: 16px 20px 22px; background: #fff; border-top: 1px solid var(--gl-line); box-shadow: 0 24px 40px -20px rgba(0, 60, 25, .45); display: none; max-height: calc(100vh - 140px); overflow-y: auto; }
  .gl-nav.is-open { display: flex; }
  .gl-nav__list { flex-direction: column; align-items: stretch; gap: 2px; }
  .gl-nav__item { flex-wrap: wrap; }
  .gl-nav__link { flex: 1; padding: 14px 12px; font-size: 1.0625rem; border-bottom: 1px solid var(--gl-line); border-radius: 0; }
  .gl-nav__link::after { display: none; }
  .gl-nav__link--cta { margin: 12px 0 0; text-align: center; border-radius: 999px; border-bottom: 0; }
  .gl-nav__sub-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .gl-nav__item.is-open .gl-nav__sub-toggle svg { transform: rotate(180deg); }
  .gl-nav__sub { position: static; width: 100%; opacity: 1; visibility: visible; transform: none; display: none; margin: 0 0 6px; background: var(--gl-tint); box-shadow: none; border-top: 0; }
  .gl-nav__item.has-sub:hover .gl-nav__sub { display: none; }
  .gl-nav__item.is-open .gl-nav__sub, .gl-nav__item.is-open:hover .gl-nav__sub { display: block; }
  .gl-search { width: 100%; box-sizing: border-box; }
  .gl-layout { grid-template-columns: 1fr; }
  .gl-side { position: static; }
  .gl-product { grid-template-columns: 1fr; gap: 28px; }
  .gl-contact { grid-template-columns: 1fr; }
  .gl-footer__grid { grid-template-columns: 1fr 1fr; }
  .gl-footer__brand { grid-column: 1 / -1; }
  .gl-features { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .gl-hide-sm { display: none; }
  .gl-a11y__label { display: none; }
  .gl-a11y__inner { justify-content: center; }
  .gl-a11y__btn--wide { width: 44px; padding: 0; }
  .gl .gl-brand__logo { height: 40px; }
  .gl-brand { min-width: 0; flex: 1 1 auto; }
  .gl-navtoggle { flex-shrink: 0; }
  .gl-header__inner { min-height: 66px; }
  .gl-hero { min-height: 560px; }
  .gl-hero__content { padding: 56px 20px 176px; }
  .gl-hero__ctas .gl-btn { width: 100%; }
  .gl-hero__controls { left: 20px; right: 20px; bottom: 104px; justify-content: space-between; }
  .gl-hero__arrow[data-gl-hero="prev"], .gl-hero__arrow[data-gl-hero="next"] { display: none; }
  .gl-finder__icon { display: none; }
  .gl-finder__title { font-size: 1.3rem; }
  .gl-assist { right: 14px; bottom: 14px; }
  .gl-assist__fab { width: 54px; height: 54px; }
  .gl-assist__orb { width: 40px; height: 40px; }
  .gl-finder { margin-top: -72px; }
  .gl-finder__card { padding: 20px; }
  .gl-finder__form { flex-direction: column; }
  .gl-finder__form .gl-btn { width: 100%; }
  .gl-finder__input { flex: none; width: 100%; box-sizing: border-box; }
  .gl-grid, .gl-grid--3 { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .gl-scroller { grid-auto-columns: 70%; gap: 14px; }
  .gl-tiles { grid-template-columns: 1fr; }
  .gl-section { padding: 52px 0; }
  .gl-form__grid { grid-template-columns: 1fr; }
  .gl-field, .gl-field--half, .gl-field--third { grid-column: 1 / -1; }
  .gl-footer__grid { grid-template-columns: 1fr; }
  .gl-sechead--row { flex-direction: column; align-items: flex-start; }
  .gl-pager { grid-template-columns: 1fr; }
  .gl-card__body { padding: 12px 12px 16px; }
  .gl-filter input { min-width: 0; width: 100%; }
  .gl-filter { width: 100%; }
}
/* 字級放大時：頁首搜尋縮小、自動減少欄數，避免擠壓 */
html.gl-fs-2 .gl-search, html.gl-fs-3 .gl-search { min-width: 0; flex: 0 1 240px; }
html.gl-fs-3 .gl-nav__link { padding: 10px 10px; }
html.gl-fs-2 .gl-grid, html.gl-fs-3 .gl-grid { grid-template-columns: repeat(3, 1fr); }
html.gl-fs-3 .gl-grid--3 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 767px) {
  html.gl-fs-2 .gl-grid, html.gl-fs-3 .gl-grid, html.gl-fs-3 .gl-grid--3 { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .gl *, .gl *::before, .gl *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media print {
  .gl-a11y, .gl-header, .gl-assist, .gl-totop, .gl-footer, .gl-hero__controls { display: none !important; }
}