/* Compact destination menus: hover a top-level item, choose a real page. */
@media (min-width: 841px) {
  .main-nav { align-items: center; }
  .nav-item { position: relative; }
  .mega-menu {
    top: calc(100% + 10px);
    left: 50%;
    width: 246px;
    padding: 9px;
    overflow: visible;
    color: var(--forest);
    background: rgba(253, 250, 242, .985);
    border: 1px solid rgba(23, 61, 51, .12);
    border-radius: 15px;
    box-shadow: 0 22px 50px rgba(5, 27, 20, .2);
    transform: translate(-50%, -8px) scale(.98);
    transform-origin: 50% 0;
    transition: opacity .18s ease, transform .24s var(--ease), visibility .18s ease;
  }
  .site-header.is-scrolled .mega-menu {
    top: calc(100% + 10px);
    border-radius: 15px;
  }
  .nav-item:hover .mega-menu,
  .nav-item:focus-within .mega-menu,
  .nav-item.is-open .mega-menu {
    transform: translate(-50%, 0) scale(1);
  }
  .mega-menu::before {
    top: -18px;
    right: 0;
    left: 0;
    height: 18px;
  }
  .mega-menu-inner {
    display: block;
    width: auto;
    margin: 0;
  }
  .mega-menu-title { display: none; }
  .mega-menu-group { display: grid; gap: 2px; }
  .mega-menu-group > span {
    margin: 0 5px 3px;
    padding: 8px 8px 10px;
    border-bottom: 1px solid var(--line);
    font-size: 9px;
  }
  .mega-menu-group a {
    display: grid;
    grid-template-columns: 7px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 12px 11px;
    border: 0;
    border-radius: 10px;
    font-family: var(--sans);
    font-size: 14px;
    font-weight: 650;
    letter-spacing: .015em;
    transition: color .18s ease, background .18s ease, transform .18s ease;
  }
  .mega-menu-group a::before {
    display: block;
    width: 6px;
    height: 6px;
    content: "";
    background: var(--orange);
    border-radius: 50%;
    opacity: 0;
    transform: scale(.4);
    transition: opacity .18s ease, transform .18s ease;
  }
  .mega-menu-group a:hover,
  .mega-menu-group a:focus-visible {
    color: var(--orange);
    background: rgba(214, 93, 48, .075);
    outline: none;
    transform: translateX(2px);
  }
  .mega-menu-group a:hover::before,
  .mega-menu-group a:focus-visible::before {
    opacity: 1;
    transform: scale(1);
  }
  .mega-menu-group a b {
    opacity: .35;
    transform: none;
  }
  .mega-menu-group a:hover b,
  .mega-menu-group a:focus-visible b { opacity: 1; }
}

.detail-page { background: var(--cream); }
.detail-page .site-header { color: var(--paper); }
.detail-page[data-section="brand"] #brand-menu-trigger,
.detail-page[data-section="food"] #food-menu-trigger,
.detail-page[data-section="moments"] #moments-menu-trigger { color: var(--gold); }
.detail-hero {
  position: relative;
  display: grid;
  min-height: 72svh;
  overflow: hidden;
  align-items: end;
  color: var(--paper);
  background: var(--forest-deep);
  isolation: isolate;
}
.detail-hero > img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.detail-hero::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  background: linear-gradient(90deg, rgba(4, 24, 17, .9), rgba(6, 29, 20, .48) 58%, rgba(5, 25, 17, .16));
}
.detail-hero-copy { padding: 180px 0 96px; }
.detail-kicker {
  margin-bottom: 24px;
  color: var(--gold);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .17em;
}
.detail-hero h1 {
  max-width: 880px;
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(52px, 7vw, 104px);
  font-weight: 550;
  line-height: 1.12;
  letter-spacing: -.065em;
}
.detail-hero-lead {
  max-width: 580px;
  margin: 30px 0 0;
  color: rgba(253, 250, 242, .75);
  font-size: 16px;
  line-height: 1.95;
}
.detail-section { padding: 118px 0; scroll-margin-top: 100px; }
.detail-section--ink { color: var(--cream); background: var(--forest-deep); }
.detail-heading {
  display: grid;
  grid-template-columns: .6fr 1.4fr;
  gap: 70px;
  align-items: start;
}
.detail-heading h2 {
  max-width: 780px;
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(40px, 5vw, 76px);
  font-weight: 520;
  line-height: 1.25;
  letter-spacing: -.055em;
}
.detail-heading p:last-child,
.detail-copy {
  max-width: 640px;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 2.05;
}
.detail-section--ink .detail-heading p:last-child,
.detail-section--ink .detail-copy { color: rgba(246, 240, 228, .7); }
.detail-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: 72px;
  background: var(--line);
}
.detail-card {
  min-height: 260px;
  padding: 32px;
  background: var(--paper);
}
.detail-section--ink .detail-cards { background: rgba(246, 240, 228, .12); }
.detail-section--ink .detail-card { background: rgba(255, 255, 255, .035); }
.detail-card span { color: var(--orange); font-family: var(--mono); font-size: 10px; }
.detail-card h3 {
  margin: 70px 0 16px;
  font-family: var(--serif);
  font-size: 28px;
  font-weight: 600;
}
.detail-card p { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.85; }
.detail-section--ink .detail-card p { color: rgba(246, 240, 228, .67); }
.detail-cta {
  display: flex;
  margin-top: 72px;
  padding: 28px 0;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  font-family: var(--serif);
  font-size: clamp(24px, 3vw, 42px);
}
.detail-cta b { color: var(--orange); font-family: var(--sans); font-weight: 400; }
.contact-panel {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 90px;
  align-items: end;
}
.contact-panel .contact-link { margin-top: 28px; }
@media (max-width: 840px) {
  .detail-hero { min-height: 620px; }
  .detail-hero-copy { padding: 135px 0 72px; }
  .detail-hero h1 { font-size: clamp(48px, 13vw, 74px); }
  .detail-section { padding: 88px 0; }
  .detail-heading, .contact-panel { grid-template-columns: 1fr; gap: 32px; }
  .detail-cards { grid-template-columns: 1fr; margin-top: 50px; }
  .detail-card { min-height: 220px; }
  .detail-card h3 { margin-top: 46px; }
}
