/*
Theme Name: Musikfestival Wien
Theme URI: https://musicvienna.com
Description: 2027 維也納國際音樂節 — Twenty Twenty-Five 子主題。以 musicvienna.com 舊站的設計語彙（品牌紅、巴洛克花飾、紅色選單鈕）為基底重新執行。
Author: Richers
Template: twentytwentyfive
Version: 0.2.0
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 7.4
Text Domain: musikfestival
*/

/* =========================================================
   0. Tokens（對應 theme.json 色票；此處給簡短別名）
   ========================================================= */
:root {
	--mf-red:   #b10b14;
	--mf-red-deep: #8c0a11;
	--mf-ink:   #3a3a3a;
	--mf-ink-strong: #262626;
	--mf-muted: #666360;   /* 紙白底上 ≥ 5.5:1，小字與斜體德文也過 AA */
	--mf-band:  #f5f9f9;
	--mf-rule:  #a8a8a8;
	--mf-rule-soft: #dcdcdc;
	--mf-gold:  #b09d7c;
	--mf-green: #33957a;
	--mf-rust:  #ce5a3a;
	--mf-footer:#eeeeee;
	--mf-white: #ffffff;

	--mf-sans:  "PingFang TC", "Noto Sans TC", "Noto Sans CJK TC", "Microsoft JhengHei", "微軟正黑體", "Heiti TC", "Helvetica Neue", Arial, sans-serif;   /* 系統字型，不下載 */
	--mf-serif: "Noto Serif TC", "Songti TC", "PMingLiU", Georgia, serif;
	--mf-latin: "Lato", "Helvetica Neue", Arial, sans-serif;

	--mf-section-y: clamp(3.5rem, 7vw, 6rem);
	--mf-header-h: 76px;
}

html { scroll-behavior: smooth; scroll-padding-top: 90px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	font-family: var(--mf-sans);
	color: var(--mf-ink);
	/* 暖白紙張：底色 + SVG 噪點紋理（不需額外圖檔） */
	background-color: #faf8f4;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .38 0 0 0 0 .30 0 0 0 0 .20 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	background-size: 260px 260px;
	font-size: 1.0625rem;
	line-height: 1.85;
	-webkit-font-smoothing: antialiased;
}
p { margin-block: 0 1.1em; }
a { color: var(--mf-red); text-underline-offset: .15em; }
a:hover { color: var(--mf-red-deep); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--mf-red); outline-offset: 3px; }
img { height: auto; max-width: 100%; }

/* 標題：襯線 + 微字距，呼應花飾 */
h1, h2, h3, h4 { font-family: var(--mf-serif); font-weight: 600; color: var(--mf-ink-strong); line-height: 1.35; letter-spacing: .04em; text-wrap: balance; }
h1 { font-size: clamp(1.9rem, 4.2vw, 2.6rem); }
h2 { font-size: clamp(1.6rem, 3.4vw, 2.1rem); }
h3 { font-size: clamp(1.15rem, 2vw, 1.3rem); margin-block: 2.2rem .8rem; }

/* =========================================================
   1. Header — 豎琴 + 兩行文字（logo 不變、城市行改 Wien—Prag—München）
   ========================================================= */
/* sticky 要套在 template-part 的外層包裝（.mf-header-wrap）：包裝高度＝header 本身時，套在內層永遠黏不住 */
.mf-header-wrap { position: sticky; top: 0; z-index: 900; }
.mf-header {
	background: rgba(250,248,244,.97);   /* 不用 backdrop-filter：它會把 fixed 的全螢幕選單困在 header 盒子裡 */
	border-bottom: 1px solid var(--mf-rule-soft);
	padding-block: 0 !important;
	transition: box-shadow .25s;
}
.mf-header-wrap.is-scrolled .mf-header { box-shadow: 0 6px 24px rgba(0,0,0,.08); }

/* header／main／footer 之間不留區塊間距 */
.wp-site-blocks > * + * { margin-block-start: 0 !important; }
.wp-site-blocks > main, .wp-block-post-content, .mf-page-body { margin-block: 0 !important; }   /* 只鎖上下：左右負外距是 alignfull 滿版所需 */
.mf-page-body { padding-block: 0 var(--mf-section-y) !important; }
.mf-page-body > .wp-block-post-content > * + * { margin-block-start: 0; }
.mf-header-inner { min-height: var(--mf-header-h); gap: 1.5rem; }

.mf-logo { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: inherit; }
.mf-logo img { width: 38px; height: auto; flex: 0 0 auto; }
.mf-logo-text { display: flex; flex-direction: column; line-height: 1.15; font-family: var(--mf-latin); font-weight: 700; letter-spacing: .01em; }
.mf-logo-title  { color: var(--mf-green); font-size: 1.12rem; }
.mf-logo-cities { color: var(--mf-rust);  font-size: .95rem; }
@media (max-width: 480px) { .mf-logo-title { font-size: .92rem; } .mf-logo-cities { font-size: .8rem; } }

/* 導覽：桌機橫排四項、行動版紅色方鈕 + 全螢幕選單（舊站識別） */
.mf-nav { font-family: var(--mf-sans); font-weight: 500; font-size: .98rem; }
.mf-nav .wp-block-navigation-item__content { color: var(--mf-ink-strong); padding: .35rem 0; border-bottom: 2px solid transparent; text-decoration: none; }
.mf-nav .wp-block-navigation-item__content:hover,
.mf-nav .current-menu-item > .wp-block-navigation-item__content { border-bottom-color: var(--mf-red); color: var(--mf-red); }
.mf-nav .wp-block-navigation__container { gap: 1.8rem; }

.mf-nav .wp-block-navigation__responsive-container-open {
	width: 60px; height: 60px; background: var(--mf-red); color: #fff; border-radius: 0;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
	margin-right: calc(-1 * var(--wp--style--root--padding-right, 1rem));
}
@media (min-width: 881px) { .mf-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: none; } }
/* 600–880px（平板直立、小視窗）上方橫排放不下一行（實測 860px 起才放得下）：沿用手機的 MENU 鈕＋全螢幕選單。
   核心在 600px 就切成橫排，選擇器要比核心多一層才蓋得過。 */
