/* Navigation and dynamic-content stability — 2026-08-20. */

.site-header .header-language {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 54px;
  min-height: 44px;
  padding: 0 9px;
  color: var(--gold-light, #efd28b);
  border: 1px solid rgba(239, 210, 139, .45);
  border-radius: 999px;
  font: 600 15px/1.2 Arial, sans-serif;
  text-decoration: none;
}
.site-header .header-language:hover,
.site-header .header-language:focus-visible {
  color: #fff;
  background: rgba(239, 210, 139, .12);
  outline: 2px solid var(--gold-light, #efd28b);
  outline-offset: 3px;
}
.mobile-menu > .mobile-language {
  align-self: flex-start;
  font-family: Arial, sans-serif;
  direction: rtl;
}
@media (max-width: 600px) {
  .site-header .header-inner { gap: 10px; }
  .site-header .header-language { margin-left: auto; }
}

/* Keep the pointer inside a continuous hit area while it crosses from the header
   into a dropdown or from the program column into the workshop list. */
.nav-dropdown-panel {
  top: 100%;
  border-color: rgba(192, 151, 66, .5);
  border-radius: 4px 20px 20px 20px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(244, 238, 225, .98)),
    #f4eee1;
  box-shadow: 0 24px 64px rgba(25, 19, 10, .3);
  color: #251f18;
  backdrop-filter: blur(18px);
}

/* Mobile workshop index: readable without zooming, while preserving the
   existing nested accordion and its scroll behaviour. */
@media (max-width: 980px) {
  .mobile-nav-branch > .mobile-nav-panel .nav-panel-item {
    align-items: flex-start;
    padding: .95rem .15rem;
    border-radius: 0;
  }

  .mobile-nav-branch > .mobile-nav-panel .nav-panel-item strong {
    font-family: var(--font-sans, Arial, sans-serif);
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.34;
  }

  .mobile-nav-branch > .mobile-nav-panel .nav-panel-item small {
    color: #c9c4b7;
    margin-top: .3rem;
    font-size: .82rem;
    line-height: 1.4;
    white-space: normal;
  }
}


.desktop-nav .nav-panel-all,
.desktop-nav .nav-panel-item {
  border-radius: 0;
  color: #251f18;
}

.desktop-nav .nav-panel-all {
  margin: 0;
  padding: 11px 13px 13px;
  border-bottom: 1px solid rgba(154, 112, 35, .28);
  color: #167b76;
  font-size: 11px;
  letter-spacing: .11em;
}

.desktop-nav .nav-panel-item {
  padding: 11px 13px;
  border-top: 0;
  border-bottom: 1px solid rgba(48, 39, 27, .1);
  font-size: 13px;
}

.desktop-nav .nav-panel-item:last-child { border-bottom: 0; }

.desktop-nav .nav-panel-item:hover,
.desktop-nav .nav-panel-item:focus-visible,
.desktop-nav .nav-panel-item[aria-current="page"] {
  background: rgba(45, 169, 162, .11);
  color: #123c39;
  box-shadow: inset 3px 0 #2da9a2;
}

.nav-panel-item strong { font-size: 13px; line-height: 1.25; }
.nav-panel-item small {
  color: rgba(37, 31, 24, .62);
  font-size: 10px;
}

.nav-panel-item img {
  border-color: rgba(154, 112, 35, .52);
  border-radius: 8px;
}

/* Program overview stays nocturnal; the long workshop index opens as paper. */
.nav-dropdown--program .nav-dropdown-panel {
  left: auto;
  right: -2rem;
  width: min(24rem, 88vw);
  transform: translateY(9px);
  padding: 7px;
  border-radius: 4px 18px 18px 18px;
  background:
    radial-gradient(circle at 10% 0, rgba(45, 169, 162, .14), transparent 42%),
    rgba(7, 17, 16, .985);
  color: #f7efdf;
}

.nav-dropdown--program.is-open > .nav-dropdown-panel { transform: translateY(0); }

.program-nav-grid { display: grid; }

.program-nav-choice,
.program-nav-branch > a {
  gap: .22rem;
  padding: .86rem .95rem .82rem;
  border-bottom-color: rgba(209, 165, 74, .22);
  color: #f7efdf;
  transform: none;
}

.program-nav-choice span,
.program-nav-branch > a span {
  color: #63d2ca;
  font-size: .67rem;
  font-weight: 750;
  letter-spacing: .09em;
}

.program-nav-choice strong,
.program-nav-branch > a strong {
  font-size: .88rem;
  letter-spacing: -.005em;
}

.program-nav-choice small,
.program-nav-branch > a small {
  color: rgba(247, 239, 223, .6);
  font-size: .68rem;
}

.program-nav-choice:hover,
.program-nav-choice:focus-visible,
.program-nav-branch > a:hover,
.program-nav-branch > a:focus-visible,
.program-nav-branch:focus-within > a,
.program-nav-branch:hover > a {
  background: rgba(45, 169, 162, .13);
  color: #fff8e8;
  box-shadow: inset 3px 0 #55c8c0;
  transform: none;
}

.program-nav-submenu {
  left: 100%;
  width: min(31rem, 43vw);
  padding: 8px;
  border-color: rgba(192, 151, 66, .5);
  border-radius: 4px 20px 20px 20px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(243, 237, 223, .99)),
    #f4eee1;
  box-shadow: 0 28px 72px rgba(12, 10, 7, .38);
  color: #251f18;
}


