@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Serif+JP:wght@400;500;600;700;900&display=swap');
:root{--ink:#2d2a20;--paper:#faf6ec;--grain:#b58a50;--pale:#eee4d0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Serif JP',serif}a{color:inherit}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:10;background:#fff;padding:8px}.notice{background:#44372a;color:#fff;font-size:10px;line-height:1.8;padding:8px max(4vw,18px)}.header{background:var(--paper);min-height:90px;padding:17px max(4vw,18px);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;flex-direction:column;text-decoration:none}.brand-name{font-size:23px;font-weight:900;letter-spacing:.12em}.brand-en{font:600 10px 'DM Sans',sans-serif;letter-spacing:.25em;color:#987347}.header nav{display:flex;gap:28px;flex-wrap:wrap}.header nav a{text-decoration:none;font:700 12px 'DM Sans','Noto Serif JP',serif}.header nav a:hover,.about a:hover{text-decoration:underline}.hero-title{padding:72px max(4vw,18px) 55px}.eyebrow{font:700 11px 'DM Sans',sans-serif;letter-spacing:.21em;color:#9d7447}.title-line{display:flex;align-items:end;justify-content:space-between;gap:40px}.hero h1{font-size:clamp(44px,7.4vw,112px);line-height:1.18;letter-spacing:-.07em;margin:20px 0 0;font-weight:700}.hero h1 em{font-style:normal;color:#a57638}.title-line p{font-size:15px;line-height:2.15;min-width:19em;margin:0 0 14px}.hero-image{margin:0;position:relative;background:#be9863;height:min(51vw,690px);min-height:430px;overflow:hidden}.hero-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%}.hero-image figcaption{position:absolute;bottom:24px;left:max(4vw,18px);background:#faf6e9e8;padding:10px 14px;font:700 10px 'DM Sans',sans-serif;letter-spacing:.15em}.hero-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px max(4vw,18px);font:600 10px 'DM Sans',sans-serif;letter-spacing:.17em;border-bottom:1px solid #d7c6a7}.hero-bottom a{text-decoration:none;font:700 13px 'Noto Serif JP',serif;letter-spacing:0}.grains{padding:110px max(4vw,18px) 125px}.grains-intro{max-width:1170px;margin:0 auto 42px;display:grid;grid-template-columns:1fr 1fr;column-gap:48px}.grains-intro .eyebrow{grid-column:1/-1}.grains h2,.about h2{font-size:clamp(35px,4.4vw,64px);line-height:1.35;letter-spacing:-.045em;margin:16px 0 0}.grains-intro p{align-self:end;font-size:14px;line-height:2.1}.zoom-layout{max-width:1170px;margin:auto;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,.5fr);background:#e9dcc4}.zoom-window{--zoom:0;height:520px;overflow:hidden;background:#d7b579}.zoom-window img{width:100%;height:100%;display:block;object-fit:cover;transform:scale(calc(1 + var(--zoom) * .006));transform-origin:54% 55%;transition:transform .2s}.zoom-panel{padding:clamp(28px,4vw,58px);display:flex;flex-direction:column;justify-content:center}.zoom-panel>span{font:700 10px 'DM Sans',sans-serif;letter-spacing:.2em;color:#926935}.zoom-panel h3{font-size:clamp(27px,3vw,41px);line-height:1.5;margin:23px 0 43px}.zoom-panel label{font-size:15px;font-weight:700;margin-bottom:13px}.zoom-panel input{width:100%;accent-color:#9b6738;cursor:pointer}.zoom-panel input:focus-visible{outline:3px solid #814a23;outline-offset:5px}.scale{display:flex;justify-content:space-between;gap:10px;font:600 11px 'DM Sans','Noto Serif JP',serif;margin:12px 0}.scale output{font-variant-numeric:tabular-nums}.zoom-panel p{font-size:12px;line-height:1.8;margin-top:25px}.about{text-align:center;background:#e8dfcc;padding:110px max(4vw,18px)}.about h2{margin:18px 0 20px}.about p{font-size:14px;line-height:2.1;max-width:47em;margin:0 auto 24px}.about a{text-decoration:none;font-size:13px;border-bottom:1px solid var(--ink);padding-bottom:8px;font-weight:700}footer{display:flex;justify-content:space-between;gap:16px;padding:24px max(4vw,18px);font:600 10px 'DM Sans',sans-serif;letter-spacing:.13em}footer a{text-decoration:none}@media(max-width:800px){.header{flex-direction:column;align-items:flex-start}.hero-title{padding:43px 22px 32px}.title-line{display:block}.hero h1{font-size:clamp(40px,9vw,70px)}.title-line p{margin:26px 0 0;min-width:0}.hero-image{min-height:0;height:auto;aspect-ratio:1.45}.hero-bottom span:last-child{display:none}.grains{padding:75px 18px 90px}.grains-intro{display:block}.zoom-layout{grid-template-columns:1fr}.zoom-window{height:auto;aspect-ratio:1.4}.zoom-panel{padding:33px}.zoom-panel h3{margin:17px 0 25px}.about{padding:75px 20px}}@media(max-width:450px){.notice{font-size:9px}.header nav{gap:12px}.header nav a{font-size:11px}.hero-title{padding:33px 20px 26px}.hero h1{font-size:42px}.title-line p{font-size:14px;line-height:1.9;margin-top:18px}.hero-image{aspect-ratio:1.25}.hero-image figcaption{bottom:12px;left:12px;font-size:8px}.hero-bottom{padding:16px 18px}.hero-bottom span:first-child{font-size:8px}.hero-bottom a{font-size:11px}.grains h2,.about h2{font-size:34px}.zoom-window{aspect-ratio:1.15}.about p{font-size:13px}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.shop-link{display:inline-block;margin-top:14px;padding-bottom:8px;border-bottom:1px solid currentColor;text-decoration:none;font-size:12px;font-weight:700}.shop{display:grid;grid-template-columns:minmax(250px,.7fr) minmax(0,1.3fr);gap:5vw;align-items:center;background:#4b3d30;color:#fff;padding:85px 4vw 85px 7vw}.shop-copy{max-width:450px}.shop .eyebrow{color:#e9bf85}.shop h2{font-size:clamp(38px,4vw,62px);line-height:1.4;letter-spacing:-.05em;margin:22px 0}.shop p{font-size:13px;line-height:2.2}.shop-copy a{display:inline-block;margin-top:22px;padding-bottom:9px;border-bottom:1px solid currentColor;text-decoration:none;font-size:12px;font-weight:700}.shop figure{margin:0;position:relative}.shop img{display:block;width:100%;height:clamp(450px,47vw,650px);object-fit:cover}.shop figcaption{position:absolute;right:12px;bottom:12px;background:#faf6ecee;color:#4b3d30;padding:9px 12px;font:700 9px 'DM Sans',sans-serif;letter-spacing:.13em}@media(max-width:900px){.shop{display:block;padding:65px 5vw}.shop-copy{max-width:none;margin-bottom:35px}.shop img{height:auto}}@media(max-width:450px){.shop{padding:55px 0 0}.shop-copy{padding:0 5vw 15px}.shop h2{font-size:39px}.shop figcaption{font-size:8px}}
