/* One visual template for the four event formats: dinner, party, theme, country. */
:is(.dinner-page, .party-page, .theme-page, .country-page) {
  --format-paper: #f6f0eb;
  --format-ink: #251b1b;
  --format-wine: #681024;
  --format-muted: #71615e;
  background: var(--format-paper);
  color: var(--format-ink);
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main {
  background: var(--format-paper);
  color: var(--format-ink);
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.split, .section, .theme-benefits, .theme-formats, .theme-gallery, .party-gallery, .country-gallery) {
  scroll-margin-top: 120px;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main :is(h2, .theme-format-copy h3) {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.02em;
  color: var(--format-wine);
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split {
  width: min(100%, 1360px);
  margin-inline: auto;
  padding: clamp(64px, 7vw, 96px) 5%;
  gap: clamp(32px, 7vw, 96px);
  align-items: center;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > picture {
  display: block;
  width: 100%;
  grid-column: 1;
  grid-row: 1;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > picture .split-photo,
:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-photo {
  display: block;
  width: 100%;
  height: clamp(390px, 42vw, 560px);
  min-height: 0;
  object-fit: cover;
  border-radius: 10px;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-copy {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  padding: 0;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-copy h2 {
  max-width: 17ch;
  margin: 0;
  font-size: clamp(38px, 4.5vw, 62px);
  line-height: .98;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-copy p {
  max-width: 48ch;
  margin-top: 22px;
  color: var(--format-muted);
  font: 400 14px/1.85 'Manrope', Arial, sans-serif;
}

/* The text-only theme introduction follows the same left-aligned editorial grid. */
.theme-page main > .theme-intro > .split-copy {
  grid-column: 1 / -1;
  max-width: 820px;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features {
  width: min(90%, 1240px);
  margin: 0 auto;
  padding: 30px 0 clamp(56px, 7vw, 88px);
  gap: 16px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features > div,
.theme-page .theme-benefits-grid > article {
  min-width: 0;
  min-height: 250px;
  padding: 26px 24px;
  border: 0;
  border-radius: 2px;
  background: linear-gradient(145deg, #681024 0%, #4b1427 100%);
  color: #fff8f1;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features :is(h3, p, .feature-icon),
.theme-page .theme-benefits-grid article :is(h3, p, .theme-benefit-number) {
  color: #fff8f1;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features h3,
.theme-page .theme-benefits-grid h3 {
  margin-top: auto;
  font: 400 27px/1.04 'Cormorant Garamond', Georgia, serif;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features p,
.theme-page .theme-benefits-grid p {
  margin: 12px 0 0;
  font: 400 12px/1.7 'Manrope', Arial, sans-serif;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner) {
  position: relative;
  isolation: isolate;
  width: 100vw;
  min-height: clamp(380px, 48vw, 620px);
  margin-inline: calc(50% - 50vw);
  padding: clamp(48px, 7vw, 96px) 7%;
  overflow: hidden;
  background-color: #35121d;
  color: #fff8f1;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner) > :is(picture, img, video) {
  position: absolute;
  inset: 0;
  z-index: -2;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner) > picture img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner)::after {
  z-index: -1;
  background: linear-gradient(90deg, #3f1028e8 0%, #4b1427c9 34%, #4b14277a 68%, #4b142740 100%) !important;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner) > div {
  position: relative;
  z-index: 1;
  width: min(100%, 760px);
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner) h2 {
  max-width: 17ch;
  color: #fff8f1 !important;
  font: 400 clamp(38px, 5.3vw, 76px)/.98 'Cormorant Garamond', Georgia, serif;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner) p {
  color: #fff8f1 !important;
}

/* All format galleries use the same refined, swipeable photo ribbon. */
:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider {
  gap: clamp(12px, 1.5vw, 20px);
  padding: 0 0 12px;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider > [data-gallery-slide] {
  flex: 0 0 calc((100% - 2 * clamp(12px, 1.5vw, 20px)) / 3) !important;
  width: auto !important;
  overflow: hidden;
  border: 1px solid #68102418;
  border-radius: 10px;
  background: #f8f3ee;
  box-shadow: 0 12px 34px #35151b0d;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.3;
  object-fit: cover;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery] figcaption {
  display: none;
}

/* The theme-specific format cards use the same image-led card language. */
.theme-page .theme-formats-grid.carousel-track > .theme-format-card {
  position: relative;
  display: flex;
  min-height: 390px;
  overflow: hidden;
  border: 1px solid #68102418;
  border-radius: 10px;
  background: #35121d;
  color: #fff8f1;
  align-items: end;
}

.theme-page .theme-formats-grid .theme-format-card > picture {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.theme-page .theme-formats-grid .theme-format-card > picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.theme-page .theme-formats-grid .theme-format-copy {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 88px 22px 22px;
  border: 0;
  background: linear-gradient(0deg, #35101ff2 0%, #4b1427bd 58%, #4b142700 100%);
  color: #fff8f1;
}

.theme-page .theme-formats-grid .theme-format-copy :is(span, h3, p) { color: #fff8f1; }
.theme-page .theme-formats-grid .theme-format-copy h3 { margin: 10px 0; font-size: 30px; }
.theme-page .theme-formats-grid .theme-format-copy p { min-height: 0; margin: 0; font: 400 12px/1.65 'Manrope', Arial, sans-serif; }

:is(.dinner-page, .party-page, .theme-page, .country-page) main .dark-section.photo-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: #35121d;
  background-position: center;
  background-size: cover;
  color: #fff8f1;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main .dark-section.photo-cta::before {
  background: linear-gradient(90deg, #3f1028e8 0%, #4b1427c9 45%, #4b142740 100%);
}

.theme-page main .dark-section.theme-inquiry {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-image: linear-gradient(90deg, #3f1028e8 0%, #4b1427c9 48%, #4b142740 100%), url('/static/assets/theme-event-gatsby.webp');
  background-position: center;
  background-size: cover;
  color: #fff8f1;
}

:is(.dinner-page, .party-page, .theme-page, .country-page) main :is(.dark-section.photo-cta, .dark-section.theme-inquiry) h2,
:is(.dinner-page, .party-page, .theme-page, .country-page) main :is(.dark-section.photo-cta, .dark-section.theme-inquiry) :is(p, .eyebrow) {
  color: #fff8f1;
}

@media (max-width: 1000px) {
  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .split {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 28px;
    padding: 56px 6%;
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > picture {
    order: 2;
    width: 100%;
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > picture .split-photo,
  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-photo {
    height: min(112vw, 440px) !important;
    aspect-ratio: 1 / 1.08;
    border-radius: 8px;
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-copy {
    order: 1;
    width: 100%;
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-copy h2 {
    font-size: clamp(36px, 10vw, 48px);
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .features {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    margin-right: -6vw;
    padding: 22px 6vw 40px 0;
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .features::-webkit-scrollbar { display: none; }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .features > div {
    flex: 0 0 82%;
    min-height: 220px;
    scroll-snap-align: start;
  }

  .theme-page .theme-benefits-grid { display: flex; gap: 14px; overflow-x: auto; margin-right: -6vw; padding: 6px 6vw 18px 0; scrollbar-width: none; }
  .theme-page .theme-benefits-grid::-webkit-scrollbar { display: none; }
  .theme-page .theme-benefits-grid > article { flex: 0 0 82%; min-height: 220px; scroll-snap-align: start; }

  :is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner:not(.dinner-evening-banner) {
    min-height: 390px;
    padding: 52px 6%;
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider > [data-gallery-slide] {
    flex-basis: 78vw !important;
  }

  :is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider img {
    aspect-ratio: 1.08;
  }

  .theme-page .theme-formats-grid.carousel-track > .theme-format-card { flex-basis: 82vw; min-height: 390px; }
  .theme-page .theme-inquiry-layout { position: relative; z-index: 1; padding: 56px 6%; }
  .theme-page .theme-inquiry-form { gap: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  :is(.dinner-page, .party-page, .theme-page, .country-page) main * { scroll-behavior: auto !important; }
}

/* Final layout lock: page-specific legacy rules must not split one template
   into different grids or hide the only useful navigation links. */
body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: center !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > picture,
body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-photo {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-width: 0;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
}

/* Match the dinner page's light editorial benefit cards across all formats. */
body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features > div,
body.theme-page main .theme-benefits-grid > article {
  border: 1px solid #68102420 !important;
  border-radius: 16px !important;
  background: #fbf7f2 !important;
  color: var(--format-ink) !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features :is(h3, p, .feature-icon),
body.theme-page main .theme-benefits-grid article :is(h3, p, .theme-benefit-number) {
  color: inherit !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features h3,
body.theme-page main .theme-benefits-grid h3 {
  color: var(--format-wine) !important;
}

/* Event page navigation: restore the page-specific links hidden by an older
   generic detail-nav rule, and give them the same horizontal header layout. */
@media (min-width: 761px) {
  html.detail-event-nav body:is(.dinner-page, .party-page, .theme-page, .country-page) header nav#navigation {
    display: flex !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0;
    justify-content: center;
    align-items: center;
    gap: clamp(12px, 1.6vw, 24px);
  }

  html.detail-event-nav body:is(.dinner-page, .party-page, .theme-page, .country-page) header nav#navigation a {
    display: inline-flex !important;
    flex: 0 0 auto;
    color: var(--format-wine);
    font-size: 10px;
    white-space: nowrap;
  }
}

/* Reuse the homepage “Всё в наших руках” carousel geometry on every birthday
   format page; only card copy and the selected photos vary by event type. */
body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section > .cms-section-copy {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

main :is(.inner-details-carousel, .dinner-details-carousel) > .cms-section-copy > .cms-section-text {
  width: min(55ch, 88%);
  max-width: none;
  margin: 15px auto 0;
  text-align: center;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-carousel {
  display: flex;
  flex-direction: column;
  margin-top: 45px !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-grid {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 560px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-grid > .care-photo-card {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: flex !important;
  width: 310px !important;
  height: 455px !important;
  min-height: 0 !important;
  margin: 0 0 0 -155px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #4b1427 !important;
  box-shadow: 0 15px 35px #36101b20 !important;
  opacity: var(--card-opacity, 1) !important;
  transform: translateX(var(--card-x, 0px)) translateY(var(--card-y, 0px)) rotate(var(--card-angle, 0deg)) !important;
  transition: transform .7s cubic-bezier(.22,.68,.2,1), opacity .5s !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-photo-card .care-photo {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-photo-card .care-card-copy {
  position: absolute !important;
  inset: auto 0 0 !important;
  padding: 72px 25px 26px !important;
  background: linear-gradient(0deg, #360f23f5, #360f23c9 58%, transparent) !important;
  color: #fff !important;
  text-align: left !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-card-copy .care-number {
  display: block !important;
  margin: 0 0 8px !important;
  color: #efd6bb !important;
  font: 500 11px/1.3 'Manrope', Arial, sans-serif !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-card-copy h3 {
  margin: 8px 0 12px !important;
  color: #fff !important;
  font: 400 29px/1.05 'Cormorant Garamond', Georgia, serif !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-card-copy p {
  margin: 0 !important;
  color: #fff !important;
  font: 400 12px/1.6 'Manrope', Arial, sans-serif !important;
  opacity: 1 !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-controls {
  order: 2;
  justify-content: center !important;
  margin: 8px 0 0 !important;
}

@media (max-width: 760px) {
  body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-carousel {
    margin-top: 28px !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-grid {
    display: flex !important;
    width: auto !important;
    height: auto !important;
    gap: 16px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 10px 6% 25px !important;
    scroll-padding-inline: 6%;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: none;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-grid::-webkit-scrollbar {
    display: none;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-grid > .care-photo-card {
    position: relative !important;
    inset: auto !important;
    flex: 0 0 86% !important;
    width: 86% !important;
    height: 450px !important;
    margin: 0 !important;
    opacity: 1 !important;
    transform: none !important;
    scroll-snap-align: center;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main .care-section .care-controls {
    display: none !important;
  }
}

/* The hero is the same full-screen composition on every birthday format.
   Dinner is the reference: copy shares the same left gutter while the
   page-specific photograph or film remains a full-bleed background. */
body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark {
  position: relative !important;
  display: flex !important;
  width: 100%;
  min-height: 100svh !important;
  height: 100svh !important;
  padding: 0 6% 10vh !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: hidden;
  background: #160d11;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark::after {
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, #160d11c9 0%, #160d1178 48%, #160d1120 100%),
    linear-gradient(0deg, #160d11bd 0%, transparent 62%) !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark > .wrap {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark .hero-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: min(100%, 620px);
  max-width: 620px !important;
  margin: 0 !important;
  text-align: left !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark h1 {
  max-width: 12ch !important;
  margin: 0 !important;
  color: #fff !important;
  font: 400 clamp(54px, 5.1vw, 72px)/.94 'Cormorant Garamond', Georgia, serif !important;
  letter-spacing: -.025em !important;
  text-align: left !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark h2 {
  max-width: 22ch !important;
  margin: 23px 0 0 !important;
  color: #fff !important;
  font: 500 12px/1.6 'Manrope', Arial, sans-serif !important;
  letter-spacing: .12em !important;
  text-align: left !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark p {
  max-width: 43ch !important;
  margin: 22px 0 0 !important;
  color: #fff !important;
  font: 400 14px/1.8 'Manrope', Arial, sans-serif !important;
  text-align: left !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark .button {
  position: relative !important;
  inset: auto !important;
  align-self: flex-start !important;
  float: none !important;
  transform: none !important;
  margin: 25px 0 0 !important;
  border-radius: 28px;
  padding: 14px 21px;
  font-size: 10px;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark > .hero-sound-button {
  right: 26px !important;
  bottom: 24px !important;
  left: auto !important;
  top: auto !important;
  z-index: 3 !important;
  transform: none !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark > .photo {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark > .photo :is(img, video) {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 760px) {
  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark {
    min-height: 100svh !important;
    height: 100svh !important;
    padding: 110px 6% 9vh !important;
    align-items: flex-end !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark .hero-content {
    align-items: flex-start !important;
    width: 100%;
    max-width: 620px !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark h1 {
    max-width: 12ch !important;
    font-size: clamp(45px, 12vw, 72px) !important;
    line-height: .96 !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark h2 {
    margin-top: 17px !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark p {
    max-width: 44ch !important;
    margin-top: 16px !important;
    font-size: 13px !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark .button {
    margin-top: 20px !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark > .hero-sound-button {
    right: 6% !important;
    bottom: 20px !important;
  }
}

/* Keep the floating offer and sound controls inside the centered desktop hero
   wrap. The same gutter formula tracks the wrap at wide viewport sizes. */
@media (min-width: 761px) {
  html:is([data-page="dinner"], [data-page="party"], [data-page="theme"], [data-page="country"]) .offer-trigger {
    left: max(6vw, calc((100vw - 1320px) / 2)) !important;
    bottom: 24px !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .hero.dark > .hero-sound-button {
    right: max(6vw, calc((100vw - 1320px) / 2)) !important;
    bottom: 24px !important;
  }
}

/* Birthday format pages use the same component structure as the homepage.
   Dinner supplies the shared editorial typography, spacing and palette; only
   each format's copy and photographs remain page-specific. */
body:is(.dinner-page, .party-page, .theme-page, .country-page) main {
  --format-paper: #f6f0eb;
  --format-card: #fbf7f2;
  --format-ink: #251b1b;
  --format-wine: #681024;
  --format-muted: #71615e;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split:not(.theme-intro) {
  width: min(100%, 1360px);
  margin-inline: auto;
  padding: clamp(64px, 7vw, 96px) 5%;
  gap: clamp(32px, 7vw, 96px);
  align-items: center;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.features, .theme-benefits) {
  width: min(90%, 1240px);
  margin-inline: auto;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .theme-benefits .theme-benefits-grid > article,
body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .features > div {
  min-height: 250px;
  padding: 26px 24px;
  border: 1px solid #68102420 !important;
  border-radius: 16px !important;
  background: var(--format-card) !important;
  color: var(--format-ink) !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.features, .theme-benefits) :is(h3, p, .feature-icon, .theme-benefit-number) {
  color: inherit !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.features, .theme-benefits) h3 {
  color: var(--format-wine) !important;
  font: 400 27px/1.04 'Cormorant Garamond', Georgia, serif;
}

/* Quote banners share the full-bleed treatment, title width and wine gradient
   used by the dinner page, including theme's custom inquiry layout. */
body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner,
body.theme-page main > .theme-inquiry {
  position: relative;
  isolation: isolate;
  width: 100vw;
  min-height: clamp(420px, 52vw, 720px);
  margin-inline: calc(50% - 50vw);
  padding: clamp(48px, 7vw, 96px) 7%;
  overflow: hidden;
  background-color: #35121d;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner::after,
body.theme-page main > .theme-inquiry::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, #3f1028e8 0%, #4b1427c9 34%, #4b14277a 68%, #4b142740 100%) !important;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner h2,
body.theme-page main > .theme-inquiry h2 {
  width: min(100%, 760px);
  max-width: 17ch;
  margin: 0 !important;
  color: #fff8f1 !important;
  font: 400 clamp(38px, 5.3vw, 76px)/.98 'Cormorant Garamond', Georgia, serif;
  letter-spacing: -.02em;
}

/* Make every format gallery follow the dinner gallery rhythm: same heading,
   horizontal photo rail, card proportions and mobile swipe behavior. */
body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.dinner-gallery, .premium-gallery-section) {
  padding: clamp(72px, 9vw, 120px) 0 clamp(92px, 11vw, 150px);
  background: var(--format-paper);
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.dinner-gallery, .premium-gallery-section) > .wrap {
  width: min(90%, 1240px);
  margin-inline: auto;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.dinner-gallery, .premium-gallery-section) :is(h2, .section-heading h2) {
  max-width: 17ch;
  margin: 12px 0 30px;
  color: var(--format-wine);
  font: 400 clamp(40px, 4.7vw, 64px)/1.02 'Cormorant Garamond', Georgia, serif;
  letter-spacing: -.02em;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) .dinner-gallery-strip,
body:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider {
  display: flex;
  gap: clamp(12px, 1.5vw, 20px);
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) :is(.dinner-gallery-strip, .premium-gallery-section [data-premium-gallery].premium-gallery-slider)::-webkit-scrollbar {
  display: none;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) .dinner-gallery-strip > figure,
body:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider > [data-gallery-slide] {
  flex: 0 0 calc((100% - 2 * clamp(12px, 1.5vw, 20px)) / 3) !important;
  width: auto !important;
  min-width: 0;
  aspect-ratio: 1.3;
  overflow: hidden;
  scroll-snap-align: start;
  border: 1px solid #68102418;
  border-radius: 10px;
  background: var(--format-card);
  box-shadow: 0 12px 34px #35151b0d;
}

body:is(.dinner-page, .party-page, .theme-page, .country-page) :is(.dinner-gallery-strip, .premium-gallery-section [data-premium-gallery].premium-gallery-slider) img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 760px) {
  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.dinner-gallery, .premium-gallery-section) {
    padding: 58px 0 90px;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > :is(.dinner-gallery, .premium-gallery-section) :is(h2, .section-heading h2) {
    font-size: clamp(38px, 10vw, 52px);
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) .dinner-gallery-strip,
  body:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider {
    margin-right: -6vw;
    padding: 0 6vw 12px 0;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) .dinner-gallery-strip > figure,
  body:is(.dinner-page, .party-page, .theme-page, .country-page) .premium-gallery-section [data-premium-gallery].premium-gallery-slider > [data-gallery-slide] {
    flex-basis: 78vw !important;
    aspect-ratio: 1.05;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .banner,
  body.theme-page main > .theme-inquiry {
    min-height: 390px;
    padding: 52px 6%;
  }
}

/* Keep the theme gallery's legacy three-image set on the same calm rail as
   the other format galleries. Every image is a real slide with equal bounds. */
body.theme-page .theme-gallery-grid[data-premium-gallery].premium-gallery-slider > figure {
  flex: 0 0 calc((100% - 2 * clamp(12px, 1.5vw, 20px)) / 3) !important;
  width: auto !important;
  height: auto !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  aspect-ratio: 1.3;
  overflow: hidden;
}

body.theme-page .theme-gallery-grid[data-premium-gallery].premium-gallery-slider figure picture,
body.theme-page .theme-gallery-grid[data-premium-gallery].premium-gallery-slider figure img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  aspect-ratio: auto !important;
  object-fit: cover;
}

body.theme-page .theme-gallery .premium-gallery-controls.is-static {
  display: none !important;
}

@media (max-width: 760px) {
  body.theme-page .theme-gallery-grid[data-premium-gallery].premium-gallery-slider > figure {
    flex-basis: 78vw !important;
    aspect-ratio: 1.05;
  }
}

@media (max-width: 760px) {
  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > picture,
  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-photo {
    order: 0 !important;
    width: 100%;
  }

  body:is(.dinner-page, .party-page, .theme-page, .country-page) main > .split > .split-copy {
    order: 0 !important;
    width: 100%;
  }
}