/**
 * Typography Unified
 * 以 /article/ 文章卡片清單為全站視覺基準：
 *   card title 20px / 500 / 1.5px ls / #1a1a1a
 *   card desc  15px / 1.8 lh / #595757 / 1px ls
 *   meta/date  13px / #999
 *   tags       12px / #79895F / bg rgba(121,137,95,.08)
 *   read btn   14px / #79895F / 1px ls
 *
 * 載入次序：最後 enqueue，藉 `!important` 覆蓋其餘頁面專屬 CSS。
 * 可還原：刪除本檔 + 從 functions.php 拿掉 enqueue 即恢復原狀。
 */

:root{
	--wph-font-primary:'Noto Serif TC',serif;
	--wph-font-accent:'Crimson Text',serif;
	--wph-color-heading:#1a1a1a;
	--wph-color-body:#595757;
	--wph-color-meta:#999;
	--wph-color-accent:#79895F;
	--wph-color-accent-bg:rgba(121,137,95,.08);
	--wph-fs-h1:26px;
	--wph-fs-h2:22px;
	--wph-fs-h3:20px;
	--wph-fs-h4:18px;
	--wph-fs-h5:16px;
	--wph-fs-h6:14px;
	--wph-fs-body:16px;
	--wph-fs-small:13px;
	--wph-fs-tag:12px;
	--wph-fs-btn:14px;
	--wph-ls-heading:1.5px;
	--wph-ls-body:1px;
	--wph-lh-body:1.8;
	--wph-lh-heading:1.4;
}

/* ===== Base body & inline text ===== */
body,
body p,
body li,
body td,
body th,
body dd,
body dt,
body span:not(.line):not(.circle):not(.icon):not(.date):not(.dashicons):not(.ast-icon):not([class*="dashicons-"]):not([class^="icon-"]):not([class*=" icon-"]),
body div:not(.ast-builder-html-element){
	font-family:var(--wph-font-primary) !important;
}

/* Icon font 必須維持各自的 font-family，否則字型繼承到 body 的 Noto Serif TC 會顯示空字元 */
body .dashicons,
body [class*="dashicons-"]{
	font-family:dashicons !important;
}
body .dashicons::before,
body [class*="dashicons-"]::before{
	font-family:dashicons !important;
}

body,
.entry-content,
.entry-content p,
.entry-content li,
.entry-content td,
article p,
article li,
.ast-container,
main p,
main li{
	font-size:var(--wph-fs-body) !important;
	line-height:var(--wph-lh-body) !important;
	letter-spacing:var(--wph-ls-body) !important;
	color:var(--wph-color-body) !important;
}

/* ===== Heading scale ===== */
body h1,
body .entry-content h1,
body .entry-title,
body .page-title,
body .plan-name,
body main h1,
body .ph-center__hero-title h1,
body .ph-center__heading h1{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-h1) !important;
	font-weight:500 !important;
	letter-spacing:2px !important;
	line-height:1.3 !important;
	color:var(--wph-color-heading) !important;
}

body h2,
body .entry-content h2,
body main h2,
body .ph-center__heading h2{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-h2) !important;
	font-weight:500 !important;
	letter-spacing:2px !important;
	line-height:1.4 !important;
	color:var(--wph-color-heading) !important;
}

body h3,
body .entry-content h3,
body main h3,
body .article-list .item .cont .title,
body .checkup-plan-single-details .title,
body .checkup-plan-single-popular-add .title{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-h3) !important;
	font-weight:500 !important;
	letter-spacing:var(--wph-ls-heading) !important;
	line-height:1.5 !important;
	color:var(--wph-color-heading) !important;
}

body h4,
body .entry-content h4,
body .suitable h4,
body .ph-center__team-member-info .title,
body .checkup-plan-single-precautions .title{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-h4) !important;
	font-weight:500 !important;
	letter-spacing:var(--wph-ls-heading) !important;
	line-height:1.5 !important;
	color:var(--wph-color-heading) !important;
}

body h5,
body .entry-content h5{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-h5) !important;
	font-weight:500 !important;
	letter-spacing:var(--wph-ls-body) !important;
	line-height:1.5 !important;
	color:var(--wph-color-heading) !important;
}

