/* three-up: force equal 4:3 media frames + hover zoom */

.section.three-up,
.section.Three-up {
  align-items: start !important;
}

.section.three-up > .base-card:not(.featured),
.section.Three-up > .base-card:not(.featured) {
  min-width: 0 !important;
  width: 100% !important;
  align-self: stretch !important;
  height: auto !important;
  contain: none !important;
  /* Do NOT force transform:none — blocks parallax stagger reveal */
  filter: none !important;
}

.section.three-up > .base-card:not(.featured) > div,
.section.Three-up > .base-card:not(.featured) > div {
  display: flex !important;
  flex-direction: column-reverse !important;
  height: auto !important;
  min-width: 0 !important;
  justify-content: flex-start !important;
}

/* Equal media box — aspect-ratio beats padding/JS fights */
.section.three-up > .base-card:not(.featured) .media,
.section.Three-up > .base-card:not(.featured) .media,
.section.three-up > .base-card:not(.featured) > div > div:has(> picture),
.section.Three-up > .base-card:not(.featured) > div > div:has(> picture) {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  padding: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  background: #eef3f8 !important;
  box-shadow: inset 0 0 0 1px rgb(43 33 24 / 6%);
  flex: 0 0 auto !important;
  align-self: stretch !important;
  clip-path: none !important;
  transform: none !important;
  animation: none !important;
}

.section.three-up > .base-card:not(.featured) .media > picture,
.section.Three-up > .base-card:not(.featured) .media > picture,
.section.three-up > .base-card:not(.featured) > div > div:has(> picture) > picture,
.section.Three-up > .base-card:not(.featured) > div > div:has(> picture) > picture {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  display: block !important;
  transform: none !important;
  animation: none !important;
  filter: none !important;
}

.section.three-up > .base-card:not(.featured) [class*="parallax-"],
.section.Three-up > .base-card:not(.featured) [class*="parallax-"] {
  --parallax-scale: 1 !important;
  --parallax-translate-y: 0 !important;
  --parallax-translate-x: 0 !important;
  --parallax-blur: 0 !important;
  animation: none !important;
  transform: none !important;
  filter: none !important;
}

.section.three-up > .base-card:not(.featured) picture img,
.section.Three-up > .base-card:not(.featured) picture img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  transform: scale(1) !important;
  transform-origin: center center !important;
  transition: transform 0.35s ease !important;
  animation: none !important;
  filter: none !important;
}

/* Same hover zoom for all three cards */
.section.three-up > .base-card:not(.featured):hover .media picture img,
.section.three-up > .base-card:not(.featured):hover picture img,
.section.Three-up > .base-card:not(.featured):hover .media picture img,
.section.Three-up > .base-card:not(.featured):hover picture img {
  transform: scale(1.06) !important;
}

/* Middle phone card: full-bleed like siblings (no letterbox / contain gap) */
.section.three-up > .base-card.incard-three-up-card--phone .media,
.section.Three-up > .base-card.incard-three-up-card--phone .media,
.section.three-up > .base-card.incard-three-up-card--phone > div > div:has(> picture),
.section.Three-up > .base-card.incard-three-up-card--phone > div > div:has(> picture) {
  background: #eef3f8 !important;
}

.section.three-up > .base-card.incard-three-up-card--phone picture img,
.section.Three-up > .base-card.incard-three-up-card--phone picture img {
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1) !important;
}

.section.three-up > .base-card:not(.featured) .foreground,
.section.Three-up > .base-card:not(.featured) .foreground,
.section.three-up > .base-card:not(.featured) > div > div:not(:has(> picture)),
.section.Three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) {
  flex: 0 1 auto;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 12px 2px 0 !important;
  box-sizing: border-box;
  gap: 0;
}

.section.three-up > .base-card:not(.featured) .foreground :is(h1, h2, h3, h4, h5, h6),
.section.Three-up > .base-card:not(.featured) .foreground :is(h1, h2, h3, h4, h5, h6),
.section.three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) :is(h1, h2, h3, h4, h5, h6),
.section.Three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) :is(h1, h2, h3, h4, h5, h6) {
  margin: 0 0 8px !important;
  min-height: 0 !important;
  line-height: 1.3;
}

.section.three-up > .base-card:not(.featured) .foreground > p,
.section.Three-up > .base-card:not(.featured) .foreground > p,
.section.three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) > p,
.section.Three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) > p {
  margin: 0 !important;
}

/* Subtitle: at most 3 lines, no forced empty height */
.section.three-up > .base-card:not(.featured) .foreground > p:not(:has(a)),
.section.Three-up > .base-card:not(.featured) .foreground > p:not(:has(a)),
.section.three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) > p:not(:has(a)),
.section.Three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) > p:not(:has(a)) {
  flex: 0 0 auto;
  font-size: 15px;
  line-height: 1.5;
  min-height: 0;
  max-height: calc(1.5em * 3);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
}

