/* The desktop type scale and spacing follow both viewport dimensions. */
@media(min-width:768px){
 :root{
  --pc-u:clamp(.75px,min(calc(100vw/1440),calc(100svh/850)),1.15px);
  --type-display:clamp(34px,calc(var(--pc-u)*56),64px);
  --type-title:clamp(32px,calc(var(--pc-u)*44),52px);
  --type-heading:clamp(18px,calc(var(--pc-u)*22),26px);
  --type-body:clamp(14px,calc(var(--pc-u)*16),18px);
  --type-meta:clamp(11px,calc(var(--pc-u)*14),16px);
  --type-caption:clamp(10px,calc(var(--pc-u)*12),14px);
  --type-number:clamp(20px,calc(var(--pc-u)*24),28px);
  --leading-body:1.7;--leading-heading:1.4;
  --brand-h:clamp(56px,11svh,110px);
 }
 .journey-brand{height:var(--brand-h);gap:calc(var(--pc-u)*12)}
 .journey-brand>span{font-size:clamp(44px,min(7.4vw,11.6svh),114px)}
 .coffee-drawing{width:clamp(56px,min(8vw,11svh),110px)}
 .nav-toggle{left:calc(var(--pc-u)*25);top:calc(var(--pc-u)*24);width:calc(var(--pc-u)*49);height:calc(var(--pc-u)*52)}
 .home-light,.intro-lamp{width:calc(var(--pc-u)*74);height:calc(var(--pc-u)*104);top:calc(var(--pc-u)*-18)}
 .home{
  --hero-top:calc(var(--pc-u)*94 + var(--type-display)*1.25);
  --hero-h:max(100px,calc(var(--content-h) - var(--hero-top) - var(--news-h,170px) - var(--pc-u)*54));
 }
 .home h1{top:calc(var(--pc-u)*78)}
 .home .store{top:var(--hero-top);width:min(44vw,calc(var(--hero-h)*854/497))}
 .news-hanger{width:min(calc(var(--pc-u)*860),calc(100vw - var(--pc-u)*140));bottom:calc(var(--brand-h) + var(--pc-u)*16)}
 .news{grid-template-columns:calc(var(--pc-u)*60) minmax(0,1fr);gap:calc(var(--pc-u)*18);padding:calc(var(--pc-u)*16) calc(var(--pc-u)*20)}
 .news-items{gap:calc(var(--pc-u)*7)}
 .news .news-items>a,.news .news-items>p{grid-template-columns:calc(var(--type-meta)*6.7) minmax(0,1fr);gap:calc(var(--pc-u)*12)}
 .news-rope{width:calc(var(--pc-u)*100);height:calc(var(--pc-u)*28);top:calc(var(--pc-u)*-26)}
 .home-cola{top:calc(var(--hero-top) + var(--hero-h)*.08);height:calc(var(--hero-h)*.65)}
 .home-omelette{top:calc(var(--hero-top) + var(--hero-h)*.54);height:calc(var(--hero-h)*.43)}
 .home-pancakes{top:calc(var(--hero-top) + var(--hero-h)*.2);width:min(18vw,calc(var(--hero-h)*.72));height:auto}
 .home-coffee{top:calc(var(--hero-top) + var(--hero-h)*.6);height:calc(var(--hero-h)*.38)}
 .home-soda{top:calc(var(--pc-u)*14);height:calc(var(--hero-h)*.64)}
 /* Both columns stay within the content area above the moving wordmark. */
 .concept-layout{left:max(6%,calc(var(--pc-u)*78));right:5%;top:calc(var(--pc-u)*24);height:calc(var(--content-h) - var(--pc-u)*48);gap:4vw}
 .concept-story{width:min(100%,calc(var(--pc-u)*680));height:auto;max-height:100%;padding:calc(var(--pc-u)*20) calc(var(--pc-u)*14);gap:calc(var(--pc-u)*20);justify-content:safe center}
 .concept-story .concept-chapter h3{margin-bottom:calc(var(--pc-u)*10);line-height:1.4}
 .concept-story .concept-chapter p{line-height:1.65}
 .concept-story .concept-chapter p+p{margin-top:calc(var(--pc-u)*8)}
 .concept .concept-lamp{width:calc(var(--pc-u)*70);height:calc(var(--pc-u)*110)}
 .concept-cover-title>p{margin-bottom:calc(var(--pc-u)*10)}
 /* Cards use the actual space left after the introduction has been laid out. */
 .menus{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:calc(var(--pc-u)*18);padding:calc(var(--pc-u)*56) 5vw calc(var(--brand-h) + var(--pc-u)*14)}
 .menus .menu-list{position:relative;top:auto;left:auto;translate:none;width:100%;height:100%;min-height:0;container-type:size}
 .menus .menu-card{--menu-u:min(calc(100cqw/2551),calc(100cqh/1084));left:calc(50% - var(--menu-u)*1275.5 + var(--menu-u)*var(--card-x));top:calc((100% - var(--menu-u)*1084)/2)}
 .menus .menu-card :is(button,.menu-detail-link){padding:calc(var(--pc-u)*8) 2px}
 .menus .menu-summary{position:static;width:100%;height:auto;max-height:none;overflow:visible;padding:0;text-align:center}
 .menu-summary h2{margin-bottom:calc(var(--pc-u)*9)}
 .menu-summary h3{margin-bottom:calc(var(--pc-u)*10)}
 .menu-summary p{line-height:1.65}
 .visitor-spread{left:max(6%,calc(var(--pc-u)*78));right:5%;top:calc(var(--pc-u)*24);height:calc(var(--content-h) - var(--pc-u)*48);gap:calc(var(--pc-u)*40)}
 .visit-sheet{grid-template-rows:auto minmax(0,1fr) minmax(calc(var(--pc-u)*96),auto);gap:calc(var(--pc-u)*16)}
 .visit-heading h2{margin:calc(var(--pc-u)*5) 0}
 .visit-body{min-height:0;gap:calc(var(--pc-u)*20)}
 .visit-photo{padding:calc(var(--pc-u)*8) calc(var(--pc-u)*8) calc(var(--pc-u)*52)}
 .visit-photo figcaption{left:calc(var(--pc-u)*12);right:calc(var(--pc-u)*12);bottom:calc(var(--pc-u)*10)}
 .visit-details dl{margin-top:calc(var(--pc-u)*14)}
 .visit-details dl>div{padding:calc(var(--pc-u)*6) 0;gap:calc(var(--pc-u)*10);line-height:1.6}
 .visit-details dd{line-height:1.6}
 .visit-details dt{width:calc(var(--pc-u)*48)}
 .visit-hours-label{line-height:1.4}
 .visit-time{margin:calc(var(--pc-u)*4) 0}
 .visit-map-copy{padding:calc(var(--pc-u)*12);gap:calc(var(--pc-u)*5);line-height:1.5}
 .visit-map-copy strong{line-height:1.5}
 .contact-letter{padding:calc(var(--pc-u)*24);gap:calc(var(--pc-u)*12)}
 .letter-heading h2{margin-top:calc(var(--pc-u)*4)}
 .letter-stamp{width:calc(var(--pc-u)*54);height:calc(var(--pc-u)*68)}
 .letter-stamp svg{width:calc(var(--pc-u)*32);height:calc(var(--pc-u)*30)}
 .letter-message h3{margin-bottom:calc(var(--pc-u)*12);line-height:1.4}
 .letter-message h3 br{display:initial}
 .letter-message p{line-height:1.65}
 .letter-message p+p{margin-top:calc(var(--pc-u)*8)}
 .letter-mail{padding:calc(var(--pc-u)*12);gap:calc(var(--pc-u)*10)}
 .letter-mail small{margin-top:calc(var(--pc-u)*4);line-height:1.5}
 .letter-arrow{width:calc(var(--pc-u)*28);height:calc(var(--pc-u)*28)}
 .letter-instagram{padding-top:calc(var(--pc-u)*12);grid-template-columns:calc(var(--pc-u)*54) minmax(0,1fr) 16px;gap:calc(var(--pc-u)*10)}
 .social-thumbnail{width:calc(var(--pc-u)*54);height:calc(var(--pc-u)*60)}
 .social-copy small{margin-bottom:calc(var(--pc-u)*4)}
 .social-copy>span{margin-top:calc(var(--pc-u)*4);line-height:1.6}
 .social-copy>span br{display:none}
 .letter-company{padding-top:calc(var(--pc-u)*10);gap:calc(var(--pc-u)*8);line-height:1.5}
 .letter-company span{line-height:1.5}
 .company-lamp{top:calc(var(--pc-u)*-12);width:calc(var(--pc-u)*52);height:calc(var(--pc-u)*68)}
 .company-content{padding:calc(var(--pc-u)*62) 4% calc(var(--pc-u)*12)}
 .company-content>h2{margin-bottom:calc(var(--pc-u)*16)}
 .company-copy{max-width:calc(var(--pc-u)*1080)}
 .company-copy h3{margin-bottom:calc(var(--pc-u)*12)}
 .company-copy p{margin-bottom:calc(var(--pc-u)*10);line-height:1.65}
 .company-info{width:min(calc(var(--pc-u)*600),100%);margin-top:calc(var(--pc-u)*18)}
 .company-info h3{padding:calc(var(--pc-u)*5) calc(var(--pc-u)*10)}
 .company-info dl{margin:calc(var(--pc-u)*6) 0}
 .company-info dl>div{padding:calc(var(--pc-u)*4) calc(var(--pc-u)*10)}
 .company-info dt{width:calc(var(--pc-u)*60)}
 .company-info dd,.company-info li{line-height:1.65}
 .company-info ul{padding:calc(var(--pc-u)*4) calc(var(--pc-u)*8) calc(var(--pc-u)*6) calc(var(--pc-u)*28)}
 .company-motto{margin-top:calc(var(--pc-u)*12);line-height:1.6}
 .detail-shell{padding-bottom:calc(var(--pc-u)*50)}
 .detail-header h2{margin:calc(var(--pc-u)*14) 0 calc(var(--pc-u)*28)}
 .detail-item{gap:calc(var(--pc-u)*24);padding-bottom:calc(var(--pc-u)*24)}
 .detail-item img{height:clamp(150px,28svh,280px);max-height:28svh}
 .price-row{padding:calc(var(--pc-u)*10) 0;gap:calc(var(--pc-u)*12)}
 .detail-menu-nav button{padding:calc(var(--pc-u)*12) 2px}
}
@media(min-width:768px) and (max-height:880px){
 .company-info{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);column-gap:calc(var(--pc-u)*28);width:min(calc(var(--pc-u)*880),100%)}
 .company-info>h3:first-child{grid-column:1;grid-row:1}
 .company-info>dl{grid-column:1;grid-row:2}
 .company-info>h3:nth-of-type(2){grid-column:2;grid-row:1}
 .company-info>ul{grid-column:2;grid-row:2;margin-top:calc(var(--pc-u)*6)}
}
@media(min-width:768px) and (max-height:700px){
 .contact-letter{padding:calc(var(--pc-u)*18);gap:calc(var(--pc-u)*10)}
 .letter-stamp{height:calc(var(--pc-u)*58)}
 .letter-message h3 br{display:none}
}