/* healing 產業版型：首頁、關於頁、服務頁的專屬設計。只用 shared/tokens.css 的變數。
   主題：入夜、儀式感。暗色全幅影像、拱形照片、置中慢節奏標題、月相圓點。
   亮色區塊與暗色區塊（.ind-night，底色 --p3）共用同一組 --ind-* 變數，換主色時一起變。 */

.ind-page {
  --ind-fg: var(--p3);
  --ind-text: var(--p4);
  --ind-muted: var(--p5);
  --ind-line: var(--line);
  --ind-accent: var(--p1);
  --ind-moon: var(--p1);
  --ind-moon-line: color-mix(in srgb, var(--p1) 55%, var(--p9));
  --ind-arch: 999px 999px var(--radius-card) var(--radius-card);
  --ind-track: 0.08em;
}
.ind-night {
  --ind-fg: var(--p9);
  --ind-text: color-mix(in srgb, var(--p9) 84%, transparent);
  --ind-muted: color-mix(in srgb, var(--p9) 66%, transparent);
  --ind-line: color-mix(in srgb, var(--p9) 16%, transparent);
  --ind-accent: color-mix(in srgb, var(--p1) 36%, var(--p9));
  --ind-moon: color-mix(in srgb, var(--p1) 18%, var(--p9));
  --ind-moon-line: color-mix(in srgb, var(--p9) 42%, transparent);
  background: var(--p3);
  color: var(--ind-text);
  padding-block: var(--section-y);
}
.ind-night :is(h2, h3) { color: var(--ind-fg); }
.ind-night .btn--text { color: var(--ind-accent); }
.ind-night .btn--text:hover { color: var(--p9); }

/* ---- 共用小元件 ---- */
.ind-kicker { display: inline-block; font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.28em; color: var(--ind-accent); }
.ind-center { display: flex; justify-content: center; margin-top: var(--s7); }
.ind-head { display: flex; flex-direction: column; align-items: center; gap: var(--s4); max-width: 40em; margin: 0 auto var(--s7); text-align: center; }
.ind-head h2 { font-size: var(--fs-2xl); line-height: 1.45; letter-spacing: var(--ind-track); }
.ind-head p { color: var(--ind-muted); max-width: 30em; }
.ind-head--split { flex-direction: row; flex-wrap: wrap; align-items: end; justify-content: space-between; max-width: none; text-align: left; gap: var(--s4) var(--s6); }
.ind-head--split > div { display: flex; flex-direction: column; gap: var(--s3); }
.ind-role { font-size: var(--fs-sm); font-weight: 700; letter-spacing: 0.12em; color: var(--ind-muted); }

/* 月相：純 CSS 圓，新月 → 眉月 → 上弦 → 盈凸 → 滿月 */
.ind-moon { --m: 40px; display: inline-block; flex: none; width: var(--m); height: var(--m); border-radius: 50%; border: 1px solid var(--ind-moon-line); }
.ind-moon--wax { box-shadow: inset calc(var(--m) * -0.3) 0 0 0 var(--ind-moon); }
.ind-moon--half { background: linear-gradient(90deg, transparent 50%, var(--ind-moon) 50%); }
.ind-moon--gib { background: radial-gradient(circle at 64% 50%, var(--ind-moon) calc(var(--m) * 0.44), transparent calc(var(--m) * 0.44 + 0.5px)); }
.ind-moon--full { background: var(--ind-moon); border-color: var(--ind-moon); box-shadow: 0 0 calc(var(--m) * 0.7) color-mix(in srgb, var(--ind-moon) 40%, transparent); }

/* ===== Z01 首頁 Hero：全幅暗色照片、置中標題 ===== */
.ind-hero { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-rows: 1fr auto; min-height: min(92svh, 860px); background: var(--p3); color: var(--p9); text-align: center; }
.ind-hero__img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; animation: indDrift 2.4s ease-out both; }
.ind-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background:
  radial-gradient(ellipse 60% 55% at 50% 44%, color-mix(in srgb, var(--p3) 62%, transparent), color-mix(in srgb, var(--p3) 30%, transparent) 70%, transparent),
  linear-gradient(180deg, color-mix(in srgb, var(--p3) 55%, transparent) 0%, color-mix(in srgb, var(--p3) 20%, transparent) 38%, color-mix(in srgb, var(--p3) 45%, transparent) 72%, var(--p3) 100%); }
