/* Detail overview only. The beer browsing controls belong to task 05. */
.festival-overview-summary,
#about,
.festival-overview-visit,
.festival-overview-related,
.festival-overview-attribution {
    overflow-wrap: anywhere;
}

.festival-overview-summary h1 {
    margin-bottom: 1rem;
}

.festival-overview-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2rem;
    margin-block: 1rem 1.25rem;
}

.festival-overview-facts > div {
    flex: 1 1 14rem;
    min-width: 0;
}

.festival-overview-facts dt {
    color: var(--bs-secondary-color);
    font-size: .875rem;
}

.festival-overview-facts dd {
    margin: .25rem 0 0;
}

.festival-overview-actions,
.festival-overview-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
}

.festival-overview-nav {
    gap: 1.5rem;
    padding-block: 1rem;
    border-bottom: 1px solid var(--bs-border-color);
}

.festival-overview-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 1.5rem;
}

.festival-overview-main,
.festival-overview-visit {
    min-width: 0;
}

.festival-overview-main {
    display: grid;
    gap: 1.5rem;
}

#beers, #about, #location {
    scroll-margin-top: 1rem;
}

.festival-overview-visit h3 {
    margin-top: 1.5rem;
}

.festival-overview-visit li + li {
    margin-top: .5rem;
}

.festival-overview-related,
.festival-overview-attribution {
    margin-top: 2rem;
}

#about img {
    max-width: 100%;
    height: auto;
}

@media (min-width: 992px) {
    .festival-overview-layout {
        grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr);
    }
}