/* MUNDP self-hosted polish layer — subtle motion + refined styling.
   Safe to remove: purely additive, never alters layout at rest. */

/* ---------- foundations ---------- */
html {
  scroll-behavior: smooth;
}

/* ---------- handbook embed ---------- */
/* the Adobe InDesign viewer iframe is width:100% but a fixed height:960px
   inline in the HTML — on a phone that's more than a full screen of empty
   chrome before any content. Cap it to a comfortable viewport fraction. */
@media (max-width: 767px) {
  .w-embed.w-iframe iframe {
    height: 70vh !important;
  }
}

::selection {
  background: #2b4da0;
  color: #fff;
}

:focus-visible {
  outline: 2px solid #2b4da0;
  outline-offset: 3px;
  border-radius: 2px;
}

/* gentle page entrance */
body {
  animation: mundp-page-in 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

@keyframes mundp-page-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* exit fade for browsers without native View Transitions (set by
   enhancements.js just before navigating to a same-origin link) */
body.mundp-leaving {
  animation: none;
  opacity: 0;
  transform: scale(0.99);
  filter: blur(4px);
  transition:
    opacity 0.18s cubic-bezier(0.4, 0, 1, 1),
    transform 0.18s cubic-bezier(0.4, 0, 1, 1),
    filter 0.18s cubic-bezier(0.4, 0, 1, 1);
}

/* slightly tighter display headings — crisper without changing scale */
.heading-xlarge,
.heading-xxlarge,
.heading-large {
  letter-spacing: -0.015em;
}

/* ---------- scroll reveal ---------- */
.mundp-reveal {
  opacity: 0;
  transform: translateY(20px) scale(0.995);
  filter: blur(7px);
  transition:
    opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--mundp-delay, 0ms);
  will-change: opacity, transform, filter;
}

.mundp-reveal.mundp-in {
  opacity: 1;
  transform: none;
  filter: blur(0);
}

/* ---------- buttons ---------- */
.w-button,
.button-primary,
.button-secondary {
  transition:
    transform 0.28s cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 0.28s cubic-bezier(0.22, 0.61, 0.36, 1),
    background-color 0.28s ease,
    color 0.28s ease,
    border-color 0.28s ease;
}

.w-button:hover,
.button-primary:hover,
.button-secondary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -8px rgba(20, 35, 80, 0.35);
}

.w-button:active,
.button-primary:active,
.button-secondary:active {
  transform: translateY(0) scale(0.985);
  box-shadow: 0 4px 10px -6px rgba(20, 35, 80, 0.3);
  transition-duration: 0.12s;
}

/* ---------- slider dot nav ---------- */
/* Webflow's auto-generated slider dots are only 8x8px — enlarge the tap
   target invisibly without changing the visual dot size. */
.w-slider-dot {
  position: relative;
}

.w-slider-dot::after {
  content: "";
  position: absolute;
  /* dots sit only 6px apart — keep the horizontal reach inside that gap so
     adjacent tap zones never overlap */
  inset: -10px -3px;
}

/* ---------- forms ---------- */
/* Webflow's default .w-input/.w-select ship at 14px; below 16px, iOS Safari
   force-zooms the whole page on focus. Bump to the zoom-safe minimum. */
.w-input,
.w-select {
  font-size: 16px;
  height: auto;
  min-height: 44px;
}

/* ---------- navigation ---------- */
.nav-link {
  transition: color 0.25s ease, opacity 0.25s ease;
}

.nav-link:hover {
  opacity: 0.6;
}

/* liquid-glass top bar: translucent, blurred, full width */
.navbar-logo-left-container.w-nav {
  width: 100%;
  max-width: 100%;
  margin-top: 0;
  background: rgba(255, 255, 255, 0.35);
  -webkit-backdrop-filter: blur(26px) saturate(1.8);
  backdrop-filter: blur(26px) saturate(1.8);
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 0;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* the menu list carries its own white pill background — let the glass show through */
.navbar-logo-left .nav-menu-two {
  background: transparent;
}

/* keep the glass treatment when the menu is open (mobile dropdown) */
.navbar-logo-left .w-nav-menu[data-nav-menu-open],
.navbar-logo-left .w-nav-overlay [data-nav-menu-open] {
  background: rgba(255, 255, 255, 0.45);
  -webkit-backdrop-filter: blur(30px) saturate(1.8);
  backdrop-filter: blur(30px) saturate(1.8);
}

/* pages with white nav links (dark heroes): darken them on the light glass dropdown */
.navbar-logo-left [data-nav-menu-open] .nav-link {
  color: #1a1b1f !important;
}

/* solid-enough fallback where backdrop-filter is unsupported */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .navbar-logo-left-container.w-nav,
  .navbar-logo-left .w-nav-menu[data-nav-menu-open],
  .navbar-logo-left .w-nav-overlay [data-nav-menu-open] {
    background: rgba(255, 255, 255, 0.92);
  }
}

