body{width:auto;min-width:0}main{min-height:50vh}a{color:inherit}footer a{text-decoration:none}header{position:sticky;top:0;z-index:20;flex-wrap:wrap}header img{height:62px}.cartbtn{text-decoration:none}
.wrap{max-width:1200px;margin:0 auto}.pagehead{background:linear-gradient(rgba(43,26,18,.78),rgba(43,26,18,.78)),url(/brand/banner-beans.jpg) center/cover;color:var(--cream);padding:56px}.pagehead h1{font-family:"Noto Serif TC",serif;font-size:40px}
.grid{display:grid;gap:22px}.g3{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.g5{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.pc .ph{height:220px;background:#f1e9dc;display:flex;align-items:center;justify-content:center;overflow:hidden}.pc .ph img{width:100%;height:100%;object-fit:cover}.pc .ph img.png{object-fit:contain}.pc .bd{padding:16px}.pc .nm{font-weight:700;margin:6px 0 8px;min-height:44px}
.b{display:inline-block;border:0;cursor:pointer;background:var(--espresso);color:var(--crema);padding:10px 20px;border-radius:30px;font-weight:700;font-size:15px;text-decoration:none;font-family:inherit}.b.gold{background:var(--gold);color:var(--espresso)}.b:disabled{background:#ccc;color:#777;cursor:not-allowed}.b.sm{padding:6px 12px;font-size:13px}
input,select,textarea{font:inherit;border:1px solid #d9cfc2;border-radius:8px;padding:10px;width:100%;background:#fff}label.f{display:block;font-size:13px;color:#6b5644;margin-bottom:10px}
.side a{display:block;padding:10px 14px;border-radius:8px;margin-bottom:4px;background:#fff;text-decoration:none}.side a.on{background:var(--espresso);color:var(--crema)}
.prose p{line-height:2;margin-bottom:14px;color:#3d2c20}.notice{background:var(--cream);padding:16px;border-radius:10px;color:#5b4636;line-height:1.8}.err{background:#fde8e8;color:#9b1c1c;padding:12px;border-radius:8px;margin:10px 0}
.qty{display:inline-flex;border:1px solid #d9cfc2;border-radius:30px;overflow:hidden}.qty button{border:0;background:#fff;padding:6px 12px;cursor:pointer}.qty input{width:64px;border:0;text-align:center;padding:6px}
table.t{width:100%;border-collapse:collapse;background:#fff}table.t td,table.t th{padding:10px;border-bottom:1px solid #eee;text-align:left;font-size:14px;vertical-align:top}
@media(max-width:800px){header{padding:10px 16px;gap:10px}header .dnav{order:3;width:100%;overflow-x:auto;gap:16px}section{padding:40px 18px}footer{grid-template-columns:1fr 1fr;padding:30px 18px}.pagehead{padding:36px 18px}.two{grid-template-columns:1fr!important}}

html,body{overflow-x:hidden}.menubtn,.mnav{display:none}header .dnav{display:flex;gap:28px;flex:1;font-size:15px;letter-spacing:.06em}header .dnav a{color:var(--cream);text-decoration:none}header .dnav a.on{color:var(--crema);border-bottom:2px solid var(--gold);padding-bottom:4px}
@media(max-width:800px){header{flex-wrap:nowrap;gap:10px;padding:8px 14px;min-height:64px}header .logo{flex:1;display:flex}header img{height:48px}header .dnav{display:none!important}
.cartbtn{display:flex;align-items:center;justify-content:center;gap:2px;min-width:44px;height:44px;padding:0 12px;font-size:15px}.cartbtn .ct{display:none}
.menubtn{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0 10px;background:transparent;border:1.5px solid rgba(200,162,107,.6);border-radius:10px;cursor:pointer}.menubtn span{display:block;height:2px;background:var(--crema);border-radius:2px}
.mnav:not([hidden]){display:flex;flex-direction:column;position:fixed;inset:0;z-index:100;background:var(--espresso);color:var(--cream);animation:sd .22s ease-out;overflow-y:auto}
@keyframes sd{from{transform:translateY(-16px);opacity:0}to{transform:none;opacity:1}}
.mnav-top{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;border-bottom:1px solid rgba(200,162,107,.25);border-top:5px solid;border-image:linear-gradient(90deg,var(--verde) 33.3%,#fff 33.3% 66.6%,var(--rosso) 66.6%) 1}.mnav-top img{height:48px}
.mclose{width:44px;height:44px;background:transparent;border:1.5px solid rgba(200,162,107,.6);border-radius:10px;color:var(--crema);font-size:20px;cursor:pointer}
.mnav nav a{display:flex;align-items:center;min-height:56px;padding:0 24px;font-size:18px;letter-spacing:.08em;color:var(--cream);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.08)}.mnav nav a.on{color:var(--crema);border-left:3px solid var(--gold)}
.mnav-foot{margin-top:auto;padding:22px 24px;color:var(--crema)}.mnav-foot a{color:var(--cream);display:inline-flex;align-items:center;min-height:44px}body.navopen{overflow:hidden}}
