/*
Theme Name: 芳療．SPA
Theme URI: https://example.com/fangliao-spa
Author: Shibanyu
Description: 天然精油與芳療服務整合主題。以 Glamar 設計語言為基礎，繁體中文最佳化，深度整合 WooCommerce 商品與線下芳療服務預約（SPA、輕旅行、DIY 課程、命理活動），並支援會員推薦積分系統。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fangliao-spa
Tags: e-commerce, spa, essential-oil, booking, custom-colors, custom-menu, translation-ready
*/

/* ==========================================================================
   1. 設計代幣 (Design Tokens)
   對齊 Glamar 設計系統：主色 #4e7661 鼠尾草綠
   ========================================================================== */
:root {
	/* 調色盤 */
	--palette1: #4e7661;   /* 主色：鼠尾草綠 */
	--palette2: #000000;   /* 次色：黑 */
	--palette3: #000000;   /* 標題/文字深色 */
	--palette4: #555555;   /* 正文 */
	--palette5: #777777;   /* 次級文字 */
	--palette6: #999999;   /* 弱化文字 */
	--palette7: #f5f5f5;   /* 淺底 */
	--palette8: #f8f8f8;   /* 更淺底 */
	--palette9: #ffffff;   /* 白 */

	/* 語意色 */
	--color-primary: var(--palette1);
	--color-secondary: var(--palette2);
	--color-heading: var(--palette3);
	--color-text: var(--palette4);
	--color-muted: var(--palette6);
	--color-background: var(--palette9);
	--color-surface: var(--palette7);
	--color-border: #e5e5e5;
	--color-border-alt: #ebebeb;
	--color-link: var(--palette3);
	--color-link-hover: var(--palette1);
	--color-star: #ffab00;
	--color-sale-bg: #fbe9e7;
	--color-sale: #ef2d2d;
	--color-success: #2a7a25;
	--color-success-bg: #e6f7e6;
	--color-alert: #da3f3f;
	--color-nostock: #ff8e3e;
	--color-new: #6b80f7;
	--color-point: #b8860b;   /* 積分金色 */

	/* 字型 */
	--body-font-family: "Poppins", "Noto Sans TC", -apple-system, BlinkMacSystemFont, "PingFang TC", "Microsoft JhengHei", sans-serif;
	--heading-font-family: var(--body-font-family);
	--font-size-body: 14px;
	--font-size-small: 0.875rem;
	--font-size-xsmall: 0.75rem;
	--font-size-medium: 1.125rem;
	--font-size-large: 1.375rem;
	--font-size-larger: 1.75rem;
	--font-size-xlarger: 2rem;
	--font-size-xxlarger: 2.375rem;
	--font-normal: 400;
	--font-medium-w: 500;
	--font-semibold: 600;
	--font-bold: 700;
	--body-line-height: 1.7em;  /* 中文行高比原版 1.5 略高，提升可讀性 */
	--heading-weight: var(--font-semibold);
	--heading-line-height: 1.4;

	--h1-size: 2.25rem;
	--h2-size: 1.875rem;
	--h3-size: 1.625rem;
	--h4-size: 1.375rem;
	--h5-size: 1.125rem;
	--h6-size: 1rem;

	/* 版面 */
	--content-width: 1330px;
	--content-narrow-width: 962px;
	--content-edge-padding-x: 15px;
	--section-spacing: 3rem;

	/* 間距 */
	--xxxs-spacing: 0.313rem;
	--xxs-spacing: 0.625rem;
	--xs-spacing: 0.938rem;
	--sm-spacing: 1rem;
	--md-spacing: 1.25rem;
	--lg-spacing: 1.875rem;
	--xl-spacing: 2rem;
	--xxl-spacing: 2.5rem;
	--xxxl-spacing: 3.5rem;
	--xxxxl-spacing: 5rem;
	--gap-sm: 0.625rem;
	--gap-md: 1.25rem;
	--gap-lg: 1.875rem;

	/* 按鈕 */
	--btn-height: 42px;
	--btn-line-height: 42px;
	--btn-padding-x: 23px;
	--btn-padding-y: 5px;
	--btn-radius: 5px;
	--btn-font-size: 14px;
	--btn-weight: 600;
	--btn-letter-spacing: 0.3px;
	--btn-border-width: 0;

	/* 表單 */
	--input-height: 42px;
	--input-radius: 5px;
	--input-border-width: 1px;
	--input-padding: 0.5rem 1rem;

	/* 其他 */
	--border-radius: 0;
	--card-radius: 5px;
	--shadow: 5px 0px 30px 0px rgba(0, 0, 0, 0.08);
	--shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.05);
	--shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.12);
	--overlay-bg: rgba(0, 0, 0, 0.6);
	--transition: all 0.4s;
	--duration-short: 0.3s;
	--duration-long: 0.5s;
	--zoom-transform: scale(1.05);
	--header-height: 80px;
}

