.plcdp-index {
    --plcdp-gap: 1rem;
}

.plcdp-index__sections,
.plcdp-index__recipes {
    margin: 0 0 2.5rem;
}

.plcdp-index__section-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: .75rem;
}

.plcdp-index__section-link {
    display: block;
    padding: .85rem 1rem;
    border: 1px solid currentColor;
    border-radius: .5rem;
    text-decoration: none;
}

.plcdp-index__controls {
    display: grid;
    gap: .75rem;
    margin-bottom: 1rem;
}

.plcdp-index__search-label {
    font-weight: 600;
}

.plcdp-index__search {
    width: 100%;
    max-width: 36rem;
    padding: .7rem .8rem;
    font: inherit;
}

.plcdp-index__cuisines {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.plcdp-index__filter {
    padding: .45rem .7rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.plcdp-index__filter.is-active {
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: .18em;
}

.plcdp-index__alphabet {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin: 1.25rem 0 2rem;
}

.plcdp-index__alphabet a,
.plcdp-index__alphabet span {
    min-width: 2rem;
    padding: .35rem .5rem;
    text-align: center;
}

.plcdp-index__alphabet span {
    opacity: .35;
}

.plcdp-index__group {
    scroll-margin-top: 2rem;
    margin-bottom: 2rem;
}

.plcdp-index__group h3 {
    margin-bottom: .6rem;
    border-bottom: 1px solid currentColor;
    padding-bottom: .25rem;
}

.plcdp-index__group ul {
    columns: 2;
    column-gap: 2.5rem;
    margin: 0;
    padding-left: 1.2rem;
}

.plcdp-index__group li {
    break-inside: avoid;
    margin: 0 0 .5rem;
}

.plcdp-index__recipe-cuisine {
    display: block;
    opacity: .7;
    font-size: .85em;
}

.plcdp-index__no-results {
    margin-top: 1rem;
    font-weight: 600;
}

@media (max-width: 680px) {
    .plcdp-index__group ul {
        columns: 1;
    }
}