/*
Theme Name: Massage Home
Theme URI: https://usdihuang.dingliuads.com/
Description: Editable massage service homepage built with WordPress blocks.
Author: Site owner
Version: 1.0.0
Template: twentytwentyfive
Text Domain: massage-home
*/
:root {
  --massage-olive: #6b8e23;
  --massage-olive-dark: #4e6c1d;
  --massage-pale-green: #dde5cc;
  --massage-page: #ededed;
  --massage-ink: #252a22;
  --massage-soft-ink: #687064;
  --massage-pink: #f94c60;
  --massage-yellow: #f5f2bd;
}
html { scroll-behavior: smooth; }
body { background: var(--massage-page); color: var(--massage-ink); }
.wp-site-blocks { background: var(--massage-page); }
.wp-block-post-content { margin-block-start: 0 !important; }
.massage-landing { margin: 0 auto !important; max-width: none; overflow: hidden; background: var(--massage-page); font-family: Arial, "Noto Sans TC", "Noto Sans SC", sans-serif; }
.massage-header { width: 100%; margin: 0 !important; padding: 0 20px; box-sizing: border-box; color: #fff; background: var(--massage-olive); }
.massage-header__inner { width: min(100%, 980px); min-height: 50px; margin: 0 auto !important; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.massage-brand, .massage-header-note { margin: 0 !important; color: #fff; }
.massage-brand { font-size: 21px; line-height: 1.2; letter-spacing: .04em; }
.massage-header-note { font-size: 13px; opacity: .94; }
.massage-hero { min-height: 455px !important; margin: 0 !important; overflow: hidden; }
.massage-hero .wp-block-cover__image-background { object-position: center center !important; }
.massage-hero .wp-block-cover__background { opacity: .42; }
.massage-hero .wp-block-cover__inner-container { width: min(calc(100% - 40px), 980px) !important; margin: 0 auto; }
.massage-hero__copy { max-width: 660px; margin: 0 !important; padding: 58px 0; }
.massage-hero-kicker { margin: 0 0 12px !important; color: #eff5e6; font-size: 14px; letter-spacing: .18em; }
.massage-hero h1 { margin: 0 0 16px; color: #fff; font-size: clamp(34px, 5vw, 52px); line-height: 1.22; letter-spacing: .025em; text-shadow: 0 2px 18px rgba(0,0,0,.2); }
.massage-hero-lead { max-width: 560px; margin: 0 0 24px !important; color: #fff; font-size: 17px; line-height: 1.85; text-shadow: 0 1px 8px rgba(0,0,0,.24); }
.massage-hero__actions { margin: 0 !important; }
.massage-hero__actions .wp-block-button__link { border-radius: 999px; padding: 12px 25px; color: var(--massage-olive-dark); background: #fff; font-size: 15px; font-weight: 700; box-shadow: 0 4px 14px rgba(0,0,0,.12); }
.massage-shortcuts { position: relative; z-index: 2; width: min(calc(100% - 32px), 980px); margin: -28px auto 0 !important; padding: 20px 14px; border-radius: 12px; background: #fff; box-shadow: 0 6px 24px rgba(35,43,29,.1); box-sizing: border-box; }
.massage-shortcut-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.massage-shortcut { padding: 7px 5px; text-align: center; }
.massage-shortcut-number { margin: 0 0 4px !important; color: var(--massage-olive); font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.massage-shortcut h2, .massage-shortcut h3 { margin: 0 0 4px; color: var(--massage-ink); font-size: 16px; line-height: 1.35; }
.massage-shortcut p:last-child { margin: 0; color: var(--massage-soft-ink); font-size: 12px; line-height: 1.5; }
.massage-shortcut a { color: inherit; text-decoration: none; }
.massage-info-strip { width: min(calc(100% - 32px), 940px); margin: 18px auto 0 !important; padding: 12px 18px; border-radius: 8px; color: #755f20; background: var(--massage-yellow); text-align: center; font-size: 14px; line-height: 1.6; }
.massage-services, .massage-space, .massage-guidance { width: min(100%, 980px); margin: 0 auto !important; padding: 48px 20px; box-sizing: border-box; }
.massage-services { padding-top: 42px; }
.massage-section-heading { margin: 0 0 7px !important; text-align: center; color: var(--massage-ink); font-size: 29px; line-height: 1.35; }
.massage-section-lead { max-width: 650px; margin: 0 auto 25px !important; text-align: center; color: var(--massage-soft-ink); font-size: 14px; line-height: 1.8; }
.massage-service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.massage-service-card { min-height: 165px; padding: 20px; border-radius: 10px; background: #fff; box-shadow: 0 3px 12px rgba(35,43,29,.06); box-sizing: border-box; }
.massage-card-tag { display: inline-block; margin: 0 0 10px !important; padding: 4px 10px; border-radius: 999px; color: var(--massage-olive-dark); background: var(--massage-pale-green); font-size: 12px; line-height: 1.45; }
.massage-service-card h3 { margin: 0 0 8px; color: var(--massage-ink); font-size: 18px; line-height: 1.4; }
.massage-service-card p:last-child { margin: 0; color: var(--massage-soft-ink); font-size: 14px; line-height: 1.75; }
.massage-space { padding-top: 8px; }
.massage-space-panel { display: grid; grid-template-columns: 1.1fr 1.9fr; gap: 22px; align-items: center; padding: 25px; border-radius: 12px; background: #fff; }
.massage-space-mark { margin: 0 !important; color: var(--massage-pink); font-size: 13px; font-weight: 700; letter-spacing: .12em; }
.massage-space-panel h2 { margin: 6px 0 0; color: var(--massage-ink); font-size: 23px; line-height: 1.45; }
.massage-space-copy { margin: 0 !important; color: var(--massage-soft-ink); font-size: 14px; line-height: 1.85; }
.massage-guidance { padding-top: 0; }
.massage-guidance-panel { padding: 20px 22px; border: 1px solid #e5e7dc; border-radius: 10px; background: #f7f8f3; }
.massage-guidance-panel h2 { margin: 0 0 8px; color: var(--massage-olive-dark); font-size: 18px; }
.massage-guidance-panel p { margin: 0; color: var(--massage-soft-ink); font-size: 14px; line-height: 1.8; }
.massage-bottom-cta { margin: 0 !important; padding: 38px 20px; color: #fff; background: var(--massage-olive-dark); text-align: center; }
.massage-bottom-cta h2 { margin: 0 0 8px; color: #fff; font-size: 25px; line-height: 1.4; }
.massage-bottom-cta p { max-width: 650px; margin: 0 auto 18px !important; color: #edf2e7; font-size: 14px; line-height: 1.8; }
.massage-bottom-cta .wp-block-button__link { border-radius: 999px; padding: 10px 22px; color: var(--massage-olive-dark); background: #fff; font-weight: 700; }
.massage-footer { margin: 0 !important; padding: 25px 20px; color: #ededed; background: #171a16; text-align: center; }
.massage-footer p { margin: 0 !important; color: #ededed; font-size: 13px; line-height: 1.8; }
@media (max-width: 640px) {
  .massage-hero { min-height: 350px !important; }
  .massage-hero__copy { padding: 40px 0; }
  .massage-hero h1 { font-size: 34px; }
  .massage-hero-lead { font-size: 15px; }
  .massage-shortcuts { width: min(calc(100% - 24px), 980px); padding: 15px 8px; }
  .massage-shortcut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 4px; }
  .massage-shortcut { padding: 7px 3px; }
  .massage-shortcut h2, .massage-shortcut h3 { font-size: 15px; }
  .massage-info-strip { width: calc(100% - 24px); }
  .massage-services, .massage-space, .massage-guidance { padding-right: 12px; padding-left: 12px; }
  .massage-section-heading { font-size: 25px; }
  .massage-service-grid { gap: 9px; }
  .massage-service-card { min-height: 0; padding: 15px 13px; }
  .massage-service-card h3 { font-size: 16px; }
  .massage-service-card p:last-child { font-size: 13px; }
  .massage-space-panel { grid-template-columns: 1fr; gap: 10px; padding: 20px; }
  .massage-guidance-panel { padding: 17px; }
  .massage-bottom-cta h2 { font-size: 22px; }
}

/* Therapist profiles: native Query Loop cards and editable post templates. */
.massage-header .wp-block-site-title { margin: 0 !important; font-size: 21px; line-height: 1.2; letter-spacing: .04em; }
.massage-header .wp-block-site-title a { color: #fff; text-decoration: none; }
.massage-team { width: min(100%, 980px); margin: 0 auto !important; padding: 8px 20px 44px; box-sizing: border-box; }
.massage-therapist-grid .wp-block-post-template { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.massage-therapist-card { overflow: hidden; border-radius: 10px; background: #fff; box-shadow: 0 3px 12px rgba(35,43,29,.07); }
.massage-therapist-card .massage-therapist-photo { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: var(--massage-pale-green); }
.massage-therapist-card .massage-therapist-photo img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.massage-therapist-card__body { padding: 16px 18px 18px; }
.massage-therapist-card .wp-block-post-title { margin: 0 0 7px; font-size: 18px; line-height: 1.4; }
.massage-therapist-card .wp-block-post-title a { color: var(--massage-ink); text-decoration: none; }
.massage-therapist-card .wp-block-post-excerpt { margin: 0; color: var(--massage-soft-ink); font-size: 14px; line-height: 1.75; }
.massage-therapist-card .wp-block-post-excerpt__more-link { display: inline-block; margin-top: 6px; color: var(--massage-olive-dark); font-weight: 700; text-decoration: none; }
.massage-therapist-grid .wp-block-query-no-results { grid-column: 1 / -1; }
.massage-no-results { margin: 0 !important; padding: 22px; border-radius: 10px; background: #fff; color: var(--massage-soft-ink); text-align: center; }
.therapist-archive-page { width: min(calc(100% - 40px), 980px); margin: 0 auto !important; padding: 48px 0 64px; }
.therapist-single-page { width: min(calc(100% - 40px), 760px); margin: 42px auto 56px !important; padding: 26px; border-radius: 12px; background: #fff; box-sizing: border-box; }
.therapist-single-photo { margin: 0 auto 24px; max-width: 560px; border-radius: 9px; overflow: hidden; background: var(--massage-pale-green); }
.therapist-single-photo img { display: block; width: 100%; height: auto; object-fit: cover; }
.therapist-single-title { margin: 0 0 9px; text-align: center; color: var(--massage-ink); font-size: 30px; }
.therapist-single-excerpt { margin: 0 auto 24px; text-align: center; color: var(--massage-olive-dark); font-size: 16px; line-height: 1.75; }
.therapist-single-page .wp-block-post-content { line-height: 1.85; }
.therapist-single-page .wp-block-buttons { margin-top: 28px; }
@media (max-width: 640px) {
  .massage-team { padding-right: 12px; padding-left: 12px; }
  .massage-therapist-grid .wp-block-post-template { gap: 9px; }
  .massage-therapist-card__body { padding: 13px 12px 15px; }
  .massage-therapist-card .wp-block-post-title { font-size: 16px; }
  .massage-therapist-card .wp-block-post-excerpt { font-size: 13px; }
  .therapist-archive-page { width: calc(100% - 24px); padding-top: 34px; }
  .therapist-single-page { width: calc(100% - 24px); margin-top: 22px !important; padding: 16px; }
  .therapist-single-title { font-size: 25px; }
}

/* Reference-aligned structure: centered 980px page, olive header, portrait banner, information rows, two-column cards. */
.reference-page { width: min(100%, 980px); margin: 0 auto !important; box-sizing: border-box; background: #ededed; }
.reference-hero { min-height: 410px !important; margin: 0 !important; overflow: hidden; }
.reference-hero .wp-block-cover__background { opacity: .58 !important; }
.reference-hero .wp-block-cover__image-background { object-position: center center !important; }
.reference-hero .wp-block-cover__inner-container { width: 100% !important; max-width: none; margin: 0 auto; }
.reference-hero-copy { width: 100%; max-width: none; margin: 0 !important; padding: 0 25px; text-align: center; box-sizing: border-box; }
.reference-hero-kicker { margin: 0 0 8px !important; color: #eff4e6; font-size: 14px; letter-spacing: .12em; }
.reference-hero h1 { margin: 0 auto 8px; padding-top: 22px; color: #fff; font-size: 30px; line-height: 1.4; text-align: center; }
.reference-hero-description { margin: 0 auto !important; padding: 12px 0 50px; color: #fff; font-size: 18px; line-height: 30px; text-align: center; }
.reference-hero .wp-block-buttons { justify-content: center; margin-top: 0; }
.reference-hero .wp-block-button__link { border-radius: 5px; padding: 9px 22px; color: var(--massage-olive-dark); background: #fff; font-weight: 700; }
.reference-tel { margin: 0 !important; padding: 10px 20px 0; background: #fff; text-align: center; }
.reference-tel p { margin: 0 !important; }
.reference-tel a { color: var(--massage-olive); font-size: 28px; font-weight: 700; line-height: 50px; text-decoration: none; }
.reference-service-time { margin: 0 !important; padding: 0 20px 12px; background: #fff; text-align: center; }
.reference-service-time p { margin: 0 !important; }
.reference-service-time strong { display: inline-block; padding: 2px 20px; border: 1px solid #ccc; border-radius: 10px; color: #333; background: #fafafa; font-size: 14px; font-weight: 400; }
.reference-appbar { margin: 0 !important; padding: 4px 0 10px; background: #fff; }
.reference-appbar-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); }
.reference-appbar-item { position: relative; width: 100%; margin: 0 !important; text-align: center; }
.reference-appbar-icon { height: 25px; margin: 0 !important; color: #00b82e; font-size: 25px; line-height: 25px; }
.reference-appbar-icon a { color: inherit; text-decoration: none; }
.reference-appbar-label { margin: 5px 0 0 !important; color: #666; font-size: 12px; text-align: center; }
.reference-moreinfo { margin: 0 !important; padding: 0 20px 10px; border-bottom: 1px solid #ededed; background: #fff; }
.reference-moreinfo-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.reference-moreinfo-item { margin: 0 !important; padding: 8px 5px; border-radius: 5px; background: #f7f7f7; color: #555; font-size: 13px; text-align: center; }
.reference-address { margin: 0 !important; padding: 0 20px; color: #333; background: #e8e8e8; font-size: 14px; line-height: 50px; text-align: center; }
.reference-address strong { color: var(--massage-pink); font-size: 20px; }
.reference-service-notes { margin: 0 !important; padding: 8px 15px 5px; background: #fff; }
.reference-service-note { position: relative; display: flex; min-height: 39px; align-items: center; gap: 11px; margin: 0 !important; padding: 4px 5px; border-bottom: 1px solid #ededed; color: #4b4b4b; font-size: 14px; line-height: 1.45; }
.reference-service-note:last-child { border-bottom: 0; }
.reference-service-note strong { display: inline-flex; width: 24px; height: 24px; flex: 0 0 24px; align-items: center; justify-content: center; border-radius: 4px; color: #fff; background: #6b8e23; font-size: 14px; font-weight: 400; }
.reference-notice { height: 40px; margin: 0 !important; overflow: hidden; color: #333; background: #fff; font-size: 16px; line-height: 40px; white-space: nowrap; text-align: center; }
.reference-team { margin: 0 !important; padding: 0 0 18px; background: #dde5cc; }
.reference-section-title { margin: 0 !important; color: #000; font-size: 20px; line-height: 60px; text-align: center; }
.reference-title-pill { display: inline-block; padding: 5px 18px; border-radius: 999px; color: #fff; background: #6b8e23; line-height: 1.5; }
.reference-team-intro { margin: -5px auto 4px !important; padding: 0 20px 8px; color: #687064; font-size: 13px; line-height: 1.6; text-align: center; }
.reference-therapist-query { width: 100%; margin: 0 auto !important; }
.reference-therapist-query .wp-block-post-template { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0; margin: 0; padding: 0; list-style: none; }
.reference-therapist-card { margin: 0 5px 20px !important; padding: 10px; border-radius: 10px; background: #fff; box-sizing: border-box; }
.reference-therapist-badge { margin: 0 auto 8px !important; padding: 2px 12px; border-radius: 5px; color: #917536; background: #f5f2bd; font-size: 14px; line-height: 1.55; text-align: center; }
.reference-therapist-inner { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px; align-items: start; }
.reference-therapist-photo { min-height: 145px; margin: 0 !important; overflow: hidden; border-radius: 8px; background: #dde5cc; }
.reference-therapist-photo img { display: block; width: 100%; height: 100%; min-height: 145px; object-fit: cover; }
.reference-therapist-photo:empty::after { display: flex; min-height: 145px; align-items: center; justify-content: center; color: #6b8e23; content: "按摩师"; font-size: 14px; }
.reference-therapist-copy { min-width: 0; }
.reference-therapist-card .wp-block-post-title { margin: 0 0 7px !important; color: #20251d; font-size: 17px; line-height: 1.4; overflow-wrap: anywhere; }
.reference-therapist-card .wp-block-post-title a { color: inherit; text-decoration: none; }
.reference-therapist-card .wp-block-post-excerpt { margin: 0 !important; color: #555; font-size: 13px; line-height: 1.65; }
.reference-therapist-card .wp-block-post-excerpt__more-link { display: inline-block; margin-top: 4px; color: #6b8e23; text-decoration: none; }
.reference-focus-label { margin: 8px 0 0 !important; color: #917536; font-size: 12px; line-height: 1.5; }
.reference-focus-label a { color: inherit; text-decoration: none; }
.reference-therapist-query .wp-block-query-no-results { grid-column: 1 / -1; margin: 0 10px 16px; }
.reference-therapist-query .massage-no-results { padding: 22px; }
.reference-services { margin: 0 !important; padding: 0 0 20px; background: #dde5cc; }
.reference-service-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0; }
.reference-service-card { margin: 0 5px 10px !important; padding: 13px; border-radius: 10px; background: #fff; box-sizing: border-box; }
.reference-service-card h3 { margin: 0 0 7px; font-size: 17px; line-height: 1.4; }
.reference-service-card p { margin: 0; color: #555; font-size: 13px; line-height: 1.65; }
.reference-booking { margin: 0 !important; padding: 22px 20px; color: #333; background: #e8e8e8; text-align: center; }
.reference-booking h2 { margin: 0 0 7px; font-size: 18px; }
.reference-booking p { margin: 0 auto !important; max-width: 740px; font-size: 14px; line-height: 1.75; }
.reference-footer { margin: 0 !important; padding: 26px 20px; color: #ededed; background: #000; text-align: center; }
.reference-footer p { margin: 0 !important; color: #ededed; font-size: 14px; line-height: 1.8; }
@media (max-width: 640px) {
  .reference-hero { min-height: 360px !important; }
  .reference-hero h1 { padding-top: 24px; font-size: 28px; }
  .reference-hero-description { padding-bottom: 36px; font-size: 16px; }
  .reference-tel a { font-size: 24px; }
  .reference-moreinfo { padding-right: 10px; padding-left: 10px; }
  .reference-moreinfo-grid { gap: 5px; }
  .reference-moreinfo-item { padding: 8px 3px; font-size: 12px; }
  .reference-address { padding: 0 10px; font-size: 13px; }
  .reference-service-notes { padding-right: 10px; padding-left: 10px; }
  .reference-therapist-card { margin-right: 4px !important; margin-left: 4px !important; padding: 8px; }
  .reference-therapist-inner { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 6px; }
  .reference-therapist-photo, .reference-therapist-photo img, .reference-therapist-photo:empty::after { min-height: 118px; }
  .reference-therapist-card .wp-block-post-title { font-size: 15px; }
  .reference-therapist-card .wp-block-post-excerpt { font-size: 12px; }
  .reference-therapist-query .wp-block-post-template { gap: 0; }
  .reference-service-card { margin-right: 4px !important; margin-left: 4px !important; padding: 11px; }
}