.navbar-brand img {
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.navbar-brand:hover img {
  transform: scale(1.06) rotate(-2deg);
}

/* refined navbar shadow */
.shadow-three {
  box-shadow:
    0 1px 2px rgba(15, 25, 60, 0.06),
    0 8px 24px -12px rgba(15, 25, 60, 0.14);
}

/* ---------- links (footer + inline) ---------- */
.footer_legal-link,
.footer_social-link,
.schedule-name a,
.text-size-medium a {
  transition: opacity 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.footer_social-link:hover {
  transform: translateY(-3px);
}

.footer_social-link:hover .social-icon {
  opacity: 0.85;
}

.footer_legal-link:hover {
  opacity: 0.7;
}

/* ---------- committee development callout buttons ---------- */
/* .button.is-alternate is hard-pinned at width:460px in the base Webflow css
   and is never resized at any breakpoint. On a row-flex parent flex-shrink
   still applies and it shrinks fine (see 404 page), but
   .header_content-wrapper.committee switches to flex-flow:column at
   max-width:479px, where flex-shrink no longer governs the cross-axis size —
   so on this page specifically the button stays 460px wide and blows out
   the whole page horizontally on every phone width. */
@media screen and (max-width: 767px) {
  .header_content-wrapper.committee .button.is-alternate {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* ---------- imagery ---------- */
/* cinematic settle on page headers — ends slightly zoomed so the
   parallax wrapper never exposes edges */
.header_background-image {
  animation: mundp-bg-settle 2.4s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

.header_background-image-wrapper {
  overflow: hidden;
  will-change: transform;
}

@keyframes mundp-bg-settle {
  from { transform: scale(1.14); }
  to   { transform: scale(1.08); }
}

/* committee / collection cards: lift + gentle image zoom */
.collection-item {
  transition:
    transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.collection-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px -18px rgba(15, 25, 60, 0.28);
}

.collection-item img {
  transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.collection-item:hover img {
  transform: scale(1.03);
}

.layout227_item {
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.layout227_item:hover {
  transform: translateY(-3px);
}

/* ---------- schedule & agenda rows ---------- */
/* the Webflow collection list carries a fixed 108px/334px left/right padding
   with no real mobile override (only a redundant max-width:479px tweak) —
   on any phone/tablet viewport that padding alone is wider than the screen,
   forcing the whole page into horizontal scroll. */
@media (max-width: 991px) {
  .collection-list-wrapper {
    padding-left: 0;
    padding-right: 0;
  }
}

/* Webflow's own generated CSS also carries a stray margin-left:-53px on this
   row at <=479px (a leftover Designer nudge) that shifts every schedule row
   off-screen to the left, clipping the start of every time/session label. */
@media (max-width: 479px) {
  .schedule-row-inner {
    margin-left: 0;
  }
}

.schedule-row-inner,
.agenda-item {
  transition: background-color 0.25s ease, transform 0.25s ease;
}

.schedule-row-inner:hover,
.agenda-item:hover {
  transform: translateX(4px);
}

/* ---------- countdown ---------- */
[id^="js-clock-"] {
  font-variant-numeric: tabular-nums;
  display: inline-block;
}

/* ---------- accessibility ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  body,
  .header_background-image {
    animation: none;
  }

  .mundp-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .w-button, .button-primary, .button-secondary,
  .nav-link, .nav-link::after, .navbar-brand img,
  .collection-item, .collection-item img, .layout227_item,
  .schedule-row-inner, .agenda-item,
  .footer_legal-link, .footer_social-link {
    transition: none;
  }
}