/* ==========================================================================
   嶼心相連 Love∞ | 主樣式 — 淡粉紅磨砂風格
   ========================================================================== */
:root {
  --c-blush: #fef4f3; --c-pink-mist: #fbe5ec; --c-pink-soft: #f5d4dc;
  --c-lavender: #ece1ee; --c-peach-mist: #fde4d6; --c-blue-mist: #e0e9f3;
  --c-coral: #d6707d; --c-coral-soft: #e89299; --c-rose: #b65a68;
  --c-ink: #4a3a3f; --c-ink-2: #6f5a60; --c-ink-3: #a08f93;
  --c-line: rgba(74,58,63,0.1);
  --c-card-bg: rgba(255,255,255,0.45);
  --c-card-border: rgba(255,255,255,0.7);
  --shadow-soft: 0 18px 40px -22px rgba(150,90,110,0.22);
  --shadow-card: 0 10px 30px -12px rgba(150,90,110,0.14);
  --shadow-deep: 0 24px 60px -28px rgba(150,90,110,0.28);
  --font-serif: "Fraunces","Noto Serif TC","PingFang TC",serif;
  --font-sans: "Noto Sans TC",-apple-system,"PingFang TC",sans-serif;
  --font-en: "Cormorant Garamond","Fraunces","Noto Serif TC",serif;
  --max: 1200px; --max-narrow: 920px;
  --space: clamp(1rem, 4vw, 2rem);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:72px;}
body{margin:0; font-family:var(--font-sans); color:var(--c-ink); font-size:16px;
  line-height:1.75; letter-spacing:0.04em; background:var(--c-blush); overflow-x:hidden;}

