/* A short, visibly expandable headline keeps the news board compact. */
.home-composition{display:contents}
.news .news-items time,.news .news-items .news-date-year{font-size:var(--type-meta);line-height:1.6}
.news .news-link{align-items:center}
.news .news-link-label{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;width:max-content;max-width:100%;font-weight:600}
.news-link-label>span{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.news-link-icon{display:grid;place-items:center;flex:none;width:22px;height:22px;border:1px solid currentColor;border-radius:50%;font:400 18px/1 Arial,sans-serif;transition:background .2s,color .2s}
.news-link:hover .news-link-icon,.news-link:focus-visible .news-link-icon{background:var(--cream);color:var(--green)}
.news-dialog{position:fixed;inset:auto;left:50%;top:50%;translate:-50% -50%;margin:0;width:min(800px,calc(100vw - 32px));height:auto;max-height:calc(100svh - 32px);padding:12px;overflow:hidden;background:var(--green)}
.news-close{position:absolute;z-index:3;top:20px;right:20px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--ink);color:var(--cream);font:400 28px/1 Arial,sans-serif}
.news-dialog-body{max-height:calc(100svh - 56px);padding:34px;overflow-y:auto;overscroll-behavior-y:contain;background:var(--cream);scrollbar-width:thin;scrollbar-color:var(--green) #e2dcce}
.news-dialog-header{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:8px 18px;padding-right:32px;margin-bottom:24px}
.news-dialog-header>p{font:600 var(--type-meta)/1.5 'Barlow Condensed',Arial,sans-serif;letter-spacing:.12em;color:var(--green)}
.news-dialog-header>time{font-size:var(--type-meta);line-height:1.5}
.news-dialog-header>h2{grid-column:1/-1;font-size:var(--type-title);font-weight:500;line-height:1.3;letter-spacing:-.03em}
.news-article-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
.news-article-layout>figure{margin:0}
.news-article-layout img{width:100%;height:auto;max-height:330px;object-fit:contain}
.news-article-copy{min-width:0}
.news-article-copy h3{font-size:var(--type-heading);font-weight:500;line-height:1.5;letter-spacing:-.025em;margin:0 0 14px}
.news-article-copy h3>span{display:block;font-size:var(--type-meta);line-height:1.6;margin-top:3px}
.news-article-copy>p{font-size:var(--type-body);line-height:1.7;margin:0 0 18px}
.news-prices{margin:0 0 22px}
.news-prices>div{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:8px 0;border-bottom:1px solid #4e5b4538}
.news-prices dt{font-size:var(--type-meta);line-height:1.6}
.news-prices dd{margin:0;font-size:var(--type-heading);line-height:1.5;font-variant-numeric:tabular-nums}
.news-all-menu{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;padding:12px 15px;background:var(--green);color:var(--cream);font-size:var(--type-body);line-height:1.5}
.news-all-menu:hover{background:#394b35}
@media(min-width:768px){
 .news-hanger{width:min(calc(var(--pc-u)*640),calc(100vw - var(--pc-u)*140))}
 .menus .menu-list{grid-row:1}
 .menus .menu-summary{grid-row:2}
}
@media(max-width:767px){
 /* The first screen contains the shop and news; short screens may scroll within it. */
 .home{width:100vw;height:var(--content-h);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:#515b4580 #e6e0d4}
 .home-composition{display:block;position:relative;width:100%;height:max(var(--content-h),calc(var(--content-h)*.27 + 88vw*497/854 + var(--news-h,170px) + 44px))}
 .home .store{top:calc(var(--content-h)*.27);width:88vw}
 .news-hanger{left:50vw;top:auto;bottom:14px;translate:-50% 0;width:calc(100vw - 40px);max-height:none}
 .news{display:block;max-height:none;overflow:visible;padding:13px 14px}
 .news h2{font-size:22px;line-height:1.2;margin-bottom:8px}
 .news-items{gap:6px}
 .news .news-items>a,.news .news-items>p{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;margin:0;align-items:baseline;line-height:1.6}
 .news .news-items time{font-size:var(--type-caption);line-height:1.6;font-variant-numeric:tabular-nums}
 .news .news-items .news-date-year{display:none}
 .news .news-items span{font-size:var(--type-meta);line-height:1.6}
 .news .news-link-label{gap:10px}
 .news-link-icon{width:18px;height:18px;font-size:16px}
 .news-rope{width:80px;height:24px;top:-23px}
 .home-cola,.home-pancakes{top:min(calc(var(--content-h)*.59),calc(100% - var(--news-h) - 24vw - 36px))}
 .home-coffee{top:min(calc(var(--content-h)*.66),calc(100% - var(--news-h) - var(--content-h)*.13 - 44px))}
 /* The introduction precedes the five cards; other phone chapters retain their layout. */
 .menus .menu-summary{left:24px;justify-content:safe center}
 .menus .menu-list{left:calc(100vw + var(--menu-gutter))}
 .news-dialog{padding:10px}
 .news-dialog-body{max-height:calc(100svh - 52px);padding:46px 22px 24px}
 .news-close{top:18px;right:18px;width:36px;height:36px;font-size:26px}
 .news-dialog-header{gap:6px 14px;padding-right:0;margin-bottom:18px}
 .news-dialog-header>h2{font-size:28px;line-height:1.35}
 .news-article-layout{grid-template-columns:1fr;gap:18px}
 .news-article-layout img{max-height:190px}
 .news-article-copy h3{font-size:22px;margin-bottom:12px}
 .news-article-copy>p{font-size:16px;line-height:1.7;margin-bottom:14px}
 .news-prices{margin-bottom:18px}
 .news-prices dd{font-size:22px}
 .news-all-menu{font-size:16px}
}
@media(max-width:767px) and (min-height:701px){
 .home .instagram-orbit{top:calc(var(--stage-h)*.52)}
}
