/* Commerce-first catalogue: prominent search, department navigation, dense cards. */
:root{--green:#35664b;--ink:#303833;--muted:#788179;--paper:#f4f5f4;--line:#e3e7e3;--light:#edf3ee;--accent:#cc5d39}html{scroll-padding-top:18px}body{font-family:'Noto Sans TC',sans-serif;background:var(--paper);font-size:13px}.utility{background:#f0f1ef;border-bottom:1px solid #e6e9e4;font-size:10px;color:#818981}.utility>div{max-width:1320px;margin:auto;padding:7px 24px;display:flex;justify-content:space-between}.utility nav{display:flex;gap:23px}.header{max-width:none;background:white;margin:0;padding:20px max(24px,calc((100vw - 1272px)/2));gap:30px;align-items:center;min-height:105px}.brand{color:#2e6044;white-space:nowrap;font-weight:800;font-size:25px;letter-spacing:-1px;gap:10px}.brand b{font-size:13px;letter-spacing:1px;display:inline-block;margin-left:6px}.brand small{font-size:9px;font-weight:400;letter-spacing:2.5px;color:#919b90;margin-top:1px}.shop-logo{font-family:Georgia,serif;display:block;font-size:35px;letter-spacing:-13px;width:48px;transform:rotate(-8deg)}.shop-logo>span{color:#7d9b67;position:relative;top:5px}.header-search{flex:1;max-width:660px}.searchbar{border:2px solid #4d7c5a;border-radius:5px;margin:0;padding:0;gap:0;height:43px;overflow:hidden;background:white}.search-scope{font-size:11px!important;color:#7a897a!important;border-right:1px solid #e0e7dd;padding:0 14px;line-height:23px!important;white-space:nowrap}.searchbar input{height:39px;padding:0 13px;font-size:12px}.searchbar button{align-self:stretch;min-width:52px;border-radius:0;background:#4d7c5a;color:white;font-size:27px;padding:0 12px;line-height:1}.hot-search{display:flex;gap:15px;align-items:center;margin-top:7px;font-size:10px;line-height:1.4;flex-wrap:wrap}.hot-search>span{color:#a0a79d}.hot-search button{border:0;background:none;color:#7b8678;font-size:10px;padding:0}.hot-search button:hover{color:var(--green);text-decoration:underline}.basket-button{background:white;border:1px solid #d9e2d6;border-radius:5px;padding:11px 16px;display:flex;align-items:center;gap:7px;color:#527448;white-space:nowrap;font-size:12px}.basket-button>span:first-child{font-size:25px;margin:0}.basket-button b{background:#e67851;color:white;margin-left:3px;width:19px;height:19px;font-size:10px}.shop-nav{background:#37644a;color:white}.shop-nav>div{max-width:1320px;margin:auto;padding:0 24px;display:flex;align-items:stretch;height:42px;gap:1px}.all-category-label{width:190px;display:flex;align-items:center;font-size:13px;font-weight:500;background:#2d563e;flex-shrink:0;padding-left:18px;margin-right:17px}.shop-nav button,.shop-nav a{border:0;color:#eef6eb;background:transparent;padding:0 23px;display:flex;align-items:center;font-size:12px;white-space:nowrap}.shop-nav button.active,.shop-nav button:hover{background:#547e5c}.shop-nav a{margin-left:auto;color:#cee1c3;font-size:11px}.preview-banner{font-size:9px;background:#f7f3e9;color:#9c8b68;padding:5px 12px;border-bottom:1px solid #ece5d5;letter-spacing:.5px}.shop-main{max-width:1320px;margin:auto;padding:18px 24px 0}.shop-shell{display:grid;grid-template-columns:190px minmax(0,1fr);gap:18px}.shop-sidebar{min-width:0}.sidebar-group{background:white;border:1px solid #e1e7de;border-radius:5px;overflow:hidden}.sidebar-group h2{font-size:13px;margin:0;background:#eaf0e6;padding:15px 17px;font-weight:600;color:#4e6d45}.sidebar-group button{display:flex;width:100%;padding:13px 17px;align-items:center;gap:10px;background:white;border:0;border-bottom:1px solid #f0f2ed;font-size:12px;color:#737e6c;text-align:left}.sidebar-group button span{font-size:17px;min-width:17px;color:#819873}.sidebar-group i{margin-left:auto;font-size:15px;font-style:normal;color:#b4bdb0}.sidebar-group button.active{background:#edf3e8;color:#3a653e;font-weight:600;box-shadow:inset 3px 0 #5f8452}.sidebar-group button:hover{background:#f5f8f1}.sidebar-note{background:#eaf0e3;border:1px solid #dbe4d1;border-radius:5px;margin-top:16px;padding:17px}.sidebar-note>span{font-size:8px;letter-spacing:1.5px;color:#8d9b7e}.sidebar-note h3{font-size:14px;font-weight:500;color:#557044;margin:7px 0}.sidebar-note strong{font-size:42px;font-weight:600;line-height:1.5;color:#4c7241}.sidebar-note strong small{font-size:12px;font-weight:400;color:#899878;margin-left:4px}.sidebar-note p{font-size:10px;color:#8a977d;line-height:1.9;margin:7px 0 13px}.sidebar-note a{font-size:10px;color:#567347}.sidebar-help{padding:20px 8px;color:#90998a}.sidebar-help b{font-size:11px;color:#75856c;font-weight:500}.sidebar-help p{font-size:10px;line-height:1.9}.shop-content{min-width:0}.promo-grid{display:grid;grid-template-columns:minmax(0,1fr) 215px;gap:13px;margin-bottom:18px;height:202px}.catalog-banner{position:relative;border-radius:6px;background:#e5ecdb;overflow:hidden;display:flex;align-items:center;padding:22px 26px}.catalog-banner>div{position:relative;z-index:1}.catalog-banner>div>span{font-size:8px;letter-spacing:1.6px;color:#8c9c7c}.catalog-banner h1{font-size:25px;font-weight:600;line-height:1.6;letter-spacing:1px;color:#42603b;margin:7px 0 5px}.catalog-banner p{font-size:10px;color:#859375;margin:0 0 10px}.catalog-banner img{position:absolute;right:43px;width:180px;height:190px;bottom:-8px;transform:rotate(-9deg)}.catalog-banner .promo-lamp{width:110px;right:-9px;bottom:-3px;transform:rotate(5deg);opacity:.9}.catalog-banner small{position:absolute;right:13px;bottom:9px;font-size:7px;color:#8c9b7d}.banner-link{border:0;border-bottom:1px solid #93a482;background:transparent;color:#627e51;font-size:10px;padding:0 0 2px}.quick-guide{border:1px solid #e7dfcc;background:#faf6eb;border-radius:6px;padding:15px 20px}.quick-guide>span{font-size:8px;letter-spacing:1.5px;color:#b2a17e}.quick-guide h2{font-size:17px;font-weight:500;line-height:1.6;color:#8a7853;margin:5px 0 7px}.quick-guide ol{padding-left:17px;color:#a69a7b;font-size:10px;line-height:1.8;margin:0 0 7px}.quick-guide>a{font-size:9px;color:#8f7b50}.collection{padding:0;max-width:none;margin:0}.catalog-heading{display:flex;align-items:end;justify-content:space-between;margin:0 0 12px}.breadcrumb{font-size:9px;color:#929c8d}.catalog-heading h2{font-size:20px;font-weight:600;letter-spacing:.8px;margin:4px 0 0;color:#3f503b}.catalog-label{font-size:9px;color:#9aa38f;margin-bottom:3px}.filter-row{background:white;border:1px solid #e2e7de;padding:10px 13px;display:flex;align-items:center;gap:12px;border-radius:4px}.filter-label{font-size:10px;color:#8a9482;border-right:1px solid #e3e8dd;padding-right:12px}.categories{gap:5px;flex:1}.categories button{font-size:10px;border-radius:3px;padding:5px 10px;color:#818e75;border:0;box-shadow:none;background:transparent}.categories button.active{color:#42653a;background:#eaf1e3;font-weight:500}.categories button:hover:not(.active){background:#f3f6ed}.sort{font-size:9px;color:#9ca58f;white-space:nowrap}.sort select{font-size:10px;color:#748466;margin-left:4px}.results-row{font-size:10px;color:#939d8c;padding:13px 1px}.results-row>span{font-size:9px}.cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.card{border:1px solid #e2e7dd;border-radius:5px;background:white;overflow:hidden;padding:0 0 12px;transition:box-shadow .2s}.card:hover{box-shadow:0 3px 12px #45633c14;border-color:#b8c9aa}.card-image{aspect-ratio:1;background:#f3f1e9!important;border-radius:0}.card:nth-child(even) .card-image{background:#eef1e9!important}.card-image img{padding:6px}.sample-tag{top:8px;left:8px;background:#ffffffb8;color:#9ca58e;font-size:7px;letter-spacing:.3px;padding:1px 5px;border-radius:2px}.detail-hint{bottom:8px;right:8px;background:#fffef8d9;width:23px;height:23px;font-size:12px;color:#8d9c7e}.card-meta{padding:0 10px;margin:10px 0 5px;font-size:7px;letter-spacing:.2px;color:#a4ad9b;gap:3px;flex-wrap:wrap}.card h3{font-size:12px;margin:0;padding:0 10px;letter-spacing:0;color:#4f5e46;line-height:1.7;font-weight:500;min-height:21px}.card .dimensions{font-size:7px;color:#a5ad9b;margin:5px 0 7px;padding:0 10px;line-height:1.6}.card-bottom{padding:0 10px;display:flex;flex-direction:column;align-items:stretch;gap:8px}.price{font-size:21px;font-weight:600;color:var(--accent);line-height:1.35}.price small{font-size:9px;font-weight:400;color:#a4aa9a;margin-left:3px}.add-button{width:100%;background:#f3f7ee;border:1px solid #cfddc4;border-radius:3px;color:#5b7b49;font-size:10px;padding:6px 4px}.add-button:hover{background:#e8f0df}.add-button.added{background:#6c8959;border-color:#6c8959;color:white}.availability-note{font-size:9px;margin-top:19px;padding:15px 8px;border-top:1px solid #e0e6d9;color:#909c85;justify-content:start}.how{margin:15px 0 30px;max-width:none;padding:23px 30px;grid-template-columns:1fr;gap:15px;background:white;border:1px solid #e0e7db;border-radius:5px}.how>div{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.how .eyebrow{font-size:9px;color:#8d9e80;letter-spacing:1px}.how h2{font-size:16px;font-weight:500;margin:0;letter-spacing:.4px}.how>div>p{font-size:9px;margin:0;color:#a0aa95}.how ol{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.how li{padding:0;border-bottom:0;gap:12px}.how li>span{font-size:22px;color:#b2c09f}.how h3{font-size:11px}.how li p{font-size:9px;color:#9ba58f}footer{max-width:1272px;margin:auto;padding:22px 0;border-color:#dce3d5;font-size:10px}footer .brand{font-size:18px}footer .brand b{font-size:11px}footer small{font-size:8px}.primary{border-radius:4px;background:#4e7854;color:white;box-shadow:none}.primary:hover{background:#426a47}.secondary{border-radius:4px;background:white;color:#748c61;border-color:#d2dec5}dialog{border-radius:6px}dialog::backdrop{background:#22332199}.detail-photo{background:#f1f2e8}.detail-info h2{color:#405b3e}.detail-info .price{font-size:27px;color:#c56744}#basket{border-radius:0}.drawer-header h2{color:#43603d}.estimate .total strong{color:#c56744}.toast{background:#4d6d41ee;border-radius:4px}.empty{background:white;border:1px solid #e1e8da;border-radius:5px}
.basket-button>span:not(:first-child){font-size:12px;margin:0}.promo-grid{height:165px}.catalog-banner h1{font-size:23px}.catalog-banner img{height:165px;width:160px}.catalog-banner .promo-lamp{width:100px}.quick-guide{padding:12px 18px}.quick-guide h2{font-size:15px;line-height:1.5;margin:4px 0 6px}.quick-guide ol{font-size:9px;margin-bottom:5px}.quick-guide>a{font-size:8px}
@media(min-width:1500px){.promo-grid{height:175px}.cards{gap:14px}.card-image{aspect-ratio:1.05}.card h3{font-size:13px}.card-meta,.card .dimensions{font-size:8px}.card-bottom .price{font-size:23px}}
@media(max-width:1100px){.header{gap:20px;padding:17px 24px}.brand{font-size:21px}.brand b{font-size:12px}.shop-shell{grid-template-columns:165px minmax(0,1fr);gap:14px}.all-category-label{width:165px;margin-right:10px}.shop-nav button,.shop-nav a{padding:0 18px}.promo-grid{grid-template-columns:minmax(0,1fr) 180px;height:190px}.catalog-banner{padding-left:20px}.catalog-banner h1{font-size:22px}.catalog-banner img{right:25px;width:135px;height:160px;opacity:.85}.catalog-banner .promo-lamp{right:-13px;width:90px}.quick-guide{padding:13px 15px}.quick-guide h2{font-size:15px}.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.filter-row{flex-wrap:wrap}.sort{margin-left:auto}.catalog-label{display:none}.how h2{font-size:15px}footer{margin:0 24px}}
@media(max-width:800px){.shop-sidebar{display:none}.shop-shell{display:block}.all-category-label{width:auto;padding:0 17px;margin-right:5px}.shop-nav button{padding:0 17px}.shop-nav a{display:none}.shop-nav>div{overflow:auto;padding:0 20px;gap:0}.header{flex-wrap:wrap;padding:15px 20px 10px;gap:13px;min-height:0}.brand{flex:1;font-size:23px}.brand b{font-size:12px}.brand small{font-size:8px;letter-spacing:2px}.shop-logo{font-size:33px;width:44px}.basket-button{padding:8px 12px;font-size:11px}.basket-button>span:first-child{font-size:22px}.header-search{order:3;flex-basis:100%;max-width:none}.searchbar{height:42px;border-width:2px}.hot-search{gap:14px;font-size:9px;margin-top:7px}.hot-search button{font-size:9px}.preview-banner{font-size:8px;letter-spacing:0}.shop-main{padding:14px 20px 0}.promo-grid{height:178px;grid-template-columns:minmax(0,1fr) 190px;gap:10px}.catalog-banner h1{font-size:22px}.catalog-banner img{right:38px;width:135px}.catalog-banner .promo-lamp{right:-10px;width:90px}.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.how{padding:22px}.how>div{gap:9px 15px}.how ol{gap:12px}.how li{gap:8px}.how li p{font-size:8px}}
@media(max-width:560px){.basket-button>span:not(:first-child){font-size:11px}.utility>div{padding:6px 16px;font-size:8px}.utility nav{gap:12px}.utility nav>span{display:none}.utility>div>span{max-width:56%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header{padding:13px 16px 10px;gap:12px}.brand{font-size:21px;gap:8px}.brand b{font-size:11px;margin-left:5px}.brand small{font-size:7px;letter-spacing:1.8px}.shop-logo{font-size:30px;width:37px;letter-spacing:-12px}.basket-button{padding:7px 9px;font-size:10px;gap:4px;border-radius:4px}.basket-button b{width:17px;height:17px;font-size:9px}.basket-button>span:first-child{font-size:20px}.search-scope{font-size:10px!important;padding:0 10px}.searchbar input{font-size:11px;padding:0 9px}.searchbar button{min-width:44px;font-size:25px}.hot-search{gap:13px;font-size:8px}.hot-search button{font-size:8px}.shop-nav>div{padding:0 16px;height:38px}.all-category-label{font-size:11px;padding:0 12px}.shop-nav button{padding:0 15px;font-size:11px}.preview-banner{padding:5px 9px;font-size:7px}.shop-main{padding:12px 12px 0}.promo-grid{height:155px;display:block;margin-bottom:14px}.catalog-banner{height:100%;padding:16px 20px;border-radius:5px}.catalog-banner>div>span{font-size:7px;letter-spacing:1px}.catalog-banner h1{font-size:21px;letter-spacing:.5px;margin:5px 0}.catalog-banner p{font-size:8px;margin-bottom:7px}.banner-link{font-size:9px}.catalog-banner img{width:125px;height:145px;right:24px;bottom:-5px;opacity:.6}.catalog-banner .promo-lamp{width:75px;right:-7px;opacity:.55}.catalog-banner small{font-size:6px}.quick-guide{display:none}.catalog-heading{margin:0 0 10px}.breadcrumb{font-size:8px}.catalog-heading h2{font-size:18px;letter-spacing:.3px}.filter-row{padding:8px 9px;gap:7px;display:flex;flex-wrap:wrap}.filter-label{font-size:9px;padding-right:8px}.categories{gap:2px;overflow:auto;flex-wrap:nowrap;padding:0;flex-basis:calc(100% - 40px)}.categories button{padding:5px 8px;font-size:9px}.sort{margin-left:auto;font-size:8px;margin-top:2px}.sort select{font-size:9px}.results-row{padding:11px 2px;font-size:9px}.results-row>span{font-size:8px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{border-radius:4px;padding-bottom:10px}.card-image{aspect-ratio:1.2}.card-image img{padding:2px 5px}.card-meta{font-size:7px;padding:0 9px;margin:9px 0 4px}.card h3{font-size:12px;padding:0 9px;min-height:21px}.card .dimensions{font-size:7px;padding:0 9px;margin:4px 0 6px}.card-bottom{padding:0 9px;gap:7px}.price{font-size:21px}.price small{font-size:8px}.add-button{font-size:10px;padding:6px 4px}.detail-hint{width:21px;height:21px;right:6px;bottom:6px}.sample-tag{font-size:6px;top:7px;left:7px}.availability-note{font-size:8px;padding:13px 3px;margin-top:16px;line-height:1.9}.how{margin:5px 0 20px;padding:17px 16px;gap:14px}.how>div{display:block}.how h2{font-size:14px;line-height:1.6;margin:5px 0}.how>div>p{font-size:8px}.how ol{display:block}.how li{padding:9px 0;gap:12px;border-bottom:1px solid #edf0e8}.how li:last-child{border:0}.how li>span{font-size:20px}.how h3{font-size:11px}.how li p{font-size:9px}.how .eyebrow{font-size:8px}footer{margin:0 16px;padding:19px 0;gap:8px 16px}footer .brand{font-size:16px}footer .brand b{font-size:10px}footer>span{font-size:9px}footer small{font-size:7px}.detail-info{padding:23px}.detail-info h2{font-size:23px}.detail-photo{height:230px}.drawer-header h2{font-size:21px}.drawer-intro{font-size:11px}}
