/* HENSIN+ 煥法｜共用設計系統（v3 生活自然系） */
:root{
  /* surface band：暖沙帶 */
  --surface-0:#fbf5ea;
  --surface-1:#f3e9d6;
  --surface-2:#ece0c8;
  --surface-card:#fffdf8;
  /* ink band：深苔綠帶 */
  --ink-0:#2b3a2a;
  --ink-1:#42513f;
  --ink-2:#6b7a63;
  --accent:#7a8f4f;
  --accent-deep:#566a37;
  --clay:#c98a5e;
  --line:#e6d9bd;
  --radius:22px;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
  background:var(--surface-0);
  color:var(--ink-1);
  font-family:"Noto Serif TC","Quicksand",sans-serif;
  line-height:1.8;
}
a{color:inherit;text-decoration:none;}
img,svg{display:block;}
.en{font-family:"Quicksand",sans-serif;}
.wrap{max-width:1140px;margin:0 auto;padding:0 32px;}

/* 導覽 */
header.nav{position:sticky;top:0;z-index:10;background:rgba(251,245,234,.92);backdrop-filter:blur(6px);}
header.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:82px;}
.logo{font-family:"Quicksand",sans-serif;font-weight:700;font-size:21px;color:var(--ink-0);}
.logo b{color:var(--accent-deep);}
nav.links{display:flex;gap:32px;font-size:14.5px;font-weight:500;color:var(--ink-1);}
nav.links a.active{color:var(--accent-deep);font-weight:700;}
.navcta{background:var(--accent);color:#fff;padding:11px 24px;font-size:14px;font-weight:600;border-radius:999px;}

/* Hero（首頁大版） */
.hero{padding:70px 0 90px;position:relative;overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center;}
.eyebrow{font-family:"Quicksand",sans-serif;font-size:14px;font-weight:700;color:var(--accent-deep);letter-spacing:.06em;margin-bottom:18px;display:inline-block;background:var(--surface-2);padding:7px 16px;border-radius:999px;}
h1.hero-title{font-size:44px;font-weight:600;color:var(--ink-0);line-height:1.5;margin-bottom:22px;}
h1.hero-title span{color:var(--clay);}
.hero-sub{font-size:16px;color:var(--ink-2);max-width:460px;margin-bottom:32px;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}
.btn{display:inline-flex;align-items:center;gap:9px;padding:16px 28px;font-size:14.5px;font-weight:600;border-radius:999px;font-family:"Quicksand",sans-serif;}
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 10px 24px -10px rgba(122,143,79,.55);}
.btn-outline{border:1.5px solid var(--ink-2);color:var(--ink-1);}
.hero-collage{position:relative;height:420px;}
.blob{position:absolute;border-radius:var(--radius);background:linear-gradient(150deg,#e3d3ad,#c7a878);display:flex;align-items:flex-end;padding:16px;}
.blob span{font-size:11.5px;color:var(--ink-0);background:rgba(255,253,248,.75);padding:5px 10px;border-radius:999px;}
.blob-a{width:64%;height:70%;top:0;right:0;border-radius:40% 60% 55% 45%/50% 45% 55% 50%;background:linear-gradient(150deg,#dccf9f,#b99a63);}
.blob-b{width:46%;height:44%;left:0;bottom:0;border-radius:50% 50% 45% 55%/55% 45% 55% 45%;background:linear-gradient(150deg,#cfd9b6,#8fa365);}

/* 內頁小型頁首（非首頁） */
.page-hero{padding:56px 0 48px;}
.page-hero .eyebrow{margin-bottom:16px;}
.page-hero h1{font-size:36px;font-weight:600;color:var(--ink-0);line-height:1.5;margin-bottom:16px;}
.page-hero p{font-size:15.5px;color:var(--ink-2);max-width:560px;}

section{padding:82px 0;}
.section-head{max-width:600px;margin:0 auto 48px;text-align:center;}
h2{font-size:30px;font-weight:600;color:var(--ink-0);}
.section-head p{color:var(--ink-2);margin-top:14px;font-size:15px;}

/* 服務速覽 / 卡片格 */
.svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.svc-card{background:var(--surface-card);border:1px solid var(--line);border-radius:var(--radius);padding:38px;}
.svc-tag{display:inline-block;font-size:12.5px;font-weight:700;color:var(--accent-deep);background:var(--surface-1);padding:6px 14px;border-radius:999px;margin-bottom:18px;}
.svc-card h3{font-size:23px;font-weight:600;color:var(--ink-0);margin-bottom:12px;}
.svc-card p{color:var(--ink-2);font-size:14.5px;margin-bottom:20px;}
.svc-list{list-style:none;display:flex;flex-direction:column;gap:10px;}
.svc-list li{display:flex;gap:10px;font-size:14px;color:var(--ink-1);align-items:flex-start;}
.svc-list svg{flex:none;margin-top:3px;stroke:var(--accent-deep);}

/* mid cta */
.mid-cta{background:var(--surface-2);text-align:center;border-radius:var(--radius);margin:0 32px;padding:48px 24px;}
.mid-cta p{font-size:15.5px;color:var(--ink-1);margin-bottom:18px;}

/* 信任區 */
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.trust-card{text-align:center;padding:0 8px;}
.trust-icon{width:64px;height:64px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;}
.trust-icon svg{stroke:var(--accent-deep);}
.trust-card h3{font-size:19px;font-weight:600;color:var(--ink-0);margin-bottom:10px;}
.trust-card p{font-size:14px;color:var(--ink-2);}

/* FAQ（含 accordion 用於 faq.html） */
.faq{background:var(--surface-1);}
.faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:12px;}
.faq-item{padding:22px 26px;background:var(--surface-card);border-radius:16px;border:1px solid var(--line);}
.faq-item summary{display:flex;justify-content:space-between;align-items:center;font-size:15px;color:var(--ink-0);font-weight:600;cursor:pointer;list-style:none;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item svg{flex:none;stroke:var(--accent-deep);transition:transform .2s;}
.faq-item[open] svg{transform:rotate(90deg);}
.faq-item .a{font-size:14px;color:var(--ink-2);margin-top:14px;line-height:1.85;}
.faq-more{text-align:center;margin-top:26px;font-size:14px;font-weight:600;color:var(--accent-deep);}
.faq-group-title{font-size:13px;font-weight:700;color:var(--accent-deep);letter-spacing:.04em;margin:36px 0 14px;}
.faq-group-title:first-child{margin-top:0;}

/* 法規口徑 */
.disclosure{padding:56px 0;}
.disclosure .wrap{max-width:800px;text-align:center;background:var(--surface-card);border:1px solid var(--line);border-radius:var(--radius);padding:36px 40px;}
.disclosure .label{font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--accent-deep);margin-bottom:14px;}
.disclosure p{font-size:13.5px;color:var(--ink-2);line-height:1.9;}

.cta-final{text-align:center;}
.cta-final .panel{background:linear-gradient(150deg,var(--surface-2),var(--surface-1));border-radius:32px;padding:64px 40px;}
.cta-final h2{margin-bottom:16px;}
.cta-final p{color:var(--ink-2);margin-bottom:32px;}
.cta-final .hero-ctas{justify-content:center;}

footer{padding:44px 0;border-top:1px solid var(--line);}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;}
footer p{font-size:12.5px;color:var(--ink-2);}
footer .soc{display:flex;gap:14px;}
footer .soc a{width:36px;height:36px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;}
footer .soc svg{stroke:var(--ink-1);}

/* 內文段落（about / services 常用） */
.prose{max-width:720px;margin:0 auto;}
.prose p{font-size:15px;color:var(--ink-1);margin-bottom:18px;}
.prose p:last-child{margin-bottom:0;}

/* 案例照佔位 */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.case-slot{aspect-ratio:4/5;border-radius:18px;background:var(--surface-2);border:1.5px dashed var(--ink-2);display:flex;align-items:center;justify-content:center;}
.case-slot span{font-size:12.5px;color:var(--ink-2);}

/* 流程步驟（services） */
.steps{display:flex;flex-direction:column;gap:0;max-width:720px;margin:0 auto;}
.step{display:flex;gap:20px;padding:24px 0;border-bottom:1px solid var(--line);}
.step:last-child{border-bottom:none;}
.step-num{flex:none;width:40px;height:40px;border-radius:50%;background:var(--surface-2);color:var(--accent-deep);font-family:"Quicksand",sans-serif;font-weight:700;font-size:15px;display:flex;align-items:center;justify-content:center;}
.step h3{font-size:16.5px;font-weight:600;color:var(--ink-0);margin-bottom:6px;}
.step p{font-size:14px;color:var(--ink-2);}

/* 聯絡頁 */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.contact-card{background:var(--surface-card);border:1px solid var(--line);border-radius:var(--radius);padding:32px;display:flex;flex-direction:column;gap:14px;align-items:flex-start;}
.contact-icon{width:52px;height:52px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;}
.contact-icon svg{stroke:var(--accent-deep);}
.contact-card h3{font-size:18px;font-weight:600;color:var(--ink-0);}
.contact-card p{font-size:13.5px;color:var(--ink-2);}
.contact-card .btn{margin-top:4px;}
.contact-hours{background:var(--surface-1);border-radius:var(--radius);padding:32px 36px;max-width:720px;margin:0 auto;}
.contact-hours h3{font-size:17px;font-weight:600;color:var(--ink-0);margin-bottom:14px;}
.contact-hours dl{display:grid;grid-template-columns:auto 1fr;gap:8px 24px;font-size:14px;}
.contact-hours dt{color:var(--ink-0);font-weight:600;}
.contact-hours dd{color:var(--ink-2);}

@media(max-width:900px){
  .wrap{padding:0 20px;}
  nav.links{display:none;}
  .hero-grid{grid-template-columns:1fr;gap:32px;}
  h1.hero-title{font-size:32px;}
  .hero-collage{height:280px;}
  .svc-grid{grid-template-columns:1fr;}
  .trust-grid{grid-template-columns:1fr;gap:26px;}
  h2{font-size:24px;}
  section{padding:52px 0;}
  .hero{padding:44px 0 52px;}
  .page-hero{padding:40px 0 36px;}
  .page-hero h1{font-size:27px;}
  .mid-cta{margin:0 20px;padding:36px 20px;}
  .cta-final .panel{padding:44px 22px;border-radius:24px;}
  .case-grid{grid-template-columns:1fr 1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .contact-hours dl{grid-template-columns:1fr;}
}