/* ==========================================================================
   2. 重置與基礎
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--body-font-family);
	font-size: var(--font-size-body);
	font-weight: var(--font-normal);
	line-height: var(--body-line-height);
	color: var(--color-text);
	background-color: var(--color-background);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 var(--sm-spacing);
	font-family: var(--heading-font-family);
	font-weight: var(--heading-weight);
	line-height: var(--heading-line-height);
	color: var(--color-heading);
}
h1 { font-size: var(--h1-size); }
h2 { font-size: var(--h2-size); }
h3 { font-size: var(--h3-size); }
h4 { font-size: var(--h4-size); }
h5 { font-size: var(--h5-size); }
h6 { font-size: var(--h6-size); }

p { margin: 0 0 var(--sm-spacing); }

a {
	color: var(--color-link);
	text-decoration: none;
	transition: var(--transition);
}
a:hover, a:focus { color: var(--color-link-hover); }

img { max-width: 100%; height: auto; vertical-align: middle; }

ul, ol { margin: 0 0 var(--sm-spacing); padding-left: 1.25rem; }

figure { margin: 0; }

/* 無障礙 */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
}
.skip-link:focus {
	position: fixed; top: 10px; left: 10px;
	z-index: 100000;
	width: auto; height: auto;
	padding: 12px 20px; clip: auto;
	background: var(--color-primary);
	color: #fff; border-radius: var(--btn-radius);
}

:focus-visible {
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
}

/* ==========================================================================
   3. 版面容器
   ========================================================================== */
.fl-container {
	width: 100%;
	max-width: var(--content-width);
	margin: 0 auto;
	padding-left: var(--content-edge-padding-x);
	padding-right: var(--content-edge-padding-x);
}
.fl-container--narrow { max-width: var(--content-narrow-width); }
.fl-container--wide { max-width: 1600px; }

.fl-section { padding-top: var(--section-spacing); padding-bottom: var(--section-spacing); }
.fl-section--tight { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.fl-section--loose { padding-top: var(--xxxxl-spacing); padding-bottom: var(--xxxxl-spacing); }
.fl-section--surface { background-color: var(--palette8); }

.fl-grid { display: grid; gap: var(--gap-lg); }
.fl-grid--2 { grid-template-columns: repeat(2, 1fr); }
.fl-grid--3 { grid-template-columns: repeat(3, 1fr); }
.fl-grid--4 { grid-template-columns: repeat(4, 1fr); }
.fl-grid--5 { grid-template-columns: repeat(5, 1fr); }

/* 區塊標頭 */
.fl-section-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--md-spacing);
	margin-bottom: var(--lg-spacing);
}
.fl-section-head__title { margin: 0; font-size: 34px; font-weight: var(--font-semibold); }
.fl-section-head__link {
	font-size: 14px; font-weight: var(--font-semibold);
	text-decoration: underline; text-underline-offset: 4px;
	white-space: nowrap;
}
.fl-section-head--center { flex-direction: column; text-align: center; }
.fl-section-head--center .fl-section-head__sub {
	max-width: 620px; margin: 0 auto;
	color: var(--color-muted);
}
.fl-eyebrow {
	display: block;
	font-size: var(--font-size-xsmall);
	font-weight: var(--font-semibold);
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--color-primary);
	margin-bottom: var(--xxs-spacing);
}

