#ylos {
  position: relative;
}

/* The Elementor header keeps its logo and cart editable. The first legacy
   column spans the viewport so the logo is truly centred, while the cart
   column remains anchored at the right edge. */
#ylos > .elementor-container {
  position: relative;
}

#ylos > .elementor-container > .elementor-column:first-child {
  position: absolute;
  inset: 0;
  width: 100%;
  z-index: 3;
  pointer-events: none;
}

#ylos > .elementor-container > .elementor-column:first-child .elementor-icon {
  pointer-events: auto;
}

#ylos > .elementor-container > .elementor-column:nth-child(2) {
  margin-left: auto;
  z-index: 2;
}

@media (min-width: 761px) {
  .kkc-wedding-experience #ylos > .elementor-container > .elementor-column:first-child .elementor-icon-wrapper,
  .kkc-special-experience #ylos > .elementor-container > .elementor-column:first-child .elementor-icon-wrapper {
    transform: translateY(-38px);
  }
}

.kkc-header-celebration-menu-widget {
  position: static !important;
  margin: 0 !important;
}

.kkc-header-wedding-link:has(.kkc-celebration-menu) {
  position: static !important;
  margin: 0 !important;
}

.kkc-subpage-header-controls {
  position: static;
}

#ylos > .elementor-container:has(.kkc-celebration-menu),
#ylos > .elementor-container > .elementor-column:has(.kkc-celebration-menu),
#ylos .elementor-widget-wrap:has(.kkc-celebration-menu) {
  position: static !important;
}

#ylos:has(.kkc-celebration-menu) {
  min-height: 285px;
  padding-bottom: 66px !important;
}

.kkc-celebration-menu {
  position: absolute;
  z-index: 20;
  bottom: 18px;
  left: 50%;
  width: min(92vw, 940px);
  transform: translateX(-50%);
}

.kkc-celebration-menu__new-badge {
  position: absolute;
  z-index: 3;
  top: -12px;
  left: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 23px;
  padding: 4px 10px 3px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 999px;
  background: linear-gradient(180deg, #ddffd8, #bcefb5);
  box-shadow:
    0 7px 17px rgba(45, 78, 42, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
  color: #183519;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.11em;
  line-height: 1;
  pointer-events: none;
  transform: translateX(-50%) rotate(-3deg);
  transform-origin: 50% 70%;
  animation: kkc-new-badge-invite 720ms cubic-bezier(0.2, 0.85, 0.25, 1.2) 320ms 2 alternate both;
}

.kkc-wedding-experience .kkc-celebration-menu__new-badge {
  background: linear-gradient(180deg, #8a7064, #5b463d);
  box-shadow:
    0 7px 18px rgba(68, 48, 38, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
  color: #fffaf5;
}

.kkc-special-experience .kkc-celebration-menu__new-badge {
  background: linear-gradient(180deg, #946f74, #65474b);
  box-shadow:
    0 7px 18px rgba(75, 45, 49, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
  color: #fff9f7;
}

.kkc-celebration-menu__track {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 4px;
  overflow-x: auto;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 999px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.68), rgba(255, 255, 255, 0.4)),
    rgba(238, 242, 234, 0.56);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.94) inset,
    0 18px 42px rgba(21, 35, 20, 0.12);
  -webkit-backdrop-filter: blur(15px) saturate(112%);
  backdrop-filter: blur(15px) saturate(112%);
  scrollbar-width: none;
}

.kkc-celebration-menu__track::-webkit-scrollbar {
  display: none;
}

.kkc-celebration-menu__link {
  min-height: 36px;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  padding: 7px 14px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #243426;
  font-size: 12.5px;
  font-weight: 760;
  letter-spacing: -0.01em;
  line-height: 1.1;
  text-decoration: none;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.kkc-celebration-menu__link:hover,
.kkc-celebration-menu__link:focus-visible {
  border-color: rgba(63, 78, 62, 0.16);
  background: rgba(255, 255, 255, 0.72);
  color: #10210f;
  transform: translateY(-1px);
}

.kkc-celebration-menu__link.is-current {
  border-color: rgba(82, 62, 52, 0.52);
  background: linear-gradient(180deg, #765e52, #4e3d35);
  color: #fffaf5;
  box-shadow: 0 7px 18px rgba(68, 48, 38, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

/* Wedding page: retain the site's header composition, shift only its palette. */
.kkc-wedding-experience #ylos {
  background-color: #f3e9e3 !important;
  background-image: linear-gradient(
    180deg,
    #d2f9c9 0%,
    #e3f2dc 27%,
    #eee7de 60%,
    #fbf7f1 100%
  ) !important;
}

/* Future category pages keep the bright brand mint at the top and dissolve it
   into their light content background instead of ending at a hard color seam. */
.kkc-coming-experience #ylos {
  background-color: #f7efe9 !important;
  background-image: linear-gradient(
    180deg,
    #d2f9c9 0%,
    #e4f3dd 34%,
    #f7efe9 100%
  ) !important;
}

.kkc-wedding-experience #ylos > .elementor-container > .elementor-column:nth-child(2) .elementor-icon,
.kkc-wedding-experience #ylos > .elementor-container > .elementor-column:nth-child(2) img {
  filter: sepia(0.42) saturate(0.72) hue-rotate(336deg) brightness(0.86) contrast(1.08);
}

.kkc-wedding-experience .kkc-celebration-menu__track {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.76), rgba(255, 249, 246, 0.46)),
    rgba(238, 222, 214, 0.56);
}

.kkc-special-experience #ylos {
  background-color: #f8eeeb !important;
  background-image: linear-gradient(
    180deg,
    #d2f9c9 0%,
    #e7f2df 24%,
    #efe5e1 58%,
    #fff8f4 100%
  ) !important;
}

.kkc-special-experience .kkc-celebration-menu__track {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.76), rgba(255, 248, 245, 0.46)),
    rgba(236, 218, 215, 0.56);
}