.ind-hero__inner { align-self: center; display: flex; flex-direction: column; align-items: center; gap: var(--s5); padding-block: clamp(88px, 13vw, 160px) var(--s7); }
.ind-hero__inner > * { animation: indRise 1.2s cubic-bezier(.2,.7,.2,1) both; }
.ind-hero__inner > :nth-child(2) { animation-delay: .15s; }
.ind-hero__inner > :nth-child(3) { animation-delay: .3s; }
.ind-hero__inner > :nth-child(4) { animation-delay: .45s; }
.ind-hero__inner > :nth-child(5) { animation-delay: .6s; }
.ind-hero .ind-kicker { color: color-mix(in srgb, var(--p9) 82%, transparent); letter-spacing: 0.4em; padding-left: 0.4em; }
.ind-hero h1 { color: var(--p9); font-size: var(--fs-hero); font-weight: 400; line-height: 1.4; letter-spacing: 0.14em; text-shadow: 0 2px 24px color-mix(in srgb, var(--p3) 60%, transparent); }
.ind-hero p { max-width: 26em; font-size: var(--fs-lg); color: color-mix(in srgb, var(--p9) 86%, transparent); }
.ind-hero__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s3); margin-top: var(--s2); }
.ind-phases { --ind-moon: color-mix(in srgb, var(--p1) 14%, var(--p9)); --ind-moon-line: color-mix(in srgb, var(--p9) 50%, transparent); display: flex; gap: 14px; margin-bottom: var(--s2); }
.ind-phases .ind-moon { --m: 12px; }
.ind-hero__foot { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s2) 0; padding-block: var(--s5) var(--s6); font-size: var(--fs-sm); color: color-mix(in srgb, var(--p9) 70%, transparent); }
.ind-hero__foot li { display: flex; align-items: baseline; gap: 8px; padding-inline: clamp(16px, 3vw, 40px); }
.ind-hero__foot li + li { border-left: 1px solid color-mix(in srgb, var(--p9) 22%, transparent); }
.ind-hero__foot b { font-family: var(--font-heading); font-weight: var(--heading-weight); color: var(--p9); letter-spacing: 0.06em; }
@keyframes indRise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes indDrift { from { transform: scale(1.08); opacity: .6; } to { transform: none; opacity: 1; } }

/* ===== Z02 拱形類別卡（暗底） ===== */
.ind-offer { padding-top: clamp(40px, 6vw, 72px); }
.ind-arches { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 4vw, 56px); align-items: start; }
.ind-arches > :nth-child(2) { margin-top: clamp(32px, 5vw, 72px); }
.ind-arch { display: flex; flex-direction: column; gap: var(--s5); color: inherit; text-decoration: none; text-align: center; }
.ind-arch__media { position: relative; aspect-ratio: 3 / 4; padding: 10px; border: 1px solid var(--ind-line); border-radius: var(--ind-arch); transition: border-color .4s ease; }
.ind-arch__media img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--ind-arch); transition: transform .9s ease, filter .9s ease; filter: saturate(.92); }
.ind-arch:hover .ind-arch__media { border-color: var(--ind-accent); }
.ind-arch:hover .ind-arch__media img { filter: saturate(1.05); }
.ind-arch__body { display: flex; flex-direction: column; align-items: center; gap: var(--s2); padding-inline: var(--s3); }
.ind-arch__no { font-family: var(--font-heading); font-size: var(--fs-sm); letter-spacing: 0.2em; color: var(--ind-accent); }
.ind-arch h3 { font-size: var(--fs-lg); letter-spacing: 0.16em; color: var(--ind-fg); word-break: keep-all; overflow-wrap: anywhere; }
.ind-offer .ind-arch h3 { font-size: var(--fs-xl); letter-spacing: 0.24em; margin-right: -0.24em; }
.ind-arch p { max-width: 20em; font-size: var(--fs-sm); color: var(--ind-muted); }
.ind-arch__meta { font-size: var(--fs-xs); letter-spacing: 0.08em; color: var(--ind-muted); }
.ind-arch__cta { margin-top: var(--s2); padding-bottom: 4px; border-bottom: 1px solid var(--ind-line); font-size: var(--fs-sm); font-weight: 700; letter-spacing: 0.06em; color: var(--ind-fg); transition: border-color .3s; }
.ind-arch:hover .ind-arch__cta { border-color: var(--ind-accent); }
.ind-arch__price { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 10px; font-size: var(--fs-sm); color: var(--ind-muted); }
.ind-arch__price b { font-family: var(--font-heading); font-size: var(--fs-xl); color: var(--ind-fg); font-variant-numeric: tabular-nums; }
.ind-arch__type { font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.16em; color: var(--ind-accent); }