/* ==========================================================================
   4. 按鈕
   ========================================================================== */
.fl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: var(--btn-height);
	padding: var(--btn-padding-y) var(--btn-padding-x);
	border: var(--btn-border-width) solid transparent;
	border-radius: var(--btn-radius);
	font-family: var(--body-font-family);
	font-size: var(--btn-font-size);
	font-weight: var(--btn-weight);
	letter-spacing: var(--btn-letter-spacing);
	line-height: 1;
	text-align: center;
	cursor: pointer;
	transition: var(--transition);
	background-color: var(--palette1);
	color: var(--palette9);
}
.fl-btn:hover, .fl-btn:focus { background-color: var(--palette2); color: var(--palette9); }

.fl-btn--secondary { background-color: var(--palette2); color: var(--palette9); }
.fl-btn--secondary:hover { background-color: var(--palette1); color: var(--palette9); }

.fl-btn--tertiary { background-color: var(--palette7); color: var(--palette4); }
.fl-btn--tertiary:hover { background-color: var(--palette1); color: var(--palette9); }

.fl-btn--outline {
	background-color: transparent;
	border-width: 1px;
	border-color: currentColor;
	color: var(--palette3);
}
.fl-btn--outline:hover { background-color: var(--palette1); border-color: var(--palette1); color: var(--palette9); }

.fl-btn--light { background-color: var(--palette9); color: var(--palette3); }
.fl-btn--light:hover { background-color: var(--palette1); color: var(--palette9); }

.fl-btn--text {
	height: auto; padding: 0;
	background: none; color: var(--palette3);
	text-decoration: underline; text-underline-offset: 4px;
}
.fl-btn--text:hover { background: none; color: var(--palette1); }

.fl-btn--lg { height: 50px; padding: 0 32px; font-size: 15px; }
.fl-btn--sm { height: 34px; padding: 0 16px; font-size: 13px; }
.fl-btn--block { display: flex; width: 100%; }

/* ==========================================================================
   5. 表單
   ========================================================================== */
input[type="text"], input[type="email"], input[type="url"], input[type="password"],
input[type="search"], input[type="number"], input[type="tel"], input[type="date"],
input[type="time"], select, textarea {
	width: 100%;
	height: var(--input-height);
	padding: var(--input-padding);
	border: var(--input-border-width) solid var(--color-border);
	border-radius: var(--input-radius);
	background-color: var(--palette9);
	color: var(--palette3);
	font-family: var(--body-font-family);
	font-size: var(--font-size-body);
	transition: var(--transition);
}
textarea { height: auto; min-height: 120px; padding: 0.75rem 1rem; }
input:focus, select:focus, textarea:focus {
	outline: none;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(78, 118, 97, 0.12);
}
input::placeholder, textarea::placeholder { color: rgba(0, 0, 0, 0.4); }
label { display: block; margin-bottom: 6px; font-weight: var(--font-medium-w); color: var(--palette3); }
select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23555' d='M6 8L0 2l1.4-1.4L6 5.2 10.6.6 12 2z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 36px;
}

/* ==========================================================================
   6. 促銷條 (Promo Bar)
   ========================================================================== */
.fl-promo-bar {
	position: relative;
	background-color: var(--palette1);
	color: var(--palette9);
	font-size: 13px;
	padding: 8px 0;
}
.fl-promo-bar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--md-spacing);
}
.fl-promo-bar__text { margin: 0; letter-spacing: 0.3px; }
.fl-promo-bar__text a { color: inherit; text-decoration: underline; font-weight: var(--font-semibold); }
.fl-promo-bar__aside { display: flex; align-items: center; gap: var(--md-spacing); }
.fl-promo-bar__close {
	background: none; border: 0; cursor: pointer;
	color: inherit; font-size: 18px; line-height: 1; padding: 0 4px;
	opacity: 0.8;
}
.fl-promo-bar__close:hover { opacity: 1; }
.fl-promo-bar.is-hidden { display: none; }

