/* ================================================
   Inner Pages — 內頁共用樣式
   Version 1.0 / 2026-04-08
   適用：__template_01 / 02 / 03
   色彩體系：#0077B6（活力藍）+ #2B4590（沉穩藍）+ #C4933F（精緻金）
   ================================================ */


/* ── 1. Inner Page Banner（三版共用） ── */

.inner-banner {
	position: relative;
	background: linear-gradient(135deg, #0077B6 0%, #005a8e 55%, #003f6b 100%);
	min-height: 200px;
	display: flex;
	align-items: center;
	overflow: hidden;
	/* padding-top 需容納固定定位 Navbar（80px）+ 視覺呼吸空間（40px）*/
	padding: 120px 0 56px;
}

/* 右上角幾何裝飾圓 */
.inner-banner::before {
	content: '';
	position: absolute;
	right: -60px;
	top: -60px;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	border: 2px solid rgba(196, 147, 63, 0.22);
	pointer-events: none;
}

/* 右下角填色裝飾圓 */
.inner-banner::after {
	content: '';
	position: absolute;
	right: 60px;
	bottom: -90px;
	width: 200px;
	height: 200px;
	border-radius: 50%;
	background: rgba(196, 147, 63, 0.07);
	pointer-events: none;
}

.inner-banner-content {
	position: relative;
	z-index: 2;
}

.inner-banner-label {
	font-family: 'Cormorant Garamond', serif;
	font-size: 14px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(196, 147, 63, 0.9);
	margin-bottom: 8px;
	display: block;
}

.inner-banner-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 36px;
	font-weight: 700;
	color: #ffffff;
	margin: 0 0 18px;
	line-height: 1.3;
}

/* 麵包屑 */
.inner-breadcrumb ol {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0;
}

.inner-breadcrumb ol li {
	font-size: 13px;
	color: rgba(255, 255, 255, 0.6);
	display: flex;
	align-items: center;
}

.inner-breadcrumb ol li + li::before {
	content: '/';
	margin: 0 8px;
	color: rgba(255, 255, 255, 0.35);
}

.inner-breadcrumb ol li a {
	color: rgba(255, 255, 255, 0.75);
	text-decoration: none;
	transition: color 0.2s ease;
}

.inner-breadcrumb ol li a:hover {
	color: #C4933F;
}

.inner-breadcrumb ol li:last-child {
	color: rgba(255, 255, 255, 0.85);
}


/* ── 2. 內頁主內容區（三版共用基礎） ── */

.inner-content-section {
	padding: 15px 0 15px;
	background: #F8F7F4;
}

/* 區段子標題（用於全寬版各區塊上方） */
.inner-section-heading {
	margin-bottom: 36px;
}

.inner-section-label {
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #C4933F;
	display: block;
	margin-bottom: 8px;
}

.inner-section-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 26px;
	font-weight: 700;
	color: #2B4590;
	margin: 0 0 12px;
	line-height: 1.35;
}

.inner-section-gold-line {
	width: 36px;
	height: 3px;
	background: #C4933F;
	border-radius: 2px;
	margin-bottom: 14px;
}

.inner-section-desc {
	font-size: 15px;
	color: #6B7280;
	line-height: 1.85;
	margin: 0;
}


/* ── 3. Template 01：側欄式（最新消息、公證知識） ── */

/* 文章卡片 */
.article-card {
	background: #ffffff;
	border: 1px solid #E5E2DC;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(43, 69, 144, 0.07);
	transition: transform 0.22s ease, box-shadow 0.22s ease;
	margin-bottom: 28px;
	display: flex;
	flex-direction: column;
}

.article-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 32px rgba(43, 69, 144, 0.13);
}

.article-card-thumb {
	width: 100%;
	height: 350px;
	object-fit: cover;
	display: block;
}

.article-card-thumb-placeholder {
	width: 100%;
	height: 350px;
	background: linear-gradient(135deg, rgba(0,119,182,0.08) 0%, rgba(43,69,144,0.12) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
}

.article-card-thumb-placeholder svg {
	stroke: rgba(0,119,182,0.3);
}

.article-card-body {
	padding: 22px 26px 26px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.article-card-meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
}

.article-card-author {
	margin-left: auto;
	font-size: 12px;
	color: #6B7280;
	line-height: 1;
}

.article-card-category {
	font-size: 11px;
	font-weight: 600;
	color: #ffffff;
	background: #0077B6;
	padding: 3px 10px;
	border-radius: 20px;
	letter-spacing: 0.04em;
}

.article-card-date {
	font-size: 12px;
	color: #6B7280;
}

.article-card-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 17px;
	font-weight: 700;
	color: #1E1E2E;
	margin: 0 0 10px;
	line-height: 1.55;
	transition: color 0.2s;
	text-decoration: none;
	display: block;
}

.article-card:hover .article-card-title {
	color: #0077B6;
}

.article-card-excerpt {
	font-size: 14px;
	color: #6B7280;
	line-height: 1.85;
	flex: 1;
}

.article-card-footer {
	margin-top: 18px;
	display: flex;
	justify-content: flex-end;
}

.article-read-more {
	font-size: 13px;
	font-weight: 600;
	color: #0077B6;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	transition: gap 0.2s ease, color 0.2s ease;
}

.article-read-more:hover {
	color: #C4933F;
	gap: 8px;
}

/* 分頁 */
.inner-pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 6px;
	margin-top: 40px;
}

.inner-pagination .page-btn {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #E5E2DC;
	border-radius: 8px;
	font-size: 14px;
	color: #1E1E2E;
	text-decoration: none;
	background: #ffffff;
	transition: all 0.2s ease;
}

.inner-pagination .page-btn:hover,
.inner-pagination .page-btn.active {
	background: #0077B6;
	border-color: #0077B6;
	color: #ffffff;
}

.inner-pagination .page-btn.disabled {
	opacity: 0.4;
	pointer-events: none;
}

/* 側欄 */
.inner-sidebar {
	position: sticky;
	top: 100px;
}

.sidebar-widget {
	background: #ffffff;
	border: 1px solid #E5E2DC;
	border-radius: 12px;
	padding: 22px;
	box-shadow: 0 4px 20px rgba(43, 69, 144, 0.07);
	margin-bottom: 22px;
}

.sidebar-widget-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: #2B4590;
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 2px solid #0077B6;
}

/* 搜尋 */
.sidebar-search-form {
	display: flex;
}

.sidebar-search-input {
	flex: 1;
	padding: 10px 14px;
	border: 1px solid #E5E2DC;
	border-right: none;
	border-radius: 8px 0 0 8px;
	font-size: 14px;
	font-family: 'Noto Sans TC', sans-serif;
	outline: none;
	transition: border-color 0.2s;
	background: #F8F7F4;
}

.sidebar-search-input:focus {
	border-color: #0077B6;
	background: #ffffff;
}

.sidebar-search-btn {
	padding: 10px 16px;
	background: #0077B6;
	border: 1px solid #0077B6;
	border-radius: 0 8px 8px 0;
	color: #ffffff;
	cursor: pointer;
	transition: background 0.2s;
	display: flex;
	align-items: center;
}

.sidebar-search-btn:hover {
	background: #005a8e;
}

/* 分類列表 */
.sidebar-cat-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.sidebar-cat-list li {
	border-bottom: 1px solid #F8F7F4;
}

.sidebar-cat-list li:last-child {
	border-bottom: none;
}

.sidebar-cat-list li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0;
	font-size: 14px;
	color: #1E1E2E;
	text-decoration: none;
	transition: color 0.2s;
}

.sidebar-cat-list li a:hover {
	color: #0077B6;
}

.sidebar-cat-count {
	font-size: 11px;
	color: #ffffff;
	background: #0077B6;
	padding: 2px 8px;
	border-radius: 20px;
	min-width: 22px;
	text-align: center;
}

/* 近期文章 */
.sidebar-recent-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.sidebar-recent-item {
	display: flex;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #F8F7F4;
}

.sidebar-recent-item:last-child {
	border-bottom: none;
}

.sidebar-recent-thumb {
	width: 54px;
	height: 54px;
	border-radius: 8px;
	object-fit: cover;
	flex-shrink: 0;
	background: rgba(0,119,182,0.08);
}

.sidebar-recent-info {
	flex: 1;
	min-width: 0;
}

.sidebar-recent-info a {
	font-size: 13px;
	font-weight: 600;
	color: #1E1E2E;
	text-decoration: none;
	line-height: 1.5;
	display: block;
	margin-bottom: 4px;
	transition: color 0.2s;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sidebar-recent-info a:hover {
	color: #0077B6;
}

.sidebar-recent-date {
	font-size: 12px;
	color: #6B7280;
}

/* 標籤雲 */
.sidebar-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
}

.sidebar-tag {
	font-size: 13px;
	color: #1E1E2E;
	background: #F8F7F4;
	padding: 5px 12px;
	border-radius: 20px;
	border: 1px solid #E5E2DC;
	text-decoration: none;
	transition: all 0.2s ease;
}

.sidebar-tag:hover {
	background: #0077B6;
	color: #ffffff;
	border-color: #0077B6;
}


/* ── 4. Template 02：全寬 Tab + Accordion ── */

/* Tab 導覽 */
.inner-tab-nav {
	display: flex;
	gap: 0;
	border-bottom: 2px solid #E5E2DC;
	margin-bottom: 40px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.inner-tab-nav::-webkit-scrollbar {
	display: none;
}

.inner-tab-btn {
	padding: 14px 28px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: #6B7280;
	background: none;
	border: none;
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
	cursor: pointer;
	transition: color 0.2s, border-color 0.2s;
	white-space: nowrap;
}

.inner-tab-btn:hover {
	color: #0077B6;
}

.inner-tab-btn.active {
	color: #0077B6;
	border-bottom-color: #0077B6;
}

.inner-tab-panel {
	display: none;
}

.inner-tab-panel.active {
	display: block;
}

/* Accordion */
.inner-accordion-item {
	background: #ffffff;
	border: 1px solid #E5E2DC;
	border-radius: 12px;
	margin-bottom: 10px;
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(43, 69, 144, 0.05);
	transition: border-color 0.2s;
}

.inner-accordion-item.open {
	border-color: rgba(0, 119, 182, 0.3);
}

.inner-accordion-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 22px;
	cursor: pointer;
	transition: background 0.2s;
	user-select: none;
}

.inner-accordion-header:hover {
	background: #F8F7F4;
}

.inner-accordion-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: #1E1E2E;
	display: flex;
	align-items: center;
	gap: 12px;
}

.acc-icon {
	width: 34px;
	height: 34px;
	background: rgba(0, 119, 182, 0.09);
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background 0.2s;
}

.acc-icon svg {
	stroke: #0077B6;
	width: 18px;
	height: 18px;
}

.inner-accordion-item.open .acc-icon {
	background: #0077B6;
}

.inner-accordion-item.open .acc-icon svg {
	stroke: #ffffff;
}

.inner-accordion-toggle {
	width: 30px;
	height: 30px;
	background: #F8F7F4;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background 0.2s;
}

.inner-accordion-toggle svg {
	stroke: #6B7280;
	width: 16px;
	height: 16px;
	transition: transform 0.3s ease, stroke 0.2s;
}

.inner-accordion-item.open .inner-accordion-toggle {
	background: #0077B6;
}

.inner-accordion-item.open .inner-accordion-toggle svg {
	stroke: #ffffff;
	transform: rotate(45deg);
}

.inner-accordion-body {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.35s ease-out;
}

.inner-accordion-item.open .inner-accordion-body {
	max-height: 2000px;
}

.inner-accordion-content {
	padding: 4px 22px 22px 22px;
	border-top: 1px solid #F8F7F4;
}

/* Checklist（文件清單） */
.inner-checklist {
	list-style: none;
	padding: 0;
	margin: 14px 0 0;
}

.inner-checklist li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 9px 0;
	font-size: 14px;
	color: #1E1E2E;
	line-height: 1.75;
	border-bottom: 1px solid #F8F7F4;
}

.inner-checklist li:last-child {
	border-bottom: none;
}

.checklist-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #0077B6;
	flex-shrink: 0;
	margin-top: 7px;
}

/* 注意事項色塊 */
.inner-note-block {
	background: rgba(196, 147, 63, 0.07);
	border-left: 4px solid #C4933F;
	border-radius: 0 10px 10px 0;
	padding: 14px 18px;
	margin-top: 18px;
}

.inner-note-block p {
	font-size: 14px;
	color: #1E1E2E;
	margin: 0;
	line-height: 1.85;
}

/* 費用表格 */
.inner-fee-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.inner-fee-table th {
	background: #0077B6;
	color: #ffffff;
	padding: 12px 16px;
	text-align: left;
	font-weight: 600;
	font-family: 'Noto Sans TC', sans-serif;
}

.inner-fee-table th:first-child { border-radius: 8px 0 0 0; }
.inner-fee-table th:last-child  { border-radius: 0 8px 0 0; }

.inner-fee-table td {
	padding: 11px 16px;
	border-bottom: 1px solid #E5E2DC;
	color: #1E1E2E;
	vertical-align: middle;
}

.inner-fee-table tr:last-child td {
	border-bottom: none;
}

.inner-fee-table tr:nth-child(even) td {
	background: #F8F7F4;
}

.inner-fee-table-wrap {
	background: #ffffff;
	border: 1px solid #E5E2DC;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(43,69,144,0.05);
	margin-bottom: 24px;
}


/* ── 5. Template 03：置中簡潔 ── */

.inner-content-centered {
	max-width: 800px;
	margin: 0 auto;
}

/* 聯絡資訊卡片 */
.contact-info-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 18px;
	margin-bottom: 50px;
}

.contact-info-card {
	background: #ffffff;
	border: 1px solid #E5E2DC;
	border-radius: 12px;
	padding: 28px 22px;
	text-align: center;
	box-shadow: 0 4px 20px rgba(43, 69, 144, 0.07);
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s;
}

.contact-info-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 32px rgba(43, 69, 144, 0.13);
	border-color: rgba(0, 119, 182, 0.3);
}

.contact-info-icon {
	width: 56px;
	height: 56px;
	background: rgba(0, 119, 182, 0.1);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 14px;
}

.contact-info-icon svg {
	stroke: #0077B6;
	width: 22px;
	height: 22px;
}

.contact-info-label {
	font-size: 12px;
	letter-spacing: 0.08em;
	color: #6B7280;
	margin-bottom: 6px;
	font-weight: 400;
	text-transform: uppercase;
}

.contact-info-value {
	font-size: 15px;
	font-weight: 700;
	color: #1E1E2E;
	line-height: 1.55;
	text-decoration: none;
	display: block;
}

a.contact-info-value:hover {
	color: #0077B6;
}

/* 下載清單 */
.download-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.download-item {
	background: #ffffff;
	border: 1px solid #E5E2DC;
	border-radius: 12px;
	padding: 18px 22px;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	box-shadow: 0 2px 12px rgba(43, 69, 144, 0.05);
	transition: transform 0.2s ease, border-color 0.2s;
}

.download-item:hover {
	transform: translateY(-2px);
	border-color: rgba(0, 119, 182, 0.35);
}

.download-item-info {
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 1;
}