/* ===== Z03 Google 評論：評分摘要＋三張錯落的卡 ===== */
.ind-rating { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--s3) var(--s5); margin: calc(var(--s5) * -1) auto var(--s7); }
.ind-rating__score { font-family: var(--font-heading); font-size: var(--fs-2xl); line-height: 1; color: var(--p3); }
.ind-rating__text { display: flex; flex-direction: column; font-size: var(--fs-sm); color: var(--p5); line-height: 1.5; }
.ind-voice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); align-items: start; }
.ind-voice-grid > :nth-child(2) { margin-top: var(--s7); }
.ind-voice { display: flex; flex-direction: column; align-items: center; gap: var(--s4); margin: 0; padding: var(--s7) var(--s6) var(--s6); border: 1px solid var(--line); border-radius: var(--ind-arch); background: var(--p9); text-align: center; }
.ind-voice .ind-moon { --m: 18px; }
.ind-voice .stars { font-size: var(--fs-xs); letter-spacing: 3px; }
.ind-voice blockquote { margin: 0; font-family: var(--font-heading); font-size: var(--fs-lg); line-height: 1.8; color: var(--p3); }
.ind-voice figcaption { display: flex; flex-direction: column; gap: 2px; padding-top: var(--s4); border-top: 1px solid var(--line); font-size: var(--fs-xs); color: var(--p5); }
.ind-voice figcaption b { font-size: var(--fs-sm); color: var(--p3); letter-spacing: 0.04em; }
.ind-voice figcaption a { color: var(--p1); font-weight: 700; text-decoration: none; }

/* 審閱用切換（好評來源、關於版本）：置中、圓角，只在 mockup 出現 */
.ind-switch { display: flex; justify-content: center; }
.ind-switch .mode-switch { justify-content: center; border-radius: 22px; padding: 5px 5px 5px 16px; }
.ind-switch .mode-switch button { border-radius: 999px; padding: 0 14px; }

/* Z03 來源一：手動輸入（置中大引言＋兩則短引言） */
.ind-manual__lead { display: flex; flex-direction: column; align-items: center; gap: var(--s5); max-width: 46rem; margin: 0 auto; text-align: center; }
.ind-manual__lead .ind-moon { --m: 22px; }
.ind-manual__lead blockquote { margin: 0; font-family: var(--font-heading); font-size: var(--fs-2xl); line-height: 1.75; letter-spacing: 0.04em; color: var(--p3); }
.ind-manual__lead figcaption { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-sm); color: var(--p5); }
.ind-manual__lead figcaption b { color: var(--p3); letter-spacing: 0.08em; }
.ind-manual__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 56rem; margin: var(--s7) auto 0; border-top: 1px solid var(--line-strong); }
.ind-manual__sm { display: flex; flex-direction: column; gap: var(--s4); margin: 0; padding: var(--s6) var(--s6) var(--s2); }
.ind-manual__sm + .ind-manual__sm { border-left: 1px solid var(--line-strong); }
.ind-manual__sm blockquote { margin: 0; color: var(--p4); line-height: 1.85; }
.ind-manual__sm figcaption { display: flex; align-items: center; gap: var(--s3); font-size: var(--fs-sm); color: var(--p5); }
.ind-manual__sm figcaption b { color: var(--p3); }

/* Z04 多位老師：拱形肖像卡（亮底，沿用 .ind-arches 的錯落與手機橫滑） */
.ind-team .ind-arch__media { aspect-ratio: 3 / 4; }