.gradient-bg{
  position:fixed; inset:0; z-index:-3;
  background:
    radial-gradient(ellipse 70% 60% at 12% 8%, rgba(236,225,238,0.95) 0%, transparent 55%),
    radial-gradient(ellipse 60% 60% at 88% 18%, rgba(251,229,236,0.95) 0%, transparent 55%),
    radial-gradient(ellipse 55% 55% at 92% 88%, rgba(224,233,243,0.85) 0%, transparent 50%),
    radial-gradient(ellipse 60% 60% at 6% 85%, rgba(253,228,214,0.92) 0%, transparent 50%),
    linear-gradient(135deg,#f5e4ee 0%,#fde6e7 35%,#fce0d6 65%,#e3e8f3 100%);
  background-attachment:fixed; filter:saturate(0.92) brightness(1.04);
}
.grain{position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:0.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.95  0 0 0 0 0.85  0 0 0 0 0.85  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");}

h1,h2,h3,h4{font-family:var(--font-serif); font-weight:500; letter-spacing:0.18em; color:var(--c-ink); margin:0;}
p{margin:0 0 0.4em;} a{color:inherit; text-decoration:none;} img{max-width:100%; display:block;}

.section{padding:clamp(6rem,13vw,10rem) var(--space); position:relative; isolation:isolate;}
.section + .section{padding-top:clamp(7rem,14vw,11rem);}
.section-inner{max-width:var(--max); margin:0 auto; text-align:center;}
.section-inner.narrow{max-width:var(--max-narrow);}

.story{background:rgba(228,215,235,0.7);}

/* Story body — 2010 創辦故事 */
.story-body{
  max-width:620px;
  margin:2.4rem auto 0;
  padding:2.2rem 2.4rem;
  background:rgba(255,255,255,0.55);
  border:1px solid rgba(214,112,125,0.12);
  border-radius:20px;
  box-shadow:0 14px 38px -20px rgba(182,90,104,0.28);
  position:relative;
}
.story-body::before,
.story-body::after{
  content:"";
  position:absolute;
  width:40px; height:1px;
  background:linear-gradient(90deg,transparent,#e89299,transparent);
  left:50%; transform:translateX(-50%);
}
.story-body::before{top:14px;}
.story-body::after{bottom:14px;}
.story-para{
  margin:0;
  font-family:var(--font-serif);
  font-size:1.02rem;
  letter-spacing:0.14em;
  line-height:2.4;
  color:var(--c-ink);
  text-align:center;
  font-style:italic;
}
@media (max-width:640px){
  .story-body{padding:1.6rem 1.2rem;}
  .story-para{font-size:0.92rem; letter-spacing:0.08em; line-height:2.1;}
}
.journey{background:rgba(252,222,230,0.75);}
.plans{background:rgba(255,255,255,0.5);}
.gallery{background:rgba(218,230,245,0.7);}
.seven{background:rgba(250,215,224,0.78);}
.impact{background:rgba(228,215,235,0.75);}
.testimonials{background:rgba(254,230,218,0.78);}
.order{background:rgba(255,255,255,0.55);}
.faq{background:rgba(232,222,240,0.7);}
.final-cta{background:rgba(248,200,212,0.7);}

.eyebrow{font-family:var(--font-en); font-size:0.85rem; letter-spacing:0.5em; color:var(--c-coral); margin-bottom:1rem; text-transform:uppercase; font-weight:500;}
.section-title{font-size:clamp(1.7rem,3.6vw,2.6rem); letter-spacing:0.34em; margin-bottom:0.6em; line-height:1.7; color:var(--c-ink);}
.section-title.big{font-size:clamp(2.2rem,5vw,3.6rem); letter-spacing:0.36em; line-height:1.5;}
.section-en{font-family:var(--font-en); font-size:clamp(1rem,1.6vw,1.25rem); letter-spacing:0.18em; color:var(--c-ink-2); margin-bottom:2.6em; font-style:italic;}
.en-sub{font-family:var(--font-en); font-size:0.95rem; letter-spacing:0.15em; color:var(--c-ink-2); font-style:italic; margin:0.2em 0 0.6em;}
.lead{font-size:1.1rem; letter-spacing:0.32em; line-height:2.2; margin:1.5rem auto 3rem; color:var(--c-ink-2); font-family:var(--font-serif);}

.pill-btn{display:inline-flex; align-items:center; gap:0.7em; padding:0.85em 1.8em; border-radius:999px;
  background:rgba(255,255,255,0.55); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,0.7);
  color:var(--c-ink); font-family:var(--font-serif); font-size:0.95rem; letter-spacing:0.32em;
  font-weight:500; box-shadow:var(--shadow-soft); cursor:pointer; transition:transform .25s,box-shadow .25s; margin-top:1rem;}
.pill-btn:hover{transform:translateY(-2px); box-shadow:var(--shadow-deep);}
.pill-btn .play{color:var(--c-coral); font-size:0.9em; line-height:1;}
.pill-btn.solid{background:linear-gradient(135deg,#ffffff 0%,#fde0e6 55%,#f5c2cd 100%); border-color:#f5d4dc; color:var(--c-ink);}
.pill-btn.solid .play{color:var(--c-rose);}
.pill-btn.outline{background:transparent; border:1.5px solid var(--c-coral); color:var(--c-coral);}
.pill-btn.outline .play{color:var(--c-coral);}
.pill-btn.wide{padding:1.05em 2.4em; font-size:1rem;}

.site-header{position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between;
  padding:0.9rem clamp(1rem,4vw,2.5rem); background:rgba(254,244,243,0.7); backdrop-filter:blur(18px) saturate(1.1);
  border-bottom:1px solid rgba(255,255,255,0.5);}
.brand{display:flex; align-items:center; gap:0.7rem;}
.brand-logo{width:38px;}
.brand-name{display:flex; flex-direction:column; line-height:1; font-family:var(--font-serif);}
.brand-name b{font-weight:500; letter-spacing:0.22em; font-size:1rem; color:var(--c-ink);}
.brand-name em{font-style:italic; font-family:var(--font-en); letter-spacing:0.05em; font-size:0.78rem; color:var(--c-coral); margin-top:0.15em;}
.site-nav{display:flex; gap:1.6rem; font-size:0.88rem; letter-spacing:0.2em; color:var(--c-ink-2); font-family:var(--font-serif);}
.site-nav a:hover{color:var(--c-coral);}
.site-nav .nav-link-highlight{
  color:var(--c-coral);
  font-weight:500;
  position:relative;
  padding-left:0.9em;
}
.site-nav .nav-link-highlight::before{
  content:"";
  position:absolute;
  left:0; top:50%;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--c-coral);
  transform:translateY(-50%);
  animation:pulseDot 1.8s ease-in-out infinite;
}
@keyframes pulseDot{
  0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(214,112,125,0.4);}
  50%{opacity:0.7; box-shadow:0 0 0 6px rgba(214,112,125,0);}
}

/* 募資專頁橫幅 */
.campaign-banner{
  margin:clamp(5rem,10vw,8rem) auto 0;
  max-width:var(--max-content);
  padding:0 clamp(1rem,4vw,3rem);
}
.campaign-banner-inner{
  display:grid;
  grid-template-columns:1.5fr auto;
  gap:2.4rem;
  align-items:center;
  padding:2.6rem 2.8rem;
  background:linear-gradient(135deg, rgba(214,112,125,0.92), rgba(182,90,104,0.95));
  border-radius:26px;
  box-shadow:0 24px 60px -22px rgba(182,90,104,0.5);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.campaign-banner-inner::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 85% 10%, rgba(255,255,255,0.18), transparent 50%),
             radial-gradient(circle at 15% 90%, rgba(255,255,255,0.12), transparent 45%);
  pointer-events:none;
}
.campaign-text{position:relative;}
.campaign-tag{
  font-family:var(--font-en);
  font-size:0.78rem;
  letter-spacing:0.4em;
  color:#fde2e6;
  margin-bottom:1.1rem;
}
.campaign-title{
  font-family:var(--font-serif);
  font-size:clamp(1.4rem,2.6vw,2rem);
  letter-spacing:0.14em;
  line-height:1.7;
  margin:0 0 1rem;
  color:#fff;
  font-weight:500;
}
.campaign-sub{
  font-family:var(--font-serif);
  font-size:0.95rem;
  letter-spacing:0.1em;
  line-height:2;
  margin:0;
  color:rgba(255,255,255,0.88);
}
.campaign-cta-col{
  position:relative;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.8rem;
}
.campaign-cta{
  display:inline-flex;
  align-items:center;
  gap:0.6em;
  padding:1rem 1.8rem;
  background:#fff;
  color:var(--c-rose);
  font-family:var(--font-serif);
  font-size:1rem;
  letter-spacing:0.22em;
  font-weight:500;
  border-radius:999px;
  text-decoration:none;
  box-shadow:0 12px 28px -10px rgba(74,58,63,0.35);
  transition:transform 0.25s ease, box-shadow 0.25s ease;
  white-space:nowrap;
}
.campaign-cta:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 36px -12px rgba(74,58,63,0.45);
}
.campaign-arrow{
  font-size:0.9em;
  transition:transform 0.25s ease;
}
.campaign-cta:hover .campaign-arrow{transform:translateX(4px);}
.campaign-note{
  font-family:var(--font-serif);
  font-size:0.78rem;
  letter-spacing:0.22em;
  color:rgba(255,255,255,0.78);
  margin:0;
}
@media (max-width:780px){
  .campaign-banner-inner{
    grid-template-columns:1fr;
    padding:2rem 1.6rem;
    text-align:center;
  }
  .campaign-cta-col{margin-top:0.6rem;}
}