.download-item-icon {
	width: 44px;
	height: 44px;
	background: rgba(0, 119, 182, 0.09);
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.download-item-icon svg {
	stroke: #0077B6;
	width: 20px;
	height: 20px;
}

.download-item-name {
	font-size: 15px;
	font-weight: 600;
	color: #1E1E2E;
	margin-bottom: 2px;
}

.download-item-desc {
	font-size: 13px;
	color: #6B7280;
}

.btn-download {
	padding: 9px 20px;
	background: #0077B6;
	color: #ffffff;
	border: none;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	transition: background 0.2s ease;
	white-space: nowrap;
	cursor: pointer;
}

.btn-download:hover {
	background: #005a8e;
	color: #ffffff;
}


/* ── 6. RWD ── */

@media (max-width: 991px) {
	.inner-banner { min-height: 200px; padding: 120px 0 56px; }
	.inner-banner-title { font-size: 36px; }
	.inner-content-section { padding: 70px 0 90px; }
	.inner-sidebar { position: sticky; top: 100px; }
	.inner-tab-btn { padding: 14px 28px; font-size: 15px; }
	.inner-section-title { font-size: 26px; }
}

@media (max-width: 767px) {
	.inner-banner { min-height: 165px; padding: 88px 0 36px; }
	.inner-banner-title { font-size: 22px; margin-bottom: 12px; }
	.inner-banner::before { width: 180px; height: 180px; right: -40px; }
	.inner-content-section { padding: 40px 0 60px; }
	.article-card-thumb,
	.article-card-thumb-placeholder { height: 160px; }
	.contact-info-grid { grid-template-columns: 1fr; gap: 12px; }
	.download-item { flex-direction: column; align-items: flex-start; }
	.download-item .btn-download { width: 100%; justify-content: center; }
	.inner-tab-btn { padding: 10px 14px; font-size: 13px; }
	.inner-section-title { font-size: 20px; }
}


/* ================================================================
   最新消息（news.php / news-detail.php）專屬樣式
   Version 1.0 / 2026-04-08
   ================================================================ */

/* ── 篩選條件提示列 ── */
.news-filter-bar {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
}
.news-filter-tag {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: rgba(0,119,182,0.08);
	border: 1px solid rgba(0,119,182,0.25);
	color: #0077B6;
	border-radius: 20px;
	padding: 4px 12px;
	font-size: 13px;
}
.news-filter-remove {
	color: #0077B6;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	font-weight: 700;
	transition: color 0.2s;
}
.news-filter-remove:hover { color: #C493333F; }

/* ── 空結果區塊 ── */
.news-empty {
	text-align: center;
	padding: 60px 20px;
	color: #6B7280;
}
.news-empty svg {
	display: block;
	margin: 0 auto 16px;
	stroke: #D1D5DB;
}
.news-empty p { margin-bottom: 20px; font-size: 15px; }

/* ── 分頁總筆數 ── */
.pagination-summary {
	text-align: center;
	color: #9CA3AF;
	font-size: 13px;
	margin-top: 12px;
}

/* ── 側欄 active 狀態 ── */
.sidebar-cat-list a.active,
.sidebar-tag.active {
	color: #C4933F;
	font-weight: 700;
}
.sidebar-recent-item.current .sidebar-recent-info a {
	color: #C4933F;
	font-weight: 600;
}

/* ── 通用按鈕（列表頁）── */
.btn-inner-primary {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #C4933F;
	color: #fff;
	border-radius: 8px;
	padding: 10px 22px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s, transform 0.2s;
	border: none;
}
.btn-inner-primary:hover {
	background: #b07836;
	color: #fff;
	transform: translateY(-2px);
}
.btn-inner-outline {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: transparent;
	color: #2B4590;
	border: 1.5px solid #2B4590;
	border-radius: 8px;
	padding: 10px 22px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s, color 0.2s, transform 0.2s;
}
.btn-inner-outline:hover {
	background: #2B4590;
	color: #fff;
	transform: translateY(-2px);
}


/* ================================================================
   news-detail.php — 文章詳細頁
   ================================================================ */

/* ── 文章 Hero 圖 ── */
.news-article-hero {
	margin-bottom: 28px;
	border-radius: 12px;
	overflow: hidden;
}
.news-article-hero-img {
	width: 100%;
	height: 360px;
	object-fit: cover;
	display: block;
}

/* ── 文章 Header ── */
.news-article-header { margin-bottom: 24px; }

.news-article-meta-top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
}
.news-article-category {
	display: inline-block;
	background: rgba(0,119,182,0.10);
	color: #0077B6;
	border-radius: 20px;
	padding: 3px 12px;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s;
}
.news-article-category:hover { background: rgba(0,119,182,0.20); color: #0077B6; }
.news-article-date,
.news-article-author {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	color: #6B7280;
}
.news-article-title {
	font-family: var(--font-body);
	font-size: 26px;
	font-weight: 700;
	color: #1E1E2E;
	line-height: 1.45;
	margin: 0 0 20px;
}

/* ── 社群分享 ── */
.news-article-share {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 0;
	border-top: 1px solid #E5E2DC;
	border-bottom: 1px solid #E5E2DC;
	margin-bottom: 24px;
}

/* ── 文章摘要 ── */
.news-article-summary {
	background: #F8F7F4;
	border-left: 4px solid #C4933F;
	border-radius: 0 8px 8px 0;
	padding: 16px 20px;
	margin-bottom: 28px;
	font-size: 15px;
	color: #374151;
	line-height: 1.8;
}

/* ── 文章主體（RichText 排版）── */
.news-article-body {
	font-size: 16px;
	line-height: 1.9;
	color: #1E1E2E;
	margin-bottom: 32px;
}
.news-article-body h2,
.news-article-body h3 { color: #2B4590; margin: 28px 0 14px; }
.news-article-body img { max-width: 100%; height: auto; border-radius: 8px; }
.news-article-body a   { color: #0077B6; text-decoration: underline; }
.news-article-body ul,
.news-article-body ol  { padding-left: 24px; margin: 14px 0; }
.news-article-body li  { margin-bottom: 6px; }
.news-article-body blockquote {
	border-left: 4px solid #C4933F;
	margin: 20px 0;
	padding: 12px 20px;
	background: #F8F7F4;
	border-radius: 0 8px 8px 0;
	color: #374151;
	font-style: italic;
}

/* ── 附件下載 ── */
.news-article-attachment {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #F0F7FF;
	border: 1px solid #BFDBFE;
	border-radius: 8px;
	padding: 14px 18px;
	margin-bottom: 20px;
	font-size: 14px;
	color: #1E40AF;
}
.news-attachment-link {
	color: #0077B6;
	font-weight: 600;
	text-decoration: underline;
	word-break: break-all;
}
.news-attachment-link:hover { color: #C493333F; }

/* ── 標籤 ── */
.news-article-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 32px;
	padding-top: 20px;
	border-top: 1px solid #E5E2DC;
}
.news-article-tag {
	display: inline-block;
	background: #F3F4F6;
	color: #374151;
	border-radius: 20px;
	padding: 4px 12px;
	font-size: 13px;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}
.news-article-tag:hover { background: #0077B6; color: #fff; }

/* ── 文章底部導覽區（上下篇 + 返回）── */
.news-article-footer-nav {
	margin-top: 40px;
	padding-top: 32px;
	border-top: 2px solid #E5E2DC;
}

/* 上下篇並排 */
.news-article-nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin-bottom: 20px;
}
.news-nav-item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: #fff;
	border-radius: 12px;
	padding: 18px 20px;
	text-decoration: none;
	border: 1.5px solid #E5E2DC;
	transition: border-color 0.22s, box-shadow 0.22s, transform 0.22s;
	min-height: 90px;   /* 讓兩卡片高度對齊 */
}
.news-nav-item:hover {
	border-color: #C4933F;
	box-shadow: 0 4px 16px rgba(196,147,63,0.12);
	transform: translateY(-3px);
}
.news-nav-next { text-align: right; }
.news-nav-label {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	color: #9CA3AF;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}
.news-nav-title {
	font-size: 14px;
	color: #374151;
	font-weight: 600;
	line-height: 1.5;
}
.news-nav-item:hover .news-nav-label { color: #C4933F; }
.news-nav-item:hover .news-nav-title  { color: #1E1E2E; }

/* 空佔位卡片（無上一篇或無下一篇時，維持兩欄對稱）*/
.news-nav-empty {
	background: transparent;
	border-color: transparent;
	pointer-events: none;
	box-shadow: none;
}
.news-nav-empty:hover {
	transform: none;
	border-color: transparent;
	box-shadow: none;
}

/* 返回按鈕：與上下篇同層，置中分隔 */
.news-back-btn-wrap {
	display: flex;
	justify-content: center;
	padding: 4px 0 8px;
}

/* ── RWD ── */
@media (max-width: 991px) {
	.news-article-title { font-size: 22px; }
	.news-article-hero-img { height: 260px; }
	.news-article-nav { grid-template-columns: 1fr; }
	.news-nav-next { text-align: left; }
}
@media (max-width: 767px) {
	.news-article-hero-img { height: 200px; }
	.news-article-title { font-size: 20px; }
	.news-article-body { font-size: 15px; }
}

/* ════════════════════════════════════════════════════════════════
   DOCS（公證知識）補充樣式
   ─ 主結構複用 .news-article-*，此處僅擴充 docs 獨有元件
   ════════════════════════════════════════════════════════════════ */

/* 附件下載 */
.news-article-attachment {
	margin-top: 32px;
	padding: 20px 24px;
	background: #F0F4F8;
	border-radius: 10px;
	border: 1px solid var(--color-border, #E2E8F0);
}
.attachment-title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 12px;
}
.attachment-link {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 18px;
	border-radius: 8px;
	background: var(--color-primary, #2B4590);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s, box-shadow 0.2s;
}
.attachment-link:hover {
	background: var(--color-gold, #C4933F);
	box-shadow: 0 4px 12px rgba(196,147,63,0.25);
}

/* 社群分享 */
.news-article-share {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 14px;
	flex-wrap: wrap;
}
.share-label {
	font-size: 13px;
	color: var(--color-text-muted, #64748B);
	font-weight: 600;
}
.share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #F1F5F9;
	transition: background 0.2s, transform 0.2s;
	text-decoration: none;
}
.share-btn:hover { transform: translateY(-2px); background: #E2E8F0; }

/* 篩選條件提示列（docs 列表頁復用 .news-filter-bar） */
/* .news-filter-bar 與 .news-filter-tag 已定義於 news 區段，無需重複 */

/* 空白 no-results 狀態（docs 列表頁）── .news-empty 已存在 */

/* RWD */
@media (max-width: 767px) {
	.news-article-attachment { padding: 16px; }
	.comment-item { padding: 14px 16px; }
}

/* ═══════════════════════════════════════════════════════
   cac.php ── 租約公證費試算
   ═══════════════════════════════════════════════════════ */

/* Banner 右側裝飾：房屋浮水印 icon（此頁獨有） */
.cac-banner .container { position: relative; }
.cac-banner-deco {
	position: absolute;
	right: 30px;
	top: 50%;
	transform: translateY(-50%);
	width: 150px;
	height: 150px;
	color: rgba(255, 255, 255, 0.12);
	pointer-events: none;
	display: inline-flex;
}
.cac-banner-deco svg { width: 100%; height: 100%; }
@media (max-width: 767px) {
	.cac-banner-deco { width: 96px; height: 96px; right: 16px; opacity: 0.7; }
}


/* ── 試算工作區（左側步驟 + 右側計算機卡） ── */
.cac-workspace-section {
	padding: 20px 0 70px;
	background: var(--color-bg-alt, #F8F7F4);
}
.cac-workspace-grid {
	display: grid;
	grid-template-columns: 320px 1fr;
	gap: 32px;
	align-items: start;
}

/* 左側步驟欄（桌機 sticky） */
.cac-steps-col {
	position: sticky;
	top: 110px;
}
/* 左欄標題區：漸層卡片 + 金色立柱 + 半透明大數字 */
.cac-steps-head {
	position: relative;
	padding: 22px 22px 22px 28px;
	margin-bottom: 18px;
	background: linear-gradient(135deg, rgba(43, 69, 144, 0.04), rgba(196, 147, 63, 0.03));
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 12px;
	overflow: hidden;
}
.cac-steps-head::before {
	content: '';
	position: absolute;
	left: 0;
	top: 18px;
	bottom: 18px;
	width: 3px;
	border-radius: 0 3px 3px 0;
	background: var(--color-accent, #C4933F);
}
.cac-steps-head::after {
	content: '5';
	position: absolute;
	right: 14px;
	bottom: -10px;
	font-family: 'Cormorant Garamond', serif;
	font-size: 82px;
	font-weight: 600;
	color: rgba(196, 147, 63, 0.12);
	line-height: 1;
	pointer-events: none;
}
.cac-steps-en {
	display: inline-block;
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	font-weight: 600;
	color: var(--color-accent, #C4933F);
	text-transform: uppercase;
	letter-spacing: 0.22em;
	margin-bottom: 6px;
	position: relative;
	z-index: 1;
}
.cac-steps-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 22px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 10px;
	line-height: 1.3;
	position: relative;
	z-index: 1;
}
.cac-steps-goldline {
	width: 40px;
	height: 3px;
	border-radius: 2px;
	background: var(--color-accent, #C4933F);
	position: relative;
	z-index: 1;
}

/* 左欄步驟列表 + 虛線金色連接線 */
.cac-steps-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	position: relative;
}
.cac-steps-list::before {
	content: '';
	position: absolute;
	left: 22px;
	top: 36px;
	bottom: 36px;
	width: 1px;
	background: repeating-linear-gradient(to bottom, rgba(196, 147, 63, 0.45) 0, rgba(196, 147, 63, 0.45) 4px, transparent 4px, transparent 10px);
	pointer-events: none;
	z-index: 0;
}
.cac-step {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 14px 16px;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 10px;
	z-index: 1;
	transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s;
}
.cac-step:hover {
	border-color: var(--color-accent, #C4933F);
	box-shadow: 0 6px 20px rgba(43, 69, 144, 0.08);
	transform: translateX(4px);
}
.cac-step--highlight {
	border-color: rgba(196, 147, 63, 0.45);
	background: linear-gradient(135deg, rgba(196, 147, 63, 0.06), rgba(196, 147, 63, 0.02));
}
.cac-step-num {
	flex-shrink: 0;
	width: 30px;
	text-align: center;
	font-family: 'Cormorant Garamond', serif;
	font-size: 26px;
	font-weight: 600;
	color: var(--color-accent, #C4933F);
	line-height: 1;
}
.cac-step-body { min-width: 0; }
.cac-step-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 14.5px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 4px;
	line-height: 1.3;
}
.cac-step-desc {
	font-size: 12.5px;
	color: var(--color-text-muted, #6B7280);
	line-height: 1.55;
	margin: 0;
}

/* 試算機主卡（右欄） */
.cac-calc-wrap {
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 16px;
	box-shadow: 0 12px 40px rgba(43, 69, 144, 0.08);
	overflow: hidden;
	position: relative;
}
.cac-calc-wrap::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, transparent, #C4933F 30%, #C4933F 70%, transparent);
}

/* 主卡標題列（icon 徽章 + 標題 + ribbon） */
.cac-calc-header {
	position: relative;
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 24px 32px;
	background: linear-gradient(135deg, #FFFFFF 0%, #FBF8F1 100%);
	border-bottom: 1px solid var(--color-border, #E5E2DC);
	color: var(--color-text, #1E1E2E);
}
.cac-calc-header::after {
	content: '';
	position: absolute;
	left: 32px;
	right: 32px;
	bottom: -1px;
	height: 2px;
	background: linear-gradient(90deg, transparent, rgba(196, 147, 63, 0.55) 25%, rgba(196, 147, 63, 0.55) 75%, transparent);
}
.cac-calc-title {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0;
	flex: 1;
	min-width: 0;
}
.cac-calc-title svg {
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	padding: 10px;
	box-sizing: content-box;
	border-radius: 50%;
	background: linear-gradient(135deg, rgba(196, 147, 63, 0.18), rgba(196, 147, 63, 0.06));
	color: var(--color-accent, #C4933F);
}
.cac-calc-title > span { line-height: 1.2; }
.cac-calc-ribbon {
	flex-shrink: 0;
	display: inline-block;
	padding: 6px 14px;
	font-family: 'Cormorant Garamond', serif;
	font-size: 12px;
	font-weight: 600;
	color: var(--color-accent, #C4933F);
	text-transform: uppercase;
	letter-spacing: 0.22em;
	border: 1px solid rgba(196, 147, 63, 0.4);
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.6);
	margin: 0;
}

/* 主卡 body */
.cac-calc-body {
	padding: 28px 32px;
}

/* 單一欄位列 */
.cac-form-row { margin-bottom: 20px; }
.cac-form-row--auto .cac-dx-box .dx-texteditor { background: #FBF8F1 !important; }

.cac-form-label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--color-text, #1E1E2E);
	margin-bottom: 8px;
	flex-wrap: wrap;
}
.cac-label-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: rgba(196, 147, 63, 0.12);
	color: var(--color-accent, #C4933F);
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	font-weight: 700;
	flex-shrink: 0;
}
.cac-label-num--auto {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 14px;
}
.cac-form-unit {
	font-size: 11.5px;
	font-weight: 500;
	color: var(--color-text-muted, #6B7280);
	background: var(--color-bg-alt, #F8F7F4);
	border-radius: 4px;
	padding: 2px 7px;
}
.cac-form-badge {
	font-size: 11px;
	font-weight: 600;
	color: var(--color-accent, #C4933F);
	background: rgba(196, 147, 63, 0.1);
	border-radius: 12px;
	padding: 2px 10px;
}
.cac-form-hint {
	font-size: 12px;
	color: var(--color-text-muted, #6B7280);
	margin: 6px 0 0;
	padding-left: 30px;
}

/* DevExtreme NumberBox 覆寫 */
.cac-dx-box .dx-texteditor {
	border-radius: 8px !important;
	border-color: var(--color-border, #E5E2DC) !important;
}
.cac-dx-box .dx-texteditor:hover,
.cac-dx-box .dx-texteditor.dx-state-focused {
	border-color: var(--color-accent, #C4933F) !important;
	box-shadow: 0 0 0 3px rgba(196, 147, 63, 0.12) !important;
}

/* 分隔線 */
.cac-form-divider {
	border: none;
	border-top: 1px dashed var(--color-border, #E5E2DC);
	margin: 24px 0;
}

/* 結果區（金框 + 大數字） */
.cac-result-row {
	position: relative;
	margin-top: 16px;
	padding: 22px 24px 16px;
	background: linear-gradient(135deg, rgba(196, 147, 63, 0.08), rgba(196, 147, 63, 0.02));
	border: 1px solid rgba(196, 147, 63, 0.4);
	border-radius: 12px;
}
.cac-result-head {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-bottom: 10px;
}
.cac-result-en {
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	font-weight: 600;
	color: var(--color-accent, #C4933F);
	text-transform: uppercase;
	letter-spacing: 0.15em;
}
.cac-result-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 14px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
}
.cac-result-label svg { color: var(--color-accent, #C4933F); flex-shrink: 0; }

.cac-dx-box--result .dx-texteditor {
	background: #fff !important;
	border-radius: 8px !important;
	border-color: rgba(196, 147, 63, 0.35) !important;
}
.cac-dx-box--result .dx-texteditor-input {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 24px !important;
	font-weight: 700 !important;
	color: var(--color-primary, #2B4590) !important;
	letter-spacing: 0.02em;
}
.cac-result-note {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--color-text-muted, #6B7280);
	margin: 8px 0 0;
}
.cac-result-note svg { color: var(--color-accent, #C4933F); flex-shrink: 0; }

/* 重新試算 */
.cac-reset-wrap { text-align: center; margin-top: 20px; }
.btn-cac-reset {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: transparent;
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 20px;
	padding: 9px 22px;
	font-size: 13px;
	color: var(--color-text-muted, #6B7280);
	cursor: pointer;
	transition: all 0.2s;
}
.btn-cac-reset:hover {
	border-color: var(--color-accent, #C4933F);
	color: var(--color-accent, #C4933F);
	background: rgba(196, 147, 63, 0.05);
}

/* ── 費率說明表 ── */
.cac-table-section { padding: 20px 0 70px; }

.cac-table-head {
	text-align: center;
	margin-bottom: 28px;
}
.cac-table-en {
	display: inline-block;
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	font-weight: 600;
	color: var(--color-accent, #C4933F);
	text-transform: uppercase;
	letter-spacing: 0.22em;
	margin-bottom: 8px;
}
.cac-table-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 28px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 12px;
	line-height: 1.3;
}
.cac-table-goldline {
	width: 44px;
	height: 3px;
	margin: 0 auto 14px;
	border-radius: 2px;
	background: var(--color-accent, #C4933F);
}
.cac-table-desc {
	font-size: 14.5px;
	color: var(--color-text-muted, #6B7280);
	margin: 0;
}
.cac-table-card {
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 8px 28px rgba(43, 69, 144, 0.06);
	overflow: hidden;
	position: relative;
}
.cac-table-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, transparent, #C4933F 30%, #C4933F 70%, transparent);
}

/* ── RWD ── */
@media (max-width: 991px) {
	.cac-workspace-grid {
		grid-template-columns: 1fr;
		gap: 24px;
	}
	.cac-steps-col { position: static; }
	.cac-steps-head { text-align: center; padding: 20px 22px; }
	.cac-steps-head::before { display: none; }
	.cac-steps-head::after { font-size: 68px; right: 10px; }
	.cac-steps-goldline { margin: 0 auto; }

	/* 平板版步驟改橫向 */
	.cac-steps-list {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 10px;
	}
	.cac-steps-list::before { display: none; }
	.cac-step {
		flex: 1 1 calc(33.333% - 10px);
		min-width: 0;
	}
	.cac-step:hover { transform: translateY(-2px); }
}
@media (max-width: 767px) {
	.cac-workspace-section { padding: 10px 0 50px; }
	.cac-steps-list { flex-direction: column; }
	.cac-step { flex: 1 1 auto; }
	.cac-steps-title { font-size: 19px; }

	.cac-calc-header {
		padding: 20px 22px;
		flex-wrap: wrap;
		gap: 10px;
	}
	.cac-calc-header::after { left: 22px; right: 22px; }
	.cac-calc-title { font-size: 20px; gap: 10px; }
	.cac-calc-title svg { padding: 8px; width: 20px; height: 20px; }
	.cac-calc-ribbon { font-size: 11px; padding: 4px 10px; letter-spacing: 0.18em; }
	.cac-calc-body { padding: 22px 20px; }
	.cac-form-hint { padding-left: 0; }

	.cac-dx-box--result .dx-texteditor-input { font-size: 20px !important; }

	.cac-table-title { font-size: 22px; }
	.cac-table-card { padding: 16px; }
}

/* ═══════════════════════════════════════════════════════
   charge.php ── 公(認)證費用標準表
   ═══════════════════════════════════════════════════════ */

/* ── 說明區 ── */
.charge-intro-section { padding: 56px 0 40px; background: var(--color-bg-alt, #F8F7F3); }

.charge-intro-wrap {
	display: flex;
	align-items: flex-start;
	gap: 24px;
	background: #fff;
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 14px;
	padding: 32px 36px;
	box-shadow: 0 4px 20px rgba(43,69,144,0.06);
}
.charge-intro-icon {
	flex-shrink: 0;
	width: 56px;
	height: 56px;
	background: linear-gradient(135deg, var(--color-primary, #2B4590), var(--color-secondary, #0077B6));
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
}
.charge-intro-body {
	flex: 1;
	font-size: 15px;
	line-height: 1.8;
	color: var(--color-text, #1E293B);
}
.charge-intro-body p { margin: 0 0 6px; }
.charge-intro-body p:last-child { margin: 0; }
.charge-intro-cta {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex-shrink: 0;
}

/* CTA 按鈕 */
.btn-charge-contact,
.btn-charge-calc {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	border-radius: 8px;
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: all 0.2s;
}
.btn-charge-contact {
	background: var(--color-primary, #2B4590);
	color: #fff;
	box-shadow: 0 3px 12px rgba(43,69,144,0.22);
}
.btn-charge-contact:hover { background: var(--color-secondary, #0077B6); color: #fff; transform: translateY(-2px); }

.btn-charge-calc {
	background: transparent;
	border: 1px solid var(--color-primary, #2B4590);
	color: var(--color-primary, #2B4590);
}
.btn-charge-calc:hover { background: var(--color-primary, #2B4590); color: #fff; transform: translateY(-2px); }

/* ── 費率主表區 ── */
.charge-table-section { padding: 64px 0; }

.charge-table-header { text-align: center; margin-bottom: 36px; }
.charge-table-title {
	font-size: 26px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 10px;
}
.charge-table-subtitle {
	font-size: 14px;
	color: var(--color-text-muted, #64748B);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
}

/* Badge */
.charge-badge {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	border-radius: 4px;
	padding: 2px 9px;
}
.charge-badge--blue {
	background: #EFF6FF;
	color: var(--color-secondary, #0077B6);
	border: 1px solid #BFDBFE;
}

/* 費率表外框 */
.charge-fee-wrap {
	background: #fff;
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 4px 24px rgba(43,69,144,0.07);
}
.charge-fee-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* 費率表本體 */
.charge-fee-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
	min-width: 760px;
}
.charge-fee-table th,
.charge-fee-table td {
	border: 1px solid #E2E8F0;
	padding: 10px 14px;
	vertical-align: middle;
	line-height: 1.6;
}

/* 表頭 */
.charge-thead-group th,
.charge-thead-sub th {
	background: var(--color-primary, #2B4590);
	color: #fff;
	text-align: center;
	font-weight: 700;
	font-size: 13px;
}
.charge-col-group { font-size: 14px !important; letter-spacing: 0.5px; }
.charge-col-group--cert { background: #1D4ED8 !important; }

.charge-thead-sub th {
	background: rgba(43,69,144,0.85);
	font-weight: 600;
	font-size: 12.5px !important;
}
.charge-thead-sub small { opacity: 0.8; font-size: 11px; }

/* 事由欄 */
.charge-col-item { min-width: 220px; text-align: left; }
.charge-item-cell {
	background: #FAFAFA;
	color: var(--color-text, #1E293B);
	font-weight: 500;
	min-width: 220px;
}

/* 公證欄（金額）*/
.charge-notarize-cell {
	text-align: right;
	color: var(--color-primary, #2B4590);
	font-weight: 600;
	font-family: 'Montserrat', 'Noto Sans TC', sans-serif;
}
.charge-col-enforce {
	background: #F0F4FF;
	color: #1D4ED8;
}

/* 認證欄（金額）*/
.charge-cert-cell {
	text-align: right;
	color: #047857;
	font-weight: 600;
	font-family: 'Montserrat', 'Noto Sans TC', sans-serif;
	background: #F0FDF4;
}

/* 說明性文字欄 */
.charge-note-cell {
	font-size: 13px;
	color: var(--color-text, #1E293B);
	line-height: 1.7;
}

/* 小字說明 */
.charge-note {
	display: block;
	font-size: 12px;
	color: var(--color-text-muted, #64748B);
	margin-top: 4px;
}

/* 區段分隔列 */
.charge-section-divider td {
	background: var(--color-primary, #2B4590);
	color: #fff;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.5px;
	padding: 8px 14px;
}

/* 隔行變色 */
.charge-fee-table tbody tr:nth-child(even) .charge-item-cell { background: #F5F7FA; }
.charge-fee-table tbody tr:hover .charge-item-cell { background: #EFF6FF; }

/* ── 備考條文區 ── */
.charge-notes-section {
	padding: 0 0 72px;
	background: var(--color-bg-alt, #F8F7F3);
}

.charge-notes-header { text-align: center; margin-bottom: 28px; }
.charge-notes-title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 20px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0;
}
.charge-notes-title svg { color: var(--color-secondary, #0077B6); }

.charge-notes-card {
	background: #fff;
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 14px;
	padding: 36px 40px;
	box-shadow: 0 4px 20px rgba(43,69,144,0.06);
}
.charge-notes-list {
	margin: 0;
	padding-left: 20px;
	counter-reset: note-counter;
}
.charge-notes-list > li {
	font-size: 14px;
	line-height: 1.8;
	color: var(--color-text, #1E293B);
	margin-bottom: 10px;
	padding-left: 4px;
}
.charge-notes-list > li:last-child { margin-bottom: 0; }
.charge-notes-list > li strong { color: var(--color-primary, #2B4590); }
.charge-notes-list ul {
	margin: 6px 0 0;
	padding-left: 18px;
}
.charge-notes-list ul li {
	font-size: 13.5px;
	margin-bottom: 4px;
	color: var(--color-text-muted, #64748B);
}

/* ── RWD ── */
@media (max-width: 991px) {
	.charge-intro-wrap { flex-direction: column; gap: 18px; padding: 24px 22px; }
	.charge-intro-cta { flex-direction: row; flex-wrap: wrap; }
	.charge-intro-icon { width: 46px; height: 46px; }
}
@media (max-width: 767px) {
	.charge-table-title { font-size: 20px; }
	.charge-notes-card { padding: 22px 18px; }
	.charge-fee-table { font-size: 12.5px; }
}


/* ============================================================
   FAQ / 常見問答 — faq.php
   ============================================================ */

/* ── 說明介紹卡 ─────────────────────────────────────────── */
.faq-intro-section { background: var(--color-bg-alt, #F0F4F8); }
.faq-intro-wrap {
	display: flex;
	align-items: flex-start;
	gap: 22px;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 12px;
	padding: 32px 36px;
	box-shadow: 0 4px 24px rgba(43, 69, 144, 0.07);
}
.faq-intro-icon {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(0, 119, 182, 0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-primary, #2B4590);
	margin-top: 4px;
}
.faq-intro-body h2.faq-intro-title {
	font-size: 19px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 8px;
}
.faq-intro-body p {
	font-size: 15px;
	color: var(--color-text-muted, #64748B);
	line-height: 1.75;
	margin: 0;
}

/* ── 主 FAQ 區 ──────────────────────────────────────────── */
.faq-main-section { background: var(--color-bg, #fff); }

/* 分類標題（有類別時出現）*/
.faq-group { margin-bottom: 42px; }
.faq-group:last-child { margin-bottom: 0; }
.faq-group-title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 17px;
	font-weight: 700;
	color: var(--color-secondary, #0077B6);
	margin: 0 0 18px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--color-border, #E2E8F0);
}
.faq-group-title svg { color: var(--color-accent, #C4933F); flex-shrink: 0; }

/* 手風琴群組 */
.faq-accordion-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* 每一個 FAQ 項目 */
.faq-item {
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 10px;
	overflow: hidden;
	background: var(--color-bg, #fff);
	transition: box-shadow 0.25s ease, border-color 0.25s ease;
}
.faq-item:hover {
	border-color: rgba(0, 119, 182, 0.35);
	box-shadow: 0 4px 20px rgba(43, 69, 144, 0.08);
}
.faq-item.is-open {
	border-color: var(--color-secondary, #0077B6);
	box-shadow: 0 6px 28px rgba(43, 69, 144, 0.13);
}

/* 問題按鈕（header）*/
.faq-question {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 16px;
	background: none;
	border: 0;
	padding: 20px 22px;
	text-align: left;
	cursor: pointer;
	transition: background 0.2s;
}
.faq-question:hover { background: rgba(0, 119, 182, 0.04); }
.faq-item.is-open .faq-question { background: rgba(0, 119, 182, 0.05); }

/* 序號徽章 */
.faq-q-num {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--color-secondary, #0077B6);
	color: #fff;
	font-family: 'Montserrat', 'Noto Sans TC', sans-serif;
	font-size: 13px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}
.faq-item.is-open .faq-q-num {
	background: var(--color-accent, #C4933F);
}

/* 問題文字 */
.faq-q-text {
	flex: 1;
	font-size: 15.5px;
	font-weight: 600;
	color: var(--color-text, #1E293B);
	line-height: 1.55;
}

/* 箭頭圖示 */
.faq-q-arrow {
	flex-shrink: 0;
	color: var(--color-text-muted, #64748B);
	display: flex;
	align-items: center;
	transition: transform 0.3s ease, color 0.2s;
}
.faq-item.is-open .faq-q-arrow {
	transform: rotate(180deg);
	color: var(--color-secondary, #0077B6);
}

/* 答案面板 */
.faq-answer {
	border-top: 1px solid var(--color-border, #E2E8F0);
}
.faq-answer[hidden] { display: none; }
.faq-answer-inner {
	padding: 20px 22px 22px 72px; /* 左縮排對齊問題文字 */
	font-size: 14.5px;
	color: var(--color-text-muted, #64748B);
	line-height: 1.8;
}
.faq-answer-inner p { margin: 0 0 10px; }
.faq-answer-inner p:last-child { margin-bottom: 0; }
.faq-answer-inner ul,
.faq-answer-inner ol { padding-left: 20px; margin: 0 0 10px; }
.faq-answer-inner li { margin-bottom: 6px; }
.faq-answer-inner strong { color: var(--color-primary, #2B4590); }
.faq-answer-inner a {
	color: var(--color-secondary, #0077B6);
	text-decoration: underline;
	text-decoration-color: transparent;
	transition: text-decoration-color 0.2s;
}
.faq-answer-inner a:hover { text-decoration-color: currentColor; }

/* ── 快速連結 ────────────────────────────────────────────── */
.faq-quicklink-section {
	background: var(--color-bg-alt, #F0F4F8);
	border-top: 1px solid var(--color-border, #E2E8F0);
}
.faq-quicklink-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	text-align: center;
	margin: 0 0 32px;
}
.faq-quicklink-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}
.faq-quicklink-card {
	display: flex;
	align-items: center;
	gap: 18px;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 12px;
	padding: 24px 22px;
	text-decoration: none;
	color: inherit;
	box-shadow: 0 4px 24px rgba(43, 69, 144, 0.06);
	transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.25s;
}
.faq-quicklink-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 32px rgba(43, 69, 144, 0.15);
	border-color: var(--color-secondary, #0077B6);
	text-decoration: none;
	color: inherit;
}
.faq-quicklink-icon {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	border-radius: 12px;
	background: rgba(0, 119, 182, 0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-secondary, #0077B6);
	transition: background 0.25s;
}
.faq-quicklink-card:hover .faq-quicklink-icon {
	background: rgba(0, 119, 182, 0.15);
}
.faq-quicklink-body { flex: 1; }
.faq-quicklink-en {
	display: block;
	font-family: 'Montserrat', sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-accent, #C4933F);
	margin-bottom: 3px;
}
.faq-quicklink-zh {
	display: block;
	font-size: 16px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin-bottom: 5px;
}
.faq-quicklink-body p {
	font-size: 13.5px;
	color: var(--color-text-muted, #64748B);
	margin: 0;
	line-height: 1.55;
}
.faq-quicklink-arrow {
	flex-shrink: 0;
	color: var(--color-text-muted, #64748B);
	opacity: 0.5;
	display: flex;
	align-items: center;
	transition: opacity 0.2s, transform 0.2s;
}
.faq-quicklink-card:hover .faq-quicklink-arrow {
	opacity: 1;
	transform: translateX(3px);
	color: var(--color-secondary, #0077B6);
}

/* ── RWD ────────────────────────────────────────────────── */
@media (max-width: 991px) {
	.faq-quicklink-grid { grid-template-columns: 1fr; gap: 14px; }
	.faq-intro-wrap { padding: 24px 22px; gap: 16px; }
}
@media (max-width: 767px) {
	.faq-answer-inner { padding: 18px 18px 20px 18px; }
	.faq-q-text { font-size: 14.5px; }
	.faq-question { padding: 16px 18px; gap: 12px; }
	.faq-q-num { width: 30px; height: 30px; font-size: 12px; }
	.faq-quicklink-card { padding: 18px 16px; }
	.faq-quicklink-title { font-size: 19px; }
}


/* ============================================================
   Required / 案件應備文件 — required.php
   ============================================================ */

/* ── 說明介紹區 ─────────────────────────────────────────── */
.req-intro-section { background: var(--color-bg-alt, #F0F4F8); }
.req-intro-wrap {
	display: flex;
	align-items: flex-start;
	gap: 22px;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 12px;
	padding: 32px 36px;
	box-shadow: 0 4px 24px rgba(43, 69, 144, 0.07);
}
.req-intro-icon {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(0, 119, 182, 0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-primary, #2B4590);
	margin-top: 4px;
}
.req-intro-body p {
	font-size: 15px;
	color: var(--color-text-muted, #64748B);
	line-height: 1.75;
	margin: 0 0 8px;
}
.req-intro-body p:last-child { margin-bottom: 0; }
.req-intro-note {
	display: flex;
	align-items: flex-start;
	gap: 7px;
	font-size: 14px;
	color: #C0392B;
}
.req-intro-note svg { flex-shrink: 0; margin-top: 2px; }

/* ── 服務頁整頁免責聲明（快速連結區與 footer 之間）─────────── */
.svc-page-disclaimer {
	background: var(--color-bg, #fff);
	padding: 0 0 56px;
}
.svc-page-disclaimer .container {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 9px;
	max-width: 880px;
	padding-top: 24px;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.svc-page-disclaimer svg {
	flex-shrink: 0;
	margin-top: 3px;
	color: var(--color-gold, #B8995A);
	opacity: .85;
}
.svc-page-disclaimer p {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.85;
	color: #8A8A8A;
	letter-spacing: .2px;
}
.svc-page-disclaimer p strong {
	color: #6E6E6E;
	font-weight: 600;
}
@media (max-width: 575px) {
	.svc-page-disclaimer { padding-bottom: 40px; }
	.svc-page-disclaimer p { font-size: 13px; }
}

/* ── 授權書下載 ─────────────────────────────────────────── */
.req-download-section { background: var(--color-bg, #fff); padding-bottom: 0; }
.req-download-card {
	background: var(--color-bg-alt, #F0F4F8);
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 12px;
	padding: 18px 24px;
	transition: padding 0.3s ease;
}

/* 標題列：左（展開按鈕）／右（身分證明文件說明連結） */
.req-download-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
}

/* 左側展開按鈕 */
.req-download-toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 4px;
	background: none;
	border: 0;
	cursor: pointer;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	transition: color 0.2s;
}
.req-download-toggle:hover { color: var(--color-secondary, #0077B6); }
.req-download-toggle-ico {
	display: inline-flex;
	color: var(--color-secondary, #0077B6);
}
.req-download-toggle-arrow {
	display: inline-flex;
	color: var(--color-accent, #C4933F);
	transition: transform 0.3s ease;
}
.req-download-toggle.is-open .req-download-toggle-arrow {
	transform: rotate(180deg);
}

/* 右側：身分證明文件說明連結 */
.req-identity-link-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 20px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--color-primary, #2B4590);
	text-decoration: none;
	transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.req-identity-link-btn:hover {
	background: var(--color-primary, #2B4590);
	border-color: var(--color-primary, #2B4590);
	color: #fff;
	text-decoration: none;
}
.req-identity-link-btn svg { flex-shrink: 0; }

/* 授權書按鈕陣列（預設收合；展開時水平置中） */
.req-download-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px dashed var(--color-border, #E2E8F0);
}
.req-download-grid[hidden] { display: none; }
.req-download-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 18px;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 8px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--color-primary, #2B4590);
	text-decoration: none;
	transition: background 0.22s, border-color 0.22s, color 0.22s;
}
.req-download-btn:hover {
	background: var(--color-secondary, #0077B6);
	border-color: var(--color-secondary, #0077B6);
	color: #fff;
	text-decoration: none;
}
.req-download-btn svg { flex-shrink: 0; }

/* 響應式：手機版左右堆疊 */
@media (max-width: 575px) {
	.req-download-bar { flex-direction: column; align-items: stretch; }
	.req-download-toggle { justify-content: space-between; }
	.req-identity-link-btn { justify-content: center; }
}

/* ── 應備文件主區 ────────────────────────────────────────── */
.req-index-section { background: var(--color-bg, #fff); }
.req-section-title {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 22px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 24px;
}
.req-section-title-bar {
	display: inline-block;
	width: 5px;
	height: 24px;
	border-radius: 3px;
	background: var(--color-accent, #C4933F);
}

/* 快速跳點索引 */
.req-quicknav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 32px;
	padding: 20px 24px;
	background: var(--color-bg-alt, #F0F4F8);
	border-radius: 10px;
	border: 1px solid var(--color-border, #E2E8F0);
}
.req-quicknav-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 7px 14px;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 20px;
	font-size: 13px;
	color: var(--color-primary, #2B4590);
	text-decoration: none;
	transition: background 0.22s, border-color 0.22s, color 0.22s;
}
.req-quicknav-btn:hover {
	background: var(--color-secondary, #0077B6);
	border-color: var(--color-secondary, #0077B6);
	color: #fff;
	text-decoration: none;
}
.req-quicknav-btn svg { flex-shrink: 0; }

/* ── 分類 Tab 區（required 專屬；與網站設計系統一致） ───────── */

/* 置中式區段標題（仿 inner-section-heading 樣式，統一視覺語彙） */
.req-tab-heading {
	text-align: center;
	margin-bottom: 36px;
}
.req-tab-heading-label {
	display: inline-block;
	font-family: 'Cormorant Garamond', serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--color-accent, #C4933F);
	text-transform: uppercase;
	letter-spacing: 0.18em;
	margin-bottom: 10px;
}
.req-tab-heading-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 32px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	margin: 0 0 14px;
	line-height: 1.3;
	letter-spacing: 2px;
}
.req-tab-heading-line {
	width: 44px;
	height: 3px;
	border-radius: 2px;
	background: var(--color-accent, #C4933F);
	margin: 0 auto 16px;
}
.req-tab-heading-desc {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 15px;
	color: var(--color-text-muted, #6B7280);
	max-width: 640px;
	margin: 0 auto;
	line-height: 1.75;
}

/* Tab 列（水平置中、金色底線強調） */
.req-tab-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px 8px;
	border-bottom: 1px solid var(--color-border, #E5E2DC);
	margin-bottom: 32px;
	padding: 0 4px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}
.req-tab-nav::-webkit-scrollbar { display: none; }

/* Tab 列換行用：強制下一個 button 從新的一排開始（公證 / 認證 分排） */
.req-tab-nav-break {
	flex-basis: 100%;
	width: 100%;
	height: 0;
}

.req-tab-btn {
	position: relative;
	padding: 14px 22px 16px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 16px;
	font-weight: 500;
	color: var(--color-text-muted, #6B7280);
	background: none;
	border: 0;
	border-bottom: 3px solid transparent;
	margin-bottom: -1px;
	cursor: pointer;
	white-space: nowrap;
	transition: color 0.25s ease, border-color 0.25s ease, font-weight 0.25s ease;
}
.req-tab-btn:hover {
	color: var(--color-primary, #2B4590);
}
.req-tab-btn.is-active {
	color: var(--color-text, #1E1E2E);
	font-weight: 700;
	border-bottom-color: var(--color-accent, #C4933F);
}
.req-tab-btn:focus-visible {
	outline: 2px solid rgba(196, 147, 63, 0.45);
	outline-offset: 3px;
	border-radius: 4px;
}

/* Tab 面板 */
.req-tab-panels { min-height: 120px; }
.req-tab-panel { display: none; }
.req-tab-panel.is-active { display: block; }

/* 響應式：手機版 Tab 改為較小字、橫向捲動 */
@media (max-width: 767px) {
	.req-tab-heading-title { font-size: 26px; }
	.req-tab-nav {
		justify-content: flex-start;
		flex-wrap: nowrap;
	}
	.req-tab-nav-break { display: none; }
	.req-tab-btn {
		flex: 0 0 auto;
		padding: 12px 14px 14px;
		font-size: 14px;
	}
}

/* 手風琴容器 */
.req-accordion-wrap {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* 單一文件項目 */
.req-item {
	border: 1px solid var(--color-border, #E2E8F0);
	border-radius: 10px;
	overflow: hidden;
	background: var(--color-bg, #fff);
	transition: box-shadow 0.25s, border-color 0.25s;
	scroll-margin-top: 110px; /* 固定導覽高度補償 */
}
.req-item:hover {
	border-color: rgba(0, 119, 182, 0.35);
	box-shadow: 0 4px 20px rgba(43, 69, 144, 0.08);
}
.req-item.is-open {
	border-color: var(--color-secondary, #0077B6);
	box-shadow: 0 6px 28px rgba(43, 69, 144, 0.13);
}

/* 問題按鈕 */
.req-question {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 16px;
	background: none;
	border: 0;
	padding: 20px 22px;
	text-align: left;
	cursor: pointer;
	transition: background 0.2s;
}
.req-question:hover { background: rgba(0, 119, 182, 0.04); }
.req-item.is-open .req-question { background: rgba(0, 119, 182, 0.05); }

/* 序號 */
.req-q-num {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--color-secondary, #aaadae);
	color: #fff;
	font-family: 'Montserrat', 'Noto Sans TC', sans-serif;
	font-size: 13px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}
.req-item.is-open .req-q-num { background: var(--color-accent, #C4933F); }

/* 文字 */
.req-q-text {
	flex: 1;
	font-size: 15.5px;
	font-weight: 600;
	color: var(--color-text, #1E293B);
	line-height: 1.55;
}

/* 箭頭 */
.req-q-arrow {
	flex-shrink: 0;
	color: var(--color-text-muted, #64748B);
	display: flex;
	align-items: center;
	transition: transform 0.3s ease, color 0.2s;
}
.req-item.is-open .req-q-arrow {
	transform: rotate(180deg);
	color: var(--color-secondary, #0077B6);
}

/* 答案面板 */
.req-answer { border-top: 1px solid var(--color-border, #E2E8F0); }
.req-answer[hidden] { display: none; }
.req-answer-inner {
	padding: 20px 22px 24px 72px;
	font-size: 14.5px;
	color: var(--color-text-muted, #64748B);
	line-height: 1.8;
}
.req-answer-inner p { margin: 0 0 10px; }
.req-answer-inner p:last-child { margin-bottom: 0; }
.req-answer-inner ul { padding-left: 0px; margin: 0 0 10px; }
.req-answer-inner ol { padding-left: 45px; margin: 0 0 10px; }
.req-answer-inner li { margin-bottom: 6px; }
.req-answer-inner strong { color: var(--color-primary, #2B4590); }
.req-answer-inner h4 strong { font-size: 16px; }
.req-answer-inner h5 strong { font-size: 15px; }
.req-answer-inner a {
	color: var(--color-secondary, #0077B6);
	text-decoration: underline;
	text-decoration-color: transparent;
	transition: text-decoration-color 0.2s;
}
.req-answer-inner a:hover { text-decoration-color: currentColor; }

/* 備註區塊 */
.req-short-note {
	margin-top: 14px;
	padding: 12px 16px;
	background: rgba(196, 147, 63, 0.07);
	border-left: 3px solid var(--color-accent, #C4933F);
	border-radius: 0 6px 6px 0;
	font-size: 13.5px;
	color: var(--color-text-muted, #64748B);
}

/* ── RWD ────────────────────────────────────────────────── */
@media (max-width: 991px) {
	.req-intro-wrap { padding: 24px 22px; gap: 16px; }
	.req-download-card { padding: 22px 20px; }
	.req-quicknav { padding: 16px 18px; }
}
@media (max-width: 767px) {
	.req-answer-inner { padding: 18px 18px 20px 18px; }
	.req-q-text { font-size: 14.5px; }
	.req-question { padding: 16px 18px; gap: 12px; }
	.req-q-num { width: 30px; height: 30px; font-size: 12px; }
	.req-section-title { font-size: 19px; }
	.req-download-grid { gap: 8px; }
	.req-download-btn { font-size: 12.5px; padding: 8px 14px; }
}

/* ============================================================
   Service / 服務項目  service.php
   ============================================================ */

/*  服務簡介區  */
/* ============================================================
   Service — service.php 服務項目頁
   ============================================================ */

/* ── 服務簡介區（svc-intro-section） ── */
.svc-intro-section {
	background: #FFFFFF;
	padding: 80px 0 90px;
	position: relative;
	overflow: hidden;
}

/* 背景幾何裝飾 */
.svc-intro-section::before {
	content: '';
	position: absolute;
	left: -80px;
	bottom: -80px;
	width: 320px;
	height: 320px;
	border-radius: 50%;
	border: 1px solid rgba(196,147,63,0.10);
	pointer-events: none;
}
.svc-intro-section::after {
	content: '';
	position: absolute;
	right: -40px;
	top: 40px;
	width: 180px;
	height: 180px;
	border-radius: 50%;
	background: rgba(0,119,182,0.04);
	pointer-events: none;
}

.svc-intro-wrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: 72px;
	position: relative;
	z-index: 1;
}
.svc-intro-text { flex: 1; }
.svc-intro-label {
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	letter-spacing: 0.20em;
	text-transform: uppercase;
	color: #C4933F;
	margin-bottom: 14px;
	display: block;
}
.svc-intro-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 34px;
	font-weight: 700;
	color: #2B4590;
	margin: 0 0 18px;
	line-height: 1.3;
}
.svc-intro-gold-line {
	width: 44px;
	height: 3px;
	background: #C4933F;
	border-radius: 2px;
	margin-bottom: 22px;
}
.svc-intro-desc {
	font-size: 15.5px;
	color: #6B7280;
	line-height: 1.9;
	margin: 0 0 32px;
}
.svc-intro-cta {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}
/* 右欄：亮點清單 */
.svc-intro-highlights {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.svc-highlight-card {
	display: flex;
	align-items: center;
	gap: 18px;
	background: #fff;
	border: 1px solid #E5E2DC;
	border-left: 3px solid transparent;
	border-radius: 12px;
	padding: 18px 22px;
	box-shadow: 0 4px 20px rgba(43,69,144,0.06);
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-left-color 0.25s;
}
.svc-highlight-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 30px rgba(43,69,144,0.12);
	border-left-color: #C4933F;
}
.svc-highlight-icon {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	border-radius: 12px;
	background: rgba(0,119,182,0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0077B6;
	transition: background 0.25s, color 0.25s;
}
.svc-highlight-card:hover .svc-highlight-icon {
	background: #0077B6;
	color: #fff;
}
.svc-highlight-body {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.svc-highlight-body strong {
	font-size: 15px;
	font-weight: 700;
	color: #1E1E2E;
	line-height: 1.4;
}
.svc-highlight-body span {
	font-size: 13px;
	color: #6B7280;
	line-height: 1.55;
}

/* ── 服務卡片區（svc-cards-section） ── */
.svc-cards-section {
	background: #F8F7F4;
	padding: 84px 0 96px;
}
.svc-section-header {
	text-align: center;
	margin-bottom: 56px;
}
.svc-section-label {
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	letter-spacing: 0.20em;
	text-transform: uppercase;
	color: #C4933F;
	display: block;
	margin-bottom: 12px;
}
.svc-section-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 32px;
	font-weight: 700;
	color: #2B4590;
	margin: 0 0 16px;
	line-height: 1.3;
}
.svc-section-gold-line {
	width: 44px;
	height: 3px;
	background: #C4933F;
	border-radius: 2px;
	margin: 0 auto 18px;
}
.svc-section-sub {
	font-size: 15px;
	color: #6B7280;
	line-height: 1.85;
	max-width: 560px;
	margin: 0 auto;
}

/* Editorial header modifier — 跨白底 section 間的視覺斷點(2026-05-28 Phase C 加入) */
/* 用於相鄰同色 section 之間,加跨幅金漸層細線 + 大號 chapter 編號(Cormorant Garamond) */
.svc-section-header--editorial {
	position: relative;
	padding-top: 64px;
}
.svc-section-header--editorial::before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 240px;
	height: 1px;
	background: linear-gradient(90deg, transparent 0%, rgba(196,147,63,0.55) 30%, rgba(196,147,63,0.85) 50%, rgba(196,147,63,0.55) 70%, transparent 100%);
}
.svc-section-chapter {
	font-family: 'Cormorant Garamond', serif;
	font-size: 42px;
	font-weight: 400;
	color: #C4933F;
	line-height: 1;
	margin: 22px 0 14px;
	letter-spacing: 0.02em;
	display: block;
}
.svc-section-header--editorial .svc-section-label {
	margin-bottom: 14px;
}

.svc-cards-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.svc-card {
	background: #FFFFFF;
	border: 1px solid #E5E2DC;
	border-top: 3px solid #E5E2DC;
	border-radius: 14px;
	padding: 34px 28px 30px;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-top-color 0.25s;
	box-shadow: 0 4px 20px rgba(43,69,144,0.06);
	display: flex;
	flex-direction: column;
}
.svc-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 40px rgba(43,69,144,0.13);
	border-top-color: #C4933F;
}
.svc-card-icon {
	width: 60px;
	height: 60px;
	border-radius: 14px;
	background: rgba(0,119,182,0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 22px;
	color: #0077B6;
	transition: background 0.25s, color 0.25s;
	flex-shrink: 0;
}
.svc-card:hover .svc-card-icon {
	background: #0077B6;
	color: #fff;
}
.svc-card-icon svg {
	width: 26px;
	height: 26px;
	stroke-width: 1.5;
}
.svc-card-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 17px;
	font-weight: 700;
	color: #1E1E2E;
	margin: 0 0 12px;
	line-height: 1.45;
}
.svc-card-desc {
	font-size: 14px;
	color: #6B7280;
	line-height: 1.85;
	margin: 0;
	flex: 1;
}

/* 服務總覽頁：可點整卡的服務連結卡（svc-card 以 <a> 呈現） */
.svc-card--linked {
	text-decoration: none;
	color: inherit;
}
.svc-card--linked:hover,
.svc-card--linked:focus {
	text-decoration: none;
	color: inherit;
}
.svc-card-eng {
	font-family: 'Cormorant Garamond', serif;
	font-size: 14px;
	letter-spacing: 0.08em;
	color: #C4933F;
	margin-bottom: 6px;
	display: block;
}
.svc-card-more {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 20px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #2B4590;
	transition: gap 0.25s ease, color 0.25s ease;
}
.svc-card--linked:hover .svc-card-more,
.svc-card--linked:focus .svc-card-more {
	color: #C4933F;
	gap: 8px;
}

/* 總覽頁 4 卡：桌機 2×2 更平衡（覆寫 .svc-cards-grid 預設 3 欄） */
.svc-cards-grid--overview {
	grid-template-columns: repeat(2, 1fr);
	max-width: 920px;
	margin: 0 auto;
}
.svc-steps-list {
	list-style: none;
	padding: 0;
	margin: 18px 0 0;
	counter-reset: svc-step;
}
.svc-steps-list li {
	counter-increment: svc-step;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 8px 0;
	font-size: 13.5px;
	color: #1E1E2E;
	border-bottom: 1px dashed #E5E2DC;
	line-height: 1.6;
}
.svc-steps-list li:last-child {
	border-bottom: none;
}
.svc-steps-list li::before {
	content: counter(svc-step);
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #2B4590;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 2px;
}

/* ── 公認證流程區（svc-process-section） ── */
.svc-process-section {
	background: #FFFFFF;
	padding: 84px 0 96px;
	position: relative;
	overflow: hidden;
}

/* 背景幾何裝飾 */
.svc-process-section::before {
	content: '';
	position: absolute;
	right: -60px;
	bottom: -60px;
	width: 280px;
	height: 280px;
	border-radius: 50%;
	border: 1px solid rgba(196,147,63,0.10);
	pointer-events: none;
}

.svc-process-steps {
	display: flex;
	align-items: stretch;
	justify-content: center;
	gap: 0;
	flex-wrap: wrap;
	position: relative;
	z-index: 1;
}
.svc-process-step {
	flex: 1;
	min-width: 140px;
	max-width: 200px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 32px 16px 28px;
	background: #fff;
	border: 1px solid #E5E2DC;
	border-bottom: 3px solid transparent;
	border-radius: 14px;
	box-shadow: 0 4px 20px rgba(43,69,144,0.07);
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-bottom-color 0.25s;
}
.svc-process-step:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 34px rgba(43,69,144,0.14);
	border-bottom-color: #C4933F;
}
.svc-process-num {
	font-family: 'Cormorant Garamond', serif;
	font-size: 42px;
	font-weight: 600;
	color: #C4933F;
	line-height: 1;
	margin-bottom: 14px;
	opacity: 0.75;
}
.svc-process-icon {
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: rgba(0,119,182,0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0077B6;
	margin-bottom: 16px;
	transition: background 0.25s, color 0.25s;
}
.svc-process-step:hover .svc-process-icon {
	background: #0077B6;
	color: #fff;
}
.svc-process-title {
	font-size: 15px;
	font-weight: 700;
	color: #2B4590;
	margin: 0 0 8px;
}
.svc-process-desc {
	font-size: 13px;
	color: #6B7280;
	line-height: 1.65;
	margin: 0;
}
.svc-process-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 6px;
	margin-top: 60px;
	color: rgba(196,147,63,0.7);
	flex-shrink: 0;
}

/* ── CTA 深色區塊（svc-cta-section） ── */
.svc-cta-section {
	background: linear-gradient(145deg, #1A2D5A 0%, #2B4590 55%, #1E3070 100%);
	padding: 80px 0;
	position: relative;
	overflow: hidden;
}

/* CTA 幾何裝飾 */
.svc-cta-section::before {
	content: '';
	position: absolute;
	right: -80px;
	top: -80px;
	width: 320px;
	height: 320px;
	border-radius: 50%;
	border: 1.5px solid rgba(196,147,63,0.20);
	pointer-events: none;
}
.svc-cta-section::after {
	content: '';
	position: absolute;
	left: 60px;
	bottom: -100px;
	width: 200px;
	height: 200px;
	border-radius: 50%;
	background: rgba(196,147,63,0.06);
	pointer-events: none;
}

.svc-cta-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 48px;
	position: relative;
	z-index: 1;
}
.svc-cta-text { flex: 1; }
.svc-cta-label {
	font-family: 'Cormorant Garamond', serif;
	font-size: 13px;
	letter-spacing: 0.20em;
	text-transform: uppercase;
	color: rgba(196,147,63,0.9);
	display: block;
	margin-bottom: 12px;
}
.svc-cta-title {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 32px;
	font-weight: 700;
	color: #fff;
	margin: 0 0 16px;
	line-height: 1.3;
}
.svc-cta-desc {
	font-size: 15px;
	color: rgba(255,255,255,0.75);
	line-height: 1.9;
	margin: 0;
	max-width: 520px;
}
.svc-cta-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex-shrink: 0;
}
.btn-svc-cta-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: #C4933F;
	color: #fff;
	border-radius: 8px;
	padding: 14px 32px;
	font-size: 14.5px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
	white-space: nowrap;
	letter-spacing: 0.01em;
}
.btn-svc-cta-primary:hover {
	background: #b07836;
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(196,147,63,0.35);
}
.btn-svc-cta-outline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: transparent;
	color: rgba(255,255,255,0.88);
	border: 1.5px solid rgba(255,255,255,0.32);
	border-radius: 8px;
	padding: 13px 32px;
	font-size: 14.5px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s, border-color 0.2s, color 0.2s, transform 0.2s;
	white-space: nowrap;
}
.btn-svc-cta-outline:hover {
	background: rgba(255,255,255,0.12);
	border-color: rgba(255,255,255,0.75);
	color: #fff;
	transform: translateY(-2px);
}

/* ── 快速連結區（svc-quicklink-section） ── */
.svc-quicklink-section {
	background: #F8F7F4;
}
.svc-quicklink-header {
	margin-bottom: 44px;
}

/* ── RWD ── */
@media (max-width: 991px) {
	.svc-intro-wrap { grid-template-columns: 1fr; gap: 40px; }
	.svc-cards-grid { grid-template-columns: repeat(2, 1fr); }
	.svc-process-steps { gap: 0; }
	.svc-cta-content { flex-direction: column; align-items: flex-start; gap: 32px; }
	.svc-cta-actions { flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 767px) {
	.svc-intro-section { padding: 52px 0 60px; }
	.svc-intro-title { font-size: 26px; }
	.svc-intro-desc { font-size: 15px; }
	.svc-cards-grid { grid-template-columns: 1fr; }
	.svc-cards-section { padding: 60px 0 68px; }
	.svc-section-title { font-size: 25px; }
	.svc-process-section { padding: 60px 0 68px; }
	.svc-process-steps { flex-direction: column; align-items: center; gap: 10px; }
	.svc-process-step { max-width: 100%; width: 100%; flex-direction: row; text-align: left; padding: 18px 20px; gap: 16px; min-width: unset; }
	.svc-process-num { font-size: 30px; min-width: 36px; margin-bottom: 0; opacity: 1; }
	.svc-process-icon { margin-bottom: 0; flex-shrink: 0; width: 46px; height: 46px; }
	.svc-process-arrow { margin-top: 0; transform: rotate(90deg); padding: 4px 0; }
	.svc-cta-section { padding: 56px 0; }
	.svc-cta-title { font-size: 26px; }
	.svc-cta-actions { width: 100%; }
	.btn-svc-cta-primary,
	.btn-svc-cta-outline { width: 100%; }
}

/* ============================================================
   Contact / 聯絡我們  contact.php
   ============================================================ */

/*  主要網格  */
.contact-main-section {
    padding: 40px 0 70px;
}
.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
}

/*  區段小標題（左右欄共用） */
.contact-section-heading {
    margin-bottom: 18px;
}
.contact-section-label {
    display: inline-block;
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    margin-bottom: 6px;
}
.contact-section-title {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 10px;
    line-height: 1.3;
}
.contact-section-line {
    width: 36px;
    height: 3px;
    border-radius: 2px;
    background: var(--color-accent, #C4933F);
}

/*  左欄：聯絡資訊  */
.contact-info-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 28px;
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 12px;
    overflow: hidden;
    background: var(--color-bg, #fff);
    box-shadow: 0 4px 24px rgba(43, 69, 144, 0.06);
}
.contact-info-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px 22px;
    background: var(--color-bg, #fff);
    border-bottom: 1px solid var(--color-border, #E5E2DC);
    transition: background 0.2s ease, padding-left 0.25s ease;
}
.contact-info-item:last-child {
    border-bottom: none;
}
.contact-info-item:hover {
    background: linear-gradient(90deg, rgba(196, 147, 63, 0.05), rgba(196, 147, 63, 0));
    padding-left: 26px;
}
.contact-info-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.15), rgba(196, 147, 63, 0.05));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-accent, #C4933F);
    margin-top: 2px;
    transition: transform 0.25s ease, background 0.25s ease;
}
.contact-info-item:hover .contact-info-icon {
    transform: scale(1.06);
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.25), rgba(196, 147, 63, 0.1));
}
.contact-info-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    gap: 2px;
}
.contact-info-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--color-text-muted, #6B7280);
    letter-spacing: 0.04em;
    margin-bottom: 2px;
    text-align: left;
}
.contact-info-value {
    display: block;
    font-size: 15px;
    color: var(--color-text, #1E1E2E);
    font-weight: 500;
    line-height: 1.55;
    text-decoration: none;
    word-break: break-all;
    text-align: left;
}
a.contact-info-value {
    transition: color 0.2s;
}
a.contact-info-value:hover {
    color: var(--color-secondary, #0077B6);
    text-decoration: none;
}
.contact-tel-link:hover {
    color: var(--color-secondary, #0077B6);
    text-decoration: underline;
}
.contact-info-sub {
    font-size: 13px;
    color: var(--color-text-muted, #64748B);
    margin-top: 2px;
}

/*  社群按鈕  */
.contact-social {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 6px;
}
.contact-social-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 24px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    color: #fff;
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease;
}
.contact-social-btn:hover {
    color: #fff;
    text-decoration: none;
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}
.contact-social-fb   { background: #1877F2; }
.contact-social-line { background: #06C755; }
.contact-social-ig   { background: linear-gradient(135deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); }

/*  右欄：地圖  */
.contact-map-col {
    position: sticky;
    top: 100px;
}
.contact-map-wrap {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--color-border, #E5E2DC);
    box-shadow: 0 4px 24px rgba(43, 69, 144, 0.06);
}
.contact-map-iframe {
    display: block;
    width: 100%;
    height: 420px;
    border: 0;
}
.contact-map-cta {
    margin-top: 14px;
    display: flex;
    justify-content: flex-end;
}
.contact-map-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 24px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-primary, #2B4590);
    text-decoration: none;
    transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.2s, box-shadow 0.2s;
}
.contact-map-cta-btn:hover {
    background: var(--color-accent, #C4933F);
    border-color: var(--color-accent, #C4933F);
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(196, 147, 63, 0.28);
}
.contact-map-cta-btn svg { flex-shrink: 0; }
.contact-map-placeholder {
    min-height: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    background: var(--color-bg-alt, #F8F7F4);
    color: var(--color-text-muted, #6B7280);
    font-size: 14px;
    padding: 40px;
}
.contact-map-placeholder svg {
    opacity: 0.35;
}

/*  RWD  */
@media (max-width: 991px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .contact-map-col { position: static; }
}
@media (max-width: 767px) {
    .contact-main-section { padding: 30px 0 50px; }
    .contact-info-item { padding: 16px 18px; gap: 12px; }
    .contact-info-item:hover { padding-left: 22px; }
    .contact-social-btn { font-size: 13px; padding: 8px 14px; }
    .contact-section-title { font-size: 20px; }
    .contact-map-iframe { height: 320px; }
    .contact-map-cta { justify-content: center; }
}

/* ============================================================
   Identity / 身分證明文件  identity.php
   ============================================================ */
.identity-intro-section {
    background: var(--color-bg-alt, #F0F4F8);
    padding: 60px 0;
	padding-bottom: 0px;
}
.identity-intro-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 36px;
}
.identity-intro-text { flex: 1; }
.identity-intro-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 12px 0;
}
.identity-intro-text p {
    font-size: 15px;
    color: var(--color-text-muted, #64748B);
    line-height: 1.8;
    margin: 0;
}
.identity-intro-cta {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
    align-items: center;
}
.identity-list-section { padding: 60px 0; }
.identity-quicknav {
    margin-bottom: 36px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    flex-wrap: wrap;
}
.identity-quicknav-label {
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text-muted, #64748B);
    white-space: nowrap;
    padding-top: 4px;
}
.identity-quicknav-links {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.identity-nav-chip {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 20px;
    border: 1px solid var(--color-primary, #2B4590);
    color: var(--color-primary, #2B4590);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}
.identity-nav-chip:hover {
    background: var(--color-primary, #2B4590);
    color: #fff;
}
.identity-cards-wrap {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.identity-card {
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(43, 69, 144, 0.06);
    scroll-margin-top: 100px;
}
.identity-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 28px;
    background: var(--color-primary, #2B4590);
    color: #fff;
}
.identity-card-icon { flex-shrink: 0; opacity: 0.85; }
.identity-card-title {
    font-size: 17px;
    font-weight: 700;
    margin: 0;
    color: #fff;
}
.identity-card-body { padding: 24px 28px; }
.identity-card-content {
    font-size: 14.5px;
    color: var(--color-text, #1E293B);
    line-height: 1.8;
}
.identity-card-content ol, .identity-card-content ul
{
	padding-left: 15px;
}

.identity-card-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 16px;
    padding: 12px 16px;
    background: rgba(245, 158, 11, 0.08);
    border-left: 3px solid var(--color-caution, #F59E0B);
    border-radius: 0 8px 8px 0;
    font-size: 13.5px;
    color: var(--color-text, #1E293B);
    line-height: 1.7;
}
.identity-card-note svg { flex-shrink: 0; color: var(--color-caution, #F59E0B); margin-top: 2px; }
@media (max-width: 767px) {
    .identity-intro-wrap { flex-direction: column; gap: 20px; }
    .identity-intro-cta { flex-wrap: wrap; }
    .identity-intro-section { padding: 40px 0; }
    .identity-list-section { padding: 40px 0; }
    .identity-card-header { padding: 16px 20px; }
    .identity-card-body { padding: 18px 20px; }
}

/* ============================================================
   Members / 本所公證人  members.php
   ============================================================ */
.members-section { padding: 70px 0; }
.member-card {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 48px;
    align-items: start;
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(43, 69, 144, 0.07);
    margin-bottom: 40px;
}
.member-card:last-child { margin-bottom: 0; }
.member-card-pic-col {
    background: var(--color-bg-alt, #F0F4F8);
    display: flex;
    align-items: stretch;
    min-height: 320px;
}
.member-card-pic {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.member-card-pic-placeholder {
    width: 100%;
    min-height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-border, #E2E8F0);
}
.member-card-body { padding: 36px 36px 36px 0; }
.member-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--color-bg-alt, #F0F4F8);
}
.member-card-name {
    font-size: 26px;
    font-weight: 800;
    color: var(--color-primary, #2B4590);
    margin: 0;
    font-family: 'Noto Sans TC', sans-serif;
}
.member-card-title-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: 20px;
    background: rgba(43, 69, 144, 0.1);
    color: var(--color-primary, #2B4590);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}
.member-info-block {
    margin-bottom: 20px;
}
.member-info-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-secondary, #0077B6);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0 0 8px 0;
}
.member-info-content {
    font-size: 14.5px;
    color: var(--color-text, #1E293B);
    line-height: 1.85;
    padding-left: 20px;
}
.member-card-cta { margin-top: 28px; }
@media (max-width: 991px) {
    .member-card { grid-template-columns: 220px 1fr; gap: 28px; }
}
@media (max-width: 767px) {
    .member-card { grid-template-columns: 1fr; }
    .member-card-pic-col { min-height: 240px; max-height: 300px; }
    .member-card-body { padding: 24px 20px; }
    .members-section { padding: 46px 0; }
    .member-card-name { font-size: 22px; }
}

/* ============================================================
   New-Case / 案件預約  new-case.php
   ============================================================ */
.newcase-section { padding: 70px 0; }
.newcase-wrap {
    max-width: 680px;
    margin: 0 auto;
}
.newcase-intro {
    text-align: center;
    margin-bottom: 40px;
}
.newcase-intro-icon {
    width: 68px;
    height: 68px;
    border-radius: 20px;
    background: rgba(43, 69, 144, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary, #2B4590);
    margin: 0 auto 18px auto;
}
.newcase-intro-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 10px 0;
}
.newcase-intro-desc {
    font-size: 14.5px;
    color: var(--color-text-muted, #64748B);
    line-height: 1.8;
    margin: 0;
}
.newcase-form-card {
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E2E8F0);
    border-radius: 16px;
    padding: 40px 44px;
    box-shadow: 0 4px 32px rgba(43, 69, 144, 0.07);
}
.newcase-field { margin-bottom: 24px; }
.newcase-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--color-text, #1E293B);
    margin-bottom: 8px;
}
.newcase-label.required::after {
    content: '*';
    color: #EF4444;
    margin-left: 2px;
}
.newcase-dx-field { width: 100%; }
.newcase-captcha-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 16px;
    align-items: end;
}
.newcase-captcha-img {
    display: block;
    border-radius: 6px;
    border: 1px solid var(--color-border, #E2E8F0);
    height: 42px;
}
.newcase-captcha-img-group {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.newcase-captcha-refresh {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--color-secondary, #0077B6);
    text-decoration: none;
}
.newcase-captcha-refresh:hover { text-decoration: underline; }
.newcase-validation-summary { margin-bottom: 12px; }
.newcase-submit-row { margin-top: 8px; }
.newcase-submit-btn { width: 100%; }
@media (max-width: 767px) {
    .newcase-form-card { padding: 28px 22px; }
    .newcase-section { padding: 46px 0; }
    .newcase-captcha-row { grid-template-columns: 1fr; }
}
/* ============================================================
   cancel-case.php  取消案件預約
   ============================================================ */
.cancelcase-section {
    padding: 60px 0 80px;
    background: var(--color-bg-alt, #F0F4F8);
}
.cancelcase-wrap {
    max-width: 660px;
    margin: 0 auto;
}
.cancelcase-intro {
    text-align: center;
    margin-bottom: 32px;
}
.cancelcase-intro-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--color-primary, #2B4590);
    color: #fff;
    font-size: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}
.cancelcase-intro-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin-bottom: 8px;
}
.cancelcase-intro-desc {
    font-size: 0.97rem;
    color: var(--color-text-muted, #64748B);
}
.cancelcase-form-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(43,69,144,0.08);
    padding: 40px 36px;
}
.cancelcase-field {
    margin-bottom: 24px;
}
.cancelcase-label {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-text, #1E293B);
    margin-bottom: 8px;
}
.cancelcase-required {
    color: #E53E3E;
    margin-right: 3px;
}
.cancelcase-dx-field {
    width: 100%;
}
.cancelcase-captcha-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: start;
}
.cancelcase-captcha-img img {
    width: 100%;
    border-radius: 6px;
    border: 1px solid var(--color-border, #E2E8F0);
    display: block;
    margin-bottom: 6px;
}
.cancelcase-captcha-refresh {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--color-secondary, #0077B6);
    text-decoration: none;
}
.cancelcase-captcha-refresh:hover { text-decoration: underline; }
.cancelcase-validation-summary { margin-bottom: 12px; }
.cancelcase-submit-btn { width: 100%; }
.cancelcase-submit-row { margin-top: 8px; }
@media (max-width: 767px) {
    .cancelcase-form-card { padding: 28px 20px; }
    .cancelcase-section { padding: 40px 0; }
    .cancelcase-captcha-row { grid-template-columns: 1fr; }
}

/* ============================================================
   case-amt-cal.php  公認證費用試算機
   ============================================================ */

/* Banner 右側裝飾：計算機浮水印 icon（此頁獨有） */
.feecal-banner .container { position: relative; }
.feecal-banner-deco {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 150px;
    height: 150px;
    color: rgba(255, 255, 255, 0.12);
    pointer-events: none;
    display: inline-flex;
}
.feecal-banner-deco svg { width: 100%; height: 100%; }
@media (max-width: 767px) {
    .feecal-banner-deco { width: 96px; height: 96px; right: 16px; opacity: 0.7; }
}


/* ── 試算工作區（左側步驟 + 右側計算機卡） ── */
.feecal-workspace-section {
    padding: 20px 0 70px;
    background: var(--color-bg-alt, #F8F7F4);
}
.feecal-workspace-grid {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 32px;
    align-items: start;
}

/* 左側步驟欄（桌機 sticky 貼上，避免右側主卡捲動時空白太久） */
.feecal-steps-col {
    position: sticky;
    top: 110px;
}

/* 左欄標題區：卡片化 + 金邊左柱設計 */
.feecal-steps-head {
    position: relative;
    padding: 22px 22px 22px 28px;
    margin-bottom: 18px;
    background: linear-gradient(135deg, rgba(43, 69, 144, 0.04), rgba(196, 147, 63, 0.03));
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 12px;
    overflow: hidden;
}
/* 左側金色裝飾柱 */
.feecal-steps-head::before {
    content: '';
    position: absolute;
    left: 0;
    top: 18px;
    bottom: 18px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--color-accent, #C4933F);
}
/* 右下角大型半透明 Cormorant 數字 */
.feecal-steps-head::after {
    content: '3';
    position: absolute;
    right: 14px;
    bottom: -10px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 82px;
    font-weight: 600;
    color: rgba(196, 147, 63, 0.12);
    line-height: 1;
    pointer-events: none;
}
.feecal-steps-en {
    display: inline-block;
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    margin-bottom: 6px;
    position: relative;
    z-index: 1;
}
.feecal-steps-title {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 10px;
    line-height: 1.3;
    position: relative;
    z-index: 1;
}
.feecal-steps-goldline {
    width: 40px;
    height: 3px;
    border-radius: 2px;
    background: var(--color-accent, #C4933F);
    position: relative;
    z-index: 1;
}

.feecal-steps-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
}
/* 步驟之間的金色連接線（裝飾線） */
.feecal-steps-list::before {
    content: '';
    position: absolute;
    left: 22px;
    top: 40px;
    bottom: 40px;
    width: 1px;
    background: repeating-linear-gradient(to bottom, rgba(196, 147, 63, 0.45) 0, rgba(196, 147, 63, 0.45) 4px, transparent 4px, transparent 10px);
    pointer-events: none;
    z-index: 0;
}
.feecal-step {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 18px;
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 10px;
    z-index: 1;
    transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s;
}
.feecal-step:hover {
    border-color: var(--color-accent, #C4933F);
    box-shadow: 0 6px 20px rgba(43, 69, 144, 0.08);
    transform: translateX(4px);
}
.feecal-step-num {
    flex-shrink: 0;
    width: 30px;
    text-align: center;
    font-family: 'Cormorant Garamond', serif;
    font-size: 28px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    line-height: 1;
}
.feecal-step-body { min-width: 0; }
.feecal-step-title {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 4px;
    line-height: 1.3;
}
.feecal-step-desc {
    font-size: 13px;
    color: var(--color-text-muted, #6B7280);
    line-height: 1.6;
    margin: 0;
}

/* 試算機主卡（右欄） */
.feecal-calc-wrap {
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(43, 69, 144, 0.08);
    overflow: hidden;
    position: relative;
}
/* 卡片頂端金色細線 */
.feecal-calc-wrap::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, #C4933F 30%, #C4933F 70%, transparent);
}

/* 主卡標題區：左側 icon 徽章 + 中央主標 + 右側 ribbon 英文 */
.feecal-calc-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px 32px;
    background: linear-gradient(135deg, #FFFFFF 0%, #FBF8F1 100%);
    border-bottom: 1px solid var(--color-border, #E5E2DC);
    color: var(--color-text, #1E1E2E);
}
/* 底部裝飾金線（replacing 舊的 center gold-line） */
.feecal-calc-header::after {
    content: '';
    position: absolute;
    left: 32px;
    right: 32px;
    bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(196, 147, 63, 0.55) 25%, rgba(196, 147, 63, 0.55) 75%, transparent);
}
/* icon 徽章 */
.feecal-calc-title {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0;
    flex: 1;
    min-width: 0;
}
.feecal-calc-title svg {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    padding: 10px;
    box-sizing: content-box;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.18), rgba(196, 147, 63, 0.06));
    color: var(--color-accent, #C4933F);
}
/* 主標題下方中文 */
.feecal-calc-title > span { line-height: 1.2; }

/* 右側 Cormorant ribbon */
.feecal-calc-ribbon {
    flex-shrink: 0;
    display: inline-block;
    padding: 6px 14px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 12px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    border: 1px solid rgba(196, 147, 63, 0.4);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.6);
    margin: 0;
}

/* 原舊的 .feecal-calc-gold-line 不再顯示（改由 ::after 底線裝飾） */
.feecal-calc-gold-line { display: none; }

.feecal-calc-body {
    padding: 32px 40px 28px;
}
.feecal-field {
    margin-bottom: 22px;
}
.feecal-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text, #1E1E2E);
    margin-bottom: 10px;
}
.feecal-label-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(196, 147, 63, 0.12);
    color: var(--color-accent, #C4933F);
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
}
.feecal-dx-field {
    width: 100%;
}

/* 結果區：金色細框 + 大數字 */
.feecal-result-row {
    position: relative;
    margin-top: 16px;
    padding: 22px 24px 16px;
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.06), rgba(196, 147, 63, 0.02));
    border: 1px solid rgba(196, 147, 63, 0.35);
    border-radius: 12px;
}
.feecal-result-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 10px;
}
.feecal-result-en {
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.15em;
}
.feecal-result-label {
    display: block;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
}
.feecal-result-field {
    margin-bottom: 10px;
}
/* DevExtreme NumberBox 放大數字字級（結果欄位） */
.feecal-result-field .dx-texteditor-input {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 22px !important;
    font-weight: 700;
    color: var(--color-primary, #2B4590) !important;
    letter-spacing: 0.02em;
}
.feecal-result-note {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--color-text-muted, #6B7280);
    margin: 0;
}
.feecal-result-note svg { color: var(--color-accent, #C4933F); flex-shrink: 0; }

/* 響應式：平板改單欄（步驟列橫向壓扁），手機再收成 stack */
@media (max-width: 991px) {
    .feecal-workspace-grid {
        grid-template-columns: 1fr;
        gap: 24px;
        max-width: 720px;
    }
    .feecal-steps-col { position: static; }
    .feecal-steps-head { text-align: center; padding-bottom: 10px; }
    .feecal-steps-goldline { margin: 0 auto; }

    /* 平板版步驟改橫向 3 欄（無連接線） */
    .feecal-steps-list {
        flex-direction: row;
        gap: 10px;
    }
    .feecal-steps-list::before { display: none; }
    .feecal-step {
        flex: 1 1 0;
        min-width: 0;
    }
    .feecal-step:hover { transform: translateY(-2px); }
}
@media (max-width: 767px) {
    .feecal-workspace-section { padding: 10px 0 50px; }
    .feecal-steps-list { flex-direction: column; gap: 10px; }
    .feecal-steps-title { font-size: 19px; }
    .feecal-steps-head { padding: 18px 18px 18px 24px; }
    .feecal-steps-head::after { font-size: 68px; right: 10px; }

    .feecal-calc-header {
        padding: 20px 22px;
        flex-wrap: wrap;
        gap: 10px;
    }
    .feecal-calc-header::after { left: 22px; right: 22px; }
    .feecal-calc-title { font-size: 20px; gap: 10px; }
    .feecal-calc-title svg { padding: 8px; width: 20px; height: 20px; }
    .feecal-calc-ribbon { font-size: 11px; padding: 4px 10px; letter-spacing: 0.18em; }
    .feecal-calc-body { padding: 24px 22px; }
    .feecal-result-field .dx-texteditor-input { font-size: 19px !important; }
}

/* ============================================================
   case-member.php  請求人基本資料
   ============================================================ */
.casemember-section {
    padding: 56px 0 80px;
    background: var(--color-bg-alt, #F0F4F8);
}
.casemember-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background: #EFF6FF;
    border: 1px solid #BFDBFE;
    border-radius: 8px;
    padding: 14px 18px;
    margin-bottom: 20px;
    font-size: 0.9rem;
    color: var(--color-secondary, #0077B6);
}
.casemember-notice i { margin-top: 2px; flex-shrink: 0; }
.casemember-action-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 28px;
}
.btn-casemember-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    background: var(--color-primary, #2B4590);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s, transform 0.2s;
}
.btn-casemember-action:hover { background: var(--color-secondary, #0077B6); color: #fff; transform: translateY(-2px); }
.casemember-form-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(43,69,144,0.08);
    overflow: hidden;
}
.casemember-form-header {
    background: var(--color-primary, #2B4590);
    color: #fff;
    padding: 32px 40px 28px;
    text-align: center;
}
.casemember-form-icon {
    font-size: 2.4rem;
    opacity: 0.9;
    margin-bottom: 12px;
    display: block;
}
.casemember-form-title {
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 8px;
}
.casemember-form-desc {
    font-size: 0.9rem;
    opacity: 0.85;
    margin: 0;
    line-height: 1.7;
}
.casemember-group-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    background: var(--color-bg-alt, #F0F4F8);
    padding: 10px 40px;
    margin: 0 0 2px;
    border-top: 1px solid var(--color-border, #E2E8F0);
}
.casemember-field {
    padding: 14px 40px;
    border-bottom: 1px solid var(--color-border, #E2E8F0);
}
.casemember-label {
    display: block;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--color-text, #1E293B);
    margin-bottom: 8px;
}
.casemember-required {
    color: #E53E3E;
    margin-right: 3px;
}
.casemember-dx-field { width: 100%; }
.casemember-date-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.casemember-date-row .dSelect { flex: 1; min-width: 80px; }
.casemember-date-sep {
    font-size: 0.9rem;
    color: var(--color-text-muted, #64748B);
    flex-shrink: 0;
}
.casemember-validation-summary { margin-bottom: 12px; }
.casemember-submit-row {
    padding: 24px 40px 8px;
}
.casemember-submit-btn { width: 100%; }
.casemember-finish-row {
    padding: 16px 40px 32px;
    text-align: center;
}
.btn-casemember-finish {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: var(--color-success, #10B981);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}
.btn-casemember-finish:hover { background: #059669; transform: translateY(-2px); }
.casemember-finish-note {
    font-size: 0.8rem;
    opacity: 0.85;
}
.casemember-member-list { min-height: 60px; }
.casemember-member-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border, #E2E8F0);
}
.casemember-member-item:last-child { border-bottom: none; }
.casemember-member-name { font-weight: 600; color: var(--color-text, #1E293B); }
.casemember-member-idno { font-size: 0.85rem; color: var(--color-text-muted, #64748B); }
.casemember-share-block {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 20px;
}
.casemember-share-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 8px;
    font-size: 0.9rem;
    text-decoration: none;
    transition: opacity 0.2s;
}
.casemember-share-btn:hover { opacity: 0.85; }
.casemember-share-line img { height: 36px; display: block; }
.casemember-qrcode-block { text-align: center; }
.casemember-qrcode-img {
    width: 160px;
    height: 160px;
    border-radius: 8px;
    border: 2px solid var(--color-border, #E2E8F0);
    display: block;
    margin: 0 auto 10px;
}
.casemember-qrcode-hint {
    font-size: 0.82rem;
    color: var(--color-text-muted, #64748B);
    margin: 0;
}
@media (max-width: 991px) {
    .casemember-group-label,
    .casemember-field { padding-left: 24px; padding-right: 24px; }
    .casemember-form-header { padding: 24px 24px 20px; }
    .casemember-submit-row { padding: 20px 24px 8px; }
    .casemember-finish-row { padding: 12px 24px 28px; }
}
@media (max-width: 767px) {
    .casemember-section { padding: 36px 0 60px; }
    .casemember-action-bar { flex-direction: column; }
    .btn-casemember-action { justify-content: center; }
    .casemember-date-row { gap: 4px; }
    .btn-casemember-finish { width: 100%; justify-content: center; }
}


/* ================================================================
   PHASE 10 — links.php（相關連結）
   ================================================================ */
.links-section { background: var(--color-bg, #fff); }

/* 分組容器（卡片化） */
.links-group {
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 12px;
    padding: 24px 28px;
    margin-bottom: 24px;
    box-shadow: 0 2px 12px rgba(43, 69, 144, 0.04);
}

/* 分組標題 */
.links-group-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    padding-bottom: 14px;
    border-bottom: 1px solid var(--color-border, #E5E2DC);
    margin: 0 0 10px;
}
.links-group-icon {
    display: inline-flex;
    color: var(--color-accent, #C4933F);
    flex-shrink: 0;
}
.links-group-count {
    margin-left: auto;
    padding: 3px 10px;
    background: var(--color-bg-alt, #F8F7F4);
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-muted, #6B7280);
    letter-spacing: 0.03em;
}

/* 清單 */
.links-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.links-item {
    border-bottom: 1px dashed var(--color-border, #E5E2DC);
}
.links-item:last-child { border-bottom: none; }

/* 連結項目（列） */
.links-anchor {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 6px;
    color: var(--color-text, #1E1E2E);
    text-decoration: none;
    transition: background 0.2s, padding-left 0.25s;
    border-radius: 6px;
}
.links-anchor:hover {
    background: linear-gradient(90deg, rgba(196, 147, 63, 0.05), rgba(196, 147, 63, 0));
    padding-left: 12px;
    text-decoration: none;
}

/* 項目文字區（名稱 + 域名） */
.links-anchor-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.links-anchor-name {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-text, #1E1E2E);
    line-height: 1.4;
    transition: color 0.2s;
}
.links-anchor:hover .links-anchor-name {
    color: var(--color-primary, #2B4590);
}
.links-anchor-host {
    font-family: 'Montserrat', 'Noto Sans TC', sans-serif;
    font-size: 12px;
    color: var(--color-text-muted, #6B7280);
    letter-spacing: 0.02em;
    word-break: break-all;
}

/* 外部連結 icon */
.links-anchor-external {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--color-bg-alt, #F8F7F4);
    color: var(--color-text-muted, #9CA3AF);
    transition: background 0.25s, color 0.25s, transform 0.25s;
}
.links-anchor:hover .links-anchor-external {
    background: var(--color-accent, #C4933F);
    color: #fff;
    transform: translate(2px, -2px);
}

/* 響應式 */
@media (max-width: 575px) {
    .links-group { padding: 20px 18px; }
    .links-group-title { font-size: 16px; flex-wrap: wrap; }
    .links-group-count { margin-left: 0; }
    .links-anchor { gap: 10px; padding: 14px 4px; }
    .links-anchor:hover { padding-left: 4px; }
    .links-anchor-external { width: 30px; height: 30px; }
}

/* ================================================================
   PHASE 10 — filedownload.php（檔案下載）
   ================================================================ */
.filedownload-section { background: var(--color-bg, #fff); }

/* 分組容器（卡片化） */
.filedownload-group {
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 12px;
	padding: 24px 28px;
	margin-bottom: 24px;
	box-shadow: 0 2px 12px rgba(43, 69, 144, 0.04);
}

/* 分組標題 */
.filedownload-group-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: var(--color-primary, #2B4590);
	padding-bottom: 14px;
	border-bottom: 1px solid var(--color-border, #E5E2DC);
	margin: 0 0 8px;
}
.filedownload-group-icon {
	display: inline-flex;
	color: var(--color-accent, #C4933F);
	flex-shrink: 0;
}
.filedownload-group-count {
	margin-left: auto;
	padding: 3px 10px;
	background: var(--color-bg-alt, #F8F7F4);
	border-radius: 12px;
	font-size: 12px;
	font-weight: 500;
	color: var(--color-text-muted, #6B7280);
	letter-spacing: 0.03em;
}

/* 清單 */
.filedownload-list { list-style: none; padding: 0; margin: 0; }

/* 單筆檔案 */
.filedownload-item {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 4px;
	border-bottom: 1px dashed var(--color-border, #E5E2DC);
	transition: background 0.2s, padding 0.2s;
}
.filedownload-item:last-child { border-bottom: none; }
.filedownload-item:hover {
	background: linear-gradient(90deg, rgba(196, 147, 63, 0.05), rgba(196, 147, 63, 0));
	padding-left: 10px;
}

/* 副檔名徽章 */
.filedownload-ext-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 48px;
	padding: 4px 10px;
	border-radius: 4px;
	font-family: 'Montserrat', 'Noto Sans TC', sans-serif;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: #fff;
	flex-shrink: 0;
}
.fdi-pdf   { background: #E53E3E; }
.fdi-word  { background: #2B6CB0; }
.fdi-excel { background: #276749; }
.fdi-ppt   { background: #D97706; }
.fdi-image { background: #805AD5; }
.fdi-zip   { background: #4A5568; }
.fdi-other { background: #718096; }

/* 檔名 */
.filedownload-item-name {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 15px;
	color: var(--color-text, #1E1E2E);
}

/* 下載按鈕 */
.btn-filedownload {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--color-primary, #2B4590);
	color: #fff;
	padding: 8px 16px;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	flex-shrink: 0;
	transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
}
.btn-filedownload:hover {
	background: var(--color-secondary, #0077B6);
	color: #fff;
	text-decoration: none;
	transform: translateY(-1px);
	box-shadow: 0 4px 10px rgba(43, 69, 144, 0.2);
}

/* 找不到文件？CTA 區 */
.filedownload-cta-block {
	margin-top: 40px;
	background: var(--color-bg-alt, #F8F7F4);
	border: 1px solid var(--color-border, #E5E2DC);
	border-radius: 12px;
	padding: 32px 28px;
	text-align: center;
}
.filedownload-cta-text {
	color: var(--color-text-muted, #6B7280);
	font-size: 15px;
	margin: 0 0 18px;
}
.btn-filedownload-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--color-primary, #2B4590);
	color: #fff;
	padding: 12px 28px;
	border-radius: 24px;
	text-decoration: none;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: 600;
	font-size: 15px;
	transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
}
.btn-filedownload-cta:hover {
	background: var(--color-accent, #C4933F);
	color: #fff;
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(196, 147, 63, 0.3);
}

/* 響應式：手機版 */
@media (max-width: 575px) {
	.filedownload-group { padding: 20px 18px; }
	.filedownload-group-title { font-size: 16px; flex-wrap: wrap; }
	.filedownload-group-count { margin-left: 0; }
	.filedownload-item { flex-wrap: wrap; gap: 10px; padding: 14px 4px; }
	.filedownload-item-name { width: 100%; order: 3; white-space: normal; }
	.filedownload-item:hover { padding-left: 4px; }
	.btn-filedownload { margin-left: auto; }
	.filedownload-cta-block { padding: 24px 18px; }
}

/* ═══════════════════════════════════════════════════════
   rent-withholding-calc.php ── 租金扣繳計算機
   ═══════════════════════════════════════════════════════ */

/* Banner 右側裝飾：折線圖 icon（此頁獨有） */
.rwcalc-banner .container { position: relative; }
.rwcalc-banner-deco {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 150px;
    height: 150px;
    color: rgba(255, 255, 255, 0.12);
    pointer-events: none;
    display: inline-flex;
}
.rwcalc-banner-deco svg { width: 100%; height: 100%; }
@media (max-width: 767px) {
    .rwcalc-banner-deco { width: 96px; height: 96px; right: 16px; opacity: 0.7; }
}


/* ── 試算工作區（左步驟 + 右主卡） ── */
.rwcalc-workspace-section {
    padding: 20px 0 70px;
    background: var(--color-bg-alt, #F8F7F4);
}
.rwcalc-workspace-grid {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 32px;
    align-items: start;
}

/* 左欄 sticky */
.rwcalc-steps-col {
    position: sticky;
    top: 110px;
}
.rwcalc-steps-head {
    position: relative;
    padding: 22px 22px 22px 28px;
    margin-bottom: 18px;
    background: linear-gradient(135deg, rgba(43, 69, 144, 0.04), rgba(196, 147, 63, 0.03));
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 12px;
    overflow: hidden;
}
.rwcalc-steps-head::before {
    content: '';
    position: absolute;
    left: 0;
    top: 18px;
    bottom: 18px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--color-accent, #C4933F);
}
.rwcalc-steps-head::after {
    content: '4';
    position: absolute;
    right: 14px;
    bottom: -10px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 82px;
    font-weight: 600;
    color: rgba(196, 147, 63, 0.12);
    line-height: 1;
    pointer-events: none;
}
.rwcalc-steps-en {
    display: inline-block;
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    margin-bottom: 6px;
    position: relative;
    z-index: 1;
}
.rwcalc-steps-title {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 10px;
    line-height: 1.3;
    position: relative;
    z-index: 1;
}
.rwcalc-steps-goldline {
    width: 40px;
    height: 3px;
    border-radius: 2px;
    background: var(--color-accent, #C4933F);
    position: relative;
    z-index: 1;
}

/* 左欄步驟列表（虛線金色連接線） */
.rwcalc-steps-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: relative;
}
.rwcalc-steps-list::before {
    content: '';
    position: absolute;
    left: 22px;
    top: 36px;
    bottom: 36px;
    width: 1px;
    background: repeating-linear-gradient(to bottom, rgba(196, 147, 63, 0.45) 0, rgba(196, 147, 63, 0.45) 4px, transparent 4px, transparent 10px);
    pointer-events: none;
    z-index: 0;
}
.rwcalc-step {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 16px;
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 10px;
    z-index: 1;
    transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s;
}
.rwcalc-step:hover {
    border-color: var(--color-accent, #C4933F);
    box-shadow: 0 6px 20px rgba(43, 69, 144, 0.08);
    transform: translateX(4px);
}
.rwcalc-step--highlight {
    border-color: rgba(196, 147, 63, 0.45);
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.06), rgba(196, 147, 63, 0.02));
}
.rwcalc-step-num {
    flex-shrink: 0;
    width: 30px;
    text-align: center;
    font-family: 'Cormorant Garamond', serif;
    font-size: 26px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    line-height: 1;
}
.rwcalc-step-body { min-width: 0; }
.rwcalc-step-title {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 4px;
    line-height: 1.3;
}
.rwcalc-step-desc {
    font-size: 12.5px;
    color: var(--color-text-muted, #6B7280);
    line-height: 1.55;
    margin: 0;
}

/* 主卡 wrap */
.rwcalc-calc-wrap {
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(43, 69, 144, 0.08);
    overflow: hidden;
    position: relative;
}
.rwcalc-calc-wrap::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, #C4933F 30%, #C4933F 70%, transparent);
}

/* 主卡標題列 */
.rwcalc-calc-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px 32px;
    background: linear-gradient(135deg, #FFFFFF 0%, #FBF8F1 100%);
    border-bottom: 1px solid var(--color-border, #E5E2DC);
    color: var(--color-text, #1E1E2E);
}
.rwcalc-calc-header::after {
    content: '';
    position: absolute;
    left: 32px;
    right: 32px;
    bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(196, 147, 63, 0.55) 25%, rgba(196, 147, 63, 0.55) 75%, transparent);
}
.rwcalc-calc-title {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0;
    flex: 1;
    min-width: 0;
}
.rwcalc-calc-title svg {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    padding: 10px;
    box-sizing: content-box;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.18), rgba(196, 147, 63, 0.06));
    color: var(--color-accent, #C4933F);
}
.rwcalc-calc-title > span { line-height: 1.2; }
.rwcalc-calc-ribbon {
    flex-shrink: 0;
    display: inline-block;
    padding: 6px 14px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 12px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    border: 1px solid rgba(196, 147, 63, 0.4);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.6);
    margin: 0;
}

/* 主卡 body */
.rwcalc-calc-body { padding: 28px 32px; }

/* 欄位群組 */
.rwcalc-field-group { margin-bottom: 18px; }
.rwcalc-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text, #1E1E2E);
    margin-bottom: 10px;
    flex-wrap: wrap;
}
.rwcalc-label-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(196, 147, 63, 0.12);
    color: var(--color-accent, #C4933F);
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
}
.rwcalc-form-unit {
    font-size: 11.5px;
    font-weight: 500;
    color: var(--color-text-muted, #6B7280);
    background: var(--color-bg-alt, #F8F7F4);
    border-radius: 4px;
    padding: 2px 7px;
}

/* 租金輸入 */
.rwcalc-rent-row {
    display: flex;
    align-items: center;
    max-width: 320px;
    margin-left: 30px;
}
.rwcalc-rent-row .input-group {
    display: flex;
    width: 100%;
}
.rwcalc-input-prefix {
    background: var(--color-bg-alt, #F8F7F4);
    border: 1px solid var(--color-border, #E5E2DC);
    border-right: none;
    padding: 10px 14px;
    border-radius: 8px 0 0 8px;
    font-size: 16px;
    color: var(--color-accent, #C4933F);
    font-weight: 700;
    font-family: 'Cormorant Garamond', serif;
}
.rwcalc-input {
    flex: 1;
    min-width: 0;
    border: 1px solid var(--color-border, #E5E2DC);
    padding: 10px 14px;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text, #1E1E2E);
    border-radius: 0 8px 8px 0;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.rwcalc-input:focus {
    border-color: var(--color-accent, #C4933F);
    box-shadow: 0 0 0 3px rgba(196, 147, 63, 0.12);
}

/* 含稅/未含稅切換 */
.rwcalc-tax-mode-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 12px 0 0 30px;
}
.rwcalc-tax-mode-option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 20px;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--color-text-muted, #6B7280);
    cursor: pointer;
    transition: all 0.22s;
    margin: 0;
}
.rwcalc-tax-mode-option:hover {
    border-color: var(--color-accent, #C4933F);
    color: var(--color-primary, #2B4590);
}
.rwcalc-tax-mode-option input[type="radio"] {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    border: 2px solid var(--color-border, #E5E2DC);
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    margin: 0;
}
.rwcalc-tax-mode-option input[type="radio"]:checked {
    border-color: var(--color-accent, #C4933F);
}
.rwcalc-tax-mode-option input[type="radio"]:checked::after {
    content: '';
    position: absolute;
    top: 2px; left: 2px;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--color-accent, #C4933F);
}
.rwcalc-tax-mode-option:has(input:checked) {
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.08), rgba(196, 147, 63, 0.02));
    border-color: var(--color-accent, #C4933F);
    color: var(--color-primary, #2B4590);
    font-weight: 600;
}

/* 分隔線 */
.rwcalc-form-divider {
    border: none;
    border-top: 1px dashed var(--color-border, #E5E2DC);
    margin: 22px 0;
}

/* 房東列表容器 */
.rwcalc-landlord-container {
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 10px;
    overflow: hidden;
    margin-left: 30px;
}
.rwcalc-landlord-header {
    display: grid;
    grid-template-columns: 0.7fr 1.4fr 1fr auto;
    gap: 12px;
    background: linear-gradient(135deg, rgba(43, 69, 144, 0.04), rgba(196, 147, 63, 0.03));
    padding: 10px 16px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-text-muted, #6B7280);
    border-bottom: 1px solid var(--color-border, #E5E2DC);
    letter-spacing: 0.04em;
}
.rwcalc-landlord-row {
    display: grid;
    grid-template-columns: 0.7fr 1.4fr 1fr auto;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--color-border, #E5E2DC);
    align-items: flex-start;
    background: var(--color-bg, #fff);
    transition: background 0.2s;
}
.rwcalc-landlord-row:hover { background: rgba(196, 147, 63, 0.02); }
.rwcalc-landlord-row:last-of-type { border-bottom: none; }
.rwcalc-landlord-name {
    display: flex;
    align-items: center;
    padding-top: 6px;
}
.rwcalc-landlord-name .nameLabel {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 12px;
    background: rgba(43, 69, 144, 0.08);
    color: var(--color-primary, #2B4590);
    font-size: 12.5px;
    font-weight: 700;
}
.rwcalc-landlord-identity .nationalitySelect {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 8px;
    font-size: 14px;
    color: var(--color-text, #1E1E2E);
    outline: none;
    background: var(--color-bg, #fff);
    transition: border-color 0.2s;
    cursor: pointer;
}
.rwcalc-landlord-identity .nationalitySelect:focus {
    border-color: var(--color-accent, #C4933F);
    box-shadow: 0 0 0 3px rgba(196, 147, 63, 0.1);
}
.rwcalc-landlord-equity .input-group {
    display: flex;
}
.rwcalc-landlord-equity .equityNum {
    flex: 1;
    min-width: 0;
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--color-border, #E5E2DC);
    border-right: none;
    border-radius: 8px 0 0 8px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.2s;
    text-align: right;
}
.rwcalc-landlord-equity .equityNum:focus {
    border-color: var(--color-accent, #C4933F);
    box-shadow: 0 0 0 3px rgba(196, 147, 63, 0.1);
}
.rwcalc-landlord-equity .input-group-text {
    padding: 8px 12px;
    border: 1px solid var(--color-border, #E5E2DC);
    border-left: none;
    border-radius: 0 8px 8px 0;
    background: var(--color-bg-alt, #F8F7F4);
    font-size: 13px;
    color: var(--color-text-muted, #6B7280);
    font-weight: 600;
}
.rwcalc-landlord-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 4px;
}

/* 外籍勾選區 */
.rwcalc-foreign-checks {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 10px;
}
.rwcalc-check-opt {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 12.5px;
    color: var(--color-text, #1E1E2E);
    cursor: pointer;
    margin: 0;
    transition: background 0.2s;
}
.rwcalc-check-opt:hover { background: rgba(196, 147, 63, 0.05); }
.rwcalc-check-opt input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    border: 1.5px solid var(--color-border, #E5E2DC);
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: all 0.2s;
    margin: 0;
}
.rwcalc-check-opt input[type="checkbox"]:checked {
    background: var(--color-accent, #C4933F);
    border-color: var(--color-accent, #C4933F);
}
.rwcalc-check-opt input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    top: 1px; left: 4px;
    width: 4px; height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.rwcalc-field-label {
    font-size: 12.5px;
    color: var(--color-text-muted, #6B7280);
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

/* 新增 / 刪除按鈕 */
.rwcalc-landlord-footer {
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(43, 69, 144, 0.02), rgba(196, 147, 63, 0.02));
}
.btn-rwcalc-add-landlord {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: 1px dashed var(--color-accent, #C4933F);
    color: var(--color-accent, #C4933F);
    padding: 8px 18px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}
.btn-rwcalc-add-landlord:hover {
    background: var(--color-accent, #C4933F);
    color: #fff;
    border-style: solid;
}
.btn-rwcalc-remove {
    background: transparent;
    border: 1px solid #E5E2DC;
    color: #9CA3AF;
    padding: 5px 10px;
    border-radius: 20px;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: all 0.2s;
}
.btn-rwcalc-remove:hover {
    background: #FEF2F2;
    border-color: #E53E3E;
    color: #E53E3E;
}

/* 結果區（金框 + 房東卡列表） */
.rwcalc-result-row {
    position: relative;
    margin-top: 16px;
    padding: 22px 24px 16px;
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.08), rgba(196, 147, 63, 0.02));
    border: 1px solid rgba(196, 147, 63, 0.4);
    border-radius: 12px;
}
.rwcalc-result-head {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 14px;
}
.rwcalc-result-en {
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.15em;
}
.rwcalc-result-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
}
.rwcalc-result-label svg { color: var(--color-accent, #C4933F); flex-shrink: 0; }
.rwcalc-result-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.rwcalc-result-item {
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 10px;
    padding: 16px 18px;
}
.rwcalc-result-person {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 12px;
    background: rgba(43, 69, 144, 0.08);
    color: var(--color-primary, #2B4590);
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 10px;
}
.rwcalc-result-detail { list-style: none; padding: 0; margin: 0; }
.rwcalc-result-detail li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0;
    font-size: 13.5px;
    border-bottom: 1px dashed var(--color-border, #E5E2DC);
    gap: 14px;
}
.rwcalc-result-detail li:last-child { border-bottom: none; }
.rwcalc-result-detail label {
    color: var(--color-text-muted, #6B7280);
    font-weight: 500;
    margin: 0;
    flex: 1;
    min-width: 0;
}
.rwcalc-result-detail > li > div {
    font-family: 'Noto Sans TC', sans-serif;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    font-size: 14.5px;
    flex-shrink: 0;
}
.rwcalc-result-note {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--color-text-muted, #6B7280);
    margin: 14px 0 0;
}
.rwcalc-result-note svg { color: var(--color-accent, #C4933F); flex-shrink: 0; }


/* ── 計算說明卡 ── */
.rwcalc-note-section { padding: 20px 0 70px; }

.rwcalc-note-head {
    text-align: center;
    margin-bottom: 28px;
}
.rwcalc-note-en {
    display: inline-block;
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-accent, #C4933F);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    margin-bottom: 8px;
}
.rwcalc-note-title {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: var(--color-primary, #2B4590);
    margin: 0 0 12px;
    line-height: 1.3;
}
.rwcalc-note-goldline {
    width: 44px;
    height: 3px;
    margin: 0 auto 14px;
    border-radius: 2px;
    background: var(--color-accent, #C4933F);
}
.rwcalc-note-desc {
    font-size: 14.5px;
    color: var(--color-text-muted, #6B7280);
    margin: 0;
}
.rwcalc-note-card {
    background: var(--color-bg, #fff);
    border: 1px solid var(--color-border, #E5E2DC);
    border-radius: 16px;
    padding: 28px 32px 22px;
    box-shadow: 0 8px 28px rgba(43, 69, 144, 0.06);
    position: relative;
    overflow: hidden;
}
.rwcalc-note-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, #C4933F 30%, #C4933F 70%, transparent);
}
.rwcalc-note-list {
    list-style: none;
    padding: 0;
    margin: 0 0 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.rwcalc-note-list li {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px;
    font-size: 14.5px;
    color: var(--color-text, #1E1E2E);
    line-height: 1.7;
}
.rwcalc-note-list strong {
    color: var(--color-accent, #C4933F);
    font-weight: 700;
}
.rwcalc-note-tag {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 12px;
    font-size: 12.5px;
    font-weight: 600;
    font-family: 'Noto Sans TC', sans-serif;
    flex-shrink: 0;
}
.rwcalc-note-tag--blue   { background: rgba(43, 69, 144, 0.1);  color: #2B4590; }
.rwcalc-note-tag--orange { background: rgba(230, 104, 60, 0.12); color: #C2410C; }
.rwcalc-note-tag--green  { background: rgba(22, 163, 74, 0.12); color: #15803D; }
.rwcalc-note-tag--gold   { background: rgba(196, 147, 63, 0.14); color: #B08437; }
.rwcalc-note-disclaimer {
    font-size: 13px;
    color: var(--color-text-muted, #6B7280);
    border-top: 1px dashed var(--color-border, #E5E2DC);
    padding-top: 14px;
    margin: 0;
    line-height: 1.7;
}


/* ── RWD ── */
@media (max-width: 991px) {
    .rwcalc-workspace-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .rwcalc-steps-col { position: static; }
    .rwcalc-steps-head { text-align: center; padding: 20px 22px; }
    .rwcalc-steps-head::before { display: none; }
    .rwcalc-steps-head::after { font-size: 68px; right: 10px; }
    .rwcalc-steps-goldline { margin: 0 auto; }

    .rwcalc-steps-list {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
    }
    .rwcalc-steps-list::before { display: none; }
    .rwcalc-step {
        flex: 1 1 calc(50% - 10px);
        min-width: 0;
    }
    .rwcalc-step:hover { transform: translateY(-2px); }
}
@media (max-width: 767px) {
    .rwcalc-workspace-section { padding: 10px 0 50px; }
    .rwcalc-steps-list { flex-direction: column; }
    .rwcalc-step { flex: 1 1 auto; }
    .rwcalc-steps-title { font-size: 19px; }

    .rwcalc-calc-header {
        padding: 20px 22px;
        flex-wrap: wrap;
        gap: 10px;
    }
    .rwcalc-calc-header::after { left: 22px; right: 22px; }
    .rwcalc-calc-title { font-size: 20px; gap: 10px; }
    .rwcalc-calc-title svg { padding: 8px; width: 20px; height: 20px; }
    .rwcalc-calc-ribbon { font-size: 11px; padding: 4px 10px; letter-spacing: 0.18em; }
    .rwcalc-calc-body { padding: 22px 20px; }

    .rwcalc-rent-row,
    .rwcalc-tax-mode-row,
    .rwcalc-landlord-container { margin-left: 0; }

    /* 房東列改為堆疊 */
    .rwcalc-landlord-header { display: none !important; }
    .rwcalc-landlord-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .rwcalc-landlord-action { justify-content: flex-start; }

    .rwcalc-result-row { padding: 18px 18px 14px; }
    .rwcalc-note-title { font-size: 22px; }
    .rwcalc-note-card { padding: 20px 18px 16px; }
    .rwcalc-note-list li { font-size: 14px; }
}

/* ================================================================
   PHASE 10 — albums.php（活動相簿列表）
   ================================================================ */
.albums-section { padding: 56px 0 80px; }
.albums-filter-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    padding: 12px 16px;
    background: #EFF6FF;
    border-radius: 8px;
    font-size: 0.9rem;
}
.albums-filter-label { font-weight: 600; color: var(--color-primary, #2B4590); }
.albums-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--color-primary, #2B4590);
    color: #fff;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.83rem;
    text-decoration: none;
    transition: background 0.2s;
}
.albums-filter-tag:hover { background: #E53E3E; color: #fff; }
.albums-grid { margin-bottom: 32px; }
.albums-card-col { margin-bottom: 24px; }
.albums-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--color-border, #E5E2DC);
    box-shadow: 0 4px 20px rgba(43,69,144,0.06);
    transition: transform 0.2s, box-shadow 0.2s;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.albums-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(43,69,144,0.14);
}
.albums-card-img-link {
    display: block;
    overflow: hidden;
    aspect-ratio: 4/3;
    background: var(--color-bg-alt, #F8F7F4);
}
.albums-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}
.albums-card:hover .albums-card-img { transform: scale(1.04); }
.albums-card-body {
    padding: 16px 16px 18px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.albums-card-title-link { text-decoration: none; }
.albums-card-title {
    font-size: 0.97rem;
    font-weight: 700;
    color: var(--color-text, #1E1E2E);
    margin: 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s;
}
.albums-card-title-link:hover .albums-card-title { color: var(--color-active, #0077B6); }
.albums-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-top: auto;
}
.albums-card-meta-item {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.82rem;
    color: var(--color-text-muted, #6B7280);
}
.albums-empty {
    padding: 60px 0;
    text-align: center;
    color: var(--color-text-muted, #6B7280);
}
.albums-pagination-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}
.albums-total-count { font-size: 0.88rem; color: var(--color-text-muted, #6B7280); margin: 0; }
@media (max-width: 575px) {
    .albums-pagination-bar { justify-content: center; }
    .albums-total-count { width: 100%; text-align: center; }
}

/* ================================================================
   PHASE 10 — album-detail.php（活動相簿詳細）
   ================================================================ */
.album-detail-section { padding: 56px 0 80px; }
.album-detail-banner-title {
    font-size: clamp(1.3rem, 3vw, 1.8rem);
    line-height: 1.4;
    white-space: normal;
    word-break: break-word;
}
.album-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--color-border, #E5E2DC);
}
.album-detail-meta-date,
.album-detail-meta-author,
.album-detail-meta-cat,
.album-detail-meta-count {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.88rem;
    color: var(--color-text-muted, #6B7280);
}
.album-detail-note {
    font-size: 0.95rem;
    line-height: 1.8;
    color: var(--color-text, #1E1E2E);
    margin-bottom: 24px;
    padding: 16px 18px;
    background: var(--color-bg-alt, #F8F7F4);
    border-radius: 8px;
}
.album-detail-photos-grid { margin-bottom: 24px; }
.album-detail-photo-col { margin-bottom: 14px; }
.album-detail-photo-link {
    display: block;
    overflow: hidden;
    border-radius: 8px;
    aspect-ratio: 1;
    background: var(--color-bg-alt, #F8F7F4);
    border: 1px solid var(--color-border, #E5E2DC);
}
.album-detail-photo-thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s, opacity 0.2s;
}
.album-detail-photo-link:hover .album-detail-photo-thumb {
    transform: scale(1.06);
    opacity: 0.9;
}
.album-detail-empty {
    padding: 60px 0;
    text-align: center;
    color: var(--color-text-muted, #6B7280);
}
.album-detail-back-row { margin-top: 32px; }
.btn-album-back {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: transparent;
    border: 1px solid var(--color-primary, #2B4590);
    color: var(--color-primary, #2B4590);
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.btn-album-back:hover {
    background: var(--color-primary, #2B4590);
    color: #fff;
}
.sidebar-recent-item--current .sidebar-recent-thumb { opacity: 0.6; pointer-events: none; }
.sidebar-recent-item--current .sidebar-recent-title { color: var(--color-active, #0077B6); font-weight: 700; pointer-events: none; }

/* ================================================================
   PHASE 10 — albumcloud.php（雲端相簿）
   ================================================================ */
.albumcloud-section { padding: 56px 0 80px; }
.albumcloud-filter-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    padding: 12px 16px;
    background: #EFF6FF;
    border-radius: 8px;
    font-size: 0.9rem;
}
.albumcloud-filter-label { font-weight: 600; color: var(--color-primary, #2B4590); }
.albumcloud-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--color-primary, #2B4590);
    color: #fff;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.83rem;
    text-decoration: none;
    transition: background 0.2s;
}
.albumcloud-filter-tag:hover { background: #E53E3E; color: #fff; }
.albumcloud-grid { margin-bottom: 32px; }
.albumcloud-card-col { margin-bottom: 24px; }
.albumcloud-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--color-border, #E5E2DC);
    box-shadow: 0 4px 20px rgba(43,69,144,0.06);
    transition: transform 0.2s, box-shadow 0.2s;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.albumcloud-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(43,69,144,0.14);
}
.albumcloud-card-img-link {
    display: block;
    overflow: hidden;
    aspect-ratio: 4/3;
    background: var(--color-bg-alt, #F8F7F4);
    position: relative;
}
.albumcloud-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}
.albumcloud-card:hover .albumcloud-card-img { transform: scale(1.04); }
.albumcloud-card-external-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    background: rgba(0,0,0,0.55);
    color: #fff;
    border-radius: 4px;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.albumcloud-card-body {
    padding: 16px 16px 18px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.albumcloud-card-title-link { text-decoration: none; }
.albumcloud-card-title {
    font-size: 0.97rem;
    font-weight: 700;
    color: var(--color-text, #1E1E2E);
    margin: 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s;
}
.albumcloud-card-title-link:hover .albumcloud-card-title { color: var(--color-active, #0077B6); }
.albumcloud-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-top: auto;
}
.albumcloud-card-meta-item {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.82rem;
    color: var(--color-text-muted, #6B7280);
}
.albumcloud-empty {
    padding: 60px 0;
    text-align: center;
    color: var(--color-text-muted, #6B7280);
}
.albumcloud-pagination-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}
.albumcloud-total-count { font-size: 0.88rem; color: var(--color-text-muted, #6B7280); margin: 0; }
.sidebar-tagcloud {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.sidebar-tag-item {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    background: var(--color-bg-alt, #F8F7F4);
    border: 1px solid var(--color-border, #E5E2DC);
    color: var(--color-text, #1E1E2E);
    font-size: 0.83rem;
    text-decoration: none;
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.sidebar-tag-item:hover {
    background: var(--color-primary, #2B4590);
    border-color: var(--color-primary, #2B4590);
    color: #fff;
}
@media (max-width: 575px) {
    .albumcloud-pagination-bar { justify-content: center; }
    .albumcloud-total-count { width: 100%; text-align: center; }
}


/* =================================================================
 * notary.php — 公證人詳細介紹頁（2026-04-21）
 *   區塊：Banner 裝飾、Hero（左大圖 + 縮圖切換 / 右資料）
 *         專業背景三卡、執業理念三卡
 * 沿用 design system：沉穩藍 #2B4590 / 亮麗藍 #0077B6 / 精緻金 #C4933F
 * ================================================================= */

/* ---- Banner 右側裝飾 icon（呼應跨頁共用設計元件） ---- */
.notary-banner .container { position: relative; }
.notary-banner-deco {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 150px;
    height: 150px;
    color: rgba(255,255,255,0.12);
    pointer-events: none;
    z-index: 1;
}
.notary-banner-deco svg { width: 100%; height: 100%; }
@media (max-width: 767px) {
    .notary-banner-deco { width: 96px; height: 96px; right: 16px; opacity: 0.7; }
}

/* ---- Hero 兩欄版型：左大圖 + 右資料 ---- */
.notary-hero-section { padding-top: 70px; padding-bottom: 70px; }
.notary-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 56px;
    align-items: flex-start;
}
.notary-hero-photo-col {
    position: sticky;
    top: 110px;
}

/* 照片主框 */
.notary-hero-photo-frame {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 48px rgba(43, 69, 144, 0.18),
                0 4px 14px rgba(43, 69, 144, 0.08);
    background: linear-gradient(135deg, #F8F7F4 0%, #FFFFFF 100%);
    aspect-ratio: 3 / 4;
}
.notary-hero-photo-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid rgba(196, 147, 63, 0.25);
    border-radius: 16px;
    pointer-events: none;
}
.notary-hero-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    transition: opacity 0.35s ease;
}

/* 照片右下職銜徽章 */
.notary-hero-photo-badge {
    position: absolute;
    left: 20px;
    bottom: 20px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: rgba(43, 69, 144, 0.92);
    color: #fff;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    box-shadow: 0 6px 18px rgba(43, 69, 144, 0.35);
}
.notary-hero-photo-badge svg {
    color: #C4933F;
    flex-shrink: 0;
}

/* 縮圖列 */
.notary-hero-thumbs {
    margin-top: 18px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
    gap: 10px;
}
.notary-hero-thumb {
    position: relative;
    aspect-ratio: 1 / 1;
    padding: 0;
    border: 2px solid #E5E2DC;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.25s, transform 0.25s, box-shadow 0.25s;
}
.notary-hero-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.notary-hero-thumb:hover {
    border-color: #C4933F;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(196, 147, 63, 0.25);
}
.notary-hero-thumb.is-active {
    border-color: #C4933F;
    box-shadow: 0 0 0 2px rgba(196, 147, 63, 0.2);
}
.notary-hero-thumb.is-active::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 6px;
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.12), rgba(0, 119, 182, 0.06));
    pointer-events: none;
}
.notary-hero-thumb:focus-visible {
    outline: 2px solid #0077B6;
    outline-offset: 2px;
}

/* 右欄資料 */
.notary-hero-info-col {
    padding-top: 8px;
}
.notary-hero-eyebrow {
    display: inline-block;
    font-family: "Cormorant Garamond", serif;
    font-size: 14px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #C4933F;
    font-weight: 600;
    margin-bottom: 10px;
}
.notary-hero-name {
    font-family: "Noto Sans TC", sans-serif;
    font-size: 42px;
    font-weight: 700;
    color: #2B4590;
    line-height: 1.2;
    margin: 0 0 14px 0;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 12px;
}
.notary-hero-role {
    font-size: 18px;
    font-weight: 600;
    color: #0077B6;
    padding: 4px 12px;
    background: rgba(0, 119, 182, 0.08);
    border-radius: 4px;
    letter-spacing: 0.08em;
}
.notary-hero-gold-line {
    width: 44px;
    height: 3px;
    background: #C4933F;
    border-radius: 2px;
    margin: 6px 0 18px 0;
}
.notary-hero-tagline {
    font-size: 17px;
    font-weight: 600;
    color: #1E1E2E;
    line-height: 1.6;
    margin: 0 0 22px 0;
}

/* 三項核心標籤 */
.notary-hero-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 26px;
}
.notary-hero-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px 8px 10px;
    background: #F8F7F4;
    border: 1px solid #E5E2DC;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    color: #2B4590;
    transition: border-color 0.25s, transform 0.25s;
}
.notary-hero-chip:hover {
    border-color: #C4933F;
    transform: translateY(-1px);
}
.notary-hero-chip .chip-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 24px;
    padding: 0 6px;
    font-family: "Cormorant Garamond", serif;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #C4933F, #B37F32);
    border-radius: 12px;
    letter-spacing: 0;
}

/* 個人簡述 */
.notary-hero-intro {
    font-size: 15.5px;
    line-height: 1.9;
    color: #4A4A5A;
    margin-bottom: 26px;
    padding: 20px 22px;
    background: #F8F7F4;
    border-left: 3px solid #C4933F;
    border-radius: 0 8px 8px 0;
}

/* CTA 按鈕列 */
.notary-hero-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.notary-hero-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 22px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.25s ease;
    letter-spacing: 0.02em;
}
.notary-hero-cta--primary {
    background: linear-gradient(135deg, #C4933F, #B37F32);
    color: #fff;
    box-shadow: 0 8px 20px rgba(196, 147, 63, 0.28);
}
.notary-hero-cta--primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(196, 147, 63, 0.4);
    color: #fff;
}
.notary-hero-cta--ghost {
    background: transparent;
    color: #2B4590;
    border: 1.5px solid #2B4590;
}
.notary-hero-cta--ghost:hover {
    background: #2B4590;
    color: #fff;
    transform: translateY(-2px);
}

/* ---- 專業背景三卡 ---- */
.notary-resume-section {
    background: #F8F7F4;
    padding-top: 70px;
    padding-bottom: 70px;
}
.notary-gold-line-center {
    margin-left: auto;
    margin-right: auto;
}
.notary-resume-grid {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}
.notary-resume-card {
    background: #fff;
    border-radius: 14px;
    padding: 28px 26px;
    border: 1px solid #E5E2DC;
    box-shadow: 0 2px 14px rgba(43, 69, 144, 0.04);
    transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s;
    position: relative;
    overflow: hidden;
}
.notary-resume-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, #C4933F, transparent);
    opacity: 0;
    transition: opacity 0.3s;
}
.notary-resume-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(43, 69, 144, 0.1);
    border-color: rgba(196, 147, 63, 0.4);
}
.notary-resume-card:hover::before { opacity: 1; }

.notary-resume-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px dashed #E5E2DC;
}
.notary-resume-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(196, 147, 63, 0.14), rgba(0, 119, 182, 0.08));
    color: #2B4590;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.notary-resume-card-title { line-height: 1.3; }
.notary-resume-en {
    display: block;
    font-family: "Cormorant Garamond", serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #C4933F;
}
.notary-resume-card-title h3 {
    margin: 2px 0 0 0;
    font-size: 20px;
    font-weight: 700;
    color: #2B4590;
}
.notary-resume-card-body {
    font-size: 15px;
    line-height: 1.85;
    color: #4A4A5A;
}
.notary-resume-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.notary-resume-list li {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px dashed #EDEBE6;
}
.notary-resume-list li:last-child { border-bottom: none; }
.notary-resume-year {
    flex-shrink: 0;
    min-width: 54px;
    display: inline-flex;
    align-items: flex-start;
    justify-content: center;
    padding: 2px 8px;
    height: 22px;
    background: #2B4590;
    color: #fff;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    margin-top: 3px;
}
.notary-resume-body {
    flex: 1;
    color: #1E1E2E;
    font-size: 14.5px;
    line-height: 1.7;
}

/* ---- 專業證照（四圖 fancybox 網格） ---- */
.notary-cert-section {
    padding-top: 70px;
    padding-bottom: 70px;
    background: #FAFAF7;
}
.notary-cert-grid {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.notary-cert-card {
    margin: 0;
    display: flex;
    flex-direction: column;
}
.notary-cert-link {
    position: relative;
    display: block;
    overflow: hidden;
    background: #fff;
    border: 1px solid #E5E2DC;
    border-radius: 4px;
    box-shadow: 0 4px 14px rgba(43, 69, 144, 0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.notary-cert-link:hover,
.notary-cert-link:focus-visible {
    transform: translateY(-3px);
    box-shadow: 0 10px 26px rgba(43, 69, 144, 0.14);
    border-color: #C4933F;
}
.notary-cert-img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.45s ease;
}
.notary-cert-link:hover .notary-cert-img {
    transform: scale(1.03);
}
.notary-cert-zoom {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(43, 69, 144, 0.86);
    color: #fff;
    border-radius: 50%;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.notary-cert-link:hover .notary-cert-zoom,
.notary-cert-link:focus-visible .notary-cert-zoom {
    opacity: 1;
    transform: translateY(0);
}
.notary-cert-name {
    margin-top: 12px;
    text-align: center;
    font-size: 14.5px;
    line-height: 1.55;
    color: #2B4590;
    font-weight: 600;
    letter-spacing: 0.02em;
}
@media (max-width: 991px) {
    .notary-cert-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 575px) {
    .notary-cert-grid { grid-template-columns: 1fr; gap: 18px; max-width: 360px; margin-left: auto; margin-right: auto; }
}

/* ---- 執業理念三卡 ---- */
.notary-philosophy-section {
    padding-top: 70px;
    padding-bottom: 70px;
}
.notary-philosophy-grid {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    align-items: stretch;
}
.notary-philosophy-card {
    position: relative;
    background: #fff;
    border: 1px solid #E5E2DC;
    border-radius: 14px;
    padding: 30px 24px 26px;
    transition: transform 0.28s, box-shadow 0.28s, border-color 0.28s;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.notary-philosophy-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(0, 119, 182, 0.1);
    border-color: rgba(0, 119, 182, 0.35);
}
.notary-philosophy-num {
    position: absolute;
    top: 16px;
    right: 20px;
    font-family: "Cormorant Garamond", serif;
    font-size: 44px;
    font-weight: 700;
    color: rgba(196, 147, 63, 0.16);
    line-height: 1;
    letter-spacing: -0.02em;
}
.notary-philosophy-h {
    margin: 0 0 10px 0;
    font-size: 19px;
    font-weight: 700;
    color: #2B4590;
    position: relative;
    padding-left: 12px;
    line-height: 1.4;
}
.notary-philosophy-h::before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: 3px;
    height: 18px;
    background: linear-gradient(180deg, #C4933F, #0077B6);
    border-radius: 2px;
}
.notary-philosophy-card p {
    margin: 0 0 10px 0;
    font-size: 14px;
    line-height: 1.8;
    color: #4A4A5A;
}
.notary-philosophy-card p:last-child { margin-bottom: 0; }

/* 引言段（lead）：粗體、深色、稍大字級 */
.notary-philosophy-card .notary-philosophy-lead {
    font-size: 14.5px;
    font-weight: 600;
    color: #1E1E2E;
    line-height: 1.65;
    margin-bottom: 10px;
}

/* 主段中的 <strong> 使用金色強調（呼應品牌色） */
.notary-philosophy-card p strong {
    color: #B37F32;
    font-weight: 700;
}

/* =================================================================
 * RWD 斷點
 * ================================================================= */
@media (max-width: 1199px) {
    .notary-hero-grid { gap: 40px; }
    .notary-hero-name { font-size: 36px; }
}
@media (max-width: 991px) {
    .notary-hero-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .notary-hero-photo-col {
        position: static;
        max-width: 480px;
        margin: 0 auto;
    }
    .notary-resume-grid,
    .notary-philosophy-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    .notary-hero-section { padding-top: 40px; padding-bottom: 40px; }
    .notary-hero-name { font-size: 30px; }
    .notary-hero-role { font-size: 15px; }
    .notary-hero-tagline { font-size: 15.5px; }
    .notary-hero-intro { font-size: 14.5px; padding: 16px 18px; }
    .notary-resume-grid,
    .notary-philosophy-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .notary-resume-section,
    .notary-philosophy-section {
        padding-top: 48px;
        padding-bottom: 48px;
    }
    .notary-hero-thumbs { grid-template-columns: repeat(auto-fill, minmax(58px, 1fr)); gap: 8px; }
    .notary-hero-photo-badge { font-size: 12px; padding: 6px 12px; }
}
@media (max-width: 479px) {
    .notary-hero-name { font-size: 26px; }
    .notary-hero-chip { font-size: 13px; padding: 6px 12px 6px 8px; }
    .notary-hero-chip .chip-num { min-width: 24px; height: 22px; font-size: 14px; }
    .notary-hero-cta { padding: 10px 18px; font-size: 14px; }
}
/* =================================================================
 * /notary.php
 * ================================================================= */