/* Homepage: porcelain, evergreen and the café's own photographs. */
.mh-home {
  --mh-space: clamp(72px, 7.5vw, 110px);
  --mh-porcelain: #fbfaf6;
  --mh-evergreen: #253b31;
  --mh-sage: #6f7f60;
  --mh-line: #dedfd5;
  --mh-muted: #62695e;
  background: var(--mh-porcelain);
  color: var(--mh-evergreen);
}
body.mud-v10 .mh-home h1,
body.mud-v10 .mh-home h2,
body.mud-v10 .mh-home h3 {
  font-family: var(--m-font-display, Georgia, "Times New Roman", serif);
  color: var(--mh-evergreen);
  font-weight: 400;
  letter-spacing: -.035em;
  line-height: 1.13;
  text-wrap: balance;
}
body.mud-v10 .mh-home h2 { font-size: clamp(34px, 3.5vw, 46px); }
.mh-home .mh-image { overflow: hidden; background: #e9e9df; }
.mh-home .mh-image img { display: block; width: 100%; height: 100% !important; object-fit: cover; }
.mh-home .m-eyebrow { margin-bottom: 20px !important; font-size: 10px; font-weight: 600; letter-spacing: .15em; color: var(--mh-sage); }
.mh-home .m-button { min-height: 50px; padding: 14px 20px; gap: 22px; border: 1px solid var(--mh-evergreen); border-radius: 2px; background: var(--mh-evergreen); font-size: 13px; font-weight: 500; }
.mh-home .m-button:hover { background: #3d5443; border-color: #3d5443; }
.mh-home .m-text-link { min-height: 46px; gap: 18px; border-bottom: 1px solid var(--mh-sage); font-size: 13px; font-weight: 500; }
.mh-home .m-text-link:hover { color: #536746; }
.mh-home .mh-section-text { font-size: 15px; line-height: 1.85; color: var(--mh-muted); }
.mh-home .mh-hero {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  align-items: stretch;
  padding-block: 28px 32px;
  gap: clamp(40px, 6vw, 82px);
}
.mh-home .mh-hero-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-block: 42px 24px; min-width: 0; }
body.mud-v10 .mh-home .mh-hero h1 { max-width: 10ch; margin: 0 0 26px; font-size: clamp(48px, 4.7vw, 64px); line-height: 1.07; letter-spacing: -.045em; }
.mh-home .mh-hero .m-lead { max-width: 38ch; margin-bottom: 30px; font-size: 15px; line-height: 1.85; color: var(--mh-muted); }
.mh-home .mh-hero .m-actions { gap: 14px 24px; }
.mh-home .mh-hero-photo { height: clamp(540px, 49vw, 650px); border-radius: 2px; }
.mh-home .mh-hero-photo img { object-position: 50% 17%; }
.mh-home .mh-hero-note { display: flex; gap: 14px; align-items: center; margin: 44px 0 0; font-size: 11px; line-height: 1.6; color: var(--mh-muted); }
.mh-home .mh-hero-note > span { border-right: 1px solid var(--mh-line); padding-right: 14px; font-size: 13px; font-weight: 750; letter-spacing: -.03em; color: var(--mh-sage); }
.mh-home .mh-at-a-glance { display: grid; grid-template-columns: 1.5fr .8fr auto; align-items: center; gap: 30px; padding-block: 25px 27px; border-block: 1px solid var(--mh-line); }
.mh-home .mh-info-label { display: block; margin-bottom: 6px; color: var(--mh-sage); font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; line-height: 1.6; }
.mh-home .mh-address > a { display: inline-flex; align-items: center; min-height: 25px; font-size: 13px; line-height: 1.6; }
.mh-home .mh-address > a:hover { text-decoration: underline; text-underline-offset: 4px; }
.mh-home .mh-at-a-glance .m-today { display: flex; align-items: center; gap: 9px; min-height: 25px; margin: 0; font-size: 13px; line-height: 1.6; }
.mh-home .mh-at-a-glance .m-dot { background: var(--mh-sage); }
.mh-home .mh-at-a-glance [data-open="false"] .m-dot { background: #8c8e85; }
.mh-home .mh-at-a-glance > .m-text-link { justify-self: end; font-size: 12px; }
.mh-home .mh-menu { padding-block: var(--mh-space); }
.mh-home .mh-menu-heading { max-width: 660px; }
.mh-home .mh-menu-heading h2 { max-width: 18ch; }
.mh-home .mh-menu-body { display: grid; grid-template-columns: .88fr 1.12fr; gap: clamp(48px, 8vw, 108px); align-items: center; margin-top: 42px; }
.mh-home .mh-menu-photo .mh-image { height: 440px; border-radius: 2px; }
.mh-home .mh-menu-photo img { object-position: 50% 45%; }
.mh-home figcaption { padding-top: 14px; font-size: 11px; line-height: 1.6; color: var(--mh-muted); }
.mh-home .mh-menu-copy { min-width: 0; }
.mh-home .mh-menu-copy > .mh-section-text { max-width: 44ch; margin: 0 0 26px; }
.mh-home .mh-drinks { padding: 0; margin: 0 0 24px; list-style: none; border-top: 1px solid var(--mh-line); }
.mh-home .mh-drinks li { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; padding-block: 17px; border-bottom: 1px solid var(--mh-line); }
.mh-home .mh-drinks li > div { min-width: 0; }
body.mud-v10 .mh-home .mh-drinks h3 { font-size: 24px; line-height: 1.3; letter-spacing: -.02em; }
.mh-home .mh-drinks li p { margin: 5px 0 0; max-width: 42ch; font-size: 11px; line-height: 1.65; color: var(--mh-muted); }
.mh-home .mh-drink-price { flex-shrink: 0; font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mh-home .mh-story { background: var(--mh-evergreen); }
.mh-home .mh-story-inner { display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: clamp(48px, 8vw, 110px); padding-block: 64px; }
.mh-home .mh-story-copy { padding-block: 20px; max-width: 430px; }
.mh-home .mh-story-copy .m-eyebrow { color: #bdc9b1; }
body.mud-v10 .mh-home .mh-story h2 { color: #fbfaf6; max-width: 12ch; font-size: clamp(38px, 3.8vw, 50px); }
.mh-home .mh-story .mh-section-text { margin: 25px 0 26px; color: #dee3d8; }
.mh-home .mh-story .m-text-link { color: #fbfaf6; border-color: #a2b18e; }
.mh-home .mh-story .m-text-link:hover { color: #d8e2cc; }
.mh-home .mh-story-photo { height: 490px; border-radius: 2px; }
.mh-home .mh-story-photo img { object-position: 50% 45%; }
.mh-home .mh-moments { padding-block: var(--mh-space); }
.mh-home .mh-moments-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 30px; margin-bottom: 36px; }
.mh-home .mh-moments-heading .m-eyebrow { margin-bottom: 0 !important; flex-shrink: 0; }
body.mud-v10 .mh-home .mh-moments h2 { max-width: 20ch; font-size: clamp(30px, 2.9vw, 38px); }
.mh-home .mh-moments-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.mh-home .mh-moments-grid .mh-image { height: 330px; border-radius: 2px; }
.mh-home .mh-moments-grid figure:nth-child(1) img { object-position: 50% 35%; }
.mh-home .mh-moments-grid figure:nth-child(2) img { object-position: 50% 40%; }
.mh-home .mh-moments-grid figure:nth-child(3) img { object-position: 50% 38%; }
/* Existing CMS news and visit sections stay part of the same visual language. */
.mh-home .m-news { gap: clamp(40px, 7vw, 90px); margin-bottom: var(--mh-space); padding: 42px; background: #f0f1e9; border-radius: 2px; }
.mh-home .m-news > div:first-child { max-width: 440px; }
.mh-home .m-news h2 { max-width: 16ch; }
.mh-home .m-news p:not(.m-eyebrow) { font-size: 15px; line-height: 1.8; color: var(--mh-muted); }
.mh-home .m-news-photo { aspect-ratio: 1 / 1; border-radius: 2px; }
.mh-home .m-news-photo img { object-position: 50% 58%; }
.mh-home .m-visit { gap: clamp(48px, 8vw, 110px); margin-bottom: 0; padding-bottom: var(--mh-space); }
.mh-home .m-visit-photo { aspect-ratio: 4 / 5; border-radius: 2px; }
.mh-home .m-visit-photo img { object-position: 50% 44%; }
.mh-home .m-visit address { font-size: 17px; line-height: 1.7; }
body.mud-v10 .mh-home .m-visit h3 { font-family: inherit; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.mh-home .m-visit .m-hours { font-size: 14px; line-height: 1.95; }
.mh-home .m-visit .m-muted { color: var(--mh-muted); }
@media (max-width: 1050px) {
  .mh-home .mh-hero { gap: 34px; }
  .mh-home .mh-hero-photo { height: 570px; }
  body.mud-v10 .mh-home .mh-hero h1 { font-size: 54px; }
  .mh-home .mh-hero .m-actions { gap: 12px 18px; }
  .mh-home .mh-hero-note { margin-top: 32px; }
  .mh-home .mh-at-a-glance { grid-template-columns: 1.35fr 1fr auto; gap: 20px; }
  .mh-home .mh-menu-body, .mh-home .mh-story-inner { gap: 48px; }
  .mh-home .mh-moments-grid { gap: 20px; }
  .mh-home .mh-moments-grid .mh-image { height: 280px; }
  .mh-home .m-news { padding: 32px; }
}
@media (max-width: 760px) {
  .mh-home { --mh-space: 64px; }
  body.mud-v10 .mh-home h2 { font-size: 36px; }
  .mh-home .mh-hero { display: flex; flex-direction: column; gap: 0; padding-block: 18px 0; }
  .mh-home .mh-hero-photo { order: 0; height: 350px; }
  .mh-home .mh-hero-photo img { object-position: 50% 25%; }
  .mh-home .mh-hero-copy { padding-block: 30px 32px; }
  .mh-home .mh-hero .m-eyebrow { margin-bottom: 17px !important; font-size: 9px; }
  body.mud-v10 .mh-home .mh-hero h1 { max-width: 12ch; margin-bottom: 22px; font-size: clamp(42px, 10vw, 56px); line-height: 1.09; }
  .mh-home .mh-hero .m-lead { max-width: 48ch; margin-bottom: 24px; font-size: 14px; line-height: 1.8; }
  .mh-home .mh-hero-note { margin-top: 28px; font-size: 10px; }
  .mh-home .mh-hero .m-actions { gap: 10px 22px; }
  .mh-home .m-button { padding-inline: 17px; gap: 18px; font-size: 12px; }
  .mh-home .m-text-link { font-size: 12px; gap: 13px; }
  .mh-home .mh-at-a-glance { grid-template-columns: 1fr auto; gap: 20px; padding-block: 22px 24px; }
  .mh-home .mh-address { grid-column: 1 / -1; }
  .mh-home .mh-address > a { font-size: 12px; }
  .mh-home .mh-at-a-glance .m-today { font-size: 12px; }
  .mh-home .mh-at-a-glance > .m-text-link { align-self: end; font-size: 11px; }
  .mh-home .mh-info-label { font-size: 9px; }
  .mh-home .mh-menu-body { grid-template-columns: 1fr; gap: 30px; margin-top: 30px; }
  .mh-home .mh-menu-photo .mh-image { height: 310px; }
  .mh-home .mh-menu-photo img { object-position: 50% 43%; }
  .mh-home .mh-menu-copy > .mh-section-text { max-width: 52ch; margin-bottom: 24px; font-size: 14px; }
  .mh-home .mh-drinks li { padding-block: 17px; gap: 20px; }
  body.mud-v10 .mh-home .mh-drinks h3 { font-size: 23px; }
  .mh-home .mh-drinks li p { font-size: 11px; }
  .mh-home .mh-drink-price { font-size: 12px; }
  .mh-home .mh-story-inner { grid-template-columns: 1fr; gap: 32px; padding-block: 42px; }
  .mh-home .mh-story-copy { padding: 0; max-width: 520px; }
  body.mud-v10 .mh-home .mh-story h2 { max-width: 14ch; font-size: 40px; }
  .mh-home .mh-story .mh-section-text { font-size: 14px; margin-block: 22px; }
  .mh-home .mh-story-photo { height: 400px; }
  .mh-home .mh-story-photo img { object-position: 50% 44%; }
  .mh-home .mh-moments-heading { display: block; margin-bottom: 28px; }
  .mh-home .mh-moments-heading .m-eyebrow { margin-bottom: 16px !important; }
  body.mud-v10 .mh-home .mh-moments h2 { font-size: 34px; max-width: 20ch; }
  .mh-home .mh-moments-grid { gap: 16px; }
  .mh-home .mh-moments-grid .mh-image { height: 230px; }
  .mh-home figcaption { font-size: 10px; padding-top: 11px; }
  .mh-home .m-news { grid-template-columns: 1fr; gap: 28px; padding: 28px; }
  .mh-home .m-news > div:first-child { max-width: 540px; }
  .mh-home .m-news h2 { max-width: 20ch; }
  .mh-home .m-news p:not(.m-eyebrow) { font-size: 14px; }
  .mh-home .m-news-photo { aspect-ratio: 4 / 3; }
  .mh-home .m-visit { grid-template-columns: 1fr; gap: 32px; }
  .mh-home .m-visit-photo { aspect-ratio: 4 / 3; }
  .mh-home .m-visit-copy { max-width: 540px; }
  .mh-home .m-visit address { font-size: 17px; }
}
@media (max-width: 600px) {
  .mh-home .mh-hero-photo { height: 310px; }
  .mh-home .mh-hero-photo img { object-position: 50% 28%; }
  .mh-home .mh-moments-grid { grid-template-columns: repeat(2, 1fr); gap: 24px 16px; }
  .mh-home .mh-moments-grid .mh-image { height: 245px; }
  .mh-home .mh-moments-grid figure:last-child { grid-column: 1 / -1; }
  .mh-home .mh-moments-grid figure:last-child .mh-image { height: 285px; }
  .mh-home .mh-moments-grid figure:last-child img { object-position: 50% 42%; }
}
@media (max-width: 390px) {
  .mh-home .mh-hero-photo { height: 280px; }
  .mh-home .mh-hero .m-actions { gap: 10px 16px; }
  .mh-home .mh-hero .m-button { gap: 13px; padding-inline: 14px; }
  .mh-home .mh-hero .m-text-link { gap: 8px; font-size: 11px; }
  .mh-home .mh-story-photo { height: 350px; }
  .mh-home .mh-moments-grid .mh-image { height: 210px; }
  .mh-home .m-news { padding: 24px; }
}

/* Preserve the MUD sign and doorway together on narrow screens. */
@media(max-width:760px){.mh-home .mh-hero-photo{height:auto;aspect-ratio:4/5}.mh-home .mh-hero-photo img{object-position:50% 20%}}