:root{--teal:#14c8b8;--blue:#2b7cf6;--ink:#22303f;--muted:#6b7a8c;--bg:#f7fafc;--line:#e6edf3;--grad:linear-gradient(135deg,#14c8b8,#2b7cf6)}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"PingFang TC","Microsoft JhengHei","Noto Sans TC",sans-serif;color:var(--ink);background:var(--bg);line-height:1.9}
a{color:var(--blue);text-decoration:none}a:hover{opacity:.85}
img{max-width:100%}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
header.site{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:9}
.bar{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:10px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.15rem;color:var(--ink)}
.brand img{width:40px;height:40px;border-radius:8px}
.brand small{display:block;font-size:.7rem;color:var(--muted);font-weight:500;letter-spacing:.12em}
nav.top{display:flex;gap:4px;flex-wrap:wrap}
nav.top a{color:#3d4f63;font-size:.93rem;padding:6px 12px;border-radius:8px}
nav.top a:hover{background:var(--bg);opacity:1}
nav.top a.cta{background:var(--grad);color:#fff;font-weight:600}
.hero{background:var(--grad);color:#fff;text-align:center;padding:84px 22px 90px}
.hero h1{font-size:2.3rem;letter-spacing:.06em;text-shadow:0 2px 12px rgba(0,0,0,.15)}
.hero p{font-size:1.1rem;margin:14px auto 30px;max-width:620px;opacity:.95}
.btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;padding:13px 34px;border-radius:999px;font-weight:700;font-size:1.02rem}
.btn.light{background:#fff;color:var(--blue)}
.btn.ghost{border:2px solid rgba(255,255,255,.8);color:#fff}
.btn.grad{background:var(--grad);color:#fff}
section{padding:64px 0}
section.alt{background:#fff}
h2.sec{text-align:center;font-size:1.6rem;margin-bottom:8px}
p.sub{text-align:center;color:var(--muted);margin-bottom:40px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.svc{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px 24px;text-align:center;transition:transform .15s,box-shadow .15s}
section.alt .svc{background:var(--bg)}
.svc:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(43,124,246,.12)}
.svc .ico{font-size:2.2rem}
.svc h3{margin:10px 0 8px;font-size:1.08rem}
.svc p{font-size:.88rem;color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;counter-reset:st}
.step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px 22px;position:relative}
.step:before{counter-increment:st;content:counter(st);position:absolute;top:-16px;left:20px;width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center}
.step h3{margin:8px 0 6px;font-size:1.02rem}.step p{font-size:.87rem;color:var(--muted)}
table.price{width:100%;border-collapse:collapse;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.04)}
table.price th{background:var(--grad);color:#fff;padding:13px;font-size:.95rem}
table.price td{padding:13px;text-align:center;border-bottom:1px solid var(--line);font-size:.93rem}
table.price tr:last-child td{border-bottom:0}
.note{font-size:.82rem;color:var(--muted);margin-top:10px;text-align:center}
details.qa{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;padding:0 22px}
details.qa summary{cursor:pointer;font-weight:600;padding:16px 0;list-style:none;position:relative;padding-right:30px}
details.qa summary:after{content:"＋";position:absolute;right:0;color:var(--teal);font-weight:700}
details.qa[open] summary:after{content:"－"}
details.qa .a{padding:2px 0 18px;color:#45566a;font-size:.94rem;border-top:1px dashed var(--line);padding-top:12px}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.cbox{background:#fff;border:1px solid var(--line);border-radius:14px;padding:30px 24px;text-align:center}
.cbox .ico{font-size:2rem}.cbox h3{margin:8px 0}.cbox p{font-size:.9rem;color:var(--muted)}
.cbox .btn{margin-top:14px;font-size:.92rem;padding:10px 26px}
.pagehead{background:var(--grad);color:#fff;text-align:center;padding:56px 22px}
.pagehead h1{font-size:1.8rem}.pagehead p{opacity:.95;margin-top:8px}
article.body{background:#fff;border:1px solid var(--line);border-radius:14px;padding:36px 40px;margin:36px 0 64px}
article.body h2{margin:1.4em 0 .6em;font-size:1.25rem;color:var(--blue)}
article.body p{margin-bottom:1em}
article.body ul{margin:0 0 1em 1.4em}
.ph{background:#fff7e6;border:1.5px dashed #e8b339;border-radius:10px;padding:14px 18px;font-size:.9rem;color:#8a6d1a;margin:16px 0}
footer.site{background:#22303f;color:#b8c5d4;padding:40px 0 30px;font-size:.88rem}
footer.site .cols{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:22px}
footer.site a{color:#d7e1ec}
footer.site .copy{border-top:1px solid #35455a;padding-top:16px;text-align:center;color:#8496ab}
@media(max-width:640px){.hero h1{font-size:1.7rem}article.body{padding:26px 20px}}

form.tf{display:grid;gap:14px;margin:20px 0}
form.tf .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
form.tf label{font-size:.88rem;font-weight:600;display:block;margin-bottom:4px}
form.tf input,form.tf select,form.tf textarea{width:100%;padding:10px 12px;border:1px solid #cdd9e4;border-radius:8px;font:inherit;font-size:.93rem;background:#fff}
form.tf input:focus,form.tf select:focus,form.tf textarea:focus{outline:2px solid var(--teal);border-color:transparent}
form.tf button{background:var(--grad);color:#fff;border:0;padding:13px;border-radius:999px;font-weight:700;font-size:1rem;cursor:pointer}
form.tf button:hover{opacity:.9}
form.tf .req:after{content:" *";color:#e05252}
@media(max-width:560px){form.tf .row{grid-template-columns:1fr}}