@media (min-width: 600px) and (max-width: 880px) {
	.mf-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.mf-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
.mf-nav .wp-block-navigation__responsive-container-open svg { width: 26px; height: 26px; }
.mf-nav .wp-block-navigation__responsive-container-open::after { content: "MENU"; font: 700 .58rem/1 var(--mf-latin); letter-spacing: .12em; }
/* 行動版全螢幕選單：深色底 + 金色花飾 + 襯線大字，每項附德文小標 */
.mf-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: radial-gradient(120% 80% at 50% 0%, #3a1c1e 0%, #1c1214 60%, #120c0d 100%);
	color: #fff; padding: 0 !important; overflow: auto;
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open::after {
	content: ""; position: absolute; right: -60px; bottom: -40px; width: 320px; height: 474px; opacity: .06; pointer-events: none;
	background: #e6cfa3; -webkit-mask: url(assets/harp.png) center / contain no-repeat; mask: url(assets/harp.png) center / contain no-repeat;
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: stretch; justify-content: flex-start; justify-content: safe center;
	padding: clamp(1rem, 3vh, 2rem) 1.6rem clamp(1rem, 3vh, 2rem); min-height: 100%; position: relative; z-index: 1;
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { width: 100%; max-width: 520px; margin: 0 auto; gap: 0; align-items: stretch !important; justify-content: flex-start !important; text-align: center; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container::before {
	content: "2027 年維也納國際音樂節"; display: block; text-align: center; font-family: var(--mf-serif); font-size: .95rem; letter-spacing: .12em; color: #e6cfa3;
	padding-top: 42px; margin-bottom: clamp(.7rem, 2.2vh, 1.3rem);
	background: url(assets/ornament.png) center top / 140px auto no-repeat;
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	border-top: 1px solid rgba(230,207,163,.22); width: 100%;
	align-items: center !important; justify-content: center !important;   /* 核心對靠右導覽在展開時套 flex-end 到 li */
	opacity: 0; transform: translateY(10px); animation: mf-menu-in .45s ease forwards;
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:last-child { border-bottom: 1px solid rgba(230,207,163,.22); }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(1) { animation-delay: .05s; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(2) { animation-delay: .12s; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(3) { animation-delay: .19s; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(4) { animation-delay: .26s; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(5) { animation-delay: .33s; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(6) { animation-delay: .40s; }
/* 矮螢幕（小手機＋LINE 上下工具列＋放大字級，可視高約 510–620px）：收起頂端裝飾標題、間距改用 px 下限，六項一屏看完 */
@media (max-height: 620px) {
	.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container::before { display: none; }
	.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: 6px 0 5px; }
}
/* 「回首頁」只在手機全螢幕選單出現（桌機有明顯的 Logo 可點，上方選單也不要變擠） */
.mf-nav .wp-block-navigation-item.mf-nav-home { display: none; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.mf-nav-home { display: flex; }
/* 「報名表下載」是選單裡的主要行動（客戶把首頁的報名按鈕移到選單）：紅色膠囊＋下載圖示，電腦與手機選單都凸顯 */
.mf-nav .mf-nav-anmeldung > .wp-block-navigation-item__content {
	background: var(--mf-red); color: #fff; border-bottom: 0; border-radius: 999px;
	padding: .45rem 1.1rem .45rem .95rem; font-weight: 600; box-shadow: 0 4px 12px rgba(177,11,20,.28);
	transition: background .2s, box-shadow .2s;
}
.mf-nav .mf-nav-anmeldung > .wp-block-navigation-item__content:hover,
.mf-nav .mf-nav-anmeldung.current-menu-item > .wp-block-navigation-item__content { background: var(--mf-red-deep); color: #fff; box-shadow: 0 6px 16px rgba(177,11,20,.36); }
.mf-nav .mf-nav-anmeldung .wp-block-navigation-item__label::before {
	content: ""; display: inline-block; width: 1em; height: 1em; margin-right: .38em; vertical-align: -.14em; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3v11m0 0-4.5-4.5M12 14l4.5-4.5M4 17v3h16v-3' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3v11m0 0-4.5-4.5M12 14l4.5-4.5M4 17v3h16v-3' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .mf-nav-anmeldung .wp-block-navigation-item__content {
	width: auto; margin: .15rem auto; padding: .42rem 1.9rem .38rem; border-radius: 999px;
	background: var(--mf-red); color: #fff; box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .mf-nav-anmeldung .wp-block-navigation-item__content:hover { background: var(--mf-red-deep); color: #fff; }
@media (max-height: 620px) {
	.mf-nav .wp-block-navigation__responsive-container.is-menu-open .mf-nav-anmeldung .wp-block-navigation-item__content { margin: .25rem auto; padding: .35rem 1.5rem .3rem; }
}
@keyframes mf-menu-in { to { opacity: 1; transform: none; } }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: flex; flex-direction: column; align-items: center; gap: .1rem; border: 0; width: 100%; text-align: center;
	padding: clamp(.5rem, 1.9vh, .95rem) 0 clamp(.45rem, 1.7vh, .85rem);   /* 五項要在一屏內看完（含活動照片） */
	font-family: var(--mf-serif); font-size: 1.22rem; line-height: 1.35; letter-spacing: .14em; color: #fff;
}
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after {
	font-family: var(--mf-latin); font-size: .6rem; line-height: 1.3; letter-spacing: .28em; text-transform: uppercase; color: rgba(230,207,163,.8);
}
/* 德文小標依項目類別對應（header.html 每個連結都有 mf-nav-* 類別），增刪或調換順序都不會錯位 */
.mf-nav .is-menu-open .mf-nav-home .wp-block-navigation-item__content::after { content: "Startseite"; }
.mf-nav .is-menu-open .mf-nav-termin .wp-block-navigation-item__content::after { content: "Termin"; }
.mf-nav .is-menu-open .mf-nav-orte .wp-block-navigation-item__content::after { content: "Konzertorte"; }
.mf-nav .is-menu-open .mf-nav-anmeldung .wp-block-navigation-item__content::after { content: "Anmeldung"; }
.mf-nav .is-menu-open .mf-nav-kontakt .wp-block-navigation-item__content::after { content: "Kontakt"; }
.mf-nav .is-menu-open .mf-nav-photos .wp-block-navigation-item__content::after { content: "Galerie"; }
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.mf-nav .wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content { color: #e6cfa3; }
.mf-nav .wp-block-navigation__responsive-container-close {
	top: 0 !important; right: 0 !important; width: 60px; height: 60px; background: var(--mf-red); color: #fff; border-radius: 0; z-index: 2;
	display: flex; align-items: center; justify-content: center;
}
.mf-nav .wp-block-navigation__responsive-container-close svg { width: 26px; height: 26px; }
@media (prefers-reduced-motion: reduce) { .mf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { animation: none; opacity: 1; transform: none; } }

/* =========================================================
   2. Hero — 10 張金色大廳輪播 + 疊字
   ========================================================= */
.mf-hero { position: relative; margin-top: 0 !important; }
.mf-hero-stage { background: #111; }
.wp-block-gallery.mf-hero-gallery {
	display: flex !important; flex-wrap: nowrap !important; gap: 0 !important;
	overflow-x: auto; overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory; scrollbar-width: none;
	min-height: clamp(440px, 82vh, 860px); margin-block: 0 !important;
}
@media (max-width: 600px) { .wp-block-gallery.mf-hero-gallery { min-height: clamp(420px, 72vh, 640px); } }
/* 輪播、遮罩、黑底必須是同一個盒子：清掉 WP 區塊間距塞進來的外距 */
.mf-hero-stage { position: relative; overflow: hidden; }
.mf-hero-stage > * { margin: 0 !important; }
.wp-block-gallery.mf-hero-gallery > figure.wp-block-image { display: block; line-height: 0; }
.wp-block-gallery.mf-hero-gallery::-webkit-scrollbar { display: none; }
.wp-block-gallery.mf-hero-gallery > figure.wp-block-image {
	flex: 0 0 100% !important; width: 100% !important; margin: 0 !important; scroll-snap-align: start; scroll-snap-stop: always;
}
.wp-block-gallery.mf-hero-gallery > figure.wp-block-image img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 輪播與疊字疊在同一個 grid 格：舞台高度＝max(輪播最小高, 文字高)。
   LINE 內建瀏覽器會套用手機系統字級放大文字，若用 absolute 疊字＋固定高度會被裁掉（配樂鈕消失）。 */
.mf-hero-stage { display: grid; }
.mf-hero-stage > .mf-hero-gallery, .mf-hero-stage > .mf-hero-text { grid-area: 1 / 1; }
.wp-block-gallery.mf-hero-gallery { align-self: stretch; }
.wp-block-gallery.mf-hero-gallery > figure.wp-block-image { position: relative; }
.wp-block-gallery.mf-hero-gallery > figure.wp-block-image img { position: absolute; inset: 0; }
.mf-hero-text {
	position: relative; z-index: 2; margin: 0 !important; line-height: 1.7;
	display: flex; flex-direction: column; justify-content: center; align-items: center;
	text-align: center; color: #fff; padding: clamp(1rem, 4vw, 3rem);
	padding-bottom: calc(clamp(1rem, 4vw, 3rem) + 1.6rem);   /* 讓出底部輪播圓點 */
	background: linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,.18) 45%, rgba(0,0,0,.55) 100%);
	pointer-events: none;
}
.mf-hero-text > * { pointer-events: auto; max-width: min(900px, 100%); margin: 0; overflow-wrap: anywhere; }
/* 客戶 20260914：輪播中間只放標題（2027／德文／中文主標），時間、地點、主辦單位放在輪播底部 */
.mf-hero-text > .mf-hero-title { margin-block: auto; }   /* 自動外距：在資訊列上方的空間裡置中 */
.mf-hero-text > .mf-hero-info { margin-top: 1.4rem; }
.mf-hero-title > *, .mf-hero-info > * { margin: 0; }
.mf-hero-text h1, .mf-hero-text h2, .mf-hero-text p { color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.75); }
.mf-hero-text .mf-hero-year { font-family: var(--mf-latin); font-weight: 700; font-size: clamp(2.4rem, 11vw, 4.4rem); line-height: 1; letter-spacing: .16em; padding-left: .16em; margin-bottom: .5rem; }
/* 德文與中文主標等寬：Lato 粗體大寫（字距 .06em）每 1em 字級寬 18.66em、中文主標（字距 .08em）12.96em
   → 德文字級＝中文 × 0.695，兩行用同一個 vw 比例縮放，任何寬度都等寬。中文主標是頁面 H1（SEO）。 */
.mf-hero-text .mf-hero-kicker { font-family: var(--mf-latin); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: clamp(.87rem, 4.45vw, 2.22rem); line-height: 1.3; text-wrap: balance; }
.mf-hero-text h1 { font-size: clamp(1.25rem, 6.4vw, 3.2rem); margin: .55rem 0 0; padding-bottom: .5rem; border-bottom: 1px solid rgba(255,255,255,.75); letter-spacing: .08em; line-height: 1.3; }
.mf-hero-text p { font-size: clamp(.95rem, 1.7vw, 1.2rem); line-height: 1.7; }
.mf-hero-info p { font-size: clamp(.88rem, 1.45vw, 1.08rem); line-height: 1.65; }
.mf-hero-text p.has-small-font-size { font-size: clamp(.72rem, 1.05vw, .85rem); opacity: .9; margin-top: .6rem; }

/* 2027 資訊入口卡片 */
.mf-cta { padding-block: var(--mf-section-y) !important; }
/* 核心 .wp-block-columns.is-not-stacked-on-mobile 用 !important 鎖 nowrap，選擇器權重要相同才蓋得過 */
.wp-block-columns.is-not-stacked-on-mobile.mf-cta-cols { gap: 1.1rem; flex-wrap: wrap !important; }
.wp-block-columns.is-not-stacked-on-mobile.mf-cta-cols > .wp-block-column { flex: 1 1 calc(25% - 1.1rem) !important; min-width: 0; }
/* 這裡的欄位是 content-box：padding 不算進 flex-basis，四欄會擠不下折行 → 一律 border-box */
.wp-block-column { box-sizing: border-box; }
.mf-cta-card {
	position: relative; background: #fff; border: 1px solid var(--mf-rule-soft); border-top: 3px solid var(--mf-gold);
	padding: 1.5rem 1.4rem 1.3rem; box-shadow: 0 8px 26px rgba(40,30,20,.06); transition: transform .25s, box-shadow .25s;
}
.mf-cta-card:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(40,30,20,.12); }
.mf-cta-card > * { margin: 0 !important; }
.mf-cta-kicker { font-family: var(--mf-latin); font-size: .68rem; letter-spacing: .26em; text-transform: uppercase; color: var(--mf-red); margin-bottom: .55rem !important; }
.mf-cta-title { font-size: 1.28rem; margin-bottom: .45rem !important; }
.mf-cta-line { font-size: .95rem; color: var(--mf-ink); line-height: 1.6; margin-bottom: 1rem !important; }
.mf-cta-link a { font-family: var(--mf-sans); font-weight: 500; font-size: .9rem; text-decoration: none; letter-spacing: .04em; }
.mf-cta-link a::after { content: ""; position: absolute; inset: 0; }   /* 整張卡可點 */
.mf-cta-primary { background: var(--mf-red); border-color: var(--mf-red); border-top-color: #e6cfa3; }
.mf-cta-primary .mf-cta-kicker { color: #f3c9cb; }
.mf-cta-primary .mf-cta-title, .mf-cta-primary .mf-cta-line, .mf-cta-primary .mf-cta-link a { color: #fff; }
@media (max-width: 900px) { .wp-block-columns.is-not-stacked-on-mobile.mf-cta-cols > .wp-block-column { flex-basis: calc(50% - .6rem) !important; } }
@media (max-width: 480px) { .wp-block-columns.is-not-stacked-on-mobile.mf-cta-cols > .wp-block-column { flex-basis: 100% !important; } }

.mf-bgm {
	display: inline-flex; align-items: center; gap: .5rem;
	background: rgba(255,255,255,.14); border: 1.5px solid rgba(255,255,255,.85); color: #fff;
	padding: .55rem 1.1rem; font: 600 .85rem/1 var(--mf-sans); letter-spacing: .08em; cursor: pointer; border-radius: 2px;
	transition: background .25s, color .25s;
}
.mf-bgm:hover, .mf-bgm[aria-pressed="true"] { background: #fff; color: var(--mf-ink-strong); }
/* 客戶 20260914：「開啟配樂」不壓在輪播圖上，改成浮在右下角（TOP 按鈕正上方），往下捲也按得到；只有首頁有 */
.mf-bgm.mf-bgm-float {
	position: fixed; right: 1.4rem; bottom: calc(1.4rem + 56px + .6rem); z-index: 790;
	background: rgba(28,18,20,.82); border: 1px solid rgba(230,207,163,.75); color: #fff;
	border-radius: 999px; padding: .6rem 1.05rem; font-size: .82rem; box-shadow: 0 6px 18px rgba(0,0,0,.22);
}
.mf-bgm.mf-bgm-float:hover, .mf-bgm.mf-bgm-float[aria-pressed="true"] { background: #e6cfa3; border-color: #e6cfa3; color: #1c1214; }
.mf-bgm-frame { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; overflow: hidden; }

/* YouTube 縮圖＋播放鍵（按下換成播放器）；尺寸與位置跟核心響應式嵌入的 iframe 相同 */
.wp-block-embed__wrapper .mf-yt { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: #000; cursor: pointer; overflow: hidden; }
.wp-block-embed__wrapper .mf-yt img { width: 100%; height: 100%; object-fit: cover; display: block; transition: filter .25s; }
.mf-yt-play { position: absolute; left: 50%; top: 50%; width: 68px; height: 48px; margin: -24px 0 0 -34px; border-radius: 14px; background: rgba(33,33,33,.85); transition: background .2s; }
.mf-yt-play::after { content: ""; position: absolute; left: 27px; top: 14px; border-style: solid; border-width: 10px 0 10px 17px; border-color: transparent transparent transparent #fff; }
.mf-yt:hover .mf-yt-play, .mf-yt:focus-visible .mf-yt-play { background: #f00; }
.mf-yt:hover img { filter: brightness(1.06); }
.mf-yt:focus-visible { outline: 3px solid var(--mf-gold); outline-offset: 2px; }

/* 圓點看起來 8px，可點範圍 24px（手機點擊目標下限） */
.mf-hero-dots { position: absolute; left: 0; right: 0; bottom: calc(1rem - 8px); z-index: 3; display: flex; justify-content: center; gap: 0; }
.mf-hero-dots button { position: relative; width: 24px; height: 24px; border: 0; padding: 0; background: transparent; cursor: pointer; }
.mf-hero-dots button::before { content: ""; position: absolute; left: 8px; top: 8px; width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.45); transition: transform .2s, background .2s; }
.mf-hero-dots button[aria-current="true"]::before { background: #fff; transform: scale(1.35); }

/* =========================================================
   3. 章節節奏、花飾標題、紅色小標（舊站 .sec-title / .sec-title_e）
   ========================================================= */
.wp-block-post-content > .wp-block-group,
.wp-block-post-content > section { padding-block: var(--mf-section-y); }
.wp-block-post-content > .mf-hero { padding-block: 0; }
.wp-block-post-content > section + section:not(.is-style-band):not(.mf-hero) { padding-top: 0; }

.is-style-band { background: var(--mf-band); }
.is-style-band + section { padding-top: var(--mf-section-y) !important; }

/* 照片底的 Cover 帶狀區（回顧、特別感謝）：客戶可在編輯器自行換底圖 */
.mf-cover { padding: var(--mf-section-y) 0 !important; min-height: 0 !important; }
.mf-cover + section { padding-top: var(--mf-section-y) !important; }
.mf-cover .wp-block-cover__inner-container { width: 100%; }
.mf-cover .wp-block-cover__background { opacity: 1 !important; background: linear-gradient(180deg, rgba(22,17,14,.74) 0%, rgba(22,17,14,.82) 100%) !important; }
.mf-cover h2, .mf-cover h3, .mf-cover p, .mf-cover li { color: #fff; }
.mf-cover h3 { color: #e6cfa3; }
.mf-cover .is-style-ornament::before { background-color: #d9c497; }
.mf-cover .is-style-eyebrow { color: #efb9bd; }
.mf-cover .is-style-eyebrow::before, .mf-cover .is-style-eyebrow::after { background: rgba(255,255,255,.4); }
.mf-cover ul { padding-left: 1.1rem; }
.mf-cover-credits .wp-block-cover__image-background { filter: blur(3px) saturate(.85); transform: scale(1.06); }

/* 子頁表頭：照片底 + 花飾標題 */
.mf-page-hero { padding: clamp(4rem, 8vw, 6.5rem) 0 clamp(2.8rem, 5vw, 4.2rem) !important; }
.mf-page-hero h1 { color: #fff; font-size: clamp(1.9rem, 4vw, 2.6rem); }
.mf-page-hero .wp-block-cover__image-background { object-position: center 40%; }
.mf-page-hero .wp-block-cover__background { background: linear-gradient(180deg, rgba(22,17,14,.62) 0%, rgba(22,17,14,.78) 100%) !important; }
.mf-page-hero + * { margin-top: var(--mf-section-y) !important; }
.mf-page-hero .is-style-eyebrow { margin-bottom: 0 !important; }
.mf-cover-rueckblick .wp-block-cover__image-background { object-position: center 35%; }

.is-style-ornament { text-align: center; margin-bottom: .6rem !important; }
.is-style-ornament::before {
	content: ""; display: block; width: 204px; height: 41px; margin: 0 auto 14px;
	background-color: var(--mf-gold);
	-webkit-mask: url(assets/ornament.png) center / contain no-repeat;
	        mask: url(assets/ornament.png) center / contain no-repeat;
}
.is-style-eyebrow {
	display: flex; align-items: center; justify-content: center; gap: .8rem;
	color: var(--mf-red); font-family: var(--mf-latin); font-weight: 400;
	font-size: .76rem; letter-spacing: .22em; text-transform: uppercase;
	/* 左右一定要 auto：Cover／頁面層級的容器規則與此同權重，寫 0 會把小標推到左邊 */
	margin-block: 0 clamp(1.8rem, 3.5vw, 2.8rem) !important;
	margin-inline: auto !important;
	max-width: var(--wp--style--global--content-size, 820px);
}
.is-style-eyebrow::before, .is-style-eyebrow::after { content: ""; flex: 0 0 auto; width: 60px; height: 1px; background: var(--mf-rule); }
@media (max-width: 600px) { .is-style-eyebrow::before, .is-style-eyebrow::after { width: 28px; } }

/* =========================================================
   4. 影片與內文
   ========================================================= */
.wp-block-embed { margin-block: 0 1.4rem; }
.wp-block-embed__wrapper { box-shadow: 0 12px 40px rgba(0,0,0,.14); background: #000; }
.wp-block-embed figcaption, .wp-block-image figcaption { color: var(--mf-muted); font-size: .88rem; line-height: 1.6; margin-top: .6rem; text-align: center; }
/* 平板：致詞區人像縮小、節目單兩欄改單欄 */
@media (min-width: 601px) and (max-width: 900px) {
	.mf-speech .mf-portrait { width: min(200px, 34%); }
	.mf-program .wp-block-columns { flex-wrap: wrap !important; }
	.mf-program .wp-block-column { flex-basis: 100% !important; }
}

.has-small-font-size { line-height: 1.75; }
.wp-block-columns { gap: 2.5rem; }
/* 德文原文：襯線斜體、淡色 —— 與中文主文區隔 */
.wp-block-column > p.has-small-font-size,
.mf-speech > p.has-small-font-size { font-family: var(--mf-serif); font-style: italic; color: var(--mf-muted); }
.mf-speech > p.has-small-font-size:not(:first-of-type) { }

/* =========================================================
   5. 致詞區塊（P4–P7）：人像浮左、簽名靠右
   ========================================================= */
/* 人像欄 + 文字欄（core columns）：文字不繞圖，不會壓到照片 */
.mf-speech-cols { gap: clamp(1.6rem, 3vw, 2.6rem); align-items: flex-start; }
.mf-speech-cols > .wp-block-column:first-child { flex: 0 0 220px !important; }
.mf-speech .mf-portrait { margin: 0; }
.mf-speech .mf-portrait img { display: block; width: 100%; border: 1px solid var(--mf-rule-soft); padding: 4px; background: #fff; box-shadow: 0 10px 28px rgba(0,0,0,.12); }
.mf-speech ul.has-small-font-size { color: var(--mf-muted); padding-left: 1.1rem; margin: 0 0 1.4rem; }
.mf-speech ul.has-small-font-size li { margin-bottom: .3rem; }
.mf-speech-cols > .wp-block-column > :first-child { margin-top: 0 !important; }
.mf-signature { display: flex; justify-content: flex-end; margin: .6rem 0 0; }
.mf-signature img { max-width: 190px; mix-blend-mode: multiply; }
.mf-signature-latin img { max-width: 230px; }
@media (max-width: 781px) {
	.mf-speech-cols > .wp-block-column:first-child { flex-basis: 100% !important; }
	.mf-speech .mf-portrait { max-width: 220px; margin: 0 auto 1.4rem; }
}

/* =========================================================
   6. 節目單（P8）
   ========================================================= */
.mf-program { position: relative; overflow: hidden; }
.mf-program::before {
	content: ""; position: absolute; right: -30px; top: 110px; width: 240px; height: 355px; pointer-events: none;
	background-color: var(--mf-gold); opacity: .08;
	-webkit-mask: url(assets/harp.png) center / contain no-repeat; mask: url(assets/harp.png) center / contain no-repeat;
}
.mf-program h3 { text-align: center; color: var(--mf-red); font-size: 1.1rem; letter-spacing: .06em; margin-top: 0; }
.mf-program h3 + p { text-align: center; }
.mf-program ol { list-style: none; counter-reset: prog; padding: 0; margin: 0; border-top: 1px solid var(--mf-rule-soft); }
.mf-program ol li { counter-increment: prog; position: relative; padding: .8rem 0 .8rem 2.6rem; border-bottom: 1px solid var(--mf-rule-soft); font-size: .95rem; line-height: 1.7; }
.mf-program ol li::before {
	content: counter(prog, decimal-leading-zero); position: absolute; left: 0; top: .95rem;
	font-family: var(--mf-latin); font-weight: 700; font-size: .8rem; color: var(--mf-red); letter-spacing: .05em;
}
.mf-program .wp-block-columns { gap: 3rem; }

/* =========================================================
   7. 相簿
   ========================================================= */
.wp-block-gallery.mf-gallery { gap: 10px !important; }
.wp-block-gallery.mf-gallery.is-cropped figure.wp-block-image img { aspect-ratio: 4 / 3; object-fit: cover; }
/* 直式照片（貴賓合照）裁成 4:3 時置中會切掉頭：逐張指定垂直焦點（mf-fy-N＝N% 對齊） */
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-0 img  { object-position: 50% 0; }
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-10 img { object-position: 50% 10%; }
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-15 img { object-position: 50% 15%; }
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-20 img { object-position: 50% 20%; }
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-25 img { object-position: 50% 25%; }
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-30 img { object-position: 50% 30%; }
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-35 img { object-position: 50% 35%; }
.wp-block-gallery.mf-gallery figure.wp-block-image.mf-fy-40 img { object-position: 50% 40%; }
.wp-block-gallery.mf-gallery figure.wp-block-image { overflow: hidden; background: #e9e6e0; }
.wp-block-gallery.mf-gallery img.mf-lazy, .wp-block-gallery.mf-gallery img.mf-loading { opacity: 0; }
.wp-block-gallery.mf-gallery img.is-loaded { opacity: 1; transition: opacity .45s ease; }
.wp-block-gallery.mf-gallery figure.wp-block-image img { transition: transform .5s ease; }
.wp-block-gallery.mf-gallery figure.wp-block-image:hover img { transform: scale(1.04); }
.wp-block-gallery.mf-gallery figure.wp-block-image figcaption { font-size: .8rem; padding: 2.2rem .7rem .55rem; }
.wp-block-gallery.mf-masterclass figure.wp-block-image img { aspect-ratio: 16 / 9; }
@media (min-width: 601px) and (max-width: 960px) {
	.wp-block-gallery.mf-gallery.columns-4 figure.wp-block-image { width: calc(33.333% - 7px) !important; }
}
@media (max-width: 600px) {
	.wp-block-gallery.mf-gallery.columns-4 figure.wp-block-image { width: calc(50% - 5px) !important; }
	.wp-block-gallery.mf-masterclass figure.wp-block-image { width: 100% !important; }
}
/* 相簿頁的年份小節 */
.mf-page-photos .wp-block-post-content > h2:not(.is-style-ornament) { text-align: center; font-size: 1.35rem; color: var(--mf-red); margin: 3.5rem 0 1.4rem; letter-spacing: .1em; }
.mf-page-photos .wp-block-post-content > h2:not(.is-style-ornament)::after { content: ""; display: block; width: 40px; height: 2px; background: var(--mf-red); margin: .6rem auto 0; }
.mf-page-photos .wp-block-post-content > .is-style-eyebrow + h2 { margin-top: 0; }
/* 客戶反饋 20260911：舊站圖說（貴賓姓名等）放回照片「下方」，不壓在照片上 */
.mf-page-photos .wp-block-gallery.has-nested-images { align-items: flex-start; }
.mf-page-photos .wp-block-gallery.has-nested-images figure.wp-block-image { flex-direction: column; background: transparent; }
.mf-page-photos .wp-block-gallery.has-nested-images figure.wp-block-image img { background: #e9e6e0; }
.mf-page-photos .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	position: static; order: 2; width: 100%; flex: none;
	background: none; color: var(--mf-muted); text-shadow: none;
	-webkit-mask-image: none; mask-image: none; max-height: none;
	font-size: .82rem; line-height: 1.5; text-align: center; margin: 0; padding: .5rem .3rem .1rem;
}
/* 2026 新照片與歷年照片之間的分隔線（客戶指定） */
.mf-photos-divider { border: 0; border-top: 1px solid var(--mf-rule-soft); max-width: 1280px; margin: 4rem auto 1rem !important; }

/* 相簿彈窗（黑底） */
body.mf-lb-open { overflow: hidden; }
.mf-lb { position: fixed; inset: 0; z-index: 100000; background: #000; display: flex; align-items: center; justify-content: center; }
.mf-lb[hidden] { display: none; }
.mf-lb-fig { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 64px 72px 164px; box-sizing: border-box; width: 100%; height: 100%; }
/* 底部縮圖列：可橫向捲動、可點選 */
.mf-lb-thumbs { position: absolute; left: 0; right: 0; bottom: 0; display: flex; gap: 6px; padding: 8px 12px 10px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; background: rgba(0,0,0,.85); }
.mf-lb-thumb { flex: 0 0 auto; width: 84px; height: 60px; padding: 0 !important; border-radius: 2px !important; border: 2px solid transparent !important; background: #111 !important; opacity: .55; overflow: hidden; transition: opacity .2s, border-color .2s; }
.mf-lb-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mf-lb-thumb:hover, .mf-lb-thumb:focus-visible { opacity: .9; }
.mf-lb-thumb.is-active { opacity: 1; border-color: #e6cfa3 !important; }
.mf-lb-bar { bottom: 80px !important; background: none !important; }
.mf-lb-img { max-width: 100%; max-height: 100%; object-fit: contain; opacity: 0; transition: opacity .25s ease; box-shadow: 0 20px 60px rgba(0,0,0,.6); }
.mf-lb-img.is-ready { opacity: 1; }
.mf-lb-cap { color: rgba(255,255,255,.8); font-size: .9rem; margin-top: .8rem; text-align: center; max-width: 70ch; line-height: 1.5; }
.mf-lb button { -webkit-appearance: none; appearance: none; border: 1px solid rgba(255,255,255,.28); background: rgba(255,255,255,.08); color: #fff; cursor: pointer; font-family: var(--mf-latin); line-height: 1; transition: background .2s, border-color .2s; }
.mf-lb button:hover, .mf-lb button:focus-visible { background: rgba(255,255,255,.22); border-color: rgba(255,255,255,.6); outline: none; }
.mf-lb-close { position: absolute; top: 14px; right: 14px; width: 48px; height: 48px; border-radius: 50%; font-size: 1.1rem; }
.mf-lb-bgm { position: absolute; top: 14px; left: 14px; width: 48px; height: 48px; border-radius: 50%; font-size: 1.15rem; }
.mf-lb-bgm[aria-pressed="true"] { background: rgba(255,255,255,.22); border-color: rgba(255,255,255,.6); }
.mf-lb-prev, .mf-lb-next { position: absolute; top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border-radius: 50%; font-size: 2.2rem; padding-bottom: 6px; }
.mf-lb-prev { left: 14px; } .mf-lb-next { right: 14px; }
.mf-lb-bar { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 14px; background: linear-gradient(0deg, rgba(0,0,0,.7), transparent); }
.mf-lb-bar button { padding: .65rem 1rem; border-radius: 999px; font-family: var(--mf-sans); font-size: .9rem; letter-spacing: .04em; }
.mf-lb-count { color: rgba(255,255,255,.85); font-family: var(--mf-latin); font-size: .9rem; letter-spacing: .1em; min-width: 5.5em; text-align: center; }
@media (max-width: 700px) {
	.mf-lb-fig { padding: 60px 12px 92px; }
	.mf-lb-prev, .mf-lb-next { display: none; }   /* 手機用底部按鈕與滑動 */
	.mf-lb-close { top: 10px; right: 10px; }
	.mf-lb-bgm { top: 10px; left: 10px; }
}
@media (prefers-reduced-motion: reduce) { .mf-lb-img { transition: none; } }

/* =========================================================
   8. 特別感謝、按鈕、連絡人
   ========================================================= */
.mf-cover-credits ul { padding-left: 1.1rem; }
.mf-cover-credits h3 { text-align: center; color: #e6cfa3; font-size: 1rem; letter-spacing: .12em; margin-top: 2.4rem; }
.mf-cover-credits h3::after { content: ""; display: block; width: 28px; height: 1px; background: rgba(230,207,163,.6); margin: .5rem auto 0; }

.wp-block-button__link { background: var(--mf-red); color: #fff; border-radius: 2px; font-family: var(--mf-sans); font-weight: 500; letter-spacing: .06em; padding: .8rem 2rem; }
.wp-block-button__link:hover { background: var(--mf-red-deep); color: #fff; }
.is-style-outline .wp-block-button__link { background: transparent; color: var(--mf-red); border: 1.5px solid var(--mf-red); }

/* 地點頁：場地卡（圖文交錯） */
.mf-venue { margin-top: clamp(2.5rem, 5vw, 4rem) !important; gap: clamp(1.6rem, 4vw, 3.5rem); align-items: center; }
.mf-venue.mf-venue-flip { flex-direction: row-reverse; }
.mf-venue-img { margin: 0 !important; }
.mf-venue-img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; box-shadow: 0 18px 44px rgba(40,30,20,.16); }
.mf-venue-noimg {
	aspect-ratio: 4 / 3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem;
	border: 1px solid var(--mf-rule-soft); background: linear-gradient(160deg, #f3efe7, #e9e4da); color: var(--mf-muted);
	font-family: var(--mf-latin); font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; position: relative; overflow: hidden;
}
.mf-venue-noimg::before { content: ""; width: 120px; height: 178px; background: var(--mf-gold); opacity: .28; -webkit-mask: url(assets/harp.png) center / contain no-repeat; mask: url(assets/harp.png) center / contain no-repeat; }
.mf-venue-city { font-family: var(--mf-latin); font-size: .72rem; letter-spacing: .26em; text-transform: uppercase; color: var(--mf-red); margin: 0 0 .5rem !important; }
.mf-venue-name { margin: 0 0 .5rem !important; font-size: clamp(1.5rem, 2.6vw, 1.9rem); }
.mf-venue-de { font-family: var(--mf-latin); color: var(--mf-muted); font-size: .9rem; line-height: 1.55; margin: 0 0 1rem !important; }
.mf-venue .wp-block-buttons { margin-top: .6rem; }
.mf-venue .wp-block-button__link { padding: .6rem 1.3rem; font-size: .88rem; }
.mf-venue-note { text-align: center; color: var(--mf-muted); font-size: .88rem; margin-top: clamp(2rem, 4vw, 3rem) !important; }
@media (max-width: 781px) { .mf-venue.mf-venue-flip { flex-direction: column; } .mf-venue > .wp-block-column { flex-basis: 100% !important; } }

/* 時間頁 */
.mf-page-body .mf-termin { padding-block: var(--mf-section-y); }
.mf-page-body .mf-page-hero + .mf-termin { margin-top: 0 !important; }
.mf-date-big { font-family: var(--mf-serif); color: var(--mf-ink-strong); line-height: 1; margin: 0 0 1rem !important; display: flex; flex-direction: column; align-items: center; gap: .4rem; }
.mf-date-y { font-family: var(--mf-latin); font-weight: 300; font-size: clamp(1.4rem, 3vw, 2rem); letter-spacing: .3em; color: var(--mf-red); }
.mf-date-d { font-size: clamp(2.6rem, 7vw, 4.6rem); letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.mf-date-d small { font-size: .38em; margin: 0 .15em; color: var(--mf-muted); letter-spacing: 0; }
.mf-date-d em { font-style: normal; color: var(--mf-gold); margin: 0 .1em; }
.mf-date-sub { font-family: var(--mf-latin); letter-spacing: .18em; color: var(--mf-muted); font-size: .85rem; text-transform: uppercase; margin-bottom: 1.6rem !important; }
.mf-route { gap: 1.2rem; flex-wrap: wrap !important; counter-reset: route; }
.wp-block-columns.is-not-stacked-on-mobile.mf-route > .wp-block-column { flex: 1 1 calc(33.333% - .8rem) !important; min-width: 0; position: relative; text-align: center; }
.mf-route-stop::before { counter-increment: route; content: counter(route); position: absolute; top: -14px; left: 50%; transform: translateX(-50%); z-index: 2; width: 30px; height: 30px; border-radius: 50%; background: var(--mf-red); color: #fff; font: 700 .85rem/30px var(--mf-latin); box-shadow: 0 4px 12px rgba(0,0,0,.18); }
.mf-route-img { margin: 0 0 .9rem !important; }
.mf-route-img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; box-shadow: 0 12px 30px rgba(40,30,20,.14); }
.mf-route-noimg { margin-bottom: .9rem; }
.mf-route-city { font-family: var(--mf-latin); font-size: .7rem; letter-spacing: .3em; text-transform: uppercase; color: var(--mf-red); margin: 0 0 .2rem !important; }
.mf-route-venue { font-family: var(--mf-serif); font-size: 1.15rem; margin: 0 !important; }
.mf-route-venue a { color: var(--mf-ink-strong); text-decoration: none; border-bottom: 1px solid var(--mf-rule); }
.mf-route-venue a:hover { color: var(--mf-red); border-color: var(--mf-red); }
@media (max-width: 700px) { .wp-block-columns.is-not-stacked-on-mobile.mf-route > .wp-block-column { flex-basis: 100% !important; margin-top: 1.2rem; } }
.mf-program-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--mf-rule-soft); }
.mf-program-list li { padding: .9rem 0; border-bottom: 1px solid var(--mf-rule-soft); line-height: 1.7; }
.mf-program-list strong { color: var(--mf-red); font-weight: 600; margin-right: .4rem; }
.mf-termin-note { color: var(--mf-muted); font-size: .9rem; margin-top: 1.6rem !important; }
.mf-termin-steps { background: var(--mf-band); }
.mf-steps { gap: 1.4rem; }
.mf-step { background: #fff; border: 1px solid var(--mf-rule-soft); border-top: 3px solid var(--mf-red); padding: 1.6rem 1.4rem 1.4rem; text-align: center; box-shadow: 0 8px 26px rgba(40,30,20,.06); }
.mf-step > * { margin: 0 !important; }
.mf-step-n { font-family: var(--mf-latin); font-weight: 300; font-size: 2.2rem; color: var(--mf-gold); line-height: 1; margin-bottom: .5rem !important; }
.mf-step-title { font-size: 1.15rem; margin-bottom: .5rem !important; }
.mf-step p:last-child { font-size: .92rem; color: var(--mf-ink); line-height: 1.7; }
.mf-termin-steps .wp-block-buttons { margin-top: 2rem; }

.mf-kontakt-card { margin: 0 auto 2rem; max-width: 640px; }
.mf-kontakt-card img { border: 1px solid var(--mf-rule-soft); box-shadow: 0 10px 28px rgba(0,0,0,.10); }

/* 連絡人頁：聯絡窗口卡片（鳳鳴合唱團在前、毛佩蓉老師在後） */
.mf-contact-card {
	background: #fff; border: 1px solid var(--mf-rule-soft); border-top: 3px solid var(--mf-red);
	box-shadow: 0 8px 26px rgba(40,30,20,.06);
	padding: 2.2rem 1.6rem 2rem; max-width: 680px;
	margin-inline: auto !important; margin-block: 0 1.8rem !important;
}
.mf-contact-card h3 { margin-block: .4rem 1rem; font-size: 1.5rem; }
h2 + .mf-contact-card { margin-block-start: 2.2rem !important; }
.mf-contact-card p:not(.is-style-eyebrow) { line-height: 2; color: var(--mf-ink); }
.mf-contact-card .mf-kontakt-card { max-width: 560px; margin: .4rem auto 1.4rem; }

/* 佔位符（等客戶補件）——清楚但不刺眼 */
.mf-placeholder {
	border: 1.5px dashed var(--mf-red); background: repeating-linear-gradient(45deg, #fff 0 10px, #fdf5f5 10px 20px);
	padding: 1.6rem 1.2rem; text-align: center; color: var(--mf-red); font-size: .88rem; line-height: 1.6; border-radius: 2px; margin: 1.2rem 0;
}
.mf-placeholder strong { display: block; font-size: .98rem; margin-bottom: .3rem; }
.mf-hero .mf-placeholder { margin: 1.4rem auto; max-width: 820px; }

/* =========================================================
   8b. 首頁側邊章節導覽（≥1100px 顯示；hero 上白點、其餘紅點）
   ========================================================= */
/* 客戶 20260915：矮螢幕（筆電 150% 縮放，可視高約 570）時最後一項「特別感謝」壓在右下配樂鈕上。
   改成在「header 下方～配樂鈕上方」這一段裡置中；容器不擋點擊，只有連結可點。 */
.mf-sidenav { position: fixed; right: 18px; top: 96px; bottom: calc(1.4rem + 56px + .6rem + 3.2rem); z-index: 850; display: none; flex-direction: column; justify-content: center; gap: 9px; pointer-events: none; }
@media (min-width: 1100px) { .mf-sidenav { display: flex; } }
.mf-sidenav a { display: flex; align-items: center; justify-content: flex-end; gap: 10px; text-decoration: none; color: var(--mf-muted); padding: 2px 0; pointer-events: auto; }
@media (max-height: 700px) { .mf-sidenav { gap: 3px; } .mf-sidenav a { padding: 1px 0; } }
@media (max-height: 530px) { .mf-sidenav { display: none !important; } }
.mf-sidenav span {
	font: 500 .72rem/1 var(--mf-sans); letter-spacing: .08em; white-space: nowrap;
	background: rgba(250,248,244,.92); padding: 5px 9px; border-radius: 2px; box-shadow: 0 2px 8px rgba(0,0,0,.08);
	opacity: 0; transform: translateX(6px); transition: opacity .2s, transform .2s, color .2s;
}
/* 原本寫 var(--mf-rule-strong)（沒定義）→ 整條 border 失效，未選取的點從來沒畫出來（上線當天發現） */
.mf-sidenav i { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid var(--mf-rule); background: transparent; transition: transform .2s, background .2s, border-color .2s; }
.mf-sidenav a:hover span, .mf-sidenav a.is-active span, .mf-sidenav:hover span { opacity: 1; transform: none; }
.mf-sidenav a:hover i { border-color: var(--mf-red); }
.mf-sidenav a.is-active i { background: var(--mf-red); border-color: var(--mf-red); transform: scale(1.35); }
.mf-sidenav a.is-active span { color: var(--mf-red); }
.mf-sidenav.is-on-dark i { border-color: rgba(255,255,255,.75); }
.mf-sidenav.is-on-dark a.is-active i { background: #fff; border-color: #fff; }
.mf-sidenav.is-on-dark span { background: rgba(0,0,0,.5); color: #fff; box-shadow: none; }
.mf-sidenav.is-on-dark a.is-active span { color: #fff; }
@media (prefers-reduced-motion: reduce) { .mf-sidenav span, .mf-sidenav i { transition: none; } }

/* =========================================================
   9. Footer + PAGE TOP
   ========================================================= */
.mf-footer { background: #ecebe6; border-top: 1px solid #e0ded8; padding-block: 3rem 2.2rem !important; text-align: center; font-size: .84rem; color: #55524e; }
.mf-footer-brand { font-family: var(--mf-latin); font-weight: 700; letter-spacing: .08em; color: var(--mf-ink-strong); margin-bottom: .6rem; }
.mf-footer-copy { margin: 0; line-height: 1.7; }

.mf-pagetop {
	position: fixed; right: 1.4rem; bottom: 1.4rem; z-index: 800;
	display: flex; flex-direction: column; align-items: center; gap: .2rem;
	width: 56px; height: 56px; justify-content: center;
	background: var(--mf-red); color: #fff; text-decoration: none; border-radius: 2px;
	font: 700 .55rem/1 var(--mf-latin); letter-spacing: .1em;
	opacity: 0; transform: translateY(8px); transition: opacity .3s, transform .3s; box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.mf-pagetop::before { content: ""; width: 9px; height: 9px; border-top: 2px solid #fff; border-left: 2px solid #fff; transform: rotate(45deg); margin-top: 3px; }
.mf-pagetop:hover { background: var(--mf-red-deep); color: #fff; }
.mf-pagetop.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.wp-block-gallery.mf-gallery figure.wp-block-image img, .mf-pagetop, .mf-bgm { transition: none; }
}