/* ==========================================================================
   7. 頁首 (Header)
   ========================================================================== */
.fl-header {
	position: relative;
	background-color: var(--palette9);
	border-bottom: 1px solid var(--color-border-alt);
	z-index: 500;
}
.fl-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--md-spacing);
	min-height: var(--header-height);
}
.fl-header.is-sticky {
	position: fixed; top: 0; left: 0; right: 0;
	box-shadow: var(--shadow);
	animation: fl-slide-down 0.35s ease;
}
@keyframes fl-slide-down {
	from { transform: translateY(-100%); }
	to { transform: translateY(0); }
}

/* 品牌 */
.fl-brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.fl-brand__logo img { display: block; height: var(--logo-height, 40px); width: auto; }
.fl-brand__name {
	margin: 0;
	font-size: 30px;
	font-weight: var(--font-semibold);
	letter-spacing: 0.5px;
	line-height: 1;
	color: var(--palette3);
}
.fl-brand__name a { color: inherit; }
.fl-brand__tagline { margin: 4px 0 0; font-size: 12px; color: var(--color-muted); }

/* 主導覽 */
.fl-nav { flex: 1; display: flex; justify-content: center; }
.fl-nav__menu {
	display: flex;
	align-items: center;
	gap: 0;
	margin: 0; padding: 0;
	list-style: none;
}
.fl-nav__menu li { position: relative; }
.fl-nav__menu > li > a {
	display: flex; align-items: center; gap: 5px;
	padding: 0 16px;
	height: var(--header-height);
	font-size: 14px;
	font-weight: var(--font-semibold);
	letter-spacing: 0.3px;
	color: var(--nav-color, var(--palette3));
	white-space: nowrap;
}
.fl-nav__menu > li > a:hover,
.fl-nav__menu > li.current-menu-item > a,
.fl-nav__menu > li.current_page_item > a { color: var(--color-primary); }

/* 下拉選單 */
.fl-nav__menu li.menu-item-has-children > a::after {
	content: "";
	width: 8px; height: 5px;
	background-color: currentColor;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	transition: transform var(--duration-short);
}
.fl-nav__menu li.menu-item-has-children:hover > a::after { transform: rotate(180deg); }

.fl-nav__menu ul.sub-menu {
	position: absolute;
	top: 100%; left: 0;
	min-width: 220px;
	margin: 0; padding: 10px 0;
	list-style: none;
	background: var(--palette9);
	border-radius: var(--card-radius);
	box-shadow: var(--shadow);
	opacity: 0; visibility: hidden;
	transform: translateY(10px);
	transition: var(--transition);
	z-index: 600;
}
.fl-nav__menu li:hover > ul.sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.fl-nav__menu ul.sub-menu li a {
	display: block;
	padding: 8px 20px;
	font-size: 14px;
	color: var(--palette4);
}
.fl-nav__menu ul.sub-menu li a:hover { color: var(--color-primary); background: var(--palette8); }
.fl-nav__menu ul.sub-menu ul.sub-menu { top: 0; left: 100%; }

/* 選單標籤 (SALE / HOT) */
.fl-nav__badge {
	display: inline-block;
	margin-left: 4px; padding: 1px 6px;
	border-radius: 3px;
	font-size: 9px; font-weight: var(--font-bold);
	letter-spacing: 0.5px; line-height: 1.6;
	text-transform: uppercase;
	color: #fff;
	background: var(--color-primary);
	vertical-align: middle;
}
.fl-nav__badge--hot { background: var(--color-sale); }

