:root{--paper:#f3f0e7;--ink:#24231f;--muted:#666159;--left:34.7222%;--film:45.1389%}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}a:focus-visible,button:focus-visible{outline:1px solid currentColor;outline-offset:8px}.skip{position:fixed;z-index:10;top:12px;left:12px;padding:12px;background:var(--paper);transform:translateY(-180%)}.skip:focus{transform:none}
.fv{position:relative;height:100svh;min-height:800px;background:var(--paper);overflow:hidden}
.brand{position:absolute;top:58px;left:5.278%;width:112px;line-height:0}.official-logo{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.copy{position:absolute;left:5.278%;top:28.6%;width:calc(var(--left) - 9%)}
h1{display:flex;flex-direction:column;margin:0;font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;font-weight:400;font-size:clamp(34px,3.06vw,50px);line-height:1.55;letter-spacing:.035em;white-space:nowrap}
.description{margin:13px 0 0;font-size:15px;line-height:2.03;letter-spacing:.025em;color:#514d46}
.signature{width:255px;max-width:100%;border-top:1px solid #aaa397;padding-top:23px;margin:28px 0 0;font-family:Arial,sans-serif;font-size:11px;line-height:1.65;letter-spacing:.025em;color:var(--muted)}
.film{position:absolute;inset:0 auto 0 var(--left);width:var(--film);height:100%;isolation:isolate;background:#352b20;overflow:hidden}
.poster,.film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}.film video{opacity:0}.film.has-video video{opacity:1}.film.has-error video{display:none}
.navigation{position:absolute;top:56px;left:calc(var(--left) + var(--film) + 3.125%);right:4.375%;display:flex;flex-direction:column;align-items:flex-start;gap:25px;border-right:1px solid #a69c8b;padding:5px 0 15px;min-height:173px}
.navigation a{display:block;padding:3px 0}.en{font-family:Arial,sans-serif;font-size:12px;letter-spacing:.025em;line-height:1.5}.ja{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.arrow{display:none}.navigation a:hover .en{color:#7a5f4a}
.location{position:absolute;left:5.278%;bottom:48px;margin:0;font-size:10px;letter-spacing:.1em;line-height:1.8;color:var(--muted)}.location span{display:block;margin-top:3px;font-family:Arial,sans-serif;font-size:8px;letter-spacing:.08em}
.scroll{position:absolute;left:calc(var(--left) + var(--film) + 3.125%);bottom:49px;display:flex;align-items:center;gap:15px;font-family:Arial,sans-serif;font-size:9px;letter-spacing:.1em;color:var(--muted)}.scroll i{display:block;width:1px;height:24px;background:#9c9589}
.playback{position:absolute;left:calc(var(--left) + var(--film) + 3.125%);bottom:104px;display:flex;align-items:center;gap:10px;border:0;padding:9px 0;background:none;cursor:pointer;font-size:9px;letter-spacing:.04em;color:var(--muted)}.pause-icon{display:block;width:7px;height:9px;border-left:2px solid currentColor;border-right:2px solid currentColor}.playback[aria-pressed="true"] .pause-icon{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid currentColor;border-right:0}.playback:hover{color:var(--ink)}.playback[hidden]{display:none}
.next-background{height:180px;background:#eeebe3}
@media(max-height:800px) and (min-width:901px){.fv{height:800px}}
@media(max-width:1100px) and (min-width:901px){.brand{width:96px}.description{font-size:12px}.signature{width:210px}h1{font-size:32px}.navigation{right:3%;left:calc(var(--left) + var(--film) + 2.5%)}.en{font-size:11px}}
@media(max-width:900px){:root{--left:42%;--film:58%}.fv{min-height:950px;height:100svh}.brand{left:5%;top:38px;width:86px}.copy{left:5%;top:230px;width:32%}h1{font-size:28px}.description{font-size:11px;margin-top:20px}.signature{font-size:9px;width:190px}.film{height:calc(100% - 150px)}.navigation{left:5%;right:5%;top:auto;bottom:72px;min-height:0;padding:0;border:0;flex-direction:row;gap:18px}.location{bottom:24px;font-size:9px}.location span{display:none}.scroll{left:auto;right:5%;bottom:25px}.playback{left:auto;right:5%;bottom:115px}.en{font-size:10px}}
@media(max-width:560px){.fv{min-height:950px;height:auto}.brand{width:72px;top:30px}.copy{top:150px}h1{font-size:19px;line-height:1.7}.description{font-size:10px;line-height:2}.signature{width:125px;font-size:8px;padding-top:18px;margin-top:20px}.film{height:760px}.navigation{bottom:110px;gap:10px}.playback{bottom:57px}.scroll{bottom:26px}.location{bottom:25px}.en{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Black FV, with the reference site's approachable Japanese sans serif. */
:root{--paper:#10100f;--ink:#eeeae1;--muted:#b6b1a7}
body{background:#eeebe3;font-family:"Zen Kaku Gothic New","Yu Gothic",sans-serif}
.official-logo{filter:invert(1);mix-blend-mode:screen}
h1{font-family:"Zen Kaku Gothic New","Yu Gothic",sans-serif;font-weight:700;font-size:clamp(32px,2.78vw,44px);line-height:1.7;letter-spacing:.035em}
.description{color:#c5c0b7;font-weight:400}
.signature{border-color:#625f58;color:#b6b1a7}
.navigation{border-color:#625f58}
.navigation .en{font-family:"Zen Kaku Gothic New","Yu Gothic",sans-serif;font-size:13px;font-weight:500;letter-spacing:.07em}
.navigation a:hover .en{color:#fff}
.scroll i{background:#969087}
@media(max-width:1100px) and (min-width:901px){h1{font-size:30px}}
@media(max-width:900px){h1{font-size:26px}}
@media(max-width:560px){h1{font-size:18px}}
/* The actual interior sits quietly behind the foreground film. */
.fv::before{content:"";position:absolute;inset:-40px;background:url("assets/store-interior.jpg") center 55% / cover no-repeat;filter:blur(22px) brightness(.55) saturate(.6);opacity:.68;pointer-events:none}
.fv::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,9,.5),rgba(10,10,9,.15) 45%,rgba(10,10,9,.35));pointer-events:none}
.fv>*{z-index:1}
/* Keep the storefront recognisable through restrained softening. */
.fv::before{background-image:url("assets/store-facade.jpg");background-position:center 48%;filter:blur(5px) brightness(.78) saturate(.72);opacity:.9}
.fv::after{background:linear-gradient(90deg,rgba(8,8,8,.58) 0%,rgba(8,8,8,.38) 34%,rgba(8,8,8,.2) 55%,rgba(8,8,8,.48) 100%)}
/* Retain the clearer background treatment and return to the interior. */
.fv::before{background-image:url("assets/store-interior.jpg");background-position:center 55%}
/* A softer interior and Japanese side navigation inspired by the reference. */
.fv::before{filter:blur(9px) brightness(.78) saturate(.72)}
.navigation{top:28%;left:calc(var(--left) + var(--film) + 2.5%);right:3.8%;padding:0;border:0;gap:23px;align-items:stretch}
.navigation a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:4px 0;min-height:28px}
.navigation .en{display:none}
.navigation .ja{position:static;width:auto;height:auto;overflow:visible;clip-path:none;font-family:"Zen Kaku Gothic New","Yu Gothic",sans-serif;font-size:17px;font-weight:700;letter-spacing:.06em;line-height:1.65;color:#eeeae1}
.navigation a::after{content:"›";display:flex;align-items:center;justify-content:center;flex:0 0 18px;width:18px;height:18px;border-radius:50%;background:#eeeae1;color:#25231f;font-family:Arial,sans-serif;font-size:19px;line-height:1;padding-bottom:2px;transition:transform .2s}
.navigation a:hover .ja{color:#fff}
.navigation a:hover::after{transform:translateX(3px);background:#fff}
@media(max-width:1100px) and (min-width:901px){.navigation .ja{font-size:14px;letter-spacing:0}.navigation a{gap:8px}.navigation a::after{flex-basis:15px;width:15px;height:15px;font-size:16px}}
@media(max-width:900px){.navigation{top:auto;bottom:72px;left:5%;right:5%;gap:12px;align-items:center}.navigation .ja{font-size:12px;letter-spacing:0}.navigation a{gap:7px}.navigation a::after{flex-basis:14px;width:14px;height:14px;font-size:15px}}
@media(max-width:560px){.navigation{bottom:110px;gap:8px}.navigation .ja{font-size:10px}.navigation a{gap:4px}.navigation a::after{display:none}}
/* Give the copy and navigation more presence without adding content. */
h1{font-size:clamp(36px,3.34vw,52px);line-height:1.55;letter-spacing:.035em}
.description{margin-top:18px;font-size:16px;line-height:1.9}
.signature{margin-top:24px}
.navigation{top:27%;gap:25px}
.navigation .ja{font-size:21px;letter-spacing:.045em}
.navigation a::after{flex-basis:20px;width:20px;height:20px;font-size:21px}
@media(max-width:1100px) and (min-width:901px){h1{font-size:36px}.navigation .ja{font-size:16px}.description{font-size:13px}}
@media(max-width:900px){h1{font-size:29px}.description{font-size:11px}.navigation .ja{font-size:12px}.navigation{top:auto}.navigation a::after{flex-basis:14px;width:14px;height:14px;font-size:15px}}
@media(max-width:560px){h1{font-size:19px}.description{font-size:10px}.navigation .ja{font-size:10px}}
/* A friendly, heavy headline; compact lines keep the film in focus. */
h1{font-family:"Arial Rounded MT Bold","Meiryo","Yu Gothic",sans-serif;font-weight:900;font-size:clamp(38px,3.48vw,54px);line-height:1.4;letter-spacing:.015em;-webkit-text-stroke:.65px currentColor;paint-order:stroke fill}
.copy{top:27%}
.description{margin-top:25px}
@media(max-width:1100px) and (min-width:901px){h1{font-size:38px}}
@media(max-width:900px){h1{font-size:30px}.copy{top:230px}}
@media(max-width:560px){h1{font-size:22px}.copy{top:150px}}
/* Group the enlarged brand mark and headline within the left column. */
.brand{top:15%;left:5.278%;width:154px}
.copy{top:39%}
h1{font-size:clamp(38px,3.34vw,52px);line-height:1.35}
.description{margin-top:23px;font-size:15px;line-height:1.9}
.signature{margin-top:21px;padding-top:18px}
@media(max-width:1100px) and (min-width:901px){.brand{width:132px}h1{font-size:36px}.description{font-size:13px}}
@media(max-width:900px){.brand{top:65px;width:112px}.copy{top:245px}h1{font-size:29px}.description{font-size:11px}}
@media(max-width:560px){.brand{top:48px;width:84px}.copy{top:185px}h1{font-size:21px}.description{font-size:10px}}
/* Headline above the mark, both centered within the left column. */
.copy{top:15%;left:4.8%;width:calc(var(--left) - 9.6%);text-align:center}
h1{align-items:center;font-size:clamp(36px,3.2vw,50px);line-height:1.35}
.brand{top:44%;left:calc(var(--left)/2 - 77px);width:154px}
.description{position:absolute;top:calc(49svh - 135px);left:0;right:0;margin:0;font-size:14px;line-height:1.9}
.signature{position:absolute;top:calc(49svh - 22px);left:50%;transform:translateX(-50%);width:235px;margin:0;padding-top:18px}
@media(max-height:800px) and (min-width:901px){.description{top:257px}.signature{top:370px}}
@media(max-width:1100px) and (min-width:901px){h1{font-size:34px}.description{font-size:12px}.brand{left:calc(var(--left)/2 - 66px);width:132px}}
@media(max-width:900px){.copy{top:130px;left:5%;width:32%}h1{font-size:27px}.brand{top:330px;left:calc(var(--left)/2 - 56px);width:112px}.description{top:380px;font-size:11px}.signature{top:470px;width:180px}}
@media(max-width:560px){.copy{top:120px}h1{font-size:20px}.brand{top:280px;left:calc(var(--left)/2 - 42px);width:84px}.description{top:295px;font-size:10px}.signature{top:390px;width:120px}}
/* Keep the supporting copy below the centered logo. */
.description{top:calc(29svh + 190px)}
.signature{top:calc(29svh + 300px)}
@media(max-width:900px){.description{top:380px}.signature{top:470px}}
@media(max-width:560px){.description{top:295px}.signature{top:390px}}
/* Center the official mark in the left column without a headline. */
.brand{top:50%;left:calc(var(--left)/2);width:240px;transform:translate(-50%,-50%)}
.copy{top:calc(50% + 165px)}
.description{position:static;margin:0}
.signature{position:static;transform:none;width:235px;margin:24px auto 0}
@media(max-width:1100px) and (min-width:901px){.brand{width:210px}}
@media(max-width:900px){.brand{top:40%;left:calc(var(--left)/2);width:145px}.copy{top:calc(40% + 110px)}.signature{width:180px}}
@media(max-width:560px){.brand{width:105px}.copy{top:calc(40% + 85px)}.signature{width:120px}}
/* The warm paper sections below the film. */
.contents{background:#f1eee6;color:#282620;position:relative}
.content-section{padding:110px max(7vw,24px);max-width:1600px;margin:auto}
.eyebrow{display:flex;align-items:center;gap:26px;margin:0 0 65px;font-size:15px;font-weight:700;letter-spacing:.08em}
.eyebrow span{font:10px Arial,sans-serif;letter-spacing:.13em;color:#777268}
.contents h2{font-family:"Meiryo","Yu Gothic",sans-serif;font-size:clamp(32px,3.2vw,48px);line-height:1.55;letter-spacing:.06em;margin:0;font-weight:800}
.intro-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;margin-bottom:80px}
.intro-text p{font-size:16px;line-height:2.2;margin:0 0 25px}
.wide-store{margin:0}.wide-store img{display:block;width:100%;height:450px;object-fit:cover}.wide-store figcaption{font-size:12px;margin-top:16px;letter-spacing:.1em;color:#6a665c}
.food-section{padding-top:70px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:65px}.section-heading>p{line-height:2;font-size:15px;padding-right:12%}
.food-feature{display:grid;grid-template-columns:60% 1fr;align-items:center;gap:65px;margin:0 0 90px}.food-feature>img{width:100%;height:420px;object-fit:cover}.food-feature h3{font-size:32px;letter-spacing:.08em;margin:18px 0 22px}.food-feature p{line-height:2;font-size:15px}.food-feature .food-index{font-size:11px;letter-spacing:.1em;color:#777268}.food-feature.reverse{grid-template-columns:1fr 60%}.food-feature.reverse>img{grid-column:2;grid-row:1}.food-feature.reverse>div{grid-column:1;grid-row:1}
.section-link{display:flex;justify-content:space-between;align-items:center;width:min(460px,100%);margin:auto;border-top:1px solid #aaa398;border-bottom:1px solid #aaa398;padding:24px 3px;font-size:19px;font-weight:700}.section-link span{font-size:24px}.section-link:hover{color:#705b47}
.shop-section{border-top:1px solid #d5cfc3}.shop-layout{display:grid;grid-template-columns:52% 1fr;gap:80px;align-items:start}.shop-layout>img{width:100%;height:610px;object-fit:cover}.shop-layout h2{font-size:35px;margin-bottom:36px}.shop-detail{padding:20px 0;border-bottom:1px solid #d1cabd}.shop-detail h3{font-size:17px;margin:0 0 12px}.shop-detail p{font-size:14px;margin:0 0 12px}.shop-detail>a{font-size:17px}.map-link{margin-left:25px;font-size:12px!important}.hours-link{display:inline-block;font-size:12px;margin-top:22px;text-decoration:underline;text-underline-offset:5px}
.site-footer{display:flex;align-items:center;gap:26px;padding:45px 7vw 120px;border-top:1px solid #d5cfc3}.site-footer img{width:64px;mix-blend-mode:multiply}.site-footer p{font-size:14px;line-height:1.9}.site-footer small{font-size:10px;color:#777268}.site-footer>a{margin-left:auto;font-size:11px}
.follow-contact{position:fixed;right:28px;bottom:24px;z-index:20;display:flex;background:#f1eee6;color:#282620;box-shadow:0 3px 20px #0002;border:1px solid #bfb7a8}.follow-contact>a{display:flex;align-items:center;justify-content:center;padding:17px 25px;font-weight:700;font-size:15px}.follow-phone{flex-direction:column;gap:4px}.follow-phone small{font:10px Arial,sans-serif;letter-spacing:.04em}.follow-reserve{background:#292821;color:#f5f1e8;gap:30px}.follow-contact a:hover{opacity:.8}
.fv .scroll{bottom:155px}.fv .playback{bottom:200px}
@media(max-width:900px){.content-section{padding:70px 6vw}.intro-layout{gap:35px}.intro-text p{font-size:14px}.wide-store img{height:320px}.food-feature{gap:30px}.food-feature>img{height:300px}.shop-layout{gap:35px}.shop-layout>img{height:500px}.shop-layout h2{font-size:27px}}
@media(max-width:600px){.eyebrow{margin-bottom:38px;gap:16px;font-size:13px}.eyebrow span{font-size:8px}.intro-layout,.food-feature,.food-feature.reverse,.shop-layout{display:flex;flex-direction:column;gap:30px}.intro-layout{margin-bottom:40px}.wide-store img{height:230px}.section-heading{display:block;margin-bottom:35px}.section-heading>p{margin-top:25px}.food-feature{align-items:stretch;margin-bottom:50px}.food-feature>img{height:260px}.food-feature h3{font-size:27px;margin:10px 0}.food-feature p{margin:5px 0}.shop-layout>img{height:360px}.shop-layout>div{width:100%}.site-footer{flex-wrap:wrap;padding-bottom:120px}.site-footer>a{margin-left:0}.follow-contact{left:0;right:0;bottom:0;border:0;border-top:1px solid #bfb7a8}.follow-contact>a{width:50%;padding:14px}.fv .scroll{bottom:180px}.fv .playback{bottom:215px}}
/* Rebuilt lower page: bold type, generous rhythm, photography first. */
.contents{background:#eee9de;color:#242720}
.content-section{max-width:none;padding:120px 7vw}
.eyebrow{font-size:17px;gap:22px;margin-bottom:65px}.eyebrow span{font-size:10px;color:#74766b}
.contents h2{font-family:"Meiryo","Yu Gothic",sans-serif;font-size:clamp(42px,5.3vw,78px);line-height:1.4;letter-spacing:-.045em;font-weight:900}
.introduction{position:relative;padding-top:135px;padding-bottom:100px;overflow:hidden}
.intro-layout{grid-template-columns:1.15fr 1fr;gap:8vw;align-items:center;margin-bottom:70px}.intro-text{padding-top:15px}.intro-text p{font-size:16px;line-height:2.25}
.wide-store{margin-left:22%;margin-right:-7vw;position:relative}.wide-store img{height:520px}.wide-store figcaption{position:absolute;left:-105px;top:38px;writing-mode:vertical-rl;font-weight:700;font-size:19px;letter-spacing:.16em;color:#242720}
.food-section{background:#dce0d0;padding-top:105px;padding-bottom:115px}.section-heading{margin-bottom:90px;align-items:center}.section-heading>p{font-size:17px;padding-right:6%;line-height:2.2}
.food-feature{position:relative;display:block;margin:0 0 130px;padding-right:27%}.food-feature>img{height:560px;width:100%;object-fit:cover}.food-feature>div{position:absolute;right:0;top:90px;width:33%;background:#dce0d0;padding:30px 0 30px 45px}.food-feature h3{font-size:clamp(42px,5.4vw,80px);letter-spacing:-.04em;line-height:1.3;margin:25px 0}.food-feature p{font-size:17px;line-height:2}.food-feature .food-index{font-size:13px;color:#525b47}.food-feature.reverse{display:block;padding-right:0;padding-left:27%;margin-bottom:85px}.food-feature.reverse>div{right:auto;left:0;top:100px;padding:30px 45px 30px 0;width:34%}.food-feature.reverse>img{height:530px}
.section-link{width:100%;max-width:none;font-size:27px;border-color:#8a9380;padding:28px 0}.section-link span{font-size:34px}
.shop-section{background:#eee9de;border:0;padding-top:115px}.shop-layout{grid-template-columns:1fr 1fr;gap:7vw;align-items:center}.shop-layout>img{height:720px;object-position:50% 50%}.shop-layout h2{font-size:clamp(38px,4.2vw,61px);line-height:1.5;margin-bottom:40px}.shop-detail{border-color:#b9baac;padding:25px 0}.shop-detail h3{font-size:20px}.shop-detail p{font-size:15px}.shop-detail>a{font-size:22px}.hours-link{font-size:14px;margin-top:30px}
.site-footer{background:#252921;color:#eee9de;border:0;padding-top:65px;padding-bottom:140px}.site-footer img{filter:invert(1);mix-blend-mode:screen;width:90px}.site-footer p{font-size:17px}.site-footer small{color:#b7bbac}
@media(max-width:900px){.content-section{padding:80px 6vw}.contents h2{font-size:45px}.intro-layout{gap:40px}.intro-text p{font-size:14px}.wide-store{margin-left:15%;margin-right:-6vw}.wide-store img{height:350px}.wide-store figcaption{left:-70px;font-size:15px}.food-feature{padding-right:20%}.food-feature>img,.food-feature.reverse>img{height:400px}.food-feature>div{width:40%;padding-left:28px;top:65px}.food-feature.reverse{padding-left:20%}.food-feature.reverse>div{width:40%;padding-right:28px;top:65px}.food-feature h3{font-size:48px}.food-feature p{font-size:14px}.shop-layout{gap:35px}.shop-layout>img{height:580px}.shop-layout h2{font-size:34px}.shop-detail h3{font-size:17px}}
@media(max-width:600px){.content-section{padding:65px 7vw}.contents h2{font-size:42px}.eyebrow{font-size:14px;margin-bottom:35px}.eyebrow span{font-size:8px}.intro-layout{display:block;margin-bottom:40px}.intro-text{margin-top:30px}.intro-text p{font-size:14px}.wide-store{margin:0 -7vw 0 10%}.wide-store img{height:290px}.wide-store figcaption{left:-40px;top:15px;font-size:13px}.section-heading{display:block;margin-bottom:45px}.section-heading>p{font-size:14px;margin-top:25px}.food-feature,.food-feature.reverse{padding:0;display:block;margin-bottom:65px}.food-feature>img,.food-feature.reverse>img{height:300px}.food-feature>div,.food-feature.reverse>div{position:relative;top:auto;left:auto;right:auto;width:92%;margin:-25px 0 0 auto;padding:25px 0 0 24px}.food-feature.reverse>div{margin:-25px auto 0 0;padding:25px 24px 0 0}.food-feature h3{font-size:45px;margin:15px 0}.section-link{font-size:21px}.shop-layout{display:block}.shop-layout>img{height:420px;margin-bottom:38px}.shop-layout h2{font-size:38px}.site-footer{padding:50px 7vw 120px}.site-footer img{width:65px}.site-footer p{font-size:13px}}
