:root{--ivory:#f7f3eb;--paper:#fffdf8;--ink:#242421;--bronze:#755323;--muted:#595750;--line:#cfc2ad}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ivory);color:var(--ink);font:17px/1.7 "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}
a{color:inherit;text-decoration:none}
.site-header{height:106px;display:flex;align-items:center;padding:0 clamp(28px,4.5vw,76px);gap:45px;border-bottom:1px solid var(--line);background:#faf7f1}
.brand{margin-right:auto;display:flex;flex-direction:column;gap:7px}
.brand span{font:21px Georgia,serif;letter-spacing:.28em;white-space:nowrap}
.brand small{color:var(--bronze);font-size:10px;font-weight:600;letter-spacing:.2em}
nav{display:flex;gap:clamp(20px,2.5vw,40px);font-size:16px}
nav a{white-space:nowrap}
.active{color:var(--bronze);font-weight:600}
.reorder{border-left:1px solid var(--line);padding-left:30px;font-size:16px;font-weight:700}
.breadcrumb{padding:20px clamp(28px,7vw,112px);font-size:15px;background:var(--paper);border-bottom:1px solid var(--line);color:var(--muted)}
.breadcrumb span{margin:0 12px}.breadcrumb b{color:var(--ink)}
.hero{padding:72px clamp(28px,7vw,112px) 58px;background:radial-gradient(circle at 75% 5%,#fffdf8 0,#f5f0e7 65%);border-bottom:1px solid var(--line)}
.eyebrow{margin:0 0 16px;color:var(--bronze);font:700 14px Georgia,serif;letter-spacing:.16em}
h1,h2{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:500}
h1{margin:0 0 15px;font-size:clamp(44px,4.5vw,66px);line-height:1.35}
.hero>p:not(.eyebrow){margin:0;color:var(--muted);font-size:19px}
.search-box{max-width:850px;margin-top:42px}
.search-box label{display:block;margin-bottom:8px;color:var(--bronze);font-size:15px;font-weight:700}
.search-box>div{display:grid;grid-template-columns:1fr 110px}
.search-box input,.search-box button{height:58px;border:1px solid var(--line);background:#fff;font-family:inherit;font-size:16px;color:var(--ink)}
.search-box input{padding:0 18px;border-right:0}.search-box button{font-weight:700;cursor:pointer}
.search-box>p{margin:9px 0 0;color:var(--muted);font-size:15px}
.featured{padding:62px clamp(28px,7vw,112px) 52px;background:var(--paper)}
.section-heading{display:flex;align-items:baseline;gap:18px;margin-bottom:25px}
.section-heading p{margin:0;color:var(--bronze);font:700 14px Georgia,serif;letter-spacing:.12em}
.section-heading h2{margin:0;font-size:32px;line-height:1.4}
.section-heading>span{margin-left:auto;color:var(--muted);font-size:15px}
.featured-grid,.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.featured-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.category-card{min-height:108px;display:grid;grid-template-columns:68px 1fr auto;align-items:center;gap:14px;padding:18px;border:1px solid var(--line);background:var(--paper);transition:.2s}
.featured-grid .category-card{min-height:120px;background:var(--ivory)}
.category-card:hover{border-color:var(--bronze);transform:translateY(-2px);box-shadow:0 8px 20px rgba(54,42,24,.1)}
.category-card img{width:64px;height:64px;object-fit:contain}
.category-card span{font-size:18px;font-weight:700;line-height:1.45}
.category-card b{color:var(--bronze);font-size:20px}
.category-card[hidden]{display:none}
.category-jump{position:sticky;top:0;z-index:5;display:flex;gap:8px;padding:15px clamp(28px,7vw,112px);overflow-x:auto;background:rgba(247,243,235,.97);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.category-jump a{flex:0 0 auto;padding:9px 14px;border:1px solid var(--line);background:var(--paper);font-size:15px;font-weight:700}
#categories{padding:20px clamp(28px,7vw,112px) 90px}
.category-section{padding-top:55px;scroll-margin-top:75px}
.category-section[hidden]{display:none}
.no-results{margin:20px clamp(28px,7vw,112px) 80px;padding:35px;text-align:center;border:1px solid var(--line);background:var(--paper);font-size:18px}
.help{padding:70px clamp(28px,7vw,112px);display:flex;align-items:center;gap:50px;background:#ded3c2}
.help div{margin-right:auto}.help h2{margin:0 0 10px;font-size:36px}.help div>p:last-child{margin:0;color:#504e49;font-size:18px}
.help>a{min-width:270px;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 25px;border:1px solid var(--ink);font-size:17px;font-weight:700}
.help>a span{color:var(--bronze)}
footer{padding:48px clamp(28px,5vw,76px);display:flex;align-items:center;gap:35px;background:var(--ink);color:#eee8dd}
footer .brand{margin-right:auto}footer p{font-size:14px;color:#d2cec5}
@media(max-width:1100px){nav{display:none}.featured-grid,.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){
 body{font-size:16px}.site-header{height:70px;padding:0 16px}.brand span{font-size:15px;letter-spacing:.16em}.brand small{display:none}.reorder{padding-left:14px;font-size:15px}
 .breadcrumb{padding:15px 18px;font-size:13px}.breadcrumb span{margin:0 7px}
 .hero{padding:42px 18px 34px}.eyebrow{font-size:12px}h1{font-size:36px}.hero>p:not(.eyebrow){font-size:16px;line-height:1.75}
 .search-box{margin-top:28px}.search-box label{font-size:14px}.search-box>div{grid-template-columns:1fr 76px}.search-box input,.search-box button{height:50px;font-size:16px}.search-box input{min-width:0;padding:0 12px}.search-box button{padding:0 8px}.search-box>p{font-size:14px}
 .featured{padding:40px 14px 35px}.section-heading{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin-bottom:18px}.section-heading p{font-size:12px}.section-heading h2{font-size:25px}.section-heading>span{grid-column:2;margin:0;font-size:13px}
 .featured-grid,.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .category-card,.featured-grid .category-card{min-height:114px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:7px;padding:13px;position:relative}
 .category-card img{width:48px;height:48px}.category-card span{font-size:16px;line-height:1.4}.category-card b{position:absolute;right:10px;top:10px;font-size:17px}
 .category-jump{padding:11px 14px}.category-jump a{padding:8px 11px;font-size:14px}
 #categories{padding:0 14px 60px}.category-section{padding-top:40px;scroll-margin-top:60px}
 .no-results{margin:20px 14px 55px;padding:25px 15px;font-size:16px}
 .help{padding:48px 20px;display:block}.help h2{font-size:29px}.help div>p:last-child{font-size:16px}.help>a{min-width:0;width:100%;height:58px;margin-top:28px;font-size:16px}
 footer{display:block;padding:38px 20px}footer p{margin-top:20px;font-size:13px}
}
