/* Final polish: shared filter geometry and a quieter invitation in the hero. */
.experience .filters {
  align-items: end;
}

.experience .filters label {
  display: grid;
  grid-template-rows: 18px 44px;
  align-content: end;
  row-gap: 0;
  min-width: 0;
  min-height: 62px;
  margin: 0;
  padding: 0;
  font-size: 9px;
  line-height: 12px;
}

.experience .filters .filter-options {
  align-items: end;
  margin: 0;
  padding: 0;
}

.experience .filters :is(input, select) {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  min-height: 44px;
  min-width: 0;
  margin: 0;
  padding: 10px 12px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: normal;
}

.experience .filters .filter-toggle {
  align-self: end;
  min-height: 44px;
}

.experience .filters :is(input, select):focus-visible {
  border-color: var(--blue);
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

.experience .hero-actions .primary-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  max-width: 100%;
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid #d98e80;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--ink);
  font-size: clamp(12px, .8vw, 14px);
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  transform: none;
  transition: color .18s ease, border-color .18s ease;
}

.experience .hero-actions .primary-link span {
  display: inline-grid;
  place-items: center;
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  border: 1px solid #e0c9bd;
  border-radius: 50%;
  background: #fff8f1;
  color: #b43d33;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
  transition: background-color .18s ease, border-color .18s ease;
}

.experience .hero-actions .primary-link:hover {
  color: #a63d34;
  border-bottom-color: var(--red);
  background: transparent;
  box-shadow: none;
  transform: none;
}

.experience .hero-actions .primary-link:hover span {
  border-color: #d98e80;
  background: #f8e7dc;
}

.experience .hero-actions .text-link {
  gap: 10px;
  min-height: 44px;
  padding: 8px 0;
  font-size: clamp(12px, .75vw, 13px);
  font-weight: 600;
  line-height: 1.4;
  color: #505957;
  border-bottom-color: #c2c4bb;
  transition: color .18s ease, border-color .18s ease;
}

.experience .hero-actions .text-link span {
  margin: 0;
}

.experience .hero-actions .text-link:hover {
  color: var(--ink);
  border-bottom-color: #6f7a74;
}

.experience .hero-actions :is(.primary-link, .text-link):focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 5px;
}

/* The underline follows the word, instead of hanging into the next paragraph. */
.experience .hero-copy h1 em:after {
  bottom: .055em;
  left: .025em;
  height: clamp(2px, .045em, 3px);
  transform: rotate(-1.5deg);
}

/* A full poster in front of its own enlarged artwork fills the display without
   cropping information from the original. The artwork carries more of the card. */
.experience .today-art {
  flex: 0 0 auto;
  height: auto;
  min-height: 0;
  max-height: 390px;
  aspect-ratio: 1.18;
  isolation: isolate;
  background: #333936;
}

.experience .today-blur {
  z-index: 0;
  filter: blur(7px) brightness(.78) saturate(1.12);
  transform: scale(1.1);
  opacity: 1;
}