/* 願景頁引導橫幅 */
.vision-link-banner{
  margin:clamp(3rem,6vw,5rem) auto 0;
  max-width:var(--max-content);
  padding:0 clamp(1rem,4vw,3rem);
}
.vision-link-inner{
  display:grid;
  grid-template-columns:1.6fr auto;
  gap:2.4rem;
  align-items:center;
  padding:2.4rem 2.6rem;
  background:#fff;
  border:1px solid rgba(70,170,170,0.2);
  border-left:5px solid #2ca8a0;
  border-radius:18px;
  box-shadow:0 16px 36px -18px rgba(70,170,170,0.3);
}
.vision-link-tag{
  font-family:var(--font-en);
  font-size:0.75rem;
  letter-spacing:0.4em;
  color:#1f8580;
  margin-bottom:1rem;
}
.vision-link-title{
  font-family:var(--font-serif);
  font-weight:500;
  font-size:clamp(1.2rem,2.4vw,1.7rem);
  letter-spacing:0.14em;
  line-height:1.85;
  margin:0 0 0.9rem;
  color:var(--c-ink);
}
.hl-teal-text-on-light{ color:#1f8580; }
.vision-link-sub{
  font-family:var(--font-serif);
  font-size:0.92rem;
  letter-spacing:0.08em;
  line-height:2;
  color:var(--c-ink-2);
  margin:0;
}
.vision-link-cta{
  display:inline-flex;
  align-items:center;
  gap:0.5em;
  padding:0.95rem 1.7rem;
  background:#2ca8a0;
  color:#fff;
  font-family:var(--font-serif);
  font-size:0.95rem;
  letter-spacing:0.22em;
  font-weight:500;
  border-radius:999px;
  text-decoration:none;
  box-shadow:0 12px 26px -10px rgba(70,170,170,0.5);
  transition:all 0.25s ease;
  white-space:nowrap;
}
.vision-link-cta:hover{
  background:#1f8580;
  transform:translateY(-3px);
}
.vc-arrow{font-size:0.9em; transition:transform 0.25s ease;}
.vision-link-cta:hover .vc-arrow{transform:translateX(4px);}
@media (max-width:780px){
  .vision-link-inner{grid-template-columns:1fr; padding:1.8rem 1.6rem; text-align:center;}
}
.nav-tools{display:flex; align-items:center; gap:0.8rem;}
.nav-cta{padding:0.55em 1.2em; border-radius:999px; background:linear-gradient(135deg,#fff,#fce0e6);
  font-size:0.85rem; letter-spacing:0.18em; border:1px solid #f5d4dc; font-family:var(--font-serif); color:var(--c-ink);}
@media (max-width:980px){.site-nav{display:none;}}

.lang-switcher{position:relative;}
.lang-toggle{display:inline-flex; align-items:center; gap:0.4em; padding:0.5em 0.9em; border-radius:999px;
  background:rgba(255,255,255,0.55); backdrop-filter:blur(10px); border:1px solid rgba(214,112,125,0.25);
  font-family:var(--font-serif); font-size:0.85rem; letter-spacing:0.12em; color:var(--c-ink); cursor:pointer; transition:all .2s;}
.lang-toggle:hover{background:#fff; border-color:var(--c-coral); color:var(--c-coral);}
.lang-toggle .caret{font-size:0.7em; transition:transform .25s; opacity:0.6;}
.lang-switcher.open .lang-toggle .caret{transform:rotate(180deg);}
.lang-menu{list-style:none; margin:0; padding:0.4rem; position:absolute; top:calc(100% + 0.5rem); right:0;
  min-width:140px; background:rgba(255,255,255,0.92); backdrop-filter:blur(20px) saturate(1.2);
  border:1px solid rgba(255,255,255,0.7); border-radius:14px; box-shadow:0 18px 40px -16px rgba(150,90,110,0.3);
  opacity:0; transform:translateY(-6px); pointer-events:none; transition:opacity .2s,transform .2s; z-index:60;}
.lang-switcher.open .lang-menu{opacity:1; transform:translateY(0); pointer-events:auto;}
.lang-menu a{display:block; padding:0.55em 0.9em; font-family:var(--font-serif); font-size:0.88rem; letter-spacing:0.12em; color:var(--c-ink-2); border-radius:10px; transition:all .15s;}
.lang-menu a:hover{background:rgba(214,112,125,0.08); color:var(--c-coral);}
.lang-menu a.active{background:rgba(214,112,125,0.12); color:var(--c-rose); font-weight:500;}
.lang-menu a.active::before{content:"✓ "; opacity:0.7;}

/* Hero */
.hero{min-height:96vh; display:flex; align-items:center; justify-content:center; padding:4rem var(--space) 2rem; text-align:center; position:relative;}
.hero-inner{max-width:760px;}
.hero-logo{width:130px; margin:0 auto 2rem; opacity:0.95;}
.hero-title{font-size:clamp(1.6rem,3vw,2.2rem); letter-spacing:0.4em; font-weight:500; margin-bottom:1rem;}
.hero-spacer{height:clamp(2.5rem,6vh,5rem);}
.hero-zh{font-family:var(--font-serif); font-size:clamp(1.05rem,1.7vw,1.3rem); letter-spacing:0.55em; font-weight:500; color:var(--c-ink); margin-bottom:0.4em;}
.hero-en{font-family:var(--font-en); font-size:clamp(0.95rem,1.5vw,1.1rem); letter-spacing:0.18em; color:var(--c-ink-2); font-style:italic; margin-bottom:1.5rem;}
.hero-zh-2{font-family:var(--font-serif); font-size:clamp(0.92rem,1.3vw,1.05rem); letter-spacing:0.42em; font-weight:400; color:var(--c-coral); margin-top:1.2rem; padding-top:1.2rem; border-top:1px solid rgba(214,112,125,0.2); margin-bottom:0.3em;}
.hero-en-2{font-family:var(--font-en); font-size:clamp(0.82rem,1.2vw,0.95rem); letter-spacing:0.15em; color:var(--c-ink-3); font-style:italic; margin-bottom:2rem;}
.hero-cta-row{display:flex; gap:0.8rem; justify-content:center; flex-wrap:wrap; margin:1rem 0 2rem;}
.hero-trust{font-family:var(--font-serif); font-size:0.86rem; letter-spacing:0.22em; color:var(--c-ink-2); margin-top:1.5rem;}
.hero-scroll{position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); font-family:var(--font-serif); font-size:0.78rem; letter-spacing:0.36em; color:var(--c-ink-2); text-align:center;}
.scroll-line{width:1px; height:30px; background:var(--c-coral); margin:0.6rem auto 0; position:relative; overflow:hidden;}
.scroll-line::before{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent,var(--c-rose)); animation:scroll-down 1.8s ease-in-out infinite;}
@keyframes scroll-down{0%{transform:translateY(-100%);} 100%{transform:translateY(100%);}}

/* Founder */
.founder{padding:clamp(4rem,9vw,7rem) clamp(1rem,4vw,2.5rem); background:rgba(254,230,218,0.55);}
.founder-inner{max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center;}
@media (max-width:880px){.founder-inner{grid-template-columns:1fr;}}
.founder-photo{margin:0; border-radius:22px; overflow:hidden; border:8px solid #fff; box-shadow:0 28px 50px -22px rgba(150,90,110,0.45); aspect-ratio:3/2;}
.founder-photo img{width:100%; height:100%; object-fit:cover; transition:transform .8s;}
.founder-photo:hover img{transform:scale(1.04);}
.founder-text{text-align:left;}
.founder-quote{font-family:var(--font-serif); font-size:clamp(1.4rem,3vw,2.1rem); letter-spacing:0.32em; line-height:1.8; color:var(--c-ink); font-weight:500; margin-bottom:0.6em;}
.founder-quote-en{font-family:var(--font-en); font-style:italic; letter-spacing:0.15em; color:var(--c-ink-2); font-size:1rem; margin-bottom:1.5rem;}
.founder-divider{display:flex; align-items:center; gap:0.8em; color:var(--c-coral); margin:1.6rem 0;}
.founder-divider::before,.founder-divider::after{content:""; flex:1; max-width:60px; height:1px; background:var(--c-coral); opacity:0.5;}
.founder-bio{font-family:var(--font-serif); letter-spacing:0.15em; line-height:2.1; color:var(--c-ink); font-size:1rem; margin-bottom:0.8rem;}
.founder-name{font-family:var(--font-serif); letter-spacing:0.32em; color:var(--c-coral); font-size:1rem; font-weight:500; margin-top:0.4em;}

/* Story */
.story-grid{display:grid; grid-template-columns:1.4fr 1fr; gap:3rem; align-items:center; margin-top:2rem; text-align:left;}
@media (max-width:760px){.story-grid{grid-template-columns:1fr;}}
.story-text{font-family:var(--font-serif); letter-spacing:0.12em; line-height:2.1; color:var(--c-ink);}
.story-text p{margin-bottom:1.2rem;}
.story-emph{font-size:1.15rem; color:var(--c-coral); font-weight:500; letter-spacing:0.22em; border-left:3px solid var(--c-coral); padding-left:1rem; margin-top:1.4rem !important;}
.source-photo{margin:4rem auto 0; max-width:760px; position:relative; border-radius:22px; overflow:hidden; box-shadow:0 28px 60px -22px rgba(150,90,110,0.4); border:8px solid #fff; background:#fff;}
.source-photo img{width:100%; height:auto; aspect-ratio:4/5; object-fit:cover;}
.source-photo figcaption{position:absolute; left:0; right:0; bottom:0; padding:1.6rem 1.4rem 1.2rem; background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,0.55) 100%); color:#fff; text-align:left;}
.source-photo figcaption b{display:block; font-family:var(--font-serif); letter-spacing:0.32em; font-size:1rem; margin-bottom:0.4em;}
.source-photo figcaption span{display:block; font-family:var(--font-serif); letter-spacing:0.12em; font-size:0.85rem; line-height:1.8;}

.story-stats{display:grid; grid-template-columns:1fr 1fr; gap:1.2rem;}
.stat{background:var(--c-card-bg); border:1px solid var(--c-card-border); border-radius:18px; padding:1.4rem 1rem; text-align:center; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); backdrop-filter:blur(20px) saturate(1.2);}
.stat b{display:block; font-family:var(--font-en); font-size:2.2rem; font-weight:600; color:var(--c-coral); line-height:1;}
.stat b small{font-size:0.6em; color:var(--c-ink-3); margin-left:0.1em;}
.stat span{display:block; margin-top:0.5em; font-size:0.85rem; letter-spacing:0.22em; color:var(--c-ink-2); font-family:var(--font-serif);}

/* Practice strip (8 cards) */
.practice-strip-wrap{max-width:1180px; margin:2rem auto 3rem; padding:0 var(--space); text-align:center;}
.practice-strip-lead{font-family:var(--font-serif); letter-spacing:0.22em; color:var(--c-ink-2); font-size:0.92rem; margin-bottom:1.2rem; line-height:2;}
.practice-strip{display:grid; grid-template-columns:repeat(5,1fr); gap:0.8rem;}
.practice-strip.practice-strip-8{grid-template-columns:repeat(4,1fr); gap:0.9rem;}
@media (max-width:980px){.practice-strip.practice-strip-8{grid-template-columns:repeat(2,1fr);}}
@media (max-width:480px){.practice-strip.practice-strip-8{grid-template-columns:1fr;}}

.practice-card{display:flex; flex-direction:column; background:rgba(255,255,255,0.55); border:1px solid rgba(255,255,255,0.8);
  backdrop-filter:blur(20px) saturate(1.2); border-radius:14px; overflow:hidden; text-align:left; color:var(--c-ink);
  transition:transform .3s,box-shadow .3s; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7);}
.practice-card:hover{transform:translateY(-4px); box-shadow:0 18px 30px -14px rgba(150,90,110,0.3);}
.practice-1 .practice-img{background:linear-gradient(135deg,#f5d4dc 0%,#e89299 60%,#d6707d 100%);}
.practice-2 .practice-img{background:linear-gradient(135deg,#fce0d6 0%,#f3a96b 60%,#c89a3f 100%);}
.practice-3 .practice-img{background:linear-gradient(135deg,#d6e4ed 0%,#87afc4 60%,#5a8aa0 100%);}
.practice-4 .practice-img{background:linear-gradient(135deg,#d4e8dd 0%,#93b5a4 60%,#6b8e7f 100%);}
.practice-5 .practice-img{background:linear-gradient(135deg,#ece1ee 0%,#a698c7 60%,#7a6ca0 100%);}
.practice-6 .practice-img{background:linear-gradient(135deg,#f8e3d0 0%,#d4a380 60%,#a87959 100%);}
.practice-7 .practice-img{background:linear-gradient(135deg,#e8edd8 0%,#b5c79a 60%,#7a8959 100%);}
.practice-8 .practice-img{background:linear-gradient(135deg,#f3d8e3 0%,#d09ab2 60%,#a05a7a 100%);}
.practice-img{position:relative; aspect-ratio:5/4; display:flex; align-items:center; justify-content:center; border-bottom:1px solid rgba(255,255,255,0.6); overflow:hidden;}
.practice-img::after{content:""; position:absolute; inset:0; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.25 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>"); mix-blend-mode:soft-light; opacity:0.6; pointer-events:none;}
.practice-num{font-family:var(--font-en); font-size:2.4rem; font-weight:600; color:rgba(255,255,255,0.92); letter-spacing:0.05em; line-height:1; text-shadow:0 3px 12px rgba(0,0,0,0.18); z-index:1;}
.practice-info{flex:1; display:flex; flex-direction:column; padding:0.9rem 0.9rem 1rem; gap:0.15rem;}
.practice-info h3{font-family:var(--font-serif); font-size:0.88rem; letter-spacing:0.18em; color:var(--c-ink); margin-bottom:0.05em; font-weight:500; line-height:1.5;}
.practice-en{font-family:var(--font-en); font-style:italic; letter-spacing:0.08em; color:var(--c-coral); font-size:0.78rem; margin:0.05em 0 0.5em;}
.practice-link{font-family:var(--font-serif); font-size:0.78rem; letter-spacing:0.22em; color:var(--c-coral); align-self:flex-start; margin-top:auto;}

/* Journey 5 steps */
.journey-line{list-style:none; padding:0; margin:3rem 0 2.5rem; display:grid; grid-template-columns:repeat(5,1fr); gap:1.2rem; position:relative; text-align:center;}
.journey-line::before{content:""; position:absolute; top:38px; left:8%; right:8%; height:2px; background:linear-gradient(90deg,transparent,#f5d4dc,#f5d4dc,transparent); z-index:0;}
.journey-line li{background:var(--c-card-bg); border:1px solid var(--c-card-border); border-radius:22px; padding:2.2rem 1rem 1.6rem; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); position:relative; z-index:1; backdrop-filter:blur(20px) saturate(1.2);}
.dot-num{display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:50%; background:linear-gradient(135deg,#ffffff,#f5c2cd); color:var(--c-rose); font-family:var(--font-en); font-weight:600; font-size:1.05rem; margin:-2.4rem auto 0.8rem; box-shadow:var(--shadow-card); border:3px solid #fff;}
.journey-line h3{font-size:1.05rem; letter-spacing:0.32em; margin-bottom:0.1em;}
.journey-line p{color:var(--c-ink-2); font-size:0.92rem; line-height:1.8;}
@media (max-width:880px){.journey-line{grid-template-columns:1fr 1fr;} .journey-line::before{display:none;}}
@media (max-width:520px){.journey-line{grid-template-columns:1fr;}}

/* Plans */
.plan-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:2rem; max-width:880px; margin:0 auto;}
.plan-grid.plan-grid-3{grid-template-columns:repeat(3,1fr); max-width:1240px; gap:1.6rem;}
@media (max-width:1100px){.plan-grid.plan-grid-3{grid-template-columns:repeat(2,1fr); max-width:880px;}}
@media (max-width:720px){.plan-grid.plan-grid-3{grid-template-columns:1fr;}}

.plan-card{position:relative; background:var(--c-card-bg); border:1px solid var(--c-card-border); border-radius:26px; padding:2.2rem 1.8rem 2rem; text-align:center; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); display:flex; flex-direction:column; align-items:center; backdrop-filter:blur(22px) saturate(1.2);}
.plan-card.featured{background:linear-gradient(165deg,rgba(255,255,255,0.7) 0%,rgba(251,229,236,0.7) 100%); border-color:#f5d4dc; box-shadow:var(--shadow-deep);}
.plan-tag{position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:#fff; color:var(--c-ink-2); padding:0.35em 1em; border-radius:999px; font-family:var(--font-serif); font-size:0.78rem; letter-spacing:0.28em; border:1px solid var(--c-line); box-shadow:var(--shadow-card);}
.plan-tag.accent{background:linear-gradient(135deg,#e89299,#d6707d); color:#fff; border-color:transparent;}
.plan-hero{margin:-2.2rem -1.8rem 1.4rem; aspect-ratio:16/10; overflow:hidden; border-radius:22px 22px 0 0; background:#fdf6f3;}
.plan-hero img{width:100%; height:100%; object-fit:cover; transition:transform .8s;}
.plan-card:hover .plan-hero img{transform:scale(1.04);}
.plan-large .plan-hero{background:#1f1f1f;}

.arch{position:relative; width:100%; border:2px solid var(--c-coral); border-radius:999px 999px 14px 14px; padding:1.8rem 1.2rem 1.6rem; margin-bottom:1.4rem; color:var(--c-coral); background:rgba(255,255,255,0.4);}
.arch h3{color:var(--c-ink); font-size:1.18rem; letter-spacing:0.32em; margin-bottom:0.6em;}
.divider{display:flex; align-items:center; justify-content:center; margin:0.8em 0; color:var(--c-coral);}
.divider span{padding:0 0.8em; font-size:0.7em;}
.divider::before,.divider::after{content:""; flex:1; max-width:60px; height:1px; background:var(--c-coral);}
.plan-list{list-style:none; padding:0; margin:0.6em 0; font-family:var(--font-serif); letter-spacing:0.18em; color:var(--c-ink); font-size:0.95rem; line-height:2;}
.plan-list li::before{content:"✦"; color:var(--c-coral); margin-right:0.5em; font-size:0.8em;}
.plan-price .amount{font-family:var(--font-en); font-size:1.85rem; color:var(--c-rose); display:block; font-weight:600;}
.plan-price small{display:block; margin-top:0.4em; letter-spacing:0.18em; color:var(--c-ink-2); font-size:0.85rem;}
.plan-en{font-family:var(--font-en); font-style:italic; color:var(--c-ink-2); margin-top:0.6rem; letter-spacing:0.18em;}
.footnote{font-family:var(--font-en); font-style:italic; color:var(--c-ink-2); margin-top:3rem; letter-spacing:0.1em; font-size:0.95rem;}

/* Frames — 畫框選擇 */
.frames{background:rgba(254,238,224,0.55);}
.frame-colors{display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; max-width:920px; margin:2rem auto 0;}
@media (max-width:760px){.frame-colors{grid-template-columns:repeat(2,1fr); gap:1.2rem;}}
.frame-option{margin:0; text-align:center; transition:transform .3s;}
.frame-option:hover{transform:translateY(-6px);}
.frame-option img{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); border:6px solid #fff; background:#fff;}
.frame-option figcaption{margin-top:0.9rem;}
.frame-option b{display:block; font-family:var(--font-serif); letter-spacing:0.28em; color:var(--c-ink); font-size:0.95rem; font-weight:500;}
.frame-option span{display:block; font-family:var(--font-en); font-style:italic; font-size:0.82rem; color:var(--c-coral); margin-top:0.25em; letter-spacing:0.08em;}

.frame-sizes{margin:3.5rem auto 0; max-width:1000px; text-align:center;}
.frame-sizes img{width:100%; border-radius:22px; box-shadow:0 30px 60px -22px rgba(150,90,110,0.4); border:8px solid #fff;}
.frame-sizes figcaption{margin-top:1.4rem;}
.frame-sizes b{display:inline-block; font-family:var(--font-en); font-size:1.8rem; color:var(--c-rose); letter-spacing:0.05em; font-weight:600; background:rgba(255,255,255,0.6); padding:0.3em 1em; border-radius:999px; border:1px solid var(--c-line);}
.frame-sizes span{display:block; font-family:var(--font-serif); letter-spacing:0.22em; color:var(--c-ink-2); margin-top:0.9em; font-size:0.95rem; line-height:2;}

/* Gallery preview */
.gallery-text{max-width:600px; margin:1.5rem auto 3rem; color:var(--c-ink-2); font-family:var(--font-serif); letter-spacing:0.15em; line-height:2.2;}
.gallery-text p{margin-bottom:1.4rem;}
.gallery-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:1rem; margin-bottom:2rem;}
.gallery-grid figure{margin:0; border-radius:14px; overflow:hidden; background:#fff; aspect-ratio:1/1; box-shadow:var(--shadow-card); border:6px solid #fff; transition:transform .35s,box-shadow .35s; position:relative;}
.gallery-grid figure:hover{transform:translateY(-4px) rotate(-1deg); box-shadow:var(--shadow-deep);}
.gallery-grid img{width:100%; height:100%; object-fit:cover;}
.gallery-grid figcaption{position:absolute; bottom:6px; right:8px; font-family:var(--font-en); font-size:0.7rem; letter-spacing:0.1em; color:var(--c-ink-2); background:rgba(255,247,235,0.85); padding:0.1em 0.5em; border-radius:999px; font-weight:500;}
.gallery-note{font-family:var(--font-serif); letter-spacing:0.18em; color:var(--c-ink-3); font-size:0.9rem; margin-bottom:1.5rem;}
.gallery-cta-row{display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-top:1rem;}

/* Seven monthly */
.seven-grid{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; margin-top:3rem;}
@media (max-width:820px){.seven-grid{grid-template-columns:1fr;}}
.hearts-cluster{position:relative; width:100%; aspect-ratio:1/1; max-width:460px; margin:0 auto; isolation:isolate;}
.gift-box{position:absolute; bottom:4%; left:50%; transform:translateX(-50%); width:62%; z-index:2; filter:drop-shadow(0 12px 24px rgba(150,90,110,0.25));}
.floating-hearts{position:absolute; inset:0; z-index:3; pointer-events:none;}
.h-heart{position:absolute; width:24%; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; color:#fff; font-family:var(--font-serif); font-size:0.72rem; letter-spacing:0.16em; text-align:center; line-height:1.4;
  clip-path:path("M 50 90 C 22 70, 5 50, 5 30 C 5 14, 18 5, 30 8 C 40 11, 48 18, 50 28 C 52 18, 60 11, 70 8 C 82 5, 95 14, 95 30 C 95 50, 78 70, 50 90 Z");
  filter:drop-shadow(0 6px 14px rgba(164,74,38,0.3)); animation:heartFloat 4s ease-in-out infinite;}
.h-heart span{transform:translateY(-4%);}
.h-heart.h1{top:0%; left:38%; background:#d6707d; animation-delay:0s;}
.h-heart.h2{top:8%; left:14%; background:#f0a8b1; animation-delay:0.4s;}
.h-heart.h3{top:8%; left:62%; background:#f0a8b1; animation-delay:0.6s;}
.h-heart.h4{top:24%; left:-2%; background:#f5b5be; animation-delay:0.2s;}
.h-heart.h5{top:24%; left:78%; background:#f5b5be; animation-delay:0.8s;}
.h-heart.h6{top:24%; left:26%; background:#e89299; animation-delay:1.2s;}
.h-heart.h7{top:24%; left:50%; background:#e89299; animation-delay:1s;}
@keyframes heartFloat{0%,100%{transform:translateY(0) rotate(-2deg);} 50%{transform:translateY(-6px) rotate(2deg);}}
.sparkles{position:absolute; inset:0; z-index:1; pointer-events:none;}
.sparkles span{position:absolute; width:6px; height:6px; border-radius:50%; background:rgba(214,112,125,0.65); animation:sparkleFloat 3s ease-in-out infinite;}
.sparkles span:nth-child(1){top:22%; left:18%; animation-delay:0s;}
.sparkles span:nth-child(2){top:12%; left:70%; animation-delay:0.6s; width:4px; height:4px;}
.sparkles span:nth-child(3){top:38%; left:8%; animation-delay:1.2s; width:5px; height:5px;}
.sparkles span:nth-child(4){top:32%; left:86%; animation-delay:1.8s; width:4px; height:4px;}
.sparkles span:nth-child(5){top:50%; left:92%; animation-delay:0.3s; width:3px; height:3px;}
.sparkles span:nth-child(6){top:18%; left:48%; animation-delay:1.5s; width:5px; height:5px; background:rgba(245,181,190,0.7);}
@keyframes sparkleFloat{0%,100%{opacity:0.3; transform:translateY(0) scale(0.8);} 50%{opacity:1; transform:translateY(-12px) scale(1.1);}}
.seven-box-photo{margin:2.5rem auto 1rem; max-width:760px; text-align:center;}
.seven-box-photo img{width:100%; border-radius:22px; border:8px solid #fff; box-shadow:0 30px 60px -22px rgba(150,90,110,0.4); background:#fff;}
.seven-box-photo figcaption{margin-top:1.2rem; font-family:var(--font-serif); font-size:0.92rem; letter-spacing:0.18em; line-height:2; color:var(--c-ink-2); max-width:680px; margin-left:auto; margin-right:auto;}
.seven-text{text-align:left; color:var(--c-ink-2); font-family:var(--font-serif); letter-spacing:0.15em; line-height:2.1;}
.seven-text p{margin-bottom:1.4rem;}
.seven-text .emph{color:var(--c-ink); font-weight:500; font-size:1.05rem;}

/* Impact */
.impact-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.6rem; margin:3rem 0;}
.impact-card{background:var(--c-card-bg); border:1px solid var(--c-card-border); border-radius:22px; padding:2rem 1.6rem; text-align:left; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); backdrop-filter:blur(20px) saturate(1.2); display:flex; flex-direction:column;}
.impact-num{font-family:var(--font-en); font-size:2.2rem; color:var(--c-pink-soft); font-weight:600; margin-bottom:0.6rem;}
.impact-card h3{font-size:1.4rem; letter-spacing:0.4em; color:var(--c-coral); margin-bottom:0.1em;}
.impact-card ul{margin:1rem 0; padding-left:1.2em; color:var(--c-ink-2); letter-spacing:0.15em; line-height:2; flex:1;}
.impact-stat{margin-top:1rem; padding-top:1rem; border-top:1px dashed var(--c-line); display:flex; align-items:baseline; gap:0.8em;}
.impact-stat b{font-family:var(--font-en); font-weight:600; font-size:1.6rem; color:var(--c-rose);}
.impact-stat b small{font-size:0.55em; margin-left:0.15em; color:var(--c-ink-3);}
.impact-stat span{font-family:var(--font-serif); letter-spacing:0.18em; color:var(--c-ink-2); font-size:0.85rem;}

/* Testimonials */
.testimonial-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.4rem; margin-top:2rem;}
.testimonial-grid blockquote{background:var(--c-card-bg); border:1px solid var(--c-card-border); border-radius:22px; padding:2rem 1.6rem; margin:0; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); text-align:left; position:relative; font-family:var(--font-serif); letter-spacing:0.1em; line-height:2; backdrop-filter:blur(20px) saturate(1.2);}
.testimonial-grid blockquote::before{content:"\201C"; position:absolute; top:-10px; left:18px; font-family:var(--font-en); font-size:4rem; color:var(--c-coral); line-height:1;}
.testimonial-grid blockquote p{color:var(--c-ink); margin-top:0.6rem;}
.testimonial-grid footer{margin-top:1rem; font-size:0.86rem; color:var(--c-ink-2); letter-spacing:0.18em;}
.testimonial-grid footer b{color:var(--c-coral); margin-right:0.4em;}

/* Order */
.order{padding-bottom:6rem;}
.trust-row{display:flex; flex-wrap:wrap; gap:0.6rem; justify-content:center; margin:2rem 0;}
.trust-row span{background:rgba(255,255,255,0.5); backdrop-filter:blur(12px); padding:0.4em 1em; border-radius:999px; border:1px solid var(--c-line); font-size:0.82rem; letter-spacing:0.18em; color:var(--c-ink-2); font-family:var(--font-serif);}
.trust-row span::before{content:"✓ "; color:var(--c-coral); font-weight:600;}
.order-form{background:rgba(255,255,255,0.55); border:1px solid rgba(255,255,255,0.8); border-radius:24px; padding:clamp(1.4rem,4vw,2.6rem); box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); text-align:left; margin-top:2rem; backdrop-filter:blur(22px) saturate(1.2);}
.order-form fieldset{border:none; padding:0; margin:0 0 1.6rem;}
.order-form legend{font-family:var(--font-serif); letter-spacing:0.28em; color:var(--c-ink); margin-bottom:0.8rem; padding:0; font-size:0.95rem;}
.plan-radio{display:block; margin-bottom:0.9rem; cursor:pointer;}
.plan-radio input{position:absolute; opacity:0; pointer-events:none;}
.radio-card{display:grid; grid-template-columns:1fr auto; gap:0.4rem 1rem; padding:1.1rem 1.3rem; border:1.5px solid var(--c-line); border-radius:16px; background:#fff; transition:all .2s;}
.radio-card b{letter-spacing:0.28em; font-family:var(--font-serif); font-weight:500;}
.radio-card em{font-family:var(--font-en); font-style:normal; color:var(--c-rose); font-weight:600; font-size:1.1rem;}
.radio-card small{grid-column:1/-1; color:var(--c-ink-2); letter-spacing:0.12em; font-size:0.85rem;}
.plan-radio input:checked + .radio-card{border-color:var(--c-coral); background:#fef3f5; box-shadow:0 0 0 4px rgba(214,112,125,0.12);}
.inline-radio{display:inline-flex; align-items:center; gap:0.4em; margin-right:1rem; cursor:pointer; padding:0.4em 1em; border-radius:999px; border:1.5px solid var(--c-line); background:#fff; transition:all .2s; font-family:var(--font-serif); letter-spacing:0.22em; font-size:0.92rem;}
.inline-radio input{accent-color:var(--c-coral);}
.inline-radio:has(input:checked){border-color:var(--c-coral); background:#fef3f5;}
.order-form input[type="text"],.order-form input[type="tel"],.order-form input[type="email"],.order-form textarea{width:100%; padding:0.75em 1em; border:1.5px solid var(--c-line); border-radius:12px; font:inherit; background:#fff; color:var(--c-ink);}
.order-form input:focus,.order-form textarea:focus{outline:none; border-color:var(--c-coral); box-shadow:0 0 0 3px rgba(214,112,125,0.15);}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:0.8rem 1rem;}
.grid-2 label{display:flex; flex-direction:column; gap:0.4em; font-size:0.9rem; letter-spacing:0.18em; color:var(--c-ink-2); font-family:var(--font-serif);}
.grid-2 .full{grid-column:1/-1;}
@media (max-width:600px){.grid-2{grid-template-columns:1fr;}}
.agree{display:flex; gap:0.6rem; align-items:flex-start; font-size:0.88rem; letter-spacing:0.1em; color:var(--c-ink-2); margin:1.4rem 0 0.8rem;}
.agree input{accent-color:var(--c-coral); margin-top:0.3em;}
.form-note{margin-top:0.8rem; text-align:center; font-size:0.82rem; color:var(--c-ink-3); letter-spacing:0.12em;}
.order-success{text-align:center; padding:3rem 1rem;}

/* FAQ */
.faq details{background:var(--c-card-bg); border:1px solid var(--c-card-border); border-radius:16px; padding:1.2rem 1.4rem; margin-bottom:0.8rem; text-align:left; box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.7); backdrop-filter:blur(20px) saturate(1.2);}
.faq details[open]{background:rgba(255,255,255,0.85);}
.faq summary{cursor:pointer; font-family:var(--font-serif); letter-spacing:0.22em; font-size:1rem; color:var(--c-ink); list-style:none; display:flex; align-items:center; justify-content:space-between; gap:1rem;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; font-family:var(--font-en); font-size:1.4rem; color:var(--c-coral);}
.faq details[open] summary::after{content:"−";}
.faq details p{margin-top:1rem; color:var(--c-ink-2); letter-spacing:0.1em; line-height:2; font-family:var(--font-serif);}

/* Final CTA */
.final-cta{text-align:center; padding:clamp(5rem,12vw,9rem) var(--space);}
.final-cta-row{display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-top:2rem;}

/* Footer */
.site-footer{background:linear-gradient(180deg,transparent 0%,rgba(245,212,220,0.6) 60%); padding-top:4rem; margin-top:2rem;}
.footer-inner{max-width:var(--max); margin:0 auto; padding:0 var(--space) 3rem; display:grid; grid-template-columns:2fr 1fr 1.4fr; gap:2.4rem;}
@media (max-width:760px){.footer-inner{grid-template-columns:1fr;}}
.foot-brand img{width:64px; margin-bottom:0.8rem;}
.foot-brand h3{font-size:1.05rem; letter-spacing:0.28em; margin-bottom:0.4em;}
.foot-brand p{color:var(--c-ink-2); letter-spacing:0.1em; font-family:var(--font-serif);}
.foot-nav h4,.foot-contact h4{font-size:0.95rem; letter-spacing:0.28em; margin-bottom:0.8rem; color:var(--c-rose);}
.foot-nav a{display:block; padding:0.2em 0; color:var(--c-ink-2);}
.foot-nav a:hover{color:var(--c-coral);}
.foot-contact p{margin-bottom:0.4em; font-size:0.9rem; color:var(--c-ink-2);}
.foot-copyright{border-top:1px solid rgba(61,42,31,0.1); padding:1.2rem var(--space); text-align:center; color:var(--c-ink-3); font-size:0.82rem; letter-spacing:0.18em;}

/* Reveal animation */
.reveal{opacity:0; transform:translateY(20px); transition:opacity .9s ease,transform .9s ease;}
.reveal.in{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1; transform:none;} html{scroll-behavior:auto;} .scroll-line::before{animation:none;}}