body h6,
body .entry-content h6,
body .ph-center__hero-title h6,
body .ph-center__heading h6,
body .ph-center__team-member-info .name-en{
	font-family:var(--wph-font-accent) !important;
	font-size:var(--wph-fs-h6) !important;
	font-weight:600 !important;
	letter-spacing:var(--wph-ls-body) !important;
	line-height:1.5 !important;
}

/* ===== Meta / date / small text ===== */
body .meta,
body .meta *,
body .date,
body .posted-on,
body .byline,
body .breadcrumbs,
body .breadcrumbs a,
body .breadcrumbs span,
body .entry-meta,
body .entry-meta *,
body .article-list .article-info .total,
body small{
	font-size:var(--wph-fs-small) !important;
	letter-spacing:.5px !important;
	line-height:1.6 !important;
	color:var(--wph-color-meta) !important;
}

body .date,
body .entry-date{
	font-family:var(--wph-font-accent) !important;
}

/* ===== Tags / categories ===== */
body .tag,
body .category,
body .categories li,
body .tags li,
body .tag-links a,
body .cat-links a{
	font-size:var(--wph-fs-tag) !important;
	font-family:var(--wph-font-primary) !important;
	color:var(--wph-color-accent) !important;
	background:var(--wph-color-accent-bg) !important;
	padding:2px 10px !important;
	border-radius:20px !important;
	line-height:1.6 !important;
	letter-spacing:.5px !important;
}

/* ===== Buttons ===== */
body .btn,
body button,
body input[type="submit"],
body input[type="button"],
body .wp-block-button__link,
body .read-btn,
body .booking-btn,
body .ast-button,
body .ast-custom-button{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-btn) !important;
	font-weight:500 !important;
	letter-spacing:var(--wph-ls-body) !important;
	line-height:1.6 !important;
}

/* 原 accent 色按鈕：鏈結 / read btn */
body .read-btn,
body a.read-btn,
body .article-list .item .cont .read-btn{
	color:var(--wph-color-accent) !important;
}

/* ===== Navigation / menu ===== */
body #primary-menu a,
body .main-navigation a,
body .ast-builder-menu a,
body .menu-item a{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-btn) !important;
	font-weight:500 !important;
	letter-spacing:var(--wph-ls-body) !important;
}

/* ===== Table text ===== */
body table td,
body table th{
	font-family:var(--wph-font-primary) !important;
	font-size:var(--wph-fs-body) !important;
	line-height:1.6 !important;
	letter-spacing:.5px !important;
}

body table th{
	font-weight:500 !important;
	color:var(--wph-color-heading) !important;
}

/* ===== Widget / sidebar ===== */
body .widget-title,
body .widget h2{
	font-size:var(--wph-fs-h4) !important;
	font-weight:500 !important;
	letter-spacing:var(--wph-ls-heading) !important;
}

/* ===== Astra builder footer / utility ===== */
body .site-footer,
body .site-footer p,
body .ast-footer-copyright{
	font-size:var(--wph-fs-small) !important;
	line-height:1.8 !important;
	letter-spacing:.5px !important;
}

/* ===== English decorative text (hero subtitles etc.) ===== */
body .ph-center__hero-title h6,
body .ph-center__heading h6,
body .ph-center__team-member-info .name-en{
	font-family:var(--wph-font-accent) !important;
}

/* ===== Single article body override (match /article/ baseline) ===== */
body.single .entry-content,
body.single .entry-content p,
body.single .article-single .article-cont,
body.single .article-single .article-cont p{
	font-size:var(--wph-fs-body) !important;
	line-height:var(--wph-lh-body) !important;
	letter-spacing:var(--wph-ls-body) !important;
}

body.single .entry-content h1,
body.single .article-single .article-cont h1{
	font-size:var(--wph-fs-h1) !important;
}
body.single .entry-content h2,
body.single .article-single .article-cont h2{
	font-size:var(--wph-fs-h2) !important;
}
body.single .entry-content h3,
body.single .article-single .article-cont h3{
	font-size:var(--wph-fs-h3) !important;
}
body.single .entry-content h4,
body.single .article-single .article-cont h4{
	font-size:var(--wph-fs-h4) !important;
}

