/* Original layout and typefaces, with the approved warm palette. */
:root {
  --color-blue: #39352e;
  --color-pink: #934b34;
  --color-pink-light: #eee6d8;
  --color-navy: #65735c;
  --color-text: #39352e;
  --color-bg: #f7f3eb;
  --color-gray: #eee6d8;
  --color-gray02: #716b61;
  --color-border: #d9d0c1;
}

.site-header,
.header-inner,
.hero::after,
.instagram-bg-white,
.site-footer { background-color: var(--color-bg); }
.hero { background-color: var(--color-bg); background-blend-mode: multiply; }
.about { background-color: var(--color-bg); background-blend-mode: multiply; }
.concept-card,
.menu-card,
.button-white,
.instagram-link { background-color: #fffdf8; }
.concept-card,
.menu-card { box-shadow: 0 2px 12px #65523c17; }
.concept-icon img { mix-blend-mode: multiply; }
.concept-icon { background: #fffdf8; }
.stripe {
  background: repeating-linear-gradient(-45deg, #f2ebdf 0 10px, #eae1d1 10px 20px);
}
.drink-menu { background: #65735c; }
.instagram {
  background-color: #eee6d8;
  background-blend-mode: luminosity;
}
.about-title::after,
.concept-title::after,
.menu-title::after,
.gallery-title::after,
.access-title::after {
  background-color: var(--color-pink);
  background-image: none;
  -webkit-mask: url('../images/line.png') no-repeat center / 100% 100%;
  mask: url('../images/line.png') no-repeat center / 100% 100%;
}
a:focus-visible,
.nav-button:focus-visible { outline: 3px solid var(--color-pink); outline-offset: 5px; }
.global-nav a::before,
.global-nav a::after { content: none; }
[id] { scroll-margin-top: 24px; }

.menu-introduction { text-align: center; margin: 28px 0 18px; font-size: 16px; }
.menu-category { display: flex; justify-content: center; gap: 0; margin: 0 auto; }
.menu-category a {
  padding: 4px 26px;
  color: var(--color-pink);
  font-family: var(--font-sans);
  font-size: 14px;
  border-right: 1px solid var(--color-border);
}
.menu-category a:last-child { border-right: 0; }
.menu-category a:hover { color: var(--color-blue); }

/* Keep the large new menu photos, inside the original Menu section. */
.new-menu-group { margin-top: 70px; }
.menu-group-title {
  margin: 0 0 30px;
  color: var(--color-blue);
  text-align: center;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.4;
}
.feature-meal {
  display: grid;
  grid-template-columns: 1.34fr 1fr;
  background: #eee6d8;
  border-radius: 8px;
  overflow: hidden;
}
.feature-meal > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.feature-copy { padding: 36px 40px; align-self: center; }
.new-menu-label { margin: 0 0 20px; color: var(--color-pink); font-size: 15px; font-family: var(--font-sans); }
.feature-copy h4 { margin: 0; font-size: 32px; font-weight: 700; line-height: 1.6; }
.feature-price { margin: 20px 0; color: var(--color-pink); font-family: var(--font-sans); font-size: 28px; font-weight: 500; }
.feature-copy > p:last-child { margin: 0; font-size: 16px; }
.meals-bottom { display: grid; grid-template-columns: 1.35fr 1fr; gap: 44px; margin-top: 34px; }
.pasta { display: flex; gap: 26px; align-items: center; }
.pasta > img { width: 43%; height: 240px; object-fit: cover; object-position: center 70%; border-radius: 8px; }
.pasta > div { flex: 1; }
.pasta h4,
.other-meals h4,
.sweets-body h4 { margin: 0; color: var(--color-gray02); font-size: 27px; line-height: 1.4; }
.pasta p { font-size: 15px; }
.pasta .new-menu-price { font: 500 25px/1.5 var(--font-sans); color: var(--color-pink); margin: 12px 0 20px; }
.other-meals { align-self: center; }
.other-meals h4 { font-size: 23px; margin-bottom: 12px; }
.other-meals dl { margin: 0; }
.other-meals dl > div { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--color-border); padding: 17px 0; }
.other-meals dt { font-size: 19px; }
.other-meals dd { margin: 0; color: var(--color-pink); font-family: var(--font-sans); font-size: 21px; white-space: nowrap; }
.sweets-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }
.sweets-grid article { overflow: hidden; background: #fffdf8; border-radius: 8px; }
.sweets-grid article > img { width: 100%; aspect-ratio: 1.5; object-fit: cover; }
.sweets-body { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 22px 24px; }
.sweets-prices { text-align: right; }
.sweets-prices p { margin: 0; font-size: 14px; }
.sweets-prices strong { font: 500 25px/1.8 var(--font-sans); color: var(--color-pink); margin-left: 15px; white-space: nowrap; }

@media (min-width: 769px) and (max-width: 1100px) {
  /* Prevent the original drink grid from exceeding tablet widths. */
  .drink-banner { grid-template-columns: 130px minmax(0,1fr) 240px; }
  .drink-image-pc img { width: 100%; min-width: 0; max-width: 100%; }
  .menu-head { flex-wrap: wrap; gap: 5px 12px; }
  .feature-copy { padding: 26px; }
  .feature-copy h4 { font-size: 27px; }
  .meals-bottom { gap: 28px; }
}
@media (min-width: 769px) and (max-width: 970px) {
  .drink-banner { grid-template-columns: 1fr; }
  .drink-image-pc img { width: auto; }
  .global-nav ul { gap: 20px; }
  .global-nav a { font-size: 14px; }
}
@media (max-width: 768px) {
  [id] { scroll-margin-top: 84px; }
  .hero {
    background-image: linear-gradient(90deg, rgba(247,243,235,.9), rgba(247,243,235,.7) 65%, rgba(247,243,235,.15)), url('../images/fv.jpg');
    background-blend-mode: normal, multiply;
  }
  .hero-title { font-size: clamp(27px, 8.6vw, 34px); }
  .global-nav { background: #f7f3eb; }
  .about { background: none; }
  .about::before { background-color: var(--color-bg); background-blend-mode: multiply; }
  .concept-card { min-width: 0; width: min(100%, 320px); }
  .menu-introduction { padding-inline: 8px; font-size: 14px; }
  .menu-category a { padding: 4px 14px; font-size: 13px; }
  .new-menu-group { margin-top: 48px; }
  .menu-group-title { font-size: 28px; margin-bottom: 24px; }
  .feature-meal { display: block; }
  .feature-meal > img { width: 100%; height: auto; aspect-ratio: 1.3; }
  .feature-copy { padding: 26px; }
  .feature-copy h4 { font-size: 28px; }
  .new-menu-label { margin-bottom: 14px; font-size: 14px; }
  .feature-price { font-size: 25px; margin: 14px 0; }
  .feature-copy > p:last-child { font-size: 15px; }
  .meals-bottom { display: block; margin-top: 28px; }
  .pasta { gap: 22px; }
  .pasta > img { height: 230px; width: 44%; }
  .pasta h4 { font-size: 25px; }
  .pasta p { font-size: 14px; }
  .other-meals { margin-top: 28px; }
  .other-meals h4 { font-size: 23px; }
  .other-meals dt { font-size: 18px; }
  .sweets-grid { grid-template-columns: 1fr; gap: 28px; }
  .sweets-body { padding: 20px; gap: 12px; }
  .sweets-body h4 { font-size: 25px; }
  .sweets-prices strong { font-size: 23px; margin-left: 10px; }
  .instagram { background-color: #eee6d8; background-blend-mode: luminosity; }
  .drink-menu { background: #65735c; }
  .site-footer { background: #eee6d8; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}