/* ===== Z04 關於（一位老師）：左文、拱形肖像置中、右側引言與數字 ===== */
.ind-about__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr) minmax(0, 1fr); gap: clamp(28px, 4.5vw, 72px); align-items: center; }
.ind-about__intro { display: flex; flex-direction: column; align-items: flex-end; gap: var(--s3); text-align: right; }
.ind-about__intro h2 { font-size: var(--fs-2xl); letter-spacing: 0.32em; margin-right: -0.32em; }
.ind-about__intro p { margin-top: var(--s3); color: var(--p5); max-width: 22em; }
.ind-portrait { position: relative; margin: 0; aspect-ratio: 2 / 3; }
.ind-portrait::before { content: ""; position: absolute; inset: -14px; border: 1px solid color-mix(in srgb, var(--p1) 40%, var(--p9)); border-radius: var(--ind-arch); pointer-events: none; }
.ind-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; border-radius: var(--ind-arch); }
.ind-about__side { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s6); }
.ind-about__side blockquote { margin: 0; font-family: var(--font-heading); font-size: var(--fs-xl); line-height: 1.7; color: var(--p3); }
.ind-facts { display: grid; gap: 0; margin: 0; width: 100%; border-top: 1px solid var(--line); }
.ind-facts div { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s4); padding-block: var(--s3); border-bottom: 1px solid var(--line); }
.ind-facts dt { font-size: var(--fs-sm); color: var(--p5); }
.ind-facts dd { margin: 0; font-family: var(--font-heading); font-size: var(--fs-xl); color: var(--p3); }

/* ===== Z05 理念：三個月相連成一線（暗底） ===== */
.ind-phase-list { list-style: none; position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s6); max-width: 60rem; margin-inline: auto; text-align: center; }
.ind-phase-list::before { content: ""; position: absolute; top: 32px; left: 16.6%; right: 16.6%; height: 1px; background: var(--ind-line); }
.ind-phase-list li { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--s3); }
.ind-phase-list .ind-moon { --m: 64px; background-color: var(--p3); }
.ind-phase-list .ind-moon--full { background-color: var(--ind-moon); }
.ind-phase-list__name { margin-top: var(--s2); font-size: var(--fs-xs); letter-spacing: 0.3em; color: var(--ind-accent); }
.ind-phase-list h3 { font-size: var(--fs-lg); letter-spacing: 0.08em; }
.ind-phase-list p { max-width: 18em; font-size: var(--fs-sm); color: var(--ind-muted); }

/* ===== Z06 文章：左右交錯 ===== */
.ind-rows { display: flex; flex-direction: column; }
.ind-row { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); align-items: center; padding-block: var(--s6); color: inherit; text-decoration: none; }
.ind-row + .ind-row { border-top: 1px solid var(--line); }
.ind-row:nth-child(even) .ind-row__media { order: 2; }
.ind-row__media { overflow: hidden; aspect-ratio: 16 / 10; border-radius: var(--radius-card); background: var(--p7); }
.ind-row:nth-child(odd) .ind-row__media { border-top-left-radius: 160px; }
.ind-row:nth-child(even) .ind-row__media { border-top-right-radius: 160px; }
.ind-row__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s ease; }
.ind-row:hover .ind-row__media img { transform: scale(1.04); }
.ind-row__body { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s3); max-width: 28em; }
.ind-row__meta { display: flex; align-items: center; gap: var(--s3); font-size: var(--fs-xs); color: var(--p5); }
.ind-row h3 { font-size: var(--fs-lg); line-height: 1.6; letter-spacing: 0.04em; transition: color .2s; }
.ind-row:hover h3 { color: var(--p1); }
.ind-row p { color: var(--p5); font-size: var(--fs-sm); }
.ind-row__cta { font-size: var(--fs-sm); font-weight: 700; color: var(--p1); }

/* ===== Z07 CTA：暗色拱窗 ===== */
.ind-cta-wrap { padding-top: 0; }
.ind-cta { --ind-moon: color-mix(in srgb, var(--p1) 18%, var(--p9)); --ind-moon-line: var(--ind-moon); position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; align-items: center; gap: var(--s4); max-width: 46rem; margin-inline: auto; padding: clamp(112px, 18vw, 188px) clamp(24px, 6vw, 72px) clamp(48px, 6vw, 72px); border-radius: var(--ind-arch); background: var(--p3); color: color-mix(in srgb, var(--p9) 80%, transparent); text-align: center; }
.ind-cta::before { content: ""; position: absolute; inset: 14px; z-index: -1; border: 1px solid color-mix(in srgb, var(--p9) 16%, transparent); border-radius: var(--ind-arch); }
.ind-cta .ind-moon { --m: 56px; margin-bottom: var(--s2); }
.ind-cta h2 { color: var(--p9); font-size: var(--fs-2xl); letter-spacing: 0.1em; }
.ind-cta p { max-width: 26em; }
.ind-cta__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s3); margin-top: var(--s3); }
.ind-cta small { margin-top: var(--s3); font-size: var(--fs-xs); letter-spacing: 0.1em; color: color-mix(in srgb, var(--p9) 58%, transparent); }

