:root{--g:#2f6b3f;--o:#7a8450;--c:#f5f0e6;--ink:#2b2b25;--mute:#6b6a5f}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth;scroll-padding-top:70px}
body{font-family:"Noto Sans TC","PingFang HK","Microsoft JhengHei",system-ui,sans-serif;color:var(--ink);background:#fffdf8;line-height:1.75}
img{max-width:100%;display:block}a{color:inherit}
.wrap{max-width:1120px;margin:auto;padding:80px 24px}.narrow{max-width:760px}.center{text-align:center;margin-bottom:32px}
.nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:14px 24px;background:rgba(255,253,248,.92);backdrop-filter:blur(8px);border-bottom:1px solid #eee6d6}
.logo{font-weight:800;font-size:1.5rem;color:var(--g);text-decoration:none}.logo span{color:var(--o)}
nav{display:flex;gap:22px;align-items:center}nav a{text-decoration:none;font-size:.95rem}.menu{display:none;background:none;border:0;font-size:1.6rem}
h1{font-size:clamp(2rem,5vw,3.4rem);line-height:1.25;margin:10px 0 18px;color:var(--g)}h2{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.3;margin-bottom:16px;color:var(--g)}h3{color:var(--g)}
.eyebrow{color:var(--o);font-weight:700;letter-spacing:.08em}.lead{font-size:1.15rem;color:var(--mute)}
.btn{display:inline-block;background:var(--g);color:#fff;padding:13px 26px;border-radius:999px;text-decoration:none;font-weight:700;margin-top:20px;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(47,107,63,.25)}.btn.ghost{background:none;color:var(--g);border:2px solid var(--g);margin-left:10px}.btn.sm{padding:8px 16px;margin:0;color:#fff}.btn.light{background:#fff;color:var(--g)}
.hero{background:radial-gradient(circle at 80% 30%,#e7efd9,transparent 55%),var(--c)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}.rev>:first-child{order:2}
.hero-img img,.pimg img{border-radius:28px;background:#fff;box-shadow:0 24px 60px rgba(60,70,40,.15)}
.band{background:var(--c);text-align:center}.band.dark{background:var(--g);color:#fff;text-align:left}.band.dark h2,.band.dark h3{color:#fff}
.alt{background:#f9f6ee}.ticks{list-style:none;padding:0;margin:16px 0}.ticks li{padding-left:28px;position:relative;margin:6px 0}.ticks li:before{content:"✓";position:absolute;left:0;color:var(--g);font-weight:800}
.chips span{display:inline-block;background:#e7efd9;color:var(--g);padding:4px 14px;border-radius:999px;margin:4px 6px 4px 0;font-size:.9rem}
.price{font-size:1.8rem;font-weight:800;color:var(--g)}.price small{font-size:.85rem;color:var(--mute);font-weight:400}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}.card{background:#fff;border:1px solid #eee6d6;border-radius:24px;padding:24px}.card img{border-radius:16px;margin-bottom:16px;aspect-ratio:4/3;object-fit:contain;background:#fff;width:100%}
.note{font-size:.85rem;color:var(--mute);font-style:italic;margin-top:8px}
.stores{display:grid;gap:18px}.stores div{background:rgba(255,255,255,.1);padding:18px 22px;border-radius:18px}
details{border-bottom:1px solid #eee6d6;padding:18px 0}summary{font-weight:700;cursor:pointer;color:var(--g)}details p{margin-top:8px;color:var(--mute)}
footer{background:#24291f;color:#cfcbbd;font-size:.9rem}footer .wrap{padding:48px 24px}footer p{margin:10px 0}
.fab{position:fixed;right:18px;bottom:18px;background:#25d366;color:#fff;text-decoration:none;font-weight:700;padding:12px 18px;border-radius:999px;box-shadow:0 8px 24px rgba(0,0,0,.2);z-index:9}
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
@media (max-width:820px){.wrap{padding:56px 20px}.grid2,.cards{grid-template-columns:1fr;gap:32px}.rev>:first-child{order:0}
.menu{display:block}nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:#fffdf8;padding:16px;border-bottom:1px solid #eee6d6}.open nav{display:flex}
.btn.ghost{margin-left:0}.ctas .btn{display:block;text-align:center}.hero .grid2>.hero-img{order:-1}}
.hero-stack{position:relative}.hero-stack .main{box-shadow:none;background:none}.hero-stack .float{position:absolute;right:-10px;bottom:-30px;width:42%;border-radius:20px;border:6px solid #fff}.life{border-radius:18px;margin:14px 0;aspect-ratio:16/9;object-fit:cover;width:100%}@media(max-width:820px){.hero-stack .float{right:0;bottom:-16px;width:38%}}
footer .logo{color:#e7efd9}footer .logo span{color:#c9cfa8}