/* =========================================================
   theme.css — 風格 preset：現代活潑（英文平台特搜）
   刻意與婦產科「溫柔圓潤（置中/暖粉/大圓角/柔光）」不同家族：
   - 骨架：左對齊、分割式 Hero
   - 字體：特粗無襯線大字
   - 色彩：靛紫主色＋珊瑚亮點（雙色）
   - 卡片：白底中圓角＋清晰陰影，hover 升起＋靛紫外框
   - 形狀：中圓角、方正按鈕（非藥丸）
   ========================================================= */
:root{
  --bg:#f6f6fb; --surface:#ffffff; --tint:#eeecff; --line:rgba(40,30,90,.12);
  --brand:#6c5ce7; --brand-deep:#5b4bd6; --brand-dark:#3d2fae; --accent:#ff7a59;
  --ink:#1e1b34; --ink-soft:#6a6683;
  --font-title:'Noto Sans TC',sans-serif; --font-body:'Noto Sans TC',sans-serif;
  --r:14px; --r-sm:10px;
  --shadow:0 18px 40px -20px rgba(60,40,150,.45);
  --shadow-soft:0 10px 26px -16px rgba(60,40,150,.35);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:var(--font-body);color:var(--ink);background:var(--bg);line-height:1.85;font-weight:400;}
h1,h2,h3,h4{font-family:var(--font-title);font-weight:800;color:var(--ink);letter-spacing:-.01em;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;height:auto;}
.container{max-width:1120px;margin:0 auto;padding:0 28px;}
.container.narrow{max-width:740px;}
.container.mid{max-width:920px;}

/* 頁首 */
header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(246,246,251,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.nav{max-width:1200px;margin:0 auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;height:72px;}
.logo{font-family:var(--font-title);font-size:1.3rem;font-weight:900;color:var(--brand-deep);letter-spacing:-.02em;display:flex;align-items:center;gap:8px;}
.nav-links{display:flex;gap:8px;font-size:.94rem;font-weight:600;}
.nav-links a{color:var(--ink-soft);padding:8px 14px;border-radius:var(--r-sm);transition:.2s;}
.nav-links a:hover{color:var(--brand-deep);background:var(--tint);}
.back-link{font-size:.92rem;font-weight:700;color:#fff;background:var(--brand-deep);padding:9px 18px;border-radius:var(--r-sm);transition:.2s;}
.back-link:hover{background:var(--brand-dark);}

/* Hero：左對齊大標題 + 右側彩色漸層區塊 */
.page-hero,.topic-hero,.article-hero{position:relative;overflow:hidden;background:var(--surface);border-bottom:1px solid var(--line);}
.page-hero{padding:126px 0 54px;}.topic-hero{padding:126px 0 54px;}.article-hero{padding:140px 0 48px;}
.page-hero>.container,.topic-hero>.container{position:relative;}
.eyebrow{display:inline-block;font-size:.76rem;font-weight:800;letter-spacing:.14em;color:var(--brand-deep);background:var(--tint);padding:6px 14px;border-radius:var(--r-sm);margin-bottom:16px;text-transform:uppercase;}
.hero-crumb{font-size:.84rem;color:var(--ink-soft);margin-bottom:14px;}
.hero-crumb a{color:var(--brand-deep);font-weight:600;}
.page-hero h1,.topic-hero h1{font-size:clamp(2.1rem,5vw,3.3rem);line-height:1.1;margin-bottom:18px;max-width:660px;position:relative;z-index:2;}
.article-hero h1{font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.2;margin-bottom:16px;max-width:680px;}
.page-hero h1 em,.topic-hero h1 em{color:var(--brand);font-style:normal;}
.hero-lead{color:var(--ink-soft);max-width:560px;font-size:1.1rem;position:relative;z-index:2;}
.tag{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.06em;color:#fff;background:var(--accent);padding:6px 14px;border-radius:var(--r-sm);margin-bottom:18px;}
.article-meta{font-size:.88rem;color:var(--accent);font-weight:700;}
.hero-actions{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap;position:relative;z-index:2;}
.page-hero::after,.topic-hero::after{content:"";position:absolute;right:-80px;top:-40px;bottom:-40px;width:42%;
  background:linear-gradient(150deg,var(--brand) 0%,#8a7bff 55%,var(--accent) 130%);transform:skewX(-8deg);opacity:.92;z-index:1;
  border-radius:36px;}

/* 區段標題 */
main{padding:60px 0 90px;}
.list-title{font-size:1.6rem;font-weight:800;margin-bottom:22px;display:flex;align-items:center;gap:12px;}
.list-title::before{content:"";width:26px;height:6px;border-radius:3px;background:var(--accent);}

/* 卡片：白底中圓角＋陰影，hover 升起＋靛紫框 */
.card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
.card-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--shadow-soft);transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;flex-direction:column;}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--brand);}
.card .article-tag{align-self:flex-start;font-size:.76rem;font-weight:800;letter-spacing:.06em;color:var(--brand-deep);background:var(--tint);padding:5px 13px;border-radius:var(--r-sm);margin-bottom:14px;}
.card h3{font-size:1.18rem;line-height:1.4;margin-bottom:10px;}
.card p{font-size:.95rem;color:var(--ink-soft);flex:1;}
.card .more{margin-top:16px;font-size:.88rem;font-weight:700;color:var(--brand-deep);}
.topic-nav{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 34px;}
.topic-nav a{display:inline-flex;align-items:center;gap:6px;font-size:.94rem;font-weight:700;color:var(--brand-deep);background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:9px 18px;transition:.2s;}
.topic-nav a:hover,.topic-nav a.active{background:var(--brand-deep);color:#fff;border-color:var(--brand-deep);}
.article-list{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.article-card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow-soft);transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;flex-direction:column;}
.article-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--brand);}
.article-card .article-tag{align-self:flex-start;font-size:.76rem;font-weight:800;letter-spacing:.06em;color:var(--brand-deep);background:var(--tint);padding:5px 13px;border-radius:var(--r-sm);margin-bottom:14px;}
.article-card h3{font-size:1.16rem;line-height:1.45;margin-bottom:10px;}
.article-card p{font-size:.95rem;color:var(--ink-soft);flex:1;}
.article-card .more{margin-top:16px;font-size:.88rem;font-weight:800;color:var(--brand-deep);}