.kkc-special-experience .kkc-celebration-menu__link.is-current {
  border-color: rgba(92, 60, 62, 0.5);
  background: linear-gradient(180deg, #835f62, #5d4145);
  box-shadow: 0 7px 18px rgba(75, 45, 49, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

@keyframes kkc-new-badge-invite {
  from { transform: translateX(-50%) rotate(-3deg) scale(1); }
  to { transform: translateX(-50%) rotate(-1deg) scale(1.08); }
}

/* Elementor-editable placeholder pages for the next categories. */
.kkc-coming-page {
  min-height: min(760px, calc(100vh - 120px));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 100px 24px;
  background:
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.9), transparent 28%),
    linear-gradient(135deg, #f7efe9, #e7efe4 58%, #f3e5e4);
}

.kkc-coming-page > .elementor-container {
  width: min(100%, 760px);
  margin-inline: auto;
}

.kkc-coming-page__card {
  padding: clamp(34px, 6vw, 66px);
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 36px;
  background: rgba(255, 255, 255, 0.66);
  box-shadow: 0 28px 80px rgba(44, 49, 39, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.96);
  text-align: center;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.kkc-coming-page__kicker {
  color: #7a6a61;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.kkc-coming-page__title .elementor-heading-title,
.kkc-coming-page__title {
  margin: 14px 0 18px;
  color: #273426;
  font-family: "KK Ramesha", Georgia, serif;
  font-size: clamp(42px, 7vw, 72px);
  line-height: 0.98;
}

.kkc-coming-page__text {
  color: #596259;
  font-size: 18px;
  line-height: 1.6;
}

.kkc-coming-page__button {
  margin-top: 26px;
}

.kkc-coming-page__button .elementor-button {
  min-height: 54px;
  padding: 14px 22px;
  border-radius: 999px;
  background: #243426;
  color: #fff;
  font-weight: 780;
}

/* 1.1.33 Homepage body copy.
 * These six Elementor widgets previously forced the decorative Roster face.
 * Keep headings untouched and match the configurator's clear system stack. */
.home .elementor-element-913ceb3,
.home .elementor-element-02065c9,
.home .elementor-element-b389da7,
.home .elementor-element-6eb86e5,
.home .elementor-element-34a0903,
.home .elementor-element-295a061,
.home .elementor-element-913ceb3 p,
.home .elementor-element-02065c9 p,
.home .elementor-element-b389da7 p,
.home .elementor-element-6eb86e5 p,
.home .elementor-element-34a0903 p,
.home .elementor-element-295a061 p {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Safe fallback while an older header widget is being upgraded. */
.kkc-header-wedding-link .elementor-button {
  min-height: 42px;
  padding: 10px 17px;
  border-radius: 999px;
  background: #4e3d35;
  color: #fff;
}

@media (max-width: 760px) {
  #ylos > .elementor-container > .elementor-column:first-child .elementor-icon-wrapper {
    transform: translateY(-12px);
  }

  #ylos:has(.kkc-celebration-menu) {
    min-height: 184px;
    padding-bottom: 54px !important;
  }

  .kkc-celebration-menu {
    bottom: 9px;
    width: calc(100vw - 16px);
  }

  .kkc-celebration-menu__track {
    justify-content: flex-start;
    padding: 3px;
    scroll-snap-type: x proximity;
  }

  .kkc-celebration-menu__link {
    min-height: 32px;
    padding: 6px 11px;
    font-size: 10.75px;
    scroll-snap-align: start;
  }

  .kkc-celebration-menu__new-badge {
    top: -10px;
    left: 50%;
    min-height: 20px;
    padding: 4px 8px 3px;
    font-size: 8px;
  }

  .kkc-coming-page {
    min-height: 620px;
    padding: 70px 14px;
  }

  .kkc-coming-page__card {
    padding: 32px 20px;
    border-radius: 28px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kkc-celebration-menu__link {
    transition-duration: 0.01ms;
  }

  .kkc-celebration-menu__new-badge {
    animation: none;
  }
}
