/* MUNDP conference theme page.
   Page-scoped, loads after theme.css. Uses the site's existing
   --ink / --ink-2 / --hairline / --accent custom properties. */

.theme-kicker {
  display: block;
  margin-bottom: 4px;
}

/* hero: shift up slightly from the shared -77px offset
   (heading legibility over photos is now handled globally in theme.css) */
.theme-hero {
  bottom: -40px !important;
}

/* Webflow's shared stylesheet redefines .padding-xhuge several times for
   different components (one variant zeroes top/bottom padding), so the
   cascade winner is unpredictable here — pin it explicitly per section. */
.theme-section-pad {
  padding-top: 6rem !important;
  padding-bottom: 6rem !important;
}

@media (max-width: 767px) {
  .theme-section-pad {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
}

/* ---------- key issues stack ---------- */
/* The shared Webflow stylesheet fixes every stack_card's height per
   breakpoint (35–55rem), so short texts leave a tall empty gap and long
   ones get clipped by the card's overflow:hidden. Size each card to its
   text instead — .box-text's 30px bottom padding then puts the same gap
   under the last line of every card. !important outranks the per-
   breakpoint height resets in the shared sheet's media queries. */
.stack_card,
.stack_card.is-first,
.stack_card.is-2,
.stack_card.is-6,
.stack_card.is-last {
  height: auto !important;
}

/* Card body text 10% below the shared sheet's size at each breakpoint
   (1.125rem / 1rem / .9rem), with extra bottom padding so every card
   keeps a strip of empty space under the last line. */
.stack_card .text-size-medium.box-text {
  font-size: 1.0125rem;
  padding-bottom: 2.5rem;
}

@media screen and (max-width: 767px) {
  .stack_card .text-size-medium.box-text {
    font-size: 0.9rem;
  }
}

@media screen and (max-width: 479px) {
  .stack_card .text-size-medium.box-text {
    font-size: 0.81rem;
  }
}


/* Editorial "Key Issues" header above the stack */
.th-issues-head {
  background: #ffffff;
  padding: 4.5rem 0;
}

.th-issues-head .ab-intro__heading {
  margin-bottom: 0;
}

/* Deep navy card borders + faint animated collage inside each card */
.stack_card,
.stack_card.is-first {
  border-color: #011a45;
}

.stack-card-collage {
  opacity: 0.06;
  pointer-events: none;
  z-index: 0;
}

.stack_card-content,
.stack_card-image-wrapper {
  position: relative;
  z-index: 1;
}

/* Theme intro: align the reading column's left edge with the heading,
   keeping the right edge where the centered column ended */
.ab-story__inner {
  max-width: 58rem;
  margin-left: 0;
}

/* Theme page: align the story column with the heading's left edge
   (about.css centers .ab-story__inner; higher specificity wins here) */
.ab-story .ab-story__inner {
  margin-left: 0;
  margin-right: auto;
}

/* ---------- hero still (restored) ----------
   The theme hero's coat-of-arms still + scrim. These rules used to come
   from hero-collage.css; without them the shared Webflow stylesheet's
   default .section-hero.background-color-black photo (DSC_0054, the 2022
   stage) shows through. Keep in sync with committees.css. */
.cx-hero-has-collage {
  position: relative;
  overflow: hidden;
  background-image: none !important;
}

.cx-hero-has-collage .grid-halves-section {
  position: relative;
  z-index: 1;
}

.home-hero-still {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.home-hero-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(6, 15, 40, 0.6) 0%, rgba(6, 15, 40, 0.42) 45%, rgba(6, 15, 40, 0.78) 100%);
}
