:where([data-etch-element="container"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  max-inline-size: var(--content-width, 1366px);
  align-self: center; margin-inline: auto;
}
:where([data-etch-element="flex-div"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
}
:where([data-etch-element="iframe"]) {
  inline-size: 100%;
  height: auto;
 aspect-ratio: 16/9;
}
:where([data-etch-element="section"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hero {
  justify-content: center;
  min-block-size: 30em;
}
.hero__inner {
  text-align: center;
  align-items: center;
  color: var(--text-light-muted);
  z-index: 1;
}
.hero__heading {
  font-size: var(--text-l);
  color: var(--white);
}
.hero__text {
  font-weight: 700;
  line-height: var(--h1);
  font-size: var(--h1);
  order: -1;
}
.background-image {
  --overlay-color: var(--secondary-ultra-dark);
  --overlay-opacity: 75%;
  :has(> &) {
    position: relative;
    isolation: isolate;
  }
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: -1;
  &::after {
    content: '';
    background: var(--overlay-color);
    opacity: var(--overlay-opacity);
    position: absolute;
    inset: 0;
  }
  .invitation & {
    --overlay-color: var(--accent);
    --overlay-opacity: 40%;
  }
}
.background-image__img {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: 50% 25%;
  .invitation & {
    object-position: center;
  }
}
#dwc-header {
  padding-block: 0;
  z-index: 9999;

  body:has([dark-body-bg='true']&) main.etch-builder-block {
    background-color: #15151e;
  }

  /* liquid glass  */
  [data-liquid-glass='true']& .dwc-nest-header:not(.etch-builder-block) {
    --overlay-header-shadow: var(--liquid-shadow);
    border: var(--liquid-glass-border);

    html:not(.dwc-mobile) & {
      backdrop-filter: url(#dwc-liquid-glass) saturate(var(--liquid-glass-saturate));

      /* Safari Specific Fallback Override */
      -webkit-backdrop-filter: blur(var(--header-blur)) saturate(var(--liquid-glass-saturate));

      /* Firefox Specific Fallback Override */
      @supports (-moz-appearance: none) {
        backdrop-filter: blur(var(--header-blur)) saturate(var(--liquid-glass-saturate));
      }
    }

    .dwc-mobile &::before {
      display: block !important;
      content: '';
      position: absolute;
      inset: 0;
      inset-block-start: calc(var(--wp-admin--admin-bar--height, 0px) + 0px);
      z-index: -1;
      backdrop-filter: url(#dwc-liquid-glass) saturate(var(--liquid-glass-saturate));
      border-radius: var(--overlay-header-radius);

      /* Safari Specific Fallback Override */
      -webkit-backdrop-filter: blur(var(--header-blur)) saturate(var(--liquid-glass-saturate));

      /* Firefox Specific Fallback Override */
      @supports (-moz-appearance: none) {
        backdrop-filter: blur(var(--header-blur)) saturate(var(--liquid-glass-saturate));
      }
    }
  }
}
.dwc-skip-link {
  position: fixed;
  top: 0;
  inset-inline-start: 1rem;
  z-index: 100000;
  transform: translateY(-150%);

  /* Appearance when revealed */
  padding: var(--skip-link-padding);
  background: var(--skip-link-bg);
  color: var(--skip-link-color);
  font-size: var(--skip-link-font-size);
  font-weight: var(--skip-link-weight);
  line-height: 1.2;
  text-decoration: none;
  border-radius: 0 0 0.5rem 0.5rem;
  box-shadow: var(--skip-link-shadow);

  transition: transform 0.2s ease;
  
  &:hover{
    background: var(--skip-link-hover-bg);
  color: var(--skip-link-hover-color);
  }

  /* Reveal on focus */
  &:focus,
  &:focus-visible {
    transform: translateY(calc(0px + var(--wp-admin--admin-bar--height, 0px)));
    outline: var(--skip-link-outline);
    outline-offset: 2px;
  }

  .dwc-skip-links:has(&) {
    display: contents;
  }

  /* Respect reduced-motion preferences */
  @media (prefers-reduced-motion: reduce) {
    & {
      transition: none;
    }
  }
}
.dwc-header-vars {
  --fallback-section-padding: 83px;
  --dropdown-content-width: 75rem;
  --dropdown-content-default-width: 1200px;
  --header-inline-padding: var(--gutter);
  --header-block-padding: var(--space-m);
  --header-min-height: 0px;
  --header-bottom-border: 1px solid color-mix(in oklch, black 7%, transparent) !important;

  /* when liquid glass is enabled */
  --liquid-glass-shadow: inset 0 0 2px 1px color-mix(in oklch, white 8%, transparent), inset 0 0 10px 4px color-mix(in oklch, white 10%, transparent), 0 6px 24px color-mix(in oklch, #11111a 6%, transparent), 0 12px 40px color-mix(in oklch, #11111a 5%, transparent);

  /*# ===== SKIP LINKS ===== */
  --skip-link-bg: #111;
  --skip-link-hover-bg: #111;
  --skip-link-font-size: 1rem;
  --skip-link-color: var(--white, #fff);
  --skip-link-hover-color: var(--white, #fff);
  --skip-link-padding: 0.75rem 1.25rem;
  --skip-link-outline: 3px solid var(--primary, #4da3ff);
  --skip-link-radius: 0 0 0.5rem 0.5rem;
  --skip-link-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  --skip-link-weight: 600;

  /*# ===== ADAPTIVE HEIGHT/STRIPE ====== */
  --adaptive-height-bg: var(--dropdown-content-bg); /*also controls stripe background*/
  --adaptive-height-border: var(--dropdown-content-border-size) solid var(--dropdown-content-border-color);
  --adaptive-height-shadow: 0 0 30px rgb(39 50 59 / 10%);

  /*# ===== STRIPE only ===== */
  --stripe-border-radius: 1rem;

  /*# ===== STICKY/OVERLAY HEADER SPECIAL STYLES ===== */
  /*===== this styles only apply when Special Sticky/Overlay Styles and sticky header is enabled =====*/

  /*# NOTE: */
  /* to change the values that are set on the component options, use !important e.g.   
   --overlay-header-bg:black !important;
  */

  /*## SVG STYLES BEFORE SCROLLING  */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:not(.scroll-up, .scroll-down) & :is(path, .cls-1):not(.dwce-dropdown path) {
    /* fill: white; */
  }

  /*## SVG STYLES BEFORE SCROLLING - HOVER */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:not(.scroll-up, .scroll-down) &:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) :is(path, .cls-1):not(.dwce-dropdown path) {
    /* fill: hsl(from #fff h s l / 0.3); */
  }

  /*## SVG STYLES AFTER SCROLLING  */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) & :is(path, .cls-1):not(.dwce-dropdown path) {
    /* fill: url(#GradientFill_1); */
  }

  /*## SVG STYLES AFTER SCROLLING - HOVER */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) &:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) :is(path, .cls-1):not(.dwce-dropdown path) {
    /* fill: hsl(from #000 h s l / 0.3); */
  }

  /*## STYLES BEFORE SCROLLING */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom &:not(:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover)) {
    /* add any of the variables above and update value*/
  }

  /*## STYLES BEFORE SCROLLING - HOVER */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:not(.scroll-up, .scroll-down) &:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) {
    /* add any of the variables above and update value*/
  }

  /*## STYLES AFTER SCROLLING */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) &:not(:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover)) {
    /* add any of the variables above and update value*/
  }

  /*## STYLES AFTER SCROLLING - HOVER*/
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) &:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) {
    /* add any of the variables above and update value*/
  }

  /*## MOBILE STYLES WHEN MENU IS OPEN*/
  .dwc-mobile:has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom &:has(.dwce-toggle.is-active) {
    /* add any of the variables above and update value*/
    /* --overlay-header-bg: white !important; */
  }

  /*# ===== END STICKY/OVERLAY HEADER SPECIAL STYLES ===== */

  /*# ===== MOBILE ONLY STYLES ===== */
  /* add and modify varibales for mobile breakpoint OR use media query if you experience FOUC*/

  html:is(.dwc-mobile:not(:has([data-offcanvas='true'])), .dwc-offcanvas-mobile) & {
    /* --header-inline-padding: var(--gutter); */
  }
}
.dwc-nest-header {
  &:not(.dwc-mobile [data-overlay-header-mobile='true']:has([data-slide-in-direction='top']) &) {
    padding-inline: var(--header-inline-padding);
    padding-block: var(--header-block-padding);
  }

  background-color: var(--header-bg);
  transition:
    opacity 0.1s,
    transform 0.4s,
    background-color 0.4s;

  :is(.scroll-down, .scroll-up) [data-sticky-header='true'] & {
    background-color: var(--header-bg-sticky);
    --overlay-header-bg: var(--header-bg-sticky);
  }
}
.dwc-nest-header__container {
  justify-content: space-between;
  flex-direction: row;
  min-height: var(--header-min-height);
  margin-inline: auto;
  align-items: center;

  /*when overlay header is active on mobile, and menu slides in from top, use the header padding  */
  .dwc-mobile [data-overlay-header-mobile='true']:has([data-slide-in-direction='top']) & {
    padding-inline: var(--header-inline-padding);
    padding-block: var(--header-block-padding);
  }
}
.dwc-nest-menu__logo {
  --centered-logo-inline-padding: 2rem;
  padding-block: 0rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  z-index: 9999;

  /* logo size */

  & > :is(svg, img) {
    width: auto;
    height: 50px;
  }

  /* when in centered logo */
  .dwc-header-logo-item &,
  .dwc-nav-nested-items:has(li &) & {
    padding-inline: var(--centered-logo-inline-padding);
  }
}
#dwce-nav-nested {
  @media (width <= 64rem) {
    inline-size: auto;
  }
}
.dwc-nav-wrapper {
  inline-size: 100%;
  max-inline-size: 100%
}
.dwc-nest-menu-top {
  padding-inline: var(--menu-item-inline-padding);
  padding-block: var(--menu-item-block-padding);
  &:not(.dwc-mobile &){
    display:none;
  }
}
.dwc-nest-menu__mobile-logo {
  transition: opacity 0.45s 0.15s var(--mobile-menu-ttf);
  block-size: var(--dwc-nest-header-height);
  max-block-size: var(--mobile-logo-size);
}
.dwce-toggle {
  --toggle-align: 0;

  &[data-flip-toggle='true'] {
    --toggle-align: auto;
    --toggle-horizontal-offset: auto;

    & .dwce-toggle__label-wrap {
      order: -1;
    }
  }

  &[data-toggle-style='techno'] {
    --toggle-line-height: 2px;
    --toggle-line-variance: 1px;
    --iw: var(--toggle-size);
    --aw: var(--toggle-size);

    &:not(.is-active) .dwca-inner {
      inline-size: 75%;
    }
  }

  &[data-equalize='true']:not([data-toggle-style='techno'], .is-active) {
    --toggle-line-variance: 1px;
    --iw: var(--toggle-size);
    --aw: var(--toggle-size);
  }
}
.dwc-nest-toggle--close {
  margin-inline-start: auto !important;
}
.dwc-nav-vars {
  /*# ===== BACK TEXT ===== */
  --back-text-clr: var(--black, #000);
  --back-text-font-size: 1rem;
  --back-text-font-weight: 500;
  --back-text-transform: uppercase;
  --back-text-bg: var(--mobile-menu-bg);
  --back-text-icon-size: 20px;

  /*# ===== MENU ITEMS GAP ===== */
  --menu-items-gap: 0rem;

  /*# ===== MOBILE ONLY STYLES ===== */
  /* Add & update varibale values for mobile breakpoint */
  html:is(.dwc-mobile:not(:has([data-offcanvas='true'])), .dwc-offcanvas-mobile) & {
    --mobile-menu-radius: var(--overlay-header-radius);
  }

  /*# =====  #MOBILE/OFFCANVAS extras ===== */

  /*## Transitions */
  --mobile-menu-ttf: cubic-bezier(0.3, 0.68, 0.1, 1);

  /*# BREAKIN CONTAINER  (see docs) */
  & .breakin-container {
    padding-inline: var(--menu-item-inline-padding);
    padding-block: var(--menu-item-block-padding);
    background: var(--white, #fff);
    z-index: 99999;
    display: flex;
    flex-direction: column;
    &:has(.dwc-is-cta-2):not(:has(.dwc-is-cta-3)) {
      flex-direction: row;
      gap: 1rem;
    }
  }
}
.dwc-megamenu-instruction {
  padding: 3rem;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.etch-h576kui {
  font-size: var(--text-m);
}
.dwc-dropdown-items-vars {
  /*## DROPDOWN CONTENT */
  --dropdown-content-bg: var(--white, #fff);
  --dropdown-content-block-padding: var(--dropdown-content-inline-padding);
  --dropdown-content-inline-padding: min(calc(var(--dropdown-item-radius) / 3), 0.5em);

  /*## DEFAULT STATE */
  --dropdown-item-clr: var(--black, #000);
  --dropdown-item-font-size: var(--menu-item-font-size);
  --dropdown-item-bg: initial;
  --dropdown-indent-bg: rgb(40 60 150 / 5%);
  --dropdown-heading-clr: var(--primary-clr);

  /*## HOVER STATE */
  --dropdown-item-hover-clr: var(--menu-item-hover-clr);
  --dropdown-item-hover-bg: hsl(from var(--primary-clr) h s l / 5%);

  /*## EXPANDED STATE (PARENT) - mobile */
  /* when [data-submenu-reveal="expand"] */
  --dropdown-expanded-clr: var(--white, #fff);
  --dropdown-expanded-bg: var(--black, #000);

  /*## PADDING | GAP | INDENT */
  --dropdown-item-inline-padding: var(--menu-item-inline-padding);
  --dropdown-item-block-padding: var(--menu-item-block-padding);
  --dropdown-indent: 0.6rem;
  --dropdown-indent-item-pad-offset: 0.5;
  --dropdown-indent-line: solid 1px rgb(40 60 150 / 20%);

  /*## RADIUS */
  --dropdown-item-radius: var(--dropdown-content-border-radius);
  /*  --dropdown-content-border-radius is set in the DWC Nav component props > DROPDOWN > Dropdown Content Radius
  When stripe style is enabled, the dropdown content radius inherits the stripe radius, found in DWC Header variables
  */

  /*# ===== APPEARANCE: BUTTON ===== */

  &[appearance='button'] > .dwc-submenu-toggle {
    --menu-item-bg: var(--black, #000);
    --menu-item-clr: var(--white, #fff);
    --menu-item-hover-clr: var(--white, #fff);
    --menu-item-hover-bg: var(--black, #000);
    --menu-item-radius: 50vw;
    --menu-item-hover-border-height: 0;
    --icon-size: 0;
    --icon-clr: var(--white, #fff);
    --icon-hover-clr: var(--white, #fff);
    --menu-item-inline-padding: 1.5rem;
    --menu-item-block-padding: 1rem;
    --chevron-clr: var(--icon-clr);
    --chevron-hover-clr: var(--icon-hover-clr);
    --chevron-size: var(--icon-size);

    /*## mobile only*/
    --menu-item-width: 200px;
    --menu-item-border: solid 1px transparent;
    --menu-item-hover-border: solid 1px transparent;
  }

  /*# ===== APPEARANCE: ICON ===== */

  &[appearance='icon'] {
    --icon-button-inline-padding: var(--menu-item-inline-padding);
  }

  &[appearance='icon'] > .dwc-submenu-toggle {
    --menu-item-bg: var(--black, #000);
    --menu-item-clr: var(--white, #fff);
    --menu-item-hover-clr: var(--white, #fff);
    --menu-item-hover-bg: var(--black, #000);
    --icon-clr: var(--white, #fff);
    --icon-hover-clr: var(--white, #fff);
    --icon-size: 0.875rem;
    --menu-item-inline-padding: 1.1rem;
    --button-max-diameter: 2.8125rem;
    --menu-item-radius: 50vw;
    --menu-item-border: solid 1px transparent;
    --menu-item-hover-border: solid 1px transparent;
    --chevron-clr: var(--icon-clr);
    --chevron-hover-clr: var(--icon-hover-clr);
    --chevron-size: var(--icon-size);
  }

  /*# ===== STICKY/OVERLAY HEADER SPECIAL STYLES ===== */
  /*===== this styles only apply when the header div attribute [data-sticky-overlay-special-style] attribute is set to true, and sticky header is enabled =====*/

  /*## STYLES BEFORE SCROLLING - HOVER */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:not(.scroll-up, .scroll-down) .dwce-nav-nested:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) .dwc-nav-nested-items & {
    /* add any of the variables above and update value*/
  }

  /*## STYLES AFTER SCROLLING - HOVER*/
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) .dwce-nav-nested:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) .dwc-nav-nested-items & {
    /* add any of the variables above and update value*/
  }

  /*# ===== MOBILE ONLY STYLES ===== */
  /* add and modify varibales for mobile breakpoint */

  html:is(.dwc-mobile:not(:has([data-offcanvas='true'])), .dwc-offcanvas-mobile) & {
    --dropdown-item-font-size: var(--menu-item-font-size);
  }
}
.dwc-top-level-items-vars {
  /*## DEFAULT STATE */
  --menu-item-clr: var(--black, #000);
  --menu-item-font-size: var(--text-m);
  --menu-item-font-weight: 500;
  --menu-item-bg: initial;

  /*## HOVER STATE */
  --menu-item-hover-clr: var(--primary-clr);
  --menu-item-hover-bg: hsl(from var(--primary-clr, crimson) h s l / 0.05);
  --menu-item-hover-border-bg: var(--menu-item-active-border-bg);
  --menu-item-hover-border-height: var(--menu-item-active-border-height);

  /*## ACTIVE STATE - Current Page Link*/
  /*(to exclude a link from this style, 
  add the attribute 'dwc-exclude' to its container)*/
  --menu-item-active-clr: var(--menu-item-clr);
  --menu-item-active-bg: initial;
  --menu-item-active-border-bg: var(--primary-clr);
  --menu-item-active-border-height: 0px;

  /*## PADDING | GAP */
  --menu-item-inline-padding: clamp(0.75rem, 0.61rem + 0.56vw, 1.1rem);
  --menu-item-block-padding: 1rem;
  /*when menu item hover effect is set to 'Text Roll'*/
  --roll-padding: 1rem;

  /*## BORDERS | RADIUS */
  --menu-item-border: initial;
  --menu-item-radius: 50vw;

  /*## CHEVRON (dropdown arrow) */
  --chevron-size: 1.2em;
  --chevron-clr: var(--menu-item-clr);
  --chevron-hover-clr: var(--menu-item-hover-clr);
  --chevron-gap: 0.625rem;

  /*# ===== CTA BUTTONS (ALL) ===== */

  /*## non last button breakout items   */
  --breakout-border: solid 1px color-mix(in oklch, var(--primary-clr) 50%, transparent);
  --breakout-block-padding: 0.25em;
  --breakout-inline-padding: 0.5em;

  /*## all cta buttons padding */
  --cta-inline-padding: calc(var(--menu-item-inline-padding) * 1.3);
  --cta-block-padding: var(--menu-item-block-padding);

  /*## all cta buttons max width on mobile */
  --cta-width: 100%;

  /*## gap offset between 2 or 3 cta buttons on mobile/offcanvas/sidebar*/
  --cta-gap-offset: 0;

  /*## gap between breakout cta and menu toggle on mobile */
  --cta-breakout-gap: 1.25rem;

  /*# ===== CTA 1 (LAST) ===== */

  /*## DEFAULT STATE */
  --menu-cta-clr: var(--neutral-ultra-dark);
  --menu-cta-bg: var(--primary);
  --menu-cta-inline-padding: var(--btn-padding-inline);
  --menu-cta-block-padding: var(--btn-padding-block);
  --menu-cta-border: var(--btn-border-width) var(--btn-border-style) transparent;
  --menu-cta-radius: var(--btn-radius);

  /*## HOVER STATE */
  --menu-cta-hover-clr: var(--neutral-hover);
  --menu-cta-hover-bg: var(--primary-semi-light);

  /*# ===== CTA 2 (SECOND) ===== */

  /*## DEFAULT STATE */
  --menu-cta-2-clr: var(--white, #fff);
  --menu-cta-2-bg: var(--black, #000);
  --menu-cta-2-inline-padding: var(--cta-inline-padding);
  --menu-cta-2-block-padding: var(--cta-block-padding);
  --menu-cta-2-border: var(--menu-cta-border);
  --menu-cta-2-radius: var(--menu-cta-radius);

  /*## HOVER STATE */
  --menu-cta-2-hover-clr: var(--white, #fff);
  --menu-cta-2-hover-bg: var(--primary-clr);

  /*# ===== CTA 3 (THIRD) ===== */

  /*## DEFAULT STATE */
  --menu-cta-3-clr: var(--white, #fff);
  --menu-cta-3-bg: var(--black, #000);
  --menu-cta-3-inline-padding: var(--cta-inline-padding);
  --menu-cta-3-block-padding: var(--cta-block-padding);
  --menu-cta-3-border: var(--menu-cta-border);
  --menu-cta-3-radius: var(--menu-cta-radius);

  /*## HOVER STATE */
  --menu-cta-3-hover-clr: var(--white, #fff);
  --menu-cta-3-hover-bg: var(--primary-clr);

  /*# ===== STICKY/OVERLAY HEADER SPECIAL STYLES ===== */
  /*===== this styles only apply when the header div attribute [data-sticky-overlay-special-style] attribute is set to true, and sticky header is enabled =====*/

  /*## STYLES BEFORE SCROLLING */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:not(.scroll-up, .scroll-down) .dwc-nav-nested-items > & {
    /* add any of the variables above and update value*/
  }

  /*## STYLES BEFORE SCROLLING - HOVER */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:not(.scroll-up, .scroll-down) .dwce-nav-nested:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) .dwc-nav-nested-items > & {
    /* add any of the variables above and update value*/
  }

  /*## STYLES AFTER SCROLLING */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) .dwce-nav-nested:not(:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover)) .dwc-nav-nested-items > & {
    /* add any of the variables above and update value*/
  }

  /*## STYLES AFTER SCROLLING - HOVER*/
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) .dwce-nav-nested:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) .dwc-nav-nested-items > & {
    /* add any of the variables above and update value*/
  }

  /*## BADGE STYLES AFTER SCROLLING */
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) .dwce-nav-nested:not(:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover)) .dwc-nav-nested-items > & .dwc-menu-item-badge {
    /* --badge-color: #fff !important;
    --badge-bg-color: var(--primary-clr) !important; */
  }

  /*## BADGE STYLES AFTER SCROLLING - HOVER*/
  html:not(.dwc-mobile):has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) .dwce-nav-nested:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover) .dwc-nav-nested-items > & .dwc-menu-item-badge {
    /* 
    --badge-color: #fff !important;
    --badge-bg-color: gray !important;  
    */
  }

  /*# ===== MOBILE ONLY STYLES ===== */
  /* add and modify varibales for mobile breakpoint */

  html:is(.dwc-mobile:not(:has([data-offcanvas='true'])), .dwc-offcanvas-mobile) & {
    --menu-item-font-size: 1.125rem;
    --menu-item-border: 1px solid rgba(0, 0, 0, 0.1);
  }
}
.dwc-tabbed-nav-vars {
  /*## TAB LIST */
  --tab-list-width: 15.625rem;
  --tab-list-wrapper-bg: rgb(0 0 0 / 4%);
  --tab-list-inline-padding: 0px;
  --tab-list-block-padding: 1.75rem;

  /*## TABS */
  --tab-list-item-clr: var(--black, #000);
  --tab-list-item-font-size: 0.875rem;
  --tab-list-item-font-weight: 500;
  --tab-list-item-inline-padding: var(--menu-item-inline-padding, 0.75rem);
  --tab-list-item-block-padding: 0.75rem;
  --tab-list-item-radius: 0px;

  /*## OPEN OR HOVERED TAB */
  --tab-list-item-active-clr: var(--black, #000);
  --tab-list-item-active-bg: var(--white, #fff);

  /*## ARROW */
  --tab-arrow-clr: gray;
  --tab-arrow-size: 1rem;

  /*## LABEL ICON (DWC Tab › LABEL ICON) */
  --tab-icon-size: 1.5rem;
  --tab-icon-gap: 0.75rem;
  --tab-icon-clr: currentColor;

  /*## CONTENT */
  --tab-content-bg: var(--tab-list-item-active-bg);
  --tab-content-height: 28.125rem;
  --tab-content-padding: 1.75rem;
  --tab-content-width: 100%;

  /*## DIVIDER (Divider prop) */
  --tab-divider-clr: rgb(0 0 0 / 20%);
  --tab-divider-width: 1px;
  --tab-divider-inset: 0px;

  /*## BLEED (Bleed prop) */
  --bleed-bg: var(--tab-list-item-active-bg);
  --bleed-height: 2.75rem;

  /*## MOBILE: tabs look like the mobile menu's items */
  html:is(.dwc-mobile:not(:has([data-offcanvas='true'])), .dwc-offcanvas-mobile) & {
    --tab-list-wrapper-bg: transparent;
    --tab-list-item-clr: var(--dropdown-item-clr, #000);
    --tab-list-item-active-clr: var(--dropdown-item-hover-clr, var(--dropdown-item-clr, #000));
    --tab-list-item-active-bg: var(--dropdown-item-hover-bg, transparent);
    --tab-arrow-clr: var(--chevron-clr, currentColor);
    --tab-content-bg: var(--mobile-menu-background, var(--white, #fff));
  }

}
#etch-o9wuqtr {
  gap: 1rem;
}
.dwc-nest-toggle--open {
  gap: var(--label-gap);
}
.etch-hzzm98j {
  position: relative;
}
.dwce-toggle__label {
  font-size: var(--label-font-size);
  color: var(--label-color);
  text-transform: uppercase;
  font-weight: 500;
}
.dwc-toggle-vars {
  /*# ===== STICKY/OVERLAY HEADER SPECIAL STYLES ===== */
  /*===== this styles only apply when the header div attribute [data-sticky-overlay-special-style] attribute is set to true, and sticky header is enabled =====*/

  /*## STYLES BEFORE SCROLLING */
  html:has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style], .dwce-nav-nested.dwc-open)) .dwc-headroom:not(.scroll-up, .scroll-down) & {
    /* 
    --toggle-color: white !important;
    --toggle-bg: color-mix(in oklch, white 10%, transparent) !important; 
    --label-color: white !important;
    */
  }

  /*## STYLES BEFORE SCROLLING - OPEN */
  html:has([data-sticky-overlay-special-style='true'][data-sticky-header='true'] .dwce-nav-nested.dwc-open):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:not(.scroll-up, .scroll-down) & {
    /* --toggle-color: black !important; */
  }

  /*## STYLES AFTER SCROLLING */
  html:has([data-sticky-overlay-special-style='true'][data-sticky-header='true']):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) .dwce-nav-nested:not(:has(.dwce-dropdown.open, .dwc-nav-nested-items > li:hover)) & {
    /* add any of the toggle variables and update value*/
  }

  /*## STYLES AFTER SCROLLING - OPEN */
  html:has([data-sticky-overlay-special-style='true'][data-sticky-header='true'] .dwce-nav-nested.dwc-open):not(:has([data-no-sticky], [data-no-overlay-style])) .dwc-headroom:is(.scroll-up, .scroll-down) & {
    /* --toggle-color: red !important; */
  }
}
.site-brand {
  display: flex;
  flex-direction: column;
}
.site-brand__link {
  color: var(--neutral);
  font-size: var(--text-l);
  text-decoration: none;

  &:hover {
    color: var(--secondary);
  }
}
.site-brand__tagline {
  font-size: var(--text-xs);
  max-inline-size: 40ch;
}
.footer {
  background-color: var(--white);
  padding-block: var(--space-m);
}
.footer__inner {
  align-items: center;
  gap: var(--space-s);

  @media (width >= 48rem) {
    flex-direction: row;
    justify-content: space-between;
  }
}
.footer__info {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  text-align: center;

  @media (width >= 48rem) {
    text-align: start;
  }
}
.footer__callout {
  font-size: var(--text-xs);
}
.footer__socials {
  display: flex;
  justify-content: center;

  @media (width >= 48rem) {
    justify-content: flex-end;
  }
}
.footer__social-link {
  display: flex;
}
.dates__inner {
  align-items: center;
  text-align: center;
}
.dates__lead {
  font-size: var(--text-l);
}
.dates__theme {
  line-height: 1.5;
}
.dates__theme-name {
  font-size: var(--h3);
}
.ages {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: var(--grid-gap);
}
.ages__card {
  display: flex;
  flex-direction: column;
  padding: var(--space-l);
  align-items: center;
  text-align: center;
  border-radius: var(--radius);
  &[data-color='primary'] {
    background-color: var(--primary-ultra-light);
  }
  &[data-color='accent'] {
    background-color: var(--accent-ultra-light);
  }
  &[data-color='secondary'] {
    background-color: var(--secondary-ultra-light);
  }
}
.ages__image {
  inline-size: 100%;
  object-fit: contain;
  min-block-size: 6.25rem;
  max-block-size: 7rem;
}
.invitation {
  min-block-size: 25rem;
}
.invitation__inner {
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr));
  gap: var(--grid-gap);
}
.invitation__content-wrapper {
  color: var(--white);
  background-color: color-mix(in oklch, var(--black) 50%, transparent);
  padding: var(--space-l);
  border-radius: var(--radius);
  align-self: center;
  block-size: max-content;
}
.invitation__heading {
  color: var(--white);
}
.invitation__media-wrapper {
  justify-self: center;
  aspect-ratio: 16/9;
  block-size: 100%;
  position: relative;
}
.invitation__media {
  border-radius: var(--radius);
  object-fit: cover;
  object-position: 0% 80%;
  inline-size: 100%;
  block-size: 100%;
  position: absolute;
}
.register__inner {
  max-inline-size: 47rem;
}
.register__heading {
  text-align: center;
}
.gallery__intro {
  align-items: center;
  text-align: center;
}
.gallery__heading {
  max-inline-size: 40ch;
  text-wrap: balance;
  font-size: var(--h3);
}
.gallery__text {
  font-size: var(--text-xs);
}
.contact__intro {
  align-items: center;
  text-align: center;
  max-inline-size: 55ch;
}
.contact__heading {
  font-size: var(--h3);
  max-inline-size: 30ch;
  text-wrap: balance;
}
.contact__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: var(--grid-gap);
}
.contact__card {
  align-items: center;
  text-align: center;
}
.contact__icon {
  color: var(--primary);
}
.reg-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}
.reg-form__step {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
  &[hidden] {
    display: none;
  }
}
.reg-form__step-title {
  text-align: center;
}
.reg-form__groups {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}
.reg-form__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
  padding: var(--space-m);
  border: var(--border);
  border-radius: var(--radius);
  background-color: var(--white);
}
.reg-form__legend {
  font-weight: 700;
  padding-inline: var(--space-xs);
}
.reg-form__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.reg-form__label {
  font-weight: 700;
}
.reg-form__input {
  inline-size: 100%;
  padding-block: var(--space-xs);
  padding-inline: var(--space-s);
  border: var(--border);
  border-radius: var(--radius);
  background-color: var(--white);
}
.reg-form__choices {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  border: 0;
  padding: 0;
}
.reg-form__choice {
  display: flex;
  align-items: baseline;
  gap: var(--space-xs);
}
.reg-form__add {
  align-self: flex-start;
  &[hidden] {
    display: none;
  }
}
.reg-form__remove {
  align-self: flex-start;
  color: var(--accent);
  text-decoration: underline;
}
.reg-form__turnstile {
  min-block-size: 4.0625rem;
}
.reg-form__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-s);
}
.reg-form__status {
  font-weight: 700;
  text-align: center;
  &:empty {
    display: none;
  }
}
.marquee {
  display: flex;
  gap: var(--space-xs);
  overflow: hidden;
}
.marquee__track {
  flex-shrink: 0;
  display: flex;
  justify-content: space-around;
  gap: var(--space-xs);
  min-inline-size: 100%;
  animation: marquee-scroll 70s linear infinite;
  @media (prefers-reduced-motion: reduce) {
    animation-play-state: paused;
  }
}
.marquee__image {
  inline-size: 100%;
  max-inline-size: 18.75rem;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-xxl);
}