.section.three-up > .base-card:not(.featured) .foreground > p:has(a),
.section.Three-up > .base-card:not(.featured) .foreground > p:has(a),
.section.three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) > p:has(a),
.section.Three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) > p:has(a),
.section.three-up > .base-card:not(.featured) .foreground .standalone-link,
.section.Three-up > .base-card:not(.featured) .foreground .standalone-link {
  margin-top: 8px !important;
  padding-top: 0 !important;
  margin-bottom: 0 !important;
}

.section.three-up > .base-card:not(.featured) .foreground a,
.section.Three-up > .base-card:not(.featured) .foreground a,
.section.three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) a,
.section.Three-up > .base-card:not(.featured) > div > div:not(:has(> picture)) a {
  font-size: 15px;
  line-height: 1.4;
  font-weight: 600;
}

/* Kill Edge compositor hairline from parallax transforms on this section */
.section.three-up,
.section.Three-up,
.section.three-up.base-card-section,
.section.Three-up.base-card-section {
  gap: clamp(20px, 2.5vw, 32px) !important;
  background-color: #fff !important;
  isolation: isolate;
  overflow: clip;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  animation: none !important;
  view-timeline: none !important;
}

.section.three-up > .base-card,
.section.Three-up > .base-card,
.section.three-up > .base-card:not(.featured),
.section.Three-up > .base-card:not(.featured) {
  transform: none !important;
  animation: none !important;
  will-change: auto !important;
  filter: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.section.three-up.base-card-section + .section,
.section.Three-up.base-card-section + .section {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.section.three-up.base-card-section + .section::before,
.section.three-up.base-card-section + .section::after,
.section.Three-up.base-card-section + .section::before,
.section.Three-up.base-card-section + .section::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
}

/* Edge: content:url(svg) arrows can paint as a full-width black bar */
.section.three-up .standalone-link::after,
.section.Three-up .standalone-link::after,
.section.three-up a.label::after,
.section.Three-up a.label::after {
  content: '>' !important;
  display: inline !important;
  margin-inline-start: 6px !important;
  font-weight: 700;
  line-height: 1;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  transform: none !important;
  background: none !important;
  border: 0 !important;
}

/* Keep hit-area on the link itself — full-card ::before can leave Edge paint artifacts */
.section.three-up .standalone-link,
.section.Three-up .standalone-link {
  position: relative;
  z-index: 2;
}

.section.three-up .standalone-link::before,
.section.Three-up .standalone-link::before {
  content: none !important;
  display: none !important;
}

.section.three-up > .base-card,
.section.Three-up > .base-card {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

@media (width >= 768px) {
  .section.three-up.base-card-section,
  .section.Three-up.base-card-section {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: start !important;
  }

  .section.three-up > .base-card:not(.featured),
  .section.Three-up > .base-card:not(.featured) {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Collapse empty spacer sections that only hold anchors (removes phantom line + gap in Edge) */
main > .section:has(> .section-anchor):not(:has(.base-card, .incard-bento-section, .rich-content, .elastic-carousel, .aside)) {
  min-height: 0 !important;
  padding-block: 0 !important;
  margin-block: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

/* Featured copy flush-left with media card above (not indented) */
.base-card.featured .foreground {
  padding-inline-start: 0 !important;
  padding-inline-end: var(--s2a-spacing-md);
}

/* Amplify featured events parallax only — three-up stagger disabled (Edge hairline) */
@supports (animation-timeline: view()) {
  /* Featured events collage: stronger rise + settle on scroll */
  .section.parallax-scale-down-grid .base-card.featured .media,
  .section.parallax-scale-down-grid .base-card.featured .parallax-featured-card-media {
    --parallax-translate-y: 160px;
    --parallax-scale: 1.14;
    --parallax-opacity-from: 0.25;
    animation-name: enable-parallax, grow-featured-card-radius;
    animation-timing-function: cubic-bezier(0.42, 0, 0, 1), cubic-bezier(0.42, 0, 0, 1);
    animation-fill-mode: both, both;
    animation-timeline: view(block 45% 8%), view(block 45% 8%);
    animation-range: entry 0% cover 50%, entry 0% cover 50%;
    will-change: opacity, transform, filter, clip-path;
  }

  .section.parallax-scale-down-grid .base-card.featured .foreground {
    --parallax-translate-y: 64px;
    --parallax-opacity-from: 0;
    animation-name: enable-parallax;
    animation-timing-function: cubic-bezier(0.42, 0, 0, 1);
    animation-fill-mode: both;
    animation-timeline: view(block 45% 8%);
    animation-range: entry 8% cover 45%;
    will-change: opacity, transform;
  }
}

@media (prefers-reduced-motion: reduce) {
  .section.parallax-scale-down-grid .base-card.featured .media,
  .section.parallax-scale-down-grid .base-card.featured .foreground {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}