/* ===== Banner 鏡像底圖 — 原圖在右 50%，左 50% 放同張水平鏡像，填補灰色空白 =====
 * 以 --banner-img CSS 變數驅動；由 footer 的小 JS 從 .ph-archive-header-img img 抓 data-src/src 設定。
 * 行動版（<768px）回到原 stacking 佈局，不套鏡像。
 */
@media (min-width:768px){
	body .ph-archive-header{
		position:relative !important;
		overflow:hidden !important;
	}
	/* 鏡像：與原圖同尺寸、右緣貼原圖左緣、整張統一 30% 透明感（不做漸層），
	 * 視覺上像是原圖從右邊一路淡淡延伸過去；左溢出被 container overflow:hidden 裁切。
	 * 0.3 opacity 疊在 #F5F5F5 容器底色之上，呈現偏亮的殘影效果，與原圖左緣灰淡出色溫一致。 */
	body .ph-archive-header-img::after{
		content:"";
		position:absolute;
		top:0;bottom:0;
		right:100%;
		width:100%;
		background:var(--banner-img) center/cover no-repeat;
		transform:scaleX(-1);
		opacity:.05;
		z-index:0;
		pointer-events:none;
	}
	/* 原圖左緣漸層起點由 100% 灰改成 95% 灰，讓圖片在最左一樣有 5% 可見度，和鏡像同透明度 */
	body .ph-archive-header-img::before{
		background:linear-gradient(90deg,rgba(245,245,245,.95) 0%,rgba(245,245,245,0) 30%) !important;
	}
	body .ph-archive-header-text{
		position:relative !important;
		z-index:2 !important;
	}
	body .ph-archive-header-text h1,
	body .ph-archive-header-text h2,
	body .ph-archive-header-text h3,
	body .ph-archive-header-text h4,
	body .ph-archive-header-text p,
	body .ph-archive-header-text .ph-subtitle{
		color:#fff !important;
		text-shadow:0 2px 8px rgba(0,0,0,.9) !important;
	}
	/* 英文副標原本 opacity:.5 把白色弄灰，拉回 1 變亮白 */
	body .ph-archive-header-text .ph-subtitle{
		opacity:1 !important;
	}
}

/* ===== Banner / hero image overlay — 文字疊在背景圖上時一律白色 =====
 * 僅針對「文字直接壓在 banner/hero 圖」的模式；
 * .ph-archive-header 是左文右圖平底灰，文字並未疊在圖上，故不列入。
 */
body .ph-page-hero,
body .ph-page-hero *,
body .ph-page-hero__title,
body .ph-page-hero__subtitle,
body .ch-hero-section .cont,
body .ch-hero-section .cont *,
body .ch-hero-section .text,
body .ch-hero-section .text *,
body .index-image-carousel .cont,
body .index-image-carousel .cont *,
body .wp-block-cover:not(.has-background-dim--0) .wp-block-cover__inner-container,
body .wp-block-cover:not(.has-background-dim--0) .wp-block-cover__inner-container *,
body .page-banner,
body .page-banner *,
body .hero-banner,
body .hero-banner *,
body .site-banner,
body .site-banner *,
body [class*="-hero"][style*="background-image"],
body [class*="-hero"][style*="background-image"] *,
body [class*="-banner"][style*="background-image"] *{
	color:#fff !important;
}

body .ph-page-hero h1,
body .ph-page-hero h2,
body .ph-page-hero h3,
body .ph-page-hero h4,
body .ph-page-hero h5,
body .ph-page-hero h6,
body .ph-page-hero p,
body .ch-hero-section h1,
body .ch-hero-section h2,
body .ch-hero-section h3,
body .ch-hero-section h4,
body .ch-hero-section p,
body .index-image-carousel h1,
body .index-image-carousel h2,
body .index-image-carousel h3,
body .index-image-carousel h4,
body .index-image-carousel p,
body .wp-block-cover h1,
body .wp-block-cover h2,
body .wp-block-cover h3,
body .wp-block-cover h4,
body .wp-block-cover p{
	text-shadow:0 2px 6px rgba(0,0,0,.35) !important;
}

/* ===== Responsive: mobile reduction ===== */
@media (max-width:768px){
	body,
	body p,
	.entry-content p,
	main p{
		font-size:15px !important;
	}
	body h1{ font-size:22px !important; }
	body h2{ font-size:20px !important; }
	body h3{ font-size:18px !important; }
	body h4{ font-size:16px !important; }
}