/* ===== 關於頁 ===== */
.ind-profile { --ind-moon: color-mix(in srgb, var(--p1) 18%, var(--p9)); padding-block: clamp(56px, 8vw, 104px); }
.ind-profile__inner { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.8fr); gap: clamp(40px, 7vw, 112px); align-items: center; }
.ind-profile__text { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s5); }
.ind-profile .breadcrumb, .ind-pagehead .breadcrumb { color: color-mix(in srgb, var(--p9) 50%, transparent); }
.ind-profile .breadcrumb a, .ind-pagehead .breadcrumb a { color: color-mix(in srgb, var(--p9) 72%, transparent); }
.ind-profile .breadcrumb a:hover, .ind-pagehead .breadcrumb a:hover { color: var(--p9); }
.ind-profile .breadcrumb span[aria-hidden], .ind-pagehead .breadcrumb span[aria-hidden] { color: color-mix(in srgb, var(--p9) 30%, transparent); }
.ind-profile h1 { color: var(--p9); font-size: var(--fs-hero); font-weight: 400; letter-spacing: 0.22em; line-height: 1.25; }
.ind-profile .lead { color: color-mix(in srgb, var(--p9) 80%, transparent); max-width: 28em; }
.ind-stats { display: flex; flex-wrap: wrap; gap: var(--s4) 0; padding-block: var(--s5); border-block: 1px solid var(--ind-line); width: 100%; }
.ind-stats div { display: flex; flex-direction: column; padding-inline: 0 clamp(20px, 3vw, 40px); }
.ind-stats div + div { padding-left: clamp(20px, 3vw, 40px); border-left: 1px solid var(--ind-line); }
.ind-stats b { font-family: var(--font-heading); font-size: var(--fs-2xl); line-height: 1.3; color: var(--p9); font-variant-numeric: tabular-nums; }
.ind-stats span { font-size: var(--fs-xs); letter-spacing: 0.08em; color: var(--ind-muted); }
.ind-profile__actions { display: flex; flex-wrap: wrap; gap: var(--s3); }
.ind-profile .ind-portrait { max-width: 400px; width: 100%; justify-self: center; }
.ind-profile .ind-portrait::before { border-color: color-mix(in srgb, var(--p9) 24%, transparent); }

.ind-story { display: flex; flex-direction: column; align-items: center; gap: var(--s6); max-width: 40rem; margin-inline: auto; }
.ind-story .ind-head { margin-bottom: 0; }
.ind-story__body { display: flex; flex-direction: column; gap: var(--s5); font-size: var(--fs-base); line-height: 2; color: var(--p4); }
.ind-story__body > p:first-child { font-family: var(--font-heading); font-size: var(--fs-lg); line-height: 1.85; color: var(--p3); }
.ind-quote { display: flex; flex-direction: column; align-items: center; gap: var(--s4); margin: var(--s4) 0; padding-block: var(--s6); border-block: 1px solid var(--line); text-align: center; }
.ind-quote .ind-moon { --m: 22px; }
.ind-quote p { font-family: var(--font-heading); font-size: var(--fs-2xl); line-height: 1.7; color: var(--p3); letter-spacing: 0.04em; }
.ind-quote cite { font-style: normal; font-size: var(--fs-xs); letter-spacing: 0.2em; color: var(--p5); }

.ind-moonline { list-style: none; position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s5); }
.ind-moonline::before { content: ""; position: absolute; top: 18px; left: 10%; right: 10%; height: 1px; background: var(--line-strong); }
.ind-moonline li { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--s3); text-align: center; }
.ind-moonline .ind-moon { --m: 36px; background-color: var(--p8); }
.ind-moonline .ind-moon--full { background-color: var(--ind-moon); }
.ind-moonline b { font-family: var(--font-heading); font-size: var(--fs-xl); color: var(--p3); letter-spacing: 0.06em; font-variant-numeric: tabular-nums; }
.ind-moonline p { font-size: var(--fs-sm); color: var(--p5); max-width: 15em; }

