:root{
  --cream:#FBF3EE;
  --pink:#E8A0A8;
  --pink-deep:#C97A85;
  --ink:#3A2E2E;
  --ink-soft:#6B5A5A;
  --line:#EAD8D4;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
  font-family:"Noto Sans TC","PingFang HK","Microsoft JhengHei",sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.9;
}
a{color:var(--pink-deep); text-decoration:none;}

header{
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
  position:sticky; top:0;
  background:rgba(251,243,238,0.95);
  backdrop-filter:blur(6px);
  z-index:10;
}
header .brand{font-weight:700; font-size:18px; letter-spacing:0.5px;}
header nav a{font-size:14px; color:var(--ink-soft); margin-left:16px;}

.breadcrumb{
  max-width:680px; margin:16px auto 0; padding:0 20px;
  font-size:13px; color:var(--ink-soft);
}

.hero{ padding:40px 24px 28px; text-align:center; }
.hero .eyebrow{
  font-size:13px; color:var(--pink-deep); letter-spacing:2px;
  text-transform:uppercase; margin-bottom:10px;
}
.hero h1{ font-size:24px; line-height:1.55; font-weight:700; margin-bottom:12px; }
.hero p{ font-size:15px; color:var(--ink-soft); max-width:560px; margin:0 auto; }

main{ max-width:680px; margin:0 auto; padding:0 20px 60px; }

article.post{
  background:#fff; border:1px solid var(--line); border-radius:18px;
  padding:32px 24px; margin-bottom:24px;
}
article.post .tag{
  display:inline-block; font-size:12px; color:var(--pink-deep);
  background:#FBEAEA; padding:4px 12px; border-radius:20px; margin-bottom:14px;
}
article.post h2{ font-size:21px; line-height:1.5; margin-bottom:16px; }
article.post h3{ font-size:17px; margin:28px 0 10px; color:var(--pink-deep); }
article.post p{ font-size:15.5px; color:var(--ink); margin-bottom:14px; }
article.post hr{ border:none; border-top:1px solid var(--line); margin:26px 0; }
article.post .hashtags{ font-size:13px; color:var(--ink-soft); margin-top:8px; }

.qa{
  background:var(--cream); border:1px solid var(--line); border-radius:12px;
  padding:16px 18px; margin:14px 0;
}
.qa .q{ font-weight:700; color:var(--pink-deep); margin-bottom:6px; font-size:15.5px;}
.qa .a{ font-size:15px; color:var(--ink); margin:0; }

.faq-section h3{ color:var(--ink); }

.related{
  background:#fff; border:1px solid var(--line); border-radius:18px;
  padding:24px; margin-bottom:24px;
}
.related h3{ font-size:16px; color:var(--pink-deep); margin-bottom:12px; }
.related ul{ list-style:none; }
.related li{ margin-bottom:8px; font-size:14.5px; }

.hub-card{
  display:block; background:#fff; border:1px solid var(--line);
  border-radius:16px; padding:22px 20px; margin-bottom:16px;
}
.hub-card .tag{
  display:inline-block; font-size:12px; color:var(--pink-deep);
  background:#FBEAEA; padding:3px 10px; border-radius:20px; margin-bottom:10px;
}
.hub-card h2{ font-size:17px; color:var(--ink); margin-bottom:8px; line-height:1.5;}
.hub-card p{ font-size:14px; color:var(--ink-soft); }

.cta{
  text-align:center; padding:36px 20px; background:#fff;
  border:1px solid var(--line); border-radius:18px; margin-top:12px;
}
.cta p{ font-size:14px; color:var(--ink-soft); margin-bottom:16px;}
.cta a.btn{
  display:inline-block; background:var(--pink); color:#fff;
  padding:12px 28px; border-radius:30px; font-size:15px; font-weight:600;
}

footer{
  text-align:center; padding:24px; font-size:13px;
  color:var(--ink-soft); border-top:1px solid var(--line);
}