*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:#fff;color:#252525;font-family:'Noto Sans TC',sans-serif;font-weight:400;line-height:1.6}
a{color:inherit;text-decoration:none}

header{background:#FFFDFD;padding:0 5%;position:sticky;top:0;z-index:10;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.header-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{color:#003E91;font-weight:900;font-size:1.3rem;letter-spacing:.02em}
nav{display:flex;gap:32px}
nav a{color:#252525;font-size:.92rem;font-weight:500;opacity:.85;transition:opacity .2s}
nav a:hover{opacity:1;color:#003E91}

.hero{padding:80px 5% 60px;text-align:center;background:linear-gradient(180deg,#F4F9FF 0%,#fff 100%)}
.hero .inner{max-width:1000px;margin:0 auto}
.hero h1{font-size:2.1rem;font-weight:900;line-height:1.5;margin-bottom:28px;
  background:linear-gradient(130deg,#003E91,#5AC3FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.btn-cta{display:inline-block;background:#FF6B6B;color:#FFFDFD;font-weight:500;font-size:.95rem;padding:13px 32px;border-radius:100px;margin-bottom:56px;transition:background .2s}
.btn-cta:hover{background:#E85555}

.pain-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:left;margin-top:20px}
.pain-card{background:#fff;border-radius:10px;padding:24px;box-shadow:0 4px 20px rgba(0,62,145,.08)}
.pain-card h3{font-size:1rem;font-weight:700;color:#1A1A1A;margin-bottom:10px;line-height:1.5}
.pain-sub{font-size:.82rem;color:#5A7A95;padding-top:10px;border-top:1px dashed #D8E4F0}

.cost-section{padding:64px 5%;text-align:center}
.cost-section .inner{max-width:1100px;margin:0 auto}
.cost-section h2{font-size:1.6rem;font-weight:900;color:#003E91;letter-spacing:.05em;margin-bottom:10px}
.section-sub{color:#5A7A95;font-size:.95rem;margin-bottom:40px}
.cost-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.cost-card{text-align:left;padding:8px}
.cost-num{font-size:2rem;font-weight:900;color:#5AC3FF;margin-bottom:8px}
.cost-card h3{font-size:1.05rem;font-weight:700;color:#1A1A1A;margin-bottom:8px}
.cost-card p{font-size:.88rem;color:#4A5568;line-height:1.7}

.formula-section{background:#E8F1FD;padding:56px 5%;text-align:center}
.formula-section h2{font-size:1.4rem;font-weight:700;color:#0F1A28;margin-bottom:20px}
.formula-text{font-size:1.15rem;font-weight:600;color:#003E91}

.brand-section{padding:64px 5%;text-align:center;background:linear-gradient(180deg,#fff,#F4F9FF)}
.brand-section .inner{max-width:820px;margin:0 auto}
.brand-section h2{font-size:1.8rem;font-weight:900;color:#003E91;margin-bottom:6px}
.brand-desc{font-size:.95rem;color:#4A5568;line-height:1.9;margin-top:24px}

.value-section{padding:64px 5%;text-align:center}
.value-section .inner{max-width:1100px;margin:0 auto}
.value-section h2{font-size:1.5rem;font-weight:900;color:#0F1A28;line-height:1.6;margin-bottom:44px}
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.value-card{background:#F4F9FF;border-radius:10px;padding:28px;border-top:3px solid #003E91}
.value-card h3{font-size:1rem;font-weight:700;color:#0F1A28;margin-bottom:10px}
.value-card p{font-size:.85rem;color:#4A5568;line-height:1.7}

footer{background:#1A1A1A;padding:40px 5%}
footer .inner{max-width:1100px;margin:0 auto}
.footer-logo{color:#5AC3FF;font-weight:900;font-size:1.1rem;margin-bottom:14px}
.footer-disclaimer{color:#A0AEC0;font-size:.8rem;line-height:1.8;max-width:820px}
.footer-bottom{margin-top:18px;color:#718096;font-size:.75rem}

.breadcrumb{background:#F4F9FF;padding:12px 5%;font-size:.82rem;color:#5A7A95}
.breadcrumb .inner{max-width:900px;margin:0 auto}
.breadcrumb a{color:#003E91}
.breadcrumb span{margin:0 6px}

.page-wrap{max-width:900px;margin:0 auto;padding:48px 5% 64px}
.page-header{margin-bottom:36px}
.page-header h1{font-size:1.8rem;font-weight:900;color:#0F1A28;margin-bottom:8px}
.page-header .sub{color:#5A7A95;font-size:.9rem}

.content-section{margin-bottom:32px}
.content-section h2{font-size:1.15rem;font-weight:700;color:#003E91;margin-bottom:12px}
.content-section p{font-size:.92rem;color:#4A5568;line-height:1.85;margin-bottom:12px}
.content-section ul{padding-left:20px;margin-bottom:12px}
.content-section li{font-size:.9rem;color:#4A5568;line-height:1.8;margin-bottom:6px}

.info-box{background:#F4F9FF;border-left:3px solid #003E91;border-radius:0 8px 8px 0;padding:20px 24px;margin-bottom:24px}
.info-box h2{font-size:1rem;color:#003E91;margin-bottom:10px}
.info-box ul{list-style:none;padding:0}
.info-box li{padding:4px 0;font-size:.88rem;color:#4A5568}

.contact-box{background:#F4F9FF;border-radius:8px;padding:20px 24px;font-size:.88rem;color:#4A5568;line-height:1.9}

/* 文章列表頁 */
.article-list-page{max-width:1100px;margin:0 auto;padding:48px 5% 64px}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px}
.article-grid-card{background:#fff;border:1px solid #E8EFF5;border-radius:10px;padding:20px;box-shadow:0 2px 10px rgba(0,62,145,.05);transition:box-shadow .2s}
.article-grid-card:hover{box-shadow:0 6px 20px rgba(0,62,145,.12)}
.article-grid-card .card-date{font-size:.75rem;color:#5AC3FF;font-weight:600;margin-bottom:8px}
.article-grid-card h2{font-size:.98rem;font-weight:700;color:#0F1A28;line-height:1.5;margin-bottom:10px}
.article-grid-card h2 a{color:inherit}
.article-grid-card .card-excerpt{font-size:.83rem;color:#5A7A95;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.article-grid-card .read-more{font-size:.8rem;font-weight:600;color:#003E91;margin-top:10px;display:inline-block}
.empty-state{text-align:center;padding:60px 20px;color:#5A7A95}
.pagination{display:flex;justify-content:center;gap:8px;margin-top:32px}
.pagination button{padding:6px 14px;border:1px solid #D8E4F0;border-radius:4px;background:#fff;color:#4A5568;font-size:.85rem;cursor:pointer}
.pagination button.active{background:#003E91;color:#fff;border-color:#003E91}

/* 單篇文章頁 */
.article-page{max-width:760px;margin:0 auto;padding:48px 5% 64px}
.article-page h1{font-size:1.6rem;font-weight:900;color:#0F1A28;line-height:1.5;margin-bottom:10px}
.article-page .article-date{font-size:.85rem;color:#5A7A95;margin-bottom:32px}
.article-page h2{font-size:1.1rem;font-weight:700;color:#003E91;margin:32px 0 12px}
.article-page p{font-size:.93rem;color:#333;line-height:1.9;margin-bottom:16px}
.article-page a{color:#003E91;text-decoration:underline}
.article-page .cta-card{background:#F4F9FF;border-radius:8px;padding:18px 24px;text-align:center;margin:28px 0}
.article-page .faq-block{margin-top:32px;border-top:1px solid #E8EFF5;padding-top:24px}
.article-page .faq-item{margin-bottom:20px}
.article-page .disclosure{font-size:.78rem;color:#A0AEC0;margin-top:32px;padding-top:16px;border-top:1px solid #E8EFF5}

@media(max-width:900px){
  .pain-cards{grid-template-columns:1fr}
  .cost-grid{grid-template-columns:1fr}
  .value-grid{grid-template-columns:1fr}
  .article-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .hero h1{font-size:1.5rem}
  nav{gap:18px}
  .article-grid{grid-template-columns:1fr}
}