/* Force listing grid inside reveal.js to show 3 columns */
.reveal .quarto-listing-cols-2 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3em;
    align-items: start;
}

/* Ensure each item behaves properly as a grid cell */
.reveal .quarto-listing-cols-2 > .g-col-1 {
    display: block !important;
}

/* Ensure cards don’t stretch to full width */
.reveal .quarto-listing-cols-2 .quarto-grid-item {
    width: 100%;
    min-height: 250px;
    display: flex;
    flex-direction: column;
    border: 2px solid rgba(223, 53, 53, 0.2);
    border-radius: 0.25rem;
}

/* Vertically center header text in listing grid cards (Reveal only) */
.reveal .quarto-listing-cols-2 .quarto-grid-item.card .card-header {
    display: flex;
    background-color: #4d5566;
    padding-left: 2em;
    align-items: center;   /* vertical centering */
    min-height: 1.2em;     /* prevents squashing when small text */
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

iframe {
  margin-bottom: 0px !important;
}

/* Medium breakpoint: switch to 2 columns */
@media (max-width: 767.98px) {
    .reveal .quarto-listing-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Small breakpoint: switch to 1 column */
@media (max-width: 575.98px) {
    .reveal .quarto-listing-cols-2 {
        grid-template-columns: minmax(0, 1fr);
    }
}