/* 頁首工具列 */
.fl-header__tools { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.fl-header__tool {
	position: relative;
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px;
	border: 0; background: none; cursor: pointer;
	color: var(--palette3);
	border-radius: 50%;
	transition: var(--transition);
}
.fl-header__tool:hover { color: var(--color-primary); background: var(--palette8); }
.fl-header__tool svg { width: 20px; height: 20px; }
.fl-header__count {
	position: absolute; top: 2px; right: 2px;
	min-width: 16px; height: 16px; padding: 0 4px;
	border-radius: 8px;
	background: var(--color-primary);
	color: #fff;
	font-size: 10px; font-weight: var(--font-bold);
	line-height: 16px; text-align: center;
}
.fl-header__points {
	display: inline-flex; align-items: center; gap: 5px;
	height: 32px; padding: 0 12px;
	border-radius: 16px;
	background: rgba(184, 134, 11, 0.1);
	color: var(--color-point);
	font-size: 12px; font-weight: var(--font-semibold);
	white-space: nowrap;
}

/* 漢堡鈕 */
.fl-burger {
	display: none;
	flex-direction: column; justify-content: center; gap: 5px;
	width: 40px; height: 40px;
	border: 0; background: none; cursor: pointer;
}
.fl-burger span {
	display: block; width: 22px; height: 2px;
	background: var(--burger-color, var(--palette3));
	transition: var(--transition);
}

/* 搜尋抽屜 */
.fl-search-drawer {
	position: absolute; top: 100%; left: 0; right: 0;
	padding: var(--md-spacing) 0;
	background: var(--palette9);
	box-shadow: var(--shadow);
	display: none;
	z-index: 550;
}
.fl-search-drawer.is-open { display: block; }
.fl-search-drawer form { display: flex; gap: 10px; max-width: 700px; margin: 0 auto; }

/* 行動選單 */
.fl-mobile-nav {
	position: fixed; top: 0; left: 0; bottom: 0;
	width: 320px; max-width: 85vw;
	padding: var(--md-spacing);
	background: var(--palette9);
	transform: translateX(-100%);
	transition: transform var(--duration-long);
	overflow-y: auto;
	z-index: 1100;
}
.fl-mobile-nav.is-open { transform: translateX(0); }
.fl-mobile-nav__head {
	display: flex; align-items: center; justify-content: space-between;
	padding-bottom: var(--sm-spacing);
	border-bottom: 1px solid var(--color-border);
	margin-bottom: var(--sm-spacing);
}
.fl-mobile-nav__close { border: 0; background: none; font-size: 26px; cursor: pointer; line-height: 1; }
.fl-mobile-nav ul { list-style: none; margin: 0; padding: 0; }
.fl-mobile-nav ul li a {
	display: block; padding: 11px 0;
	border-bottom: 1px solid var(--palette7);
	font-weight: var(--font-medium-w);
	color: var(--palette3);
}
.fl-mobile-nav ul ul { padding-left: var(--md-spacing); }
.fl-mobile-nav ul ul li a { font-weight: var(--font-normal); color: var(--palette4); }

.fl-overlay {
	position: fixed; inset: 0;
	background: var(--overlay-bg);
	opacity: 0; visibility: hidden;
	transition: var(--transition);
	z-index: 1050;
}
.fl-overlay.is-open { opacity: 1; visibility: visible; }

/* ==========================================================================
   8. 頁尾 (Footer)
   ========================================================================== */
.fl-footer {
	background-color: var(--footer-bg, var(--palette9));
	color: var(--footer-color, var(--palette4));
	border-top: 1px solid var(--color-border-alt);
}
.fl-footer__main { padding: var(--xxxl-spacing) 0 var(--xl-spacing); }
.fl-footer__cols { display: grid; gap: var(--lg-spacing); }
.fl-footer__title {
	margin-bottom: var(--md-spacing);
	font-size: 15px; font-weight: var(--font-semibold);
	letter-spacing: 0.5px; text-transform: uppercase;
	color: var(--footer-color, var(--palette3));
}
.fl-footer__list { list-style: none; margin: 0; padding: 0; }
.fl-footer__list li { margin-bottom: 8px; }
.fl-footer__list a { color: var(--footer-link, var(--palette4)); font-size: 14px; }
.fl-footer__list a:hover { color: var(--color-primary); padding-left: 4px; }
.fl-footer__contact li { display: flex; gap: 8px; margin-bottom: 10px; font-size: 14px; }
.fl-footer__contact svg { flex-shrink: 0; width: 16px; height: 16px; margin-top: 4px; color: var(--color-primary); }

.fl-footer__bottom {
	padding: var(--md-spacing) 0;
	border-top: 1px solid var(--color-border-alt);
}
.fl-footer__bottom-inner {
	display: flex; align-items: center; justify-content: space-between;
	gap: var(--md-spacing); flex-wrap: wrap;
}
.fl-footer__copy { margin: 0; font-size: 13px; }

.fl-socials { display: flex; align-items: center; gap: 8px; }
.fl-socials a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px;
	border-radius: 50%;
	background: var(--palette7);
	color: var(--palette4);
}
.fl-socials a:hover { background: var(--color-primary); color: #fff; }
.fl-socials svg { width: 15px; height: 15px; }

/* ==========================================================================
   9. 電子報
   ========================================================================== */
.fl-newsletter { background: var(--palette8); }
.fl-newsletter__inner {
	display: grid; grid-template-columns: 1fr 1fr;
	align-items: center; gap: var(--xl-spacing);
}
.fl-newsletter__title { margin-bottom: 4px; font-size: 30px; }
.fl-newsletter__form { display: flex; gap: 10px; }
.fl-newsletter__form input[type="email"] { flex: 1; }
.fl-newsletter__consent {
	display: flex; align-items: flex-start; gap: 8px;
	margin-top: 10px; font-size: 12px; color: var(--color-muted);
}
.fl-newsletter__consent input { width: auto; height: auto; margin-top: 3px; }
.fl-newsletter__consent label { margin: 0; font-weight: 400; font-size: 12px; color: var(--color-muted); }

/* ==========================================================================
   10. 懸浮聯絡
   ========================================================================== */
.fl-float {
	position: fixed;
	bottom: 24px;
	z-index: 900;
	display: flex; flex-direction: column; gap: 10px;
}
.fl-float--right { right: 20px; }
.fl-float--left { left: 20px; }
.fl-float__item {
	position: relative;
	display: flex; align-items: center; justify-content: center;
	width: 46px; height: 46px;
	border: 0; cursor: pointer;
	background: var(--float-bg, var(--color-primary));
	color: var(--float-color, #fff);
	box-shadow: var(--shadow-sm);
	transition: var(--transition);
}
.fl-float--round .fl-float__item { border-radius: 50%; }
.fl-float--square .fl-float__item { border-radius: 8px; }
.fl-float__item:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.fl-float__item svg { width: 22px; height: 22px; }
.fl-float__tip {
	position: absolute; top: 50%; transform: translateY(-50%);
	padding: 5px 10px;
	border-radius: 4px;
	background: rgba(0, 0, 0, 0.85); color: #fff;
	font-size: 12px; white-space: nowrap;
	opacity: 0; visibility: hidden;
	pointer-events: none;
	transition: var(--transition);
}
.fl-float--right .fl-float__tip { right: calc(100% + 10px); }
.fl-float--left .fl-float__tip { left: calc(100% + 10px); }
.fl-float__item:hover .fl-float__tip { opacity: 1; visibility: visible; }

.fl-float__qr {
	position: fixed; inset: 0;
	display: none; align-items: center; justify-content: center;
	background: var(--overlay-bg); z-index: 1200;
}
.fl-float__qr.is-open { display: flex; }
.fl-float__qr-box {
	padding: var(--md-spacing);
	background: #fff; border-radius: 8px; text-align: center;
}
.fl-float__qr-box img { max-width: 240px; }

.fl-back-top {
	position: fixed; right: 20px; bottom: 24px;
	display: flex; align-items: center; justify-content: center;
	width: 46px; height: 46px;
	border: 0; border-radius: 50%; cursor: pointer;
	background: var(--palette3); color: #fff;
	opacity: 0; visibility: hidden;
	transition: var(--transition);
	z-index: 890;
}
.fl-back-top.is-visible { opacity: 1; visibility: visible; }
.fl-back-top:hover { background: var(--color-primary); }

/* ==========================================================================
   11. 頁面標頭 / 麵包屑
   ========================================================================== */
.fl-page-head {
	padding: var(--xxl-spacing) 0;
	background: var(--palette8);
	text-align: center;
}
.fl-page-head__title { margin-bottom: 8px; font-size: 36px; }
.fl-breadcrumb { font-size: 13px; color: var(--color-muted); }
.fl-breadcrumb a { color: var(--color-muted); }
.fl-breadcrumb a:hover { color: var(--color-primary); }
.fl-breadcrumb__sep { margin: 0 8px; opacity: 0.5; }

/* ==========================================================================
   12. 內文排版
   ========================================================================== */
.fl-entry-content { line-height: 1.9; }
.fl-entry-content > * + * { margin-top: 1rem; }
.fl-entry-content h2 { margin-top: 2rem; }
.fl-entry-content h3 { margin-top: 1.5rem; }
.fl-entry-content img { border-radius: var(--card-radius); }
.fl-entry-content blockquote {
	margin: 1.5rem 0; padding: var(--md-spacing) var(--lg-spacing);
	border-left: 3px solid var(--color-primary);
	background: var(--palette8);
	font-style: italic;
}
.fl-entry-content table { width: 100%; border-collapse: collapse; }
.fl-entry-content th, .fl-entry-content td { padding: 10px; border: 1px solid var(--color-border); text-align: left; }
.fl-entry-content th { background: var(--palette8); font-weight: var(--font-semibold); }

/* 分頁 */
.fl-pagination { display: flex; justify-content: center; gap: 6px; margin-top: var(--xl-spacing); }
.fl-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 40px; padding: 0 10px;
	border: 1px solid var(--color-border);
	border-radius: var(--btn-radius);
	color: var(--palette4); font-weight: var(--font-medium-w);
}
.fl-pagination .page-numbers:hover,
.fl-pagination .page-numbers.current {
	background: var(--color-primary); border-color: var(--color-primary); color: #fff;
}

/* ==========================================================================
   13. 響應式
   ========================================================================== */
@media (max-width: 1199px) {
	.fl-nav__menu > li > a { padding: 0 11px; font-size: 13px; }
	.fl-brand__name { font-size: 26px; }
}

@media (max-width: 991px) {
	:root { --section-spacing: 2.5rem; --header-height: 66px; }
	.fl-nav { display: none; }
	.fl-burger { display: flex; }
	.fl-grid--4, .fl-grid--5 { grid-template-columns: repeat(2, 1fr); }
	.fl-grid--3 { grid-template-columns: repeat(2, 1fr); }
	.fl-newsletter__inner { grid-template-columns: 1fr; text-align: center; }
	.fl-section-head__title { font-size: 26px; }
	h1 { font-size: 1.875rem; }
	h2 { font-size: 1.5rem; }
	.fl-page-head__title { font-size: 28px; }
}

@media (max-width: 767px) {
	:root { --section-spacing: 2rem; }
	.fl-grid--2, .fl-grid--3, .fl-grid--4, .fl-grid--5 { grid-template-columns: repeat(2, 1fr); }
	.fl-promo-bar__inner { flex-direction: column; gap: 4px; text-align: center; font-size: 12px; }
	.fl-promo-bar__aside { display: none; }
	.fl-footer__bottom-inner { flex-direction: column; text-align: center; }
	.fl-section-head { flex-direction: column; align-items: flex-start; gap: 8px; }
	.fl-newsletter__form { flex-direction: column; }
	.fl-header__points { display: none; }
}

@media (max-width: 575px) {
	.fl-grid--3, .fl-grid--4, .fl-grid--5 { grid-template-columns: 1fr 1fr; }
	.fl-brand__name { font-size: 22px; }
	.fl-section-head__title { font-size: 22px; }
}

/* 動畫偏好 */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}