.program-nav-submenu .nav-panel-list {
  max-height: min(62vh, 36rem);
  overflow: auto;
  overscroll-behavior: contain;
}

/* Stable two-column program menu: the workshop index is part of the same surface,
   not a fragile floating third-level panel. */
.nav-dropdown--program > .nav-dropdown-panel {
  left: 50%;
  right: auto;
  width: min(54rem, calc(100vw - 32px));
  max-height: min(72vh, 42rem);
  transform: translate(-50%, 9px);
  overflow: hidden;
}

.nav-dropdown--program.is-open > .nav-dropdown-panel {
  transform: translate(-50%, 0);
}

.program-nav-grid {
  position: relative;
  grid-template-columns: minmax(17rem, 20rem) minmax(0, 1fr);
  min-height: min(35rem, 62vh);
}

.program-nav-branch,
.program-nav-choice {
  position: static;
  grid-column: 1;
}

.program-nav-submenu {
  top: 0;
  right: 0;
  bottom: 0;
  left: calc(min(20rem, 38%) + 7px);
  width: auto;
  max-height: none;
  border: 0;
  border-left: 1px solid rgba(192, 151, 66, .34);
  border-radius: 0 14px 14px 0;
  box-shadow: none;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

.program-nav-submenu::before,

.program-nav-submenu .nav-panel-list {
  max-height: calc(min(35rem, 62vh) - 48px);
}
/* Every slide remains in the layout grid, so changing the active quote does not
   move the controls or the sections below it. Hidden slides stay non-interactive. */
[data-review-slides] {
  display: grid;
  align-items: start;
}

[data-review-slides] > .review-slide {
  display: block;
  grid-area: 1 / 1;
  align-self: start;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

[data-review-slides] > .review-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
  .nav-dropdown-panel,
  .program-nav-submenu,
  [data-review-slides] > .review-slide { transition: none; animation: none; }
}
/* Trigger boundary + compact program menu — 2026-08-20. */
.nav-dropdown:not(.is-open) > .nav-dropdown-panel,
.nav-dropdown:not(.is-open) > .nav-dropdown-panel * {
  pointer-events: none !important;
}

.nav-dropdown.is-open > .nav-dropdown-panel {
  pointer-events: auto;
}

.nav-dropdown--program > .nav-dropdown-panel {
  width: min(44rem, calc(100vw - 24px));
  max-height: min(26rem, calc(100vh - 112px));
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(174, 132, 48, .55);
  border-radius: 14px;
  background: #f7f2e8;
  box-shadow: 0 22px 52px rgba(23, 18, 10, .28);
  color: #272119;
}

.program-nav-grid {
  grid-template-columns: minmax(14rem, 15.25rem) minmax(0, 1fr);
  min-height: min(23rem, calc(100vh - 128px));
  max-height: min(26rem, calc(100vh - 112px));
  background: #f7f2e8;
}

.program-nav-branch,
.program-nav-choice {
  grid-column: 1;
  background: #ede9df;
}

.program-nav-choice,
.program-nav-branch > a {
  gap: .18rem;
  min-height: 0;
  padding: .66rem .78rem .64rem;
  border-bottom: 1px solid rgba(112, 87, 39, .16);
  color: #272119;
}

.program-nav-choice span,
.program-nav-branch > a span {
  color: #16857f;
  font-size: .62rem;
  letter-spacing: .1em;
}

.program-nav-choice strong,
.program-nav-branch > a strong {
  color: #272119;
  font-size: .78rem;
  line-height: 1.18;
}

.program-nav-choice small,
.program-nav-branch > a small {
  color: rgba(39, 33, 25, .58);
  font-size: .61rem;
  line-height: 1.25;
}

.program-nav-choice:hover,
.program-nav-choice:focus-visible,
.program-nav-branch > a:hover,
.program-nav-branch > a:focus-visible,
.program-nav-branch:focus-within > a,
.program-nav-branch:hover > a {
  background: #dcece7;
  color: #173d39;
  box-shadow: inset 3px 0 #2da9a2;
}

.program-nav-submenu {
  top: 0;
  right: 0;
  bottom: 0;
  left: 15.25rem;
  width: auto;
  padding: .55rem .65rem .65rem;
  overflow: hidden;
  border: 0;
  border-left: 1px solid rgba(174, 132, 48, .26);
  border-radius: 0 13px 13px 0;
  background: #fbf8f1;
  box-shadow: none;
  color: #272119;
}

.program-nav-submenu .nav-panel-all {
  padding: .55rem .15rem .65rem;
  color: #9b6b18;
  font-size: .64rem;
}

.program-nav-submenu .nav-panel-list {
  max-height: calc(min(26rem, calc(100vh - 112px)) - 3rem);
  padding-right: .2rem;
}

.program-nav-submenu .nav-panel-item {
  padding: .5rem .65rem;
  font-size: .73rem;
  line-height: 1.18;
}

.program-nav-submenu .nav-panel-item strong {
  font-size: .73rem;
}

.program-nav-submenu .nav-panel-item small {
  margin-top: .08rem;
  font-size: .59rem;
}

@media (max-height: 700px) and (min-width: 981px) {
  .nav-dropdown--program > .nav-dropdown-panel,
  .program-nav-grid { max-height: calc(100vh - 92px); }
  .program-nav-grid { min-height: calc(100vh - 112px); }
  .program-nav-submenu .nav-panel-list { max-height: calc(100vh - 148px); }
}

/* The workshop index is a true second level: hidden until the day branch is
   hovered or keyboard-focused. Keeping it inside the branch preserves the
   hover corridor while removing the permanent second column. */
@media (min-width: 981px) {
  .nav-dropdown--program > .nav-dropdown-panel {
    width: 18rem;
    max-height: none;
    overflow: visible;
    background: #f7f2e8;
  }

  .program-nav-grid {
    display: block;
    width: 18rem;
    min-height: 0;
    max-height: none;
    background: #f7f2e8;
  }

  .program-nav-branch,
  .program-nav-choice {
    width: 100%;
  }

  .program-nav-submenu {
    top: -1px;
    right: auto;
    bottom: auto;
    left: 100%;
    width: min(28.75rem, calc(100vw - 18rem - 32px));
    height: min(23rem, calc(100vh - 112px));
    padding: .55rem .65rem .65rem;
    overflow: hidden;
    border: 1px solid rgba(174, 132, 48, .55);
    border-left-color: rgba(174, 132, 48, .26);
    border-radius: 0 14px 14px 0;
    background: #fbf8f1;
    box-shadow: 18px 22px 44px rgba(23, 18, 10, .22);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-8px);
    transition: opacity 150ms ease, transform 150ms ease, visibility 0s linear 150ms;
  }

  .program-nav-branch:hover > .program-nav-submenu,
  .program-nav-branch:focus-within > .program-nav-submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition-delay: 0s;
  }

  .program-nav-submenu .nav-panel-list {
    max-height: calc(min(23rem, calc(100vh - 112px)) - 3rem);
  }

  .program-nav-choice small,
  .program-nav-branch > a small {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* Temporarily hide the events entry without removing its route or markup. */
.desktop-nav > a[href="/events.html"],
.desktop-nav > a[href="events.html"],
[data-mobile-menu] > a[href="/events.html"],
[data-mobile-menu] > a[href="events.html"] { display:none !important; }
/* Temporarily keep the events destination in markup while hiding it site-wide. */
.site-header .desktop-nav a[href="/events.html"],
.mobile-menu a[href="/events.html"],
.site-footer a[href="/events.html"] {
  display: none !important;
}
