/* Shared type scale for every page and menu detail. */
:root{
 --type-display:clamp(34px,4vw,56px);
 --type-title:44px;
 --type-heading:22px;
 --type-body:16px;
 --type-meta:14px;
 --type-caption:12px;
 --type-number:24px;
 --leading-body:1.8;
 --leading-heading:1.45;
}
body{font-size:var(--type-body);line-height:var(--leading-body)}
.home h1{font-size:var(--type-display)}
:is(.concept-cover-title h2,.visit-heading h2,.letter-heading h2,.company-content>h2,.detail-header h2,.menu-summary h2){
 font-size:var(--type-title);line-height:1.2;letter-spacing:-.025em
}
:is(.concept-story .concept-chapter h3,.menu-summary h3,.letter-message h3,.company-copy h3,.detail-item h3,.simple-group-title,.price-group-title,.menu-card h3){
 font-size:var(--type-heading);line-height:var(--leading-heading);font-weight:500
}
:is(.concept-story .concept-chapter p,.menu-summary p,.company-copy p,.letter-message p,.visit-welcome,.detail-item p,.detail-item .item-catch,.price-row,.company-info){
 font-size:var(--type-body);line-height:var(--leading-body);font-weight:400;letter-spacing:0
}
:is(.visit-details dl>div,.visit-details dd,.company-info dd,.company-info li){
 font-size:var(--type-body);line-height:var(--leading-body)
}
:is(.simple-set-note,.table-set-note,.price-note,.price-group-title>span,.company-motto,.visit-details dt,.company-info dt,.visit-hours-label,.visit-map-copy,.visit-map-copy strong,.letter-mail small,.social-copy>span,.letter-company,.letter-company span,.back-top,.official-menu,.detail-menu-nav button){
 font-size:var(--type-meta);line-height:1.7;letter-spacing:0
}
:is(.concept-cover-title>p,.concept-cover-cue,.visit-kicker,.visit-details .visit-kicker,.visit-hours .visit-kicker,.social-copy small,.detail-header p,.menu-note,#navigation>p,#navigation :is(button,a) span,.journey-controls>span,.detail-close){
 font-size:var(--type-caption);line-height:1.6
}
:is(.visit-time,.visit-time i){font-size:var(--type-number);line-height:1.3}
:is(.letter-mail strong,.social-copy strong,#navigation :is(button,a),.door-hotspot span,.menu-card :is(button,.menu-detail-link)){
 font-size:var(--type-body);line-height:1.5
}
.detail-item p.price{font-size:var(--type-heading);line-height:1.5}
.price-value{font-size:var(--type-body);line-height:var(--leading-body)}
.company-info h3{font-size:var(--type-heading);line-height:var(--leading-heading);padding:8px 12px}
.company-info{width:min(560px,100%);margin-top:24px}
.company-info dl{margin:8px 0}
.company-info dl>div{padding:6px 12px}
.company-info dt{width:64px}
.company-info ul{padding-top:8px;padding-bottom:10px}
.company-content{padding-top:68px}
.company-content>h2{margin-bottom:24px}
.company-copy{max-width:940px;margin:0 auto}
.company-copy h3{margin-bottom:18px}
.company-copy p{margin-bottom:18px}
.company-copy br{display:none}
.company-motto{margin-top:20px}
.concept-story .concept-chapter p{line-height:var(--leading-body)}
.concept-story .concept-chapter p+p{margin-top:10px}
.concept-story .concept-chapter h3{margin-bottom:12px}
.concept-story{gap:24px}
.menu-summary h2{font-family:'Barlow Condensed',Arial,sans-serif;letter-spacing:.025em;margin-bottom:12px}
.menu-summary h3{margin-bottom:12px}
.menu-card h3{font-family:'Barlow Condensed',Arial,sans-serif;font-weight:600}
.menu-card :is(button,.menu-detail-link){left:5%;width:90%;padding:10px 2px;letter-spacing:-.05em;white-space:nowrap}
.visit-sheet{grid-template-rows:auto minmax(300px,1fr) minmax(140px,auto);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin}
.visit-body{min-height:300px}
.visit-details dt{width:52px}
.visit-details dl>div{padding:8px 0;gap:12px}
.visit-details dd>a{white-space:normal;overflow-wrap:anywhere}
.visit-photo{padding-bottom:70px}
.visit-photo figcaption{display:block;bottom:10px;font-size:var(--type-caption);line-height:1.4}
.visit-photo figcaption>span{display:block;font-size:var(--type-caption);line-height:1.4;letter-spacing:.03em}
.visit-map-copy{padding:14px;gap:6px}
.letter-message h3{margin-bottom:18px}
.letter-message p+p{margin-top:12px}
.letter-mail{padding:16px}
.letter-mail small{overflow-wrap:anywhere}
.letter-instagram{grid-template-columns:60px minmax(0,1fr) 18px;gap:12px}
.social-thumbnail{width:60px;height:72px}
.social-copy strong{overflow-wrap:anywhere}
.letter-company{gap:8px}
.letter-company span{font-family:'Noto Sans JP',sans-serif}
.price-row{gap:14px;padding:12px 0}
.price-note{display:block}
.simple-set-note,.table-set-note{margin-bottom:22px}
.detail-item h3{margin-bottom:12px}
.detail-item p{margin-bottom:8px}
.detail-menu-nav button{padding:12px 2px}
#navigation :is(button,a){padding:16px 0}
.journey-controls>span{letter-spacing:.08em}
.scroll-hint{width:min(280px,calc(100vw - 48px));height:auto;padding:22px;gap:14px}
.scroll-hint-copy strong{font-size:var(--type-body)}
.scroll-hint-copy small{font-size:var(--type-meta);line-height:1.6}
/* News gets space for the shared readable type sizes. */
.news-hanger{--news-reserve:170px;width:min(860px,calc(100vw - 160px))}
.news{display:grid;grid-template-columns:60px minmax(0,1fr);gap:18px;padding:18px 20px;line-height:var(--leading-body)}
.news h2{font-family:'Barlow Condensed',Arial,sans-serif;font-size:var(--type-heading);font-weight:600;line-height:var(--leading-heading);letter-spacing:.04em;margin:0}
.news-items{display:grid;gap:8px;min-width:0}
.news .news-items>a,.news .news-items>p{display:grid;grid-template-columns:94px minmax(0,1fr);gap:14px;margin:0;font-size:var(--type-body);line-height:1.65;align-items:baseline}
.news .news-items time{font-size:var(--type-meta);line-height:1.65;font-variant-numeric:tabular-nums;letter-spacing:0}
.news .news-items span{font-size:var(--type-body);line-height:1.65;overflow-wrap:anywhere}
@media(min-width:768px){
 .home .store{top:calc(var(--content-h)*.25);width:min(44vw,calc((var(--content-h)*.75 - 222px)*854/497))}
 .news-hanger{top:auto;bottom:calc(var(--brand-h) + 20px)}
 .menus{--menu-copy-h:220px;--menu-u:min(calc((100vw - 100px)/2551),calc(max(280px,var(--content-h) - 324px)/1084))}
 .menus .menu-summary{top:calc(86px + var(--menu-u)*1084);max-height:calc(var(--content-h) - 96px - var(--menu-u)*1084);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;padding-bottom:10px}
}
@media(min-width:768px) and (max-width:1023px){
 .news-hanger{width:calc(100vw - 100px)}
 .home .store{width:min(44vw,calc((var(--content-h)*.75 - 250px)*854/497))}
}
@media(max-width:767px){
 :root{--type-title:36px;--type-display:32px}
 .home{width:200vw}
 .home h1,.home .store,.home-light{left:50vw}
 .home-soda{left:77vw}.home-cola{left:11vw}.home-pancakes{left:67vw}.home-coffee{left:47vw}
 .news-hanger{left:150vw;top:calc(var(--content-h)*.5 + 22px);bottom:auto;translate:-50% -50%;width:calc(100vw - 48px);max-height:calc(var(--content-h) - 110px)}
 .news{display:block;padding:24px 20px;max-height:calc(var(--content-h) - 110px);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin}
 .news h2{font-size:var(--type-title);line-height:1.2;margin-bottom:22px}
 .news-items{gap:20px}
 .news .news-items>a,.news .news-items>p{grid-template-columns:1fr;gap:5px}
 .news-rope{top:-25px}
 .menu-summary{gap:0}
 .menu-summary h2{margin-bottom:24px}
 .menu-summary h3{line-height:1.7;margin-bottom:22px}
 .menu-summary p{line-height:var(--leading-body)}
 .concept-story{margin:84px 30px 30px;padding:20px 2px;gap:26px}
 .concept-story .concept-chapter h3{line-height:var(--leading-heading)}
 .company-content{padding:76px 6% 30px}
 .company-content>h2{margin-bottom:22px}
 .company-info dt{width:58px}
 .company-info dl>div{padding:7px;gap:10px}
 .visit-sheet{grid-template-rows:auto minmax(390px,1fr) minmax(150px,auto);gap:20px}
 .visit-body{grid-template-rows:minmax(150px,1fr) auto;gap:20px;min-height:390px}
 .visit-heading{padding-top:55px;padding-left:0}
 .visit-heading h2{margin:8px 0}
 .visit-welcome{letter-spacing:0}
 .visit-photo{padding-bottom:60px}
 .visit-map{grid-template-columns:1fr 1.2fr}
 .visit-details dt{width:52px}
 .visit-details dl>div{padding:7px 0}
 .contact-letter{padding:28px 23px;gap:24px}
 .letter-heading{padding-top:48px;padding-left:0}
 .letter-stamp{width:48px;height:64px}
 .letter-message h3{line-height:var(--leading-heading)}
 .letter-message p{line-height:var(--leading-body)}
 .detail-shell{padding-left:6%;padding-right:6%}
 .detail-menu-nav button{font-size:var(--type-meta)}
}

/* Keep the hanging lamp clear of the unified page title. */
.company-lamp{top:-14px;width:58px;height:75px}
@media(max-width:767px){.company-lamp{top:-16px;width:52px;height:70px}}