/* 文章 */
article{padding:52px 0 76px;}
article p{margin-bottom:1.4em;font-size:1.06rem;color:#2c2745;}
article h2{font-size:1.55rem;font-weight:800;margin:2.2em 0 .7em;display:flex;align-items:center;gap:10px;}
article h2::before{content:"";width:10px;height:24px;border-radius:4px;background:var(--brand);}
article h3{font-size:1.2rem;font-weight:700;margin:1.8em 0 .6em;color:var(--brand-deep);}
article ul,article ol{margin:0 0 1.4em 1.4em;}
article li{margin-bottom:.55em;font-size:1.02rem;color:#2c2745;}
.lead{font-size:1.14rem;font-weight:500;color:var(--ink);background:var(--tint);border-radius:var(--r);padding:20px 24px;margin-bottom:2em !important;}
.note-box{background:var(--surface);border:1.5px solid var(--line);border-left:5px solid var(--accent);border-radius:var(--r);padding:22px 26px;margin:1.8em 0;box-shadow:var(--shadow-soft);}
.note-box strong{color:var(--brand-dark);}
.cta-box{background:linear-gradient(135deg,var(--brand),#8a7bff);color:#fff;border-radius:var(--r);padding:32px;margin:2em 0;text-align:left;}
.cta-box p{margin-bottom:18px;font-size:1.04rem;color:#f0edff;}
.cta-box strong{color:#fff;}
.btn{display:inline-block;background:var(--brand-deep);color:#fff;padding:14px 32px;border-radius:var(--r-sm);font-size:.98rem;font-weight:800;transition:.2s;box-shadow:var(--shadow-soft);}
.btn:hover{background:var(--brand-dark);transform:translateY(-2px);}
.cta-box .btn{background:#fff;color:var(--brand-deep);}
.btn-ghost{display:inline-block;border:2px solid var(--brand-deep);color:var(--brand-deep);padding:12px 28px;border-radius:var(--r-sm);font-size:.98rem;font-weight:800;}
.btn-ghost:hover{background:var(--brand-deep);color:#fff;}

.faq-sec{margin-top:3em;}
.faq-sec details{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);margin-bottom:12px;box-shadow:var(--shadow-soft);}
.faq-sec summary{list-style:none;cursor:pointer;padding:18px 22px;font-weight:800;color:var(--ink);display:flex;justify-content:space-between;align-items:center;}
.faq-sec summary::-webkit-details-marker{display:none;}
.faq-sec summary::after{content:'＋';color:var(--brand);}
.faq-sec details[open] summary::after{content:'－';}
.faq-sec .ans{padding:0 22px 20px;font-size:.98rem;color:var(--ink-soft);}

.related{margin-top:3em;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:26px 30px;box-shadow:var(--shadow-soft);}
.related h2{font-size:1.2rem;margin:0 0 12px;}
.related h2::before{display:none;}
.related a{display:block;padding:10px 0;font-size:1rem;font-weight:600;color:var(--brand-deep);border-bottom:1px solid var(--line);transition:padding .2s;}
.related a:last-child{border-bottom:none;}
.related a:hover{padding-left:8px;}
.related-reading{margin-top:3em;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:26px 30px;box-shadow:var(--shadow-soft);}
.related-reading h2{font-size:1.2rem;margin:0 0 12px;}
.related-reading h2::before{display:none;}
.related-reading a{display:block;padding:10px 0;font-size:1rem;font-weight:600;color:var(--brand-deep);border-bottom:1px solid var(--line);transition:padding .2s;}
.related-reading a:last-child{border-bottom:none;}
.related-reading a:hover{padding-left:8px;}
.article-exclusive-recommendation{margin-top:2em;}
.article-recommendation-card{background:linear-gradient(135deg,var(--tint),#fff);border:2px solid var(--brand);border-radius:var(--r);padding:26px 28px;box-shadow:var(--shadow);}
.article-recommendation-card .label{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.14em;color:#fff;background:var(--brand);padding:5px 14px;border-radius:var(--r-sm);margin-bottom:14px;}
.article-recommendation-card h3{font-size:1.32rem;margin-bottom:6px;}
.article-recommendation-card p{font-size:.98rem;color:var(--ink-soft);margin-bottom:14px;}
.article-recommendation-card a{display:inline-block;background:var(--brand-deep);color:#fff;padding:12px 24px;border-radius:var(--r-sm);font-size:.94rem;font-weight:800;}

/* 冠名版位（靠左） */
.sponsor-slot{margin-top:2.2em;background:linear-gradient(135deg,var(--tint),#fff);border:2px solid var(--brand);border-radius:var(--r);padding:30px;text-align:left;box-shadow:var(--shadow);}
.sponsor-eyebrow{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.14em;color:#fff;background:var(--brand);padding:5px 14px;border-radius:var(--r-sm);margin-bottom:14px;text-transform:uppercase;}
.sponsor-name{font-size:1.5rem;font-weight:800;margin-bottom:8px;}
.sponsor-pitch{font-size:1.06rem;color:var(--brand-deep);font-weight:700;margin-bottom:8px;}
.sponsor-desc{font-size:.98rem;color:var(--ink-soft);margin-bottom:16px;}
.sponsor-contact{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:16px;font-size:.94rem;color:var(--ink-soft);justify-content:flex-start;}
.sponsor-contact a{color:var(--brand-deep);font-weight:600;}
.sponsor-contact b{color:var(--ink);font-weight:800;margin-right:4px;}
.sponsor-btn{display:inline-block;background:var(--brand-deep);color:#fff;padding:13px 30px;border-radius:var(--r-sm);font-size:.96rem;font-weight:800;}
.sponsor-btn:hover{background:var(--brand-dark);}

.references{margin-top:3.4em;padding-top:1.8em;border-top:1px solid var(--line);}
.references h2{font-size:1.2rem;}
.references ol{list-style:none;margin:1.2em 0 0;counter-reset:ref;}
.references li{counter-increment:ref;font-size:.9rem;color:var(--ink-soft);margin-bottom:.9em;padding-left:2.4em;position:relative;line-height:1.7;}
.references li::before{content:"[" counter(ref) "]";position:absolute;left:0;color:var(--brand-deep);font-weight:800;}
.disclaimer{background:var(--tint);border-radius:var(--r);padding:18px 22px;margin-top:2.4em;font-size:.88rem;color:var(--ink-soft);}

/* 名單 */
.intro{padding:8px 0 10px;color:var(--ink-soft);font-size:1.02rem;}
.jump,.area-pills{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 34px;}
.jump a,.area-pills a{display:inline-flex;align-items:center;gap:6px;font-size:.94rem;font-weight:700;color:var(--brand-deep);background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:9px 18px;transition:.2s;}
.jump a:hover,.area-pills a:hover,.area-pills a.active{background:var(--brand-deep);color:#fff;border-color:var(--brand-deep);}
.area-pills a .cnt{font-size:.82rem;opacity:.85;}

.district-block{margin-bottom:50px;}
.district-title{font-size:1.5rem;font-weight:800;margin-bottom:18px;display:flex;align-items:center;gap:12px;}
.district-title::before{content:"";width:26px;height:6px;border-radius:3px;background:var(--accent);}

/* 平台卡（＝store-card），整卡可點 */
.store-list{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.store-card{position:relative;cursor:pointer;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow-soft);transition:transform .25s,box-shadow .25s,border-color .25s;}
.store-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--brand);}
.store-card .card-cover{position:absolute;inset:0;z-index:1;border-radius:var(--r);}
.store-card .field a,.store-card .detail-link{position:relative;z-index:2;}
.store-card h4{font-size:1.2rem;font-weight:800;margin-bottom:8px;}
.store-badge{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.05em;color:var(--brand-deep);background:var(--tint);padding:5px 12px;border-radius:999px;margin-bottom:10px;}
.store-card p{font-size:.96rem;color:var(--ink-soft);margin-bottom:8px;}
.store-card .field{font-size:.92rem;color:#2c2745;margin-bottom:6px;}
.store-card .field b{font-weight:800;color:var(--brand-deep);}
.store-card .detail-link{font-size:.92rem;font-weight:800;color:var(--brand-deep);margin-top:10px;display:inline-block;}
/* 推薦平台：明顯外框＋左側「推薦平台」標籤 */
.store-card.is-sponsor{border:2.5px solid var(--brand);box-shadow:var(--shadow);}
.store-card.is-sponsor .store-badge{color:#fff;background:var(--brand);}

.store-detail{padding:44px 0 78px;}
.store-detail .field-row{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);font-size:1.02rem;}
.store-detail .field-row b{min-width:88px;color:var(--brand-deep);font-weight:800;}

/* 分類卡（overview） */
.link-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.link-card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow-soft);transition:.25s;border-top:6px solid var(--brand);}
.link-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--brand);border-top-color:var(--accent);}
.link-card h3{font-size:1.2rem;margin-bottom:6px;}
.link-card p{font-size:.92rem;color:var(--ink-soft);}
.link-card .more{margin-top:12px;font-size:.88rem;font-weight:800;color:var(--brand-deep);display:inline-block;}

/* 加入推薦頁 */
.join-hero{background:linear-gradient(135deg,var(--brand-dark),var(--brand) 60%,var(--accent) 140%);color:#fff;padding:150px 0 74px;}
.join-hero .eyebrow{background:rgba(255,255,255,.18);color:#fff;}
.join-hero h1{color:#fff;font-size:clamp(2.1rem,4.6vw,3.1rem);line-height:1.15;margin-bottom:18px;max-width:700px;}
.join-hero p{color:#efeaff;max-width:600px;font-size:1.08rem;}
.join-sec{padding:54px 0;}
.join-sec .k{font-size:.78rem;letter-spacing:.16em;color:var(--brand-deep);font-weight:800;margin-bottom:10px;text-transform:uppercase;}
.join-sec h2{font-size:1.8rem;margin-bottom:14px;}
.join-sec>.container>p{color:var(--ink-soft);max-width:640px;}
.join-actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 28px;}
.step{display:flex;gap:16px;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:22px;margin-bottom:14px;box-shadow:var(--shadow-soft);}
.step .n{flex:none;width:42px;height:42px;border-radius:12px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;}
.step h3{font-size:1.1rem;margin-bottom:4px;}
.step p{color:var(--ink-soft);font-size:.96rem;}

/* 頁尾 */
footer{background:var(--ink);color:#c9c4e6;padding:50px 0 34px;font-size:.9rem;}
footer .footer-cols{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:32px;margin-bottom:28px;}
.footer-brand h4{color:#fff;font-size:1.15rem;margin-bottom:10px;}
.footer-brand p{color:#a9a2d6;font-size:.9rem;max-width:300px;line-height:1.85;}
.footer-col h4{color:#fff;font-size:.96rem;margin-bottom:12px;}
.footer-col a{display:block;color:#a9a2d6;padding:5px 0;font-size:.9rem;}
.footer-col a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.16);padding-top:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
.footer-bottom .copy{color:#a9a2d6;font-size:.84rem;}
.powered{display:inline-flex;align-items:center;gap:6px;background:var(--brand);color:#fff;padding:9px 20px;border-radius:999px;font-size:.84rem;font-weight:800;}
.powered:hover{background:var(--brand-deep);}
.footer-disclaimer{font-size:.84rem;line-height:1.85;color:#8f88bd;max-width:760px;margin:0 0 16px;}

@media(max-width:720px){
  .card-grid,.card-grid.cols-3,.store-list,.link-grid,.article-list{grid-template-columns:1fr;}
  .nav-links{display:none;}
  .page-hero,.topic-hero,.article-hero{padding:110px 0 44px;}
  .page-hero::after,.topic-hero::after{display:none;}
  .page-hero h1,.topic-hero h1,.page-hero .hero-lead{max-width:100%;}
  footer .footer-cols{grid-template-columns:1fr;gap:24px;}
}