/* ===== 服務總覽與服務內頁 ===== */
.ind-pagehead { --ind-moon: color-mix(in srgb, var(--p1) 18%, var(--p9)); padding-block: clamp(56px, 8vw, 96px); text-align: center; }
.ind-pagehead__inner { display: flex; flex-direction: column; align-items: center; gap: var(--s4); }
.ind-pagehead h1 { color: var(--p9); font-size: var(--fs-3xl); font-weight: 400; letter-spacing: 0.22em; margin-right: -0.22em; }
.ind-pagehead .lead { color: color-mix(in srgb, var(--p9) 80%, transparent); max-width: 30em; }
.ind-pagehead .ind-phases { margin-bottom: 0; }
.ind-note { display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px; border: 1px solid var(--ind-line); border-radius: 999px; font-size: var(--fs-xs); letter-spacing: 0.06em; color: var(--ind-muted); }
.ind-note .ind-moon { --m: 10px; }

.ind-svc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s7) clamp(24px, 4vw, 56px); }
.ind-svc-card { display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 36px); align-items: center; color: inherit; text-decoration: none; }
.ind-svc-card__media { position: relative; overflow: hidden; aspect-ratio: 3 / 4; border-radius: var(--ind-arch); background: var(--p7); }
.ind-svc-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s ease; }
.ind-svc-card:hover .ind-svc-card__media img { transform: scale(1.04); }
.ind-svc-card__media .badge { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); }
.ind-svc-card__body { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s3); }
.ind-svc-card__body h2, .ind-svc-card__body h3 { font-size: var(--fs-lg); letter-spacing: 0.06em; line-height: 1.4; transition: color .2s; word-break: keep-all; overflow-wrap: anywhere; }
.ind-svc-card:hover :is(h2, h3) { color: var(--p1); }
.ind-svc-card__body p { font-size: var(--fs-sm); color: var(--p5); }
.ind-svc-card__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--fs-xs); letter-spacing: 0.04em; color: var(--p5); }
.ind-svc-card__meta span + span::before { content: ""; display: inline-block; width: 3px; height: 3px; margin: 0 10px 3px -7px; border-radius: 50%; background: var(--p6); vertical-align: middle; }
.ind-svc-card__foot { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s2) var(--s4); width: 100%; margin-top: var(--s2); padding-top: var(--s3); border-top: 1px solid var(--line); }
.ind-svc-card__foot .price { font-size: var(--fs-lg); }
.ind-svc-card__cta { font-size: var(--fs-sm); font-weight: 700; color: var(--p1); }
.ind-disclaimer { display: flex; align-items: flex-start; gap: var(--s3); max-width: 46rem; margin: var(--s8) auto 0; padding: var(--s5) var(--s6); border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--p8); font-size: var(--fs-sm); color: var(--p5); }
.ind-disclaimer .ind-moon { --m: 16px; margin-top: 4px; }
.ind-disclaimer b { color: var(--p3); }

/* 服務內頁：置中標題＋三扇拱窗照片 */
.ind-svc-head { align-items: center; text-align: center; padding-block: var(--s6) var(--s6); }
.ind-svc-head .breadcrumb { justify-content: center; }
.ind-svc-head h1 { letter-spacing: 0.1em; }
.ind-svc-head .svc-meta { justify-content: center; }
.ind-triptych { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr) minmax(0, 0.8fr); gap: clamp(12px, 2.4vw, 32px); align-items: end; max-width: 60rem; margin-inline: auto; }
.ind-triptych figure { position: relative; margin: 0; overflow: hidden; aspect-ratio: 3 / 4; border-radius: var(--ind-arch); background: var(--p7); }
.ind-triptych figure:nth-child(2) { aspect-ratio: 4 / 5; }
.ind-triptych img { width: 100%; height: 100%; object-fit: cover; }
.ind-triptych .btn { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); }
.ind-svc-main h2 { font-size: var(--fs-2xl); letter-spacing: 0.06em; }
.ind-svc-main .svc-facts { padding: var(--s5); border-radius: var(--radius-card); background: var(--p8); }
.ind-book { overflow: hidden; }
.ind-book__top { --ind-moon: color-mix(in srgb, var(--p1) 18%, var(--p9)); --ind-moon-line: color-mix(in srgb, var(--p9) 40%, transparent); display: flex; align-items: center; gap: var(--s4); padding: var(--s5); background: var(--p3); color: color-mix(in srgb, var(--p9) 72%, transparent); font-size: var(--fs-xs); }
.ind-book__top .ind-moon { --m: 30px; }
.ind-book__top b { display: block; font-family: var(--font-heading); font-size: var(--fs-lg); color: var(--p9); letter-spacing: 0.06em; }
.ind-svc-more .ind-arches > :nth-child(2) { margin-top: 0; }
.ind-svc-more .ind-arch__media { aspect-ratio: 4 / 5; }