.experience .today-poster {
  position: absolute;
  inset: 0;
  z-index: 1;
  object-fit: contain;
  filter: drop-shadow(0 6px 16px #07101780);
}

.experience .today-art:after {
  z-index: 2;
  background: linear-gradient(120deg, #ffffff12, transparent 35%, transparent 80%, #111a1512);
  box-shadow: inset 0 1px 0 #ffffff40, inset 0 -1px 0 #00000020;
}

.experience .today-number {
  z-index: 3;
  top: 10px;
  left: 10px;
  padding: 7px 8px 6px;
  border: 1px solid #ffffff35;
  border-radius: 4px;
  background: #15242b80;
  backdrop-filter: blur(10px);
  font-size: 22px;
  text-shadow: 0 1px 3px #00000040;
}

.experience .today-art .editorial {
  z-index: 3;
}

.experience .today-body {
  padding: 13px 15px 8px;
}

.experience .today-body h4 {
  min-height: 0;
  margin: 8px 0 7px;
}

.experience .today-time {
  margin-bottom: 10px;
}

.experience .today-card-bottom {
  padding-top: 4px;
}

@media (max-width: 600px) {
  .experience .today-art {
    aspect-ratio: 1.12;
    max-height: 360px;
  }

  .experience .today-body {
    padding: 12px 13px 7px;
  }
}

@media (max-width: 820px) {
  .experience .filters :is(input, select) {
    padding-inline: 9px;
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .experience .hero-actions :is(.primary-link, .primary-link span, .text-link) {
    transition: none;
  }
}

/* Keep the desktop metrics inline; the mobile labels use the same live counts. */
.stat-short {display:none;}
.hero-metric {display:contents;line-height:normal;}
.experience .hero-stats small span {font-size:inherit;line-height:inherit;color:inherit;}
.experience .hero-catalog>.hero-metric {margin:0;color:inherit;font-size:inherit;line-height:normal;}
@media(max-width:820px) {
  .experience .hero-copy {padding-inline:12px;}
  .experience .hero-stats {flex-direction:row;align-items:center;flex-wrap:wrap;gap:6px 12px;margin-top:10px;}
  .experience .hero-live-count {flex-wrap:nowrap;white-space:nowrap;gap:4px;min-height:24px;}
  .experience .hero-stats .hero-catalog {display:contents;}
  .experience .hero-stats .hero-metric {display:inline-flex;align-items:baseline;white-space:nowrap;gap:4px;}
  .experience .hero-stats .stat-long,.experience .hero-stats .stat-divider {display:none;}
  .experience .hero-stats .stat-short {display:inline;}
  .experience .filters {padding-inline:11px;}
  .experience .today-showcase {padding-inline:11px;}
  .experience .today-showcase:before {left:12px;right:12px;}
  .experience .next-shelf .heading {padding-inline:12px;flex-direction:row;align-items:end;justify-content:space-between;}
  .experience .next-shelf .shelf-tools {max-width:none;}
  /* The foreground keeps the complete poster; only the duplicate fills the sides. */
  .experience .upcoming-carousel .visual .card-link {position:relative;isolation:isolate;overflow:hidden;}
  .experience .upcoming-carousel .visual .artwork-backdrop {inset:0;width:100%;height:100%;object-fit:cover;filter:blur(9px) brightness(.78) saturate(.95);transform:scale(1.12);opacity:1;z-index:0;pointer-events:none;transition:none;}
  .experience .upcoming-carousel .visual .artwork-foreground {object-fit:contain;transform:none;filter:drop-shadow(0 2px 7px #10202b55);}
}
@media(max-width:600px) {
  .experience .hero {padding-block:16px;}
  .experience .hero-actions {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);margin-top:8px;gap:6px 14px;}
  .experience .hero-actions :is(.primary-link,.text-link) {font-size:12px;}
  .experience .hero-stats strong {font-size:12px;}
  .experience .hero-stats small {font-size:10px;}
  .experience .next-shelf h2 {font-size:21px;}
  .experience .next-shelf .heading {margin-bottom:12px;}
  .experience .next-shelf {padding-top:26px;}
}
@media(max-width:350px) {
  .experience .hero-stats {gap:6px 8px;}
  .experience .hero-stats strong {font-size:11px;}
}

/* Older published shells keep their HTML; these two invitations are text links. */
.experience .hero-actions :is(.primary-link,.text-link)>span {display:none;}

/* The underline ends with the text after removal of the decorative icons. */
.experience .hero-actions :is(.primary-link,.text-link){width:fit-content;justify-self:start;max-width:100%;}
.experience #proximos.first-result{padding-top:0;}
/* Four compact metrics stay in balanced pairs on narrow screens. */
@media (max-width:820px) {
  .experience .hero-stats {display:grid;grid-template-columns:max-content max-content;gap:6px 14px;align-items:center;}
  .experience .hero-stats .hero-catalog {display:contents;}
  .experience .hero-stats .hero-metric {margin:0;}
}
