*{ margin:0; padding:0; box-sizing:border-box; }
:root{
  --bg:     #332B33;
  --bg-2:   #3D343D;
  --cream:  #F2ECE8;
  --line:   #4A404A;
  --violet: #9098C4;
  --sage:   #8FAFA0;
  --rose:   #D89A8E;
  --bark:   #F2ECE8;
  --mid:    #C9BEB8;
  --muted:  #A6979E;
  /* 舊變數名稱別名,供仍引用舊命名的頁面(如 five.css)沿用 */
  --gold:   #D89A8E;
  --gold-d: #B97A70;
  --warm:   #3D343D;
}
html{ scroll-behavior:smooth; }
body{
  font-family:'Noto Sans TC',sans-serif;
  background:var(--bg);
  color:var(--bark);
  font-weight:400;
  line-height:1.8;
}
a{ color:inherit; text-decoration:none; }

/* ── NAV ── */
nav{
  position:fixed; top:0; left:0; width:100%; z-index:100;
  display:flex; justify-content:space-between; align-items:center;
  padding:0 6vw; height:68px;
  background:rgba(51,43,51,.88);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.logo{
  font-family:'Noto Serif TC',serif;
  font-size:20px; letter-spacing:.1em; color:var(--cream);
}
.logo span{ color:var(--rose); }
.nav-links{ display:flex; gap:2.2rem; }
.nav-links a{ font-size:14px; color:var(--mid); letter-spacing:.05em; transition:color .2s; }
.nav-links a:hover{ color:var(--rose); }

/* ── LOGO GROUP（聯名）── */
.logo-group{ display:flex; align-items:center; gap:10px; }
.logo-divider{ color:var(--rose); font-size:14px; opacity:0.8; }
.partner-logo{ height:32px; vertical-align:middle; filter:brightness(0) invert(1) opacity(.85); }
.partner-name{
  font-size:15px; color:var(--mid);
  font-family:'Noto Serif TC',serif;
  letter-spacing:1px;
}

/* ── HERO ── */
.hero{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  text-align:left;
  padding:100px 8vw 60px;
  position:relative;
  overflow:hidden;
}
.hero-bg{ position:absolute; inset:0; pointer-events:none; }
.hero-bg svg{ width:100%; height:100%; position:absolute; inset:0; }
.hero-text{
  position:relative; z-index:2;
  display:flex; flex-direction:column;
  align-items:flex-start;
  max-width:480px;
}
.hero-eyebrow{
  font-size:11px; letter-spacing:.28em; color:var(--rose);
  text-transform:uppercase; margin-bottom:1.4rem;
}
.hero-text h1{
  font-family:'Noto Serif TC',serif;
  font-size:clamp(34px,5vw,54px);
  font-weight:500; line-height:1.5;
  letter-spacing:.04em; color:var(--cream);
  margin-bottom:1.4rem;
}
.hero-text h1 em{
  font-style:normal;
  background:var(--rose); opacity:.92; color:var(--bg);
  padding:0 8px;
}
.hero-text p{
  font-size:15px; color:var(--mid); line-height:2;
  margin-bottom:2.2rem; max-width:420px;
}
.hero-btn{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--cream); color:var(--bg);
  padding:12px 30px; border-radius:22px 4px 22px 4px;
  font-size:13px; letter-spacing:.06em;
  transition:opacity .2s;
}
.hero-btn:hover{ opacity:.85; }

/* ── SECTION BASE ── */
section{ padding:6rem 10vw; }
.label{
  display:block; font-size:11px; letter-spacing:.24em;
  color:var(--rose); text-transform:uppercase; margin-bottom:.8rem;
}
.sec-title{
  font-family:'Noto Serif TC',serif;
  font-size:clamp(24px,3vw,34px); font-weight:500;
  color:var(--cream); letter-spacing:.03em; margin-bottom:3rem;
}

/* ── SERVICES ── */
.services{ background:var(--bg-2); }
.svc-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
}
.svc{
  padding:2.2rem 1.8rem 1.8rem;
  border-left:1px dashed var(--line);
  display:flex; flex-direction:column;
}
.svc:nth-child(1){ padding-top:2.2rem; border-left:none; }
.svc:nth-child(2){ padding-top:3.4rem; }
.svc:nth-child(3){ padding-top:1.6rem; }
.svc:nth-child(4){ padding-top:3rem; }
.svc-icon{ margin-bottom:.9rem; display:block; }
.svc-icon line{ stroke-linecap:round; stroke-width:2.6; }
.svc:nth-child(1) .svc-icon line{ stroke:var(--violet); }
.svc:nth-child(2) .svc-icon line{ stroke:var(--rose); }
.svc:nth-child(3) .svc-icon line{ stroke:var(--sage); }
.svc:nth-child(4) .svc-icon line{ stroke:var(--cream); }
.svc h3{
  font-family:'Noto Serif TC',serif;
  font-size:18px; font-weight:500;
  color:var(--cream); margin-bottom:.7rem;
}
.svc p{ font-size:13px; color:var(--mid); line-height:1.9; flex:1; }
.svc-link{
  display:inline-block; margin-top:1.1rem;
  font-size:12px; letter-spacing:.08em; color:var(--rose);
  border-bottom:1px solid var(--rose);
  padding-bottom:2px;
  transition:opacity .2s;
  align-self:flex-start;
}
.svc-link:hover{ opacity:.75; }