/* ===== 響應式 ===== */
@media (max-width: 960px) {
  .ind-about__grid { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); }
  .ind-about__intro { grid-column: 2; grid-row: 1; align-items: flex-start; text-align: left; }
  .ind-about__intro h2 { margin-right: 0; }
  .ind-portrait { grid-column: 1; grid-row: 1 / 3; align-self: center; }
  .ind-about__side { grid-column: 2; }
  .ind-voice-grid { grid-template-columns: minmax(0, 1fr); max-width: 34rem; margin-inline: auto; }
  .ind-voice-grid > :nth-child(2) { margin-top: 0; }
  .ind-svc-grid { grid-template-columns: minmax(0, 1fr); max-width: 44rem; margin-inline: auto; }
  .ind-moonline { grid-template-columns: minmax(0, 1fr); gap: 0; max-width: 34rem; margin-inline: auto; }
  .ind-moonline::before { top: 18px; bottom: 18px; left: 18px; right: auto; width: 1px; height: auto; }
  .ind-moonline li { display: grid; grid-template-columns: 36px minmax(0, 1fr); grid-template-rows: auto auto; gap: 2px var(--s4); align-items: center; padding-bottom: var(--s5); text-align: left; }
  .ind-moonline .ind-moon { grid-row: 1 / 3; align-self: start; }
  .ind-moonline p { max-width: none; }
}
@media (max-width: 720px) {
  .ind-hero { min-height: min(88svh, 720px); }
  .ind-hero h1 { letter-spacing: 0.08em; }
  .ind-hero__foot { font-size: var(--fs-xs); }
  .ind-hero__foot li { flex-direction: column; align-items: center; gap: 0; padding-inline: 14px; }
  .ind-arches { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 74%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--s4); margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); }
  .ind-arches > * { scroll-snap-align: start; }
  .ind-arches > :nth-child(2) { margin-top: 0; }
  .ind-about__grid { grid-template-columns: minmax(0, 1fr); text-align: center; }
  .ind-about__intro, .ind-about__side { grid-column: auto; grid-row: auto; align-items: center; text-align: center; }
  .ind-portrait { grid-row: 1; grid-column: auto; width: min(100% - 28px, 300px); margin-inline: auto; }
  .ind-about__intro h2 { margin-right: -0.2em; }
  .ind-about__side { align-items: stretch; }
  .ind-about__side .btn { align-self: center; }
  .ind-phase-list { grid-template-columns: minmax(0, 1fr); gap: var(--s7); }
  .ind-phase-list::before { top: 32px; bottom: 32px; left: 50%; right: auto; width: 1px; height: auto; }
  .ind-phase-list li { padding-block: var(--s2); background: var(--p3); }
  .ind-row { grid-template-columns: minmax(0, 1fr); gap: var(--s4); }
  .ind-row:nth-child(even) .ind-row__media { order: 0; }
  .ind-row:nth-child(odd) .ind-row__media, .ind-row:nth-child(even) .ind-row__media { border-radius: var(--radius-card); border-top-left-radius: 96px; }
  .ind-manual__pair { grid-template-columns: minmax(0, 1fr); border-top: 0; }
  .ind-manual__sm { padding: var(--s5) 0 var(--s2); border-top: 1px solid var(--line-strong); }
  .ind-manual__sm + .ind-manual__sm { border-left: 0; }
  .ind-profile__inner { grid-template-columns: minmax(0, 1fr); }
  .ind-profile .ind-portrait { order: -1; width: min(100% - 28px, 280px); }
  .ind-stats div { padding-right: 16px; }
  .ind-stats div + div { padding-left: 16px; }
  .ind-svc-card { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); align-items: start; }
  .ind-svc-card__body p { display: none; }
  .ind-triptych { grid-template-columns: minmax(0, 0.62fr) minmax(0, 1fr) minmax(0, 0.62fr); }
  .ind-triptych .btn { font-size: var(--fs-xs); padding: 0 12px; min-height: 32px; }
  .ind-disclaimer { padding: var(--s4); }
}