/* ── ORIGIN ── */
.origin{ background:var(--bg); }
.origin-inner{
  display:grid; grid-template-columns:1fr 1fr;
  gap:6rem; align-items:center; max-width:1000px;
}
.origin-text h2{
  font-family:'Noto Serif TC',serif;
  font-size:clamp(26px,3vw,38px); font-weight:500;
  line-height:1.7; letter-spacing:.03em;
  color:var(--cream);
  margin-bottom:1.6rem;
}
.origin-text p{ font-size:15px; color:var(--mid); line-height:2.1; margin-bottom:1rem; }
.origin-hexagram{ display:flex; justify-content:center; }
.origin-hexagram line{ stroke-linecap:round; }

/* ── PROCESS ── */
.process{ background:var(--bg-2); }
.process-list{ max-width:800px; border-top:1px solid var(--line); }
.process-item{
  display:grid; grid-template-columns:60px 1fr 2fr;
  gap:2rem; padding:2rem 0;
  border-bottom:1px dashed var(--line);
  align-items:start;
}
.process-item .num{ display:flex; align-items:center; padding-top:2px; }
.process-item .num svg line{ stroke-linecap:round; stroke:var(--rose); stroke-width:2.4; }
.process-item h3{
  font-family:'Noto Serif TC',serif;
  font-size:18px; font-weight:500; color:var(--cream);
}
.process-item p{ font-size:14px; color:var(--mid); line-height:1.9; }

/* ── QUOTE BLOCK ── */
.quote-block{
  background:#2A232A;
  text-align:center;
  padding:5rem 2rem;
  position:relative;
  overflow:hidden;
}
.quote-block p{
  font-family:'Noto Serif TC',serif;
  font-size:clamp(18px,2.5vw,26px);
  font-weight:500;
  line-height:2;
  letter-spacing:.08em;
  color:var(--cream);
  margin:0; position:relative; z-index:2;
}
.quote-line{
  width:40px; height:1px;
  background:var(--rose);
  margin:0 auto 1.5rem;
  position:relative; z-index:2;
}
.quote-block p + .quote-line{ margin:1.5rem auto 0; }

/* ── FOOTER ── */
footer{
  background:#241E24;
  padding:2.4rem 2rem;
  text-align:center;
  font-size:13px; letter-spacing:.08em; line-height:2.2;
}
.footer-copy{ color:var(--muted); }
.footer-slogan{ display:block; color:#6E626C; font-size:12px; letter-spacing:.1em; }
.footer-copy a{
  display:block; margin-top:.4rem;
  color:var(--rose); font-size:13px;
  letter-spacing:.08em; text-decoration:none;
}
.footer-copy a:hover{ opacity:.8; }

/* ── 圖片浮動檢視視窗 ── */
.img-lightbox{
  position:fixed; inset:0; z-index:999;
  background:rgba(20,16,20,.86);
  display:none; align-items:center; justify-content:center;
  padding:24px;
}
.img-lightbox.open{ display:flex; }
.img-lightbox img{
  max-width:92vw; max-height:88vh;
  border-radius:4px;
  border:1px solid var(--line);
}
.img-lightbox-close{
  position:absolute; top:18px; right:20px;
  width:40px; height:40px; border-radius:50%;
  background:var(--bg-2); border:1px solid var(--line);
  color:var(--cream); font-size:18px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}

/* ── 療癒淨化連結 ── */
.healing-link-wrap{ padding:2rem 0; display:flex; flex-wrap:wrap; gap:16px; }
.healing-link{
  display:flex; align-items:center; gap:16px;
  background:var(--bg-2);
  border:1px solid var(--line);
  border-radius:4px;
  padding:16px 22px;
  text-decoration:none;
  flex:1 1 300px;
  max-width:400px;
  transition:border-color .2s;
}
.healing-link:hover{ border-color:var(--rose); }
.healing-icon{
  width:38px; height:38px; flex-shrink:0;
  border:1px solid var(--rose); border-radius:2px;
  display:flex; align-items:center; justify-content:center;
  font-family:'Noto Serif TC',serif; color:var(--rose); font-size:16px;
}
.healing-text{ flex:1; }
.healing-title{
  font-family:'Noto Serif TC',serif;
  font-size:16px; color:var(--cream);
  letter-spacing:.05em; margin-bottom:4px;
}
.healing-sub{ font-size:12px; color:var(--muted); line-height:1.6; }
.healing-arrow{ color:var(--rose); font-size:22px; flex-shrink:0; }