/* ==========================================================================
   Rezepte – Inhaltselemente „Rezept" und „Rezeptübersicht"
   Weingut Schürmer · ONE TABLE

   Eingebunden über Configuration/Sets/SitePackage/TypoScript/recipes.typoscript.
   Achtung: Diese Datei steht im HTML VOR theme.min.css und user.css von
   dd_sparrow. Alle Regeln hängen deshalb an .ws-* Klassen (Spezifität 0,1,0
   und höher) und schlagen so die Element-Regeln des Themes. Überschriften
   h1–h6 bekommen aus user.css global Gewicht 100 und Versalien (!important) –
   das ist gewollt und hier nicht überschrieben.
   ========================================================================== */

.ws-recipe,
.ws-recipes,
.ws-booklet {
    --ws-ink: #111;
    --ws-text: #3a3a3a;
    --ws-muted: #767676;
    --ws-line: #e4e2dc;
    --ws-paper: #f6f5f1;
    --ws-gold: #c8ba00;
    --ws-gold-dark: #7d7400;
    --ws-font: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ws-gutter: clamp(1.5rem, 5vw, 4.5rem);
    font-family: var(--ws-font);
    color: var(--ws-text);
}

.ws-print-only {
    display: none !important;
}

/* --------------------------------------------------------------------------
   Gemeinsame Bausteine
   -------------------------------------------------------------------------- */

.ws-recipe .ws-kicker,
.ws-recipes .ws-kicker,
.ws-booklet .ws-kicker {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 .9em;
    margin: 0 0 1.1rem;
    font-size: .72rem;
    font-weight: 400;
    letter-spacing: .22em;
    line-height: 1.6;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-recipe .ws-kicker__sep {
    display: inline-block;
    width: 1.75rem;
    height: 1px;
    background: var(--ws-gold);
}

.ws-recipe .ws-kicker--gold,
.ws-recipes .ws-kicker--gold {
    color: var(--ws-gold-dark);
}

.ws-recipe .ws-btn,
.ws-recipes .ws-btn,
.ws-booklet .ws-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3rem;
    padding: .85rem 1.9rem;
    border: 1px solid var(--ws-ink);
    border-radius: 0;
    background: var(--ws-ink);
    color: #fff;
    font-family: var(--ws-font);
    font-size: .72rem;
    font-weight: 400;
    letter-spacing: .2em;
    line-height: 1.2;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

.ws-recipe .ws-btn:hover,
.ws-recipe .ws-btn:focus-visible,
.ws-recipes .ws-btn:hover,
.ws-recipes .ws-btn:focus-visible,
.ws-booklet .ws-btn:hover,
.ws-booklet .ws-btn:focus-visible {
    background: var(--ws-gold);
    border-color: var(--ws-gold);
    color: var(--ws-ink);
}

.ws-recipe .ws-btn--ghost,
.ws-booklet .ws-btn--ghost {
    background: transparent;
    color: var(--ws-ink);
}

.ws-recipe .ws-btn:focus-visible,
.ws-recipes .ws-btn:focus-visible,
.ws-booklet .ws-btn:focus-visible,
.ws-recipes .ws-filter__btn:focus-visible,
.ws-recipes .ws-card__link:focus-visible {
    outline: 2px solid var(--ws-gold);
    outline-offset: 3px;
}

.ws-recipe .ws-link {
    position: relative;
    display: inline-block;
    padding-bottom: .3rem;
    color: inherit;
    font-size: .72rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 1px solid var(--ws-gold);
    transition: color .2s ease;
}

.ws-recipe .ws-link:hover,
.ws-recipe .ws-link:focus-visible {
    color: var(--ws-gold);
}

/* Typografischer Platzhalter, wenn kein Bild gepflegt ist */
.ws-recipe .ws-placeholder,
.ws-recipes .ws-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    padding: 2rem;
    background: #111;
    color: #fff;
    text-align: center;
}

.ws-recipe .ws-placeholder::after,
.ws-recipes .ws-placeholder::after {
    content: "";
    position: absolute;
    inset: .9rem;
    border: 1px solid rgba(255, 255, 255, .12);
    pointer-events: none;
}

.ws-recipe .ws-placeholder__mark,
.ws-recipes .ws-placeholder__mark {
    width: 5.5rem;
    height: auto;
    opacity: .9;
    /* Der Bodenstrich der Zeichnung endet hart am Bildrand – an beiden Seiten auslaufen lassen */
    -webkit-mask-image: linear-gradient(to right, transparent, #000 18%, #000 82%, transparent);
    mask-image: linear-gradient(to right, transparent, #000 18%, #000 82%, transparent);
}

.ws-recipe .ws-placeholder__rule,
.ws-recipes .ws-placeholder__rule {
    display: block;
    width: 2.5rem;
    height: 1px;
    background: var(--ws-gold);
}

.ws-recipe .ws-placeholder__text,
.ws-recipes .ws-placeholder__text {
    max-width: 22ch;
    font-size: clamp(1.1rem, 1.8vw, 1.45rem);
    font-weight: 100;
    letter-spacing: .14em;
    line-height: 1.45;
    text-transform: uppercase;
}

.ws-recipe .ws-placeholder__wine {
    font-size: .7rem;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--ws-gold);
}

/* --------------------------------------------------------------------------
   Rezept
   -------------------------------------------------------------------------- */

.ws-recipe {
    max-width: 76rem;
    margin: 0 auto;
    padding: clamp(4.5rem, 9vw, 7.5rem) var(--ws-gutter) clamp(4rem, 8vw, 7rem);
    line-height: 1.7;
}

.ws-recipe .ws-recipe__header {
    max-width: 50rem;
    margin: 0 auto clamp(2.5rem, 5vw, 4rem);
    text-align: center;
}

.ws-recipe .ws-recipe__header .ws-kicker {
    justify-content: center;
}

.ws-recipe .ws-recipe__title {
    margin: 0;
    color: var(--ws-ink);
    font-size: clamp(2rem, 4.6vw, 3.6rem);
    letter-spacing: .06em;
    line-height: 1.12;
    hyphens: manual;
    overflow-wrap: break-word;
}

.ws-recipe .ws-recipe__subtitle {
    margin: 1.1rem 0 0;
    font-size: clamp(1.05rem, 1.6vw, 1.3rem);
    font-weight: 300;
    font-style: italic;
    color: var(--ws-text);
}

.ws-recipe .ws-recipe__chef {
    margin: 1.6rem 0 0;
    font-size: .72rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-recipe .ws-recipe__chef span {
    margin-left: .6em;
    color: var(--ws-ink);
}

.ws-recipe .ws-recipe__hero {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: clamp(2rem, 5vw, 4.5rem);
    align-items: center;
    margin-bottom: clamp(3.5rem, 7vw, 6rem);
}

.ws-recipe .ws-recipe__media {
    position: relative;
    margin: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--ws-paper);
}

.ws-recipe .ws-recipe__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ws-recipe .ws-recipe__intro {
    margin: 0 0 2.25rem;
    font-size: clamp(1.05rem, 1.35vw, 1.2rem);
    font-weight: 300;
    line-height: 1.75;
    color: var(--ws-ink);
}

.ws-recipe .ws-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    border-top: 1px solid var(--ws-line);
}

.ws-recipe .ws-facts__item {
    padding: 1.1rem 0;
    border-bottom: 1px solid var(--ws-line);
}

.ws-recipe .ws-facts__item:nth-child(odd) {
    padding-right: 1.25rem;
}

.ws-recipe .ws-facts__item:nth-child(even) {
    padding-left: 1.25rem;
    border-left: 1px solid var(--ws-line);
}

.ws-recipe .ws-facts dt {
    margin: 0 0 .3rem;
    font-size: .66rem;
    font-weight: 400;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-recipe .ws-facts dd {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 300;
    color: var(--ws-ink);
}

/* Zutaten und Zubereitung */
.ws-recipe .ws-recipe__body {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2.5rem, 6vw, 6rem);
    align-items: start;
}

/* Das Theme gibt jedem <section> Innenabstand – hier nicht gewollt */
.ws-recipe .ws-recipe__ingredients,
.ws-recipe .ws-recipe__steps {
    padding-top: 0;
    padding-bottom: 0;
}

.ws-recipe .ws-section-title {
    margin: 0 0 1.75rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--ws-ink);
    color: var(--ws-ink);
    font-size: 1.35rem;
    letter-spacing: .16em;
    line-height: 1.3;
}

.ws-recipe .ws-recipe__ingredients {
    position: sticky;
    top: 2rem;
}

.ws-recipe .ws-recipe__yield {
    margin: -.75rem 0 1.25rem;
    font-size: .8rem;
    font-style: italic;
    color: var(--ws-muted);
}

.ws-recipe .ws-ingredients {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ws-recipe .ws-ingredients__group {
    margin: 1.9rem 0 .4rem;
    font-size: .68rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ws-gold-dark);
}

.ws-recipe .ws-ingredients__group:first-child {
    margin-top: 0;
}

.ws-recipe .ws-ingredients__item {
    display: grid;
    grid-template-columns: 5.25rem minmax(0, 1fr);
    gap: 1rem;
    padding: .6rem 0;
    border-bottom: 1px solid var(--ws-line);
    font-size: .95rem;
    line-height: 1.5;
}

.ws-recipe .ws-ingredients__qty {
    color: var(--ws-ink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.ws-recipe .ws-ingredients__name {
    color: var(--ws-text);
}

.ws-recipe .ws-ingredients__note {
    color: var(--ws-muted);
}

.ws-recipe .ws-steps {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ws-recipe .ws-steps__item {
    display: grid;
    grid-template-columns: 3.75rem minmax(0, 1fr);
    gap: 1.25rem;
    padding: 0 0 2.1rem;
}

.ws-recipe .ws-steps__item + .ws-steps__item {
    padding-top: 2.1rem;
    border-top: 1px solid var(--ws-line);
}

.ws-recipe .ws-steps__no {
    font-size: 2.4rem;
    font-weight: 100;
    line-height: 1;
    color: var(--ws-gold);
    font-variant-numeric: lining-nums tabular-nums;
}

.ws-recipe .ws-steps__title {
    margin: .15rem 0 .5rem;
    font-size: .74rem;
    font-weight: 400;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--ws-ink);
}

.ws-recipe .ws-steps__text {
    margin: 0;
    font-size: 1rem;
    line-height: 1.8;
    max-width: 62ch;
}

/* Formatierter Text aus dem Shop-Editor */
.ws-recipe .ws-steps__text p,
.ws-recipe .ws-steps__text ul,
.ws-recipe .ws-steps__text ol {
    margin: 0 0 .6em;
}

.ws-recipe .ws-steps__text > :last-child {
    margin-bottom: 0;
}

.ws-recipe .ws-steps__text ul,
.ws-recipe .ws-steps__text ol {
    padding-left: 1.25em;
}

.ws-recipe .ws-steps__text a {
    color: inherit;
    text-decoration: underline;
}

/* Weinempfehlung – schwarzer Block wie Navigation und Fuß der Seite */
.ws-recipe .ws-recipe__wine {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
    align-items: center;
    text-align: center;
    margin: clamp(3.5rem, 7vw, 6rem) 0 0;
    padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.75rem, 6vw, 5.5rem);
    background: #111;
    color: rgba(255, 255, 255, .78);
}

.ws-recipe .ws-recipe__wine .ws-kicker {
    justify-content: center;
    color: var(--ws-gold);
}

.ws-recipe .ws-recipe__wine .ws-kicker::before,
.ws-recipe .ws-recipe__wine .ws-kicker::after {
    content: "";
    width: 1.75rem;
    height: 1px;
    background: currentColor;
}

.ws-recipe .ws-wine__name {
    margin: 0 0 1.25rem;
    color: #fff;
    font-size: clamp(1.9rem, 4vw, 3.1rem);
    font-weight: 100;
    letter-spacing: .08em;
    line-height: 1.12;
    text-transform: uppercase;
}

.ws-recipe .ws-wine__text {
    max-width: 56ch;
    margin: 0 auto 1.9rem;
    font-size: 1.05rem;
    font-weight: 300;
    line-height: 1.75;
}

.ws-recipe .ws-wine__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 1rem 2rem;
    margin: 0;
}

.ws-recipe .ws-recipe__wine .ws-link {
    color: #fff;
}

.ws-recipe .ws-recipe__wine .ws-link:hover,
.ws-recipe .ws-recipe__wine .ws-link:focus-visible {
    color: var(--ws-gold);
}

.ws-recipe .ws-wine__sku {
    font-size: .7rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .55);
}

.ws-recipe .ws-wine__qr {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
}

.ws-recipe .ws-qr {
    display: block;
    width: 28mm;
    height: 28mm;
}

.ws-recipe .ws-wine__qr-caption {
    font-size: 7pt;
    letter-spacing: .2em;
    text-transform: uppercase;
}

/* Mehrere Empfehlungen: ein durchgehender Block, getrennt durch eine feine Linie */
.ws-recipe .ws-recipe__wine + .ws-recipe__wine {
    margin-top: 0;
    border-top: 1px solid rgba(200, 186, 0, .3);
}

/* Tipp des Winzers */
.ws-recipe .ws-recipe__tip {
    max-width: 46rem;
    margin: clamp(3.5rem, 7vw, 6rem) auto 0;
    text-align: center;
}

.ws-recipe .ws-recipe__tip .ws-kicker {
    justify-content: center;
}

.ws-recipe .ws-recipe__tip .ws-kicker::before,
.ws-recipe .ws-recipe__tip .ws-kicker::after {
    content: "";
    width: 1.75rem;
    height: 1px;
    background: var(--ws-gold);
}

.ws-recipe .ws-tip__text {
    margin: 0;
    padding: 0;
    border: 0;
}

.ws-recipe .ws-tip__text p {
    margin: 0;
    font-size: clamp(1.15rem, 2vw, 1.5rem);
    font-weight: 300;
    font-style: italic;
    line-height: 1.65;
    color: var(--ws-ink);
}

.ws-recipe .ws-tip__author {
    margin-top: 1.25rem;
    font-size: .72rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-recipe .ws-recipe__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
    margin-top: clamp(3.5rem, 7vw, 5.5rem);
    padding-top: clamp(2.5rem, 5vw, 3.5rem);
    border-top: 1px solid var(--ws-line);
}

@media (max-width: 991.98px) {
    .ws-recipe .ws-recipe__hero,
    .ws-recipe .ws-recipe__body {
        grid-template-columns: minmax(0, 1fr);
    }

    .ws-recipe .ws-recipe__ingredients {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .ws-recipe {
        padding-top: 6.5rem;
    }

    .ws-recipe .ws-recipe__title {
        font-size: 1.75rem;
        letter-spacing: .04em;
    }

    .ws-recipe .ws-recipe__header .ws-kicker {
        flex-direction: column;
        gap: .35rem;
    }

    .ws-recipe .ws-recipe__header .ws-kicker__sep {
        width: 1.25rem;
    }

    .ws-recipe .ws-recipe__media {
        margin: 0 calc(var(--ws-gutter) * -1);
        aspect-ratio: 5 / 4;
    }

    .ws-recipe .ws-steps__item {
        grid-template-columns: 2.75rem minmax(0, 1fr);
        gap: .9rem;
    }

    .ws-recipe .ws-steps__no {
        font-size: 1.8rem;
    }

    .ws-recipe .ws-recipe__wine {
        grid-template-columns: minmax(0, 1fr);
        margin-left: calc(var(--ws-gutter) * -1);
        margin-right: calc(var(--ws-gutter) * -1);
    }

    .ws-recipe .ws-recipe__actions .ws-btn {
        width: 100%;
    }
}

/* --------------------------------------------------------------------------
   Rezeptübersicht
   -------------------------------------------------------------------------- */

.ws-recipes {
    max-width: 82rem;
    margin: 0 auto;
    padding: clamp(4.5rem, 9vw, 7.5rem) var(--ws-gutter) clamp(4rem, 8vw, 7rem);
}

.ws-recipes .ws-recipes__header {
    max-width: 46rem;
    margin: 0 auto clamp(3rem, 6vw, 4.5rem);
    text-align: center;
}

.ws-recipes .ws-recipes__header .ws-kicker {
    justify-content: center;
}

.ws-recipes .ws-recipes__header .ws-kicker::before,
.ws-recipes .ws-recipes__header .ws-kicker::after {
    content: "";
    width: 1.75rem;
    height: 1px;
    background: var(--ws-gold);
}

.ws-recipes .ws-recipes__title {
    margin: 0;
    color: var(--ws-ink);
    font-size: clamp(2.2rem, 5vw, 3.8rem);
    letter-spacing: .08em;
    line-height: 1.1;
}

.ws-recipes .ws-recipes__intro {
    margin: 1.75rem 0 0;
    font-size: clamp(1rem, 1.3vw, 1.15rem);
    font-weight: 300;
    line-height: 1.8;
}

.ws-recipes .ws-recipes__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem 2rem;
    margin: 0 0 clamp(2.5rem, 5vw, 3.5rem);
    padding: 0 0 1.25rem;
    border-bottom: 1px solid var(--ws-line);
}

.ws-recipes .ws-recipes__bar > .ws-btn:only-child {
    margin-left: auto;
}

.ws-recipes .ws-filter {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 2.25rem;
}

.ws-recipes .ws-filter[hidden] {
    display: none;
}

.ws-recipes .ws-filter__btn {
    position: relative;
    padding: .6rem 0;
    border: 0;
    background: none;
    color: var(--ws-muted);
    font-family: var(--ws-font);
    font-size: .74rem;
    font-weight: 400;
    letter-spacing: .2em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s ease;
}

.ws-recipes .ws-filter__btn::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: -1.3rem;
    height: 2px;
    background: var(--ws-gold);
    transition: right .3s ease;
}

.ws-recipes .ws-filter__btn:hover {
    color: var(--ws-ink);
}

.ws-recipes .ws-filter__btn[aria-pressed="true"] {
    color: var(--ws-ink);
}

.ws-recipes .ws-filter__btn[aria-pressed="true"]::after {
    right: 0;
}

.ws-recipes .ws-recipes__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(2.75rem, 5vw, 4rem) clamp(1.5rem, 3vw, 2.5rem);
    margin: 0;
    padding: 0;
    list-style: none;
}

.ws-recipes .ws-card[hidden] {
    display: none;
}

.ws-recipes .ws-card__link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.ws-recipes .ws-card__media {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--ws-paper);
}

.ws-recipes .ws-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .8s ease;
}

.ws-recipes .ws-placeholder--card {
    gap: .9rem;
    transition: background-color .4s ease;
}

.ws-recipes .ws-placeholder--card .ws-placeholder__mark {
    width: 3.5rem;
}

.ws-recipes .ws-placeholder--card .ws-placeholder__text {
    font-size: .78rem;
    letter-spacing: .26em;
}

.ws-recipes .ws-card__link:hover .ws-card__image {
    transform: scale(1.03);
}

.ws-recipes .ws-card__link:hover .ws-placeholder--card {
    background: #1d1d1d;
}

.ws-recipes .ws-card__body {
    padding-top: 1.6rem;
}

.ws-recipes .ws-card__body .ws-kicker {
    margin-bottom: .7rem;
    font-size: .66rem;
}

.ws-recipes .ws-card__title {
    display: inline;
    margin: 0;
    color: var(--ws-ink);
    font-size: clamp(1.25rem, 1.7vw, 1.5rem);
    letter-spacing: .07em;
    line-height: 1.3;
    background-image: linear-gradient(var(--ws-gold), var(--ws-gold));
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 1px;
    transition: background-size .35s ease;
}

.ws-recipes .ws-card__link:hover .ws-card__title,
.ws-recipes .ws-card__link:focus-visible .ws-card__title {
    background-size: 100% 1px;
}

.ws-recipes .ws-card__sub {
    margin: .7rem 0 0;
    font-size: .98rem;
    font-weight: 300;
    font-style: italic;
    line-height: 1.6;
    color: var(--ws-text);
}

.ws-recipes .ws-card__intro {
    display: none;
    margin: 1rem 0 0;
    font-size: .95rem;
    font-weight: 300;
    line-height: 1.75;
}

.ws-recipes .ws-card.is-last-of-3 .ws-card__intro {
    display: block;
}

.ws-recipes .ws-card__wine {
    display: flex;
    align-items: baseline;
    gap: .75rem;
    margin: 1.25rem 0 0;
    padding-top: 1rem;
    border-top: 1px solid var(--ws-line);
    font-size: .74rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ws-ink);
}

.ws-recipes .ws-card__wine-label {
    color: var(--ws-gold-dark);
}

/* Letzte Karte allein in ihrer Reihe: über die volle Breite, Bild links */
@media (min-width: 992px) {
    .ws-recipes .ws-card.is-last-of-3 {
        grid-column: 1 / -1;
    }

    .ws-recipes .ws-card.is-last-of-3 .ws-card__link {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
        gap: clamp(1.5rem, 3vw, 2.5rem);
        align-items: center;
    }

    .ws-recipes .ws-card.is-last-of-3 .ws-card__body {
        padding-top: 0;
        max-width: 34rem;
    }
}

@media (min-width: 576px) and (max-width: 991.98px) {
    .ws-recipes .ws-card.is-last-of-2 {
        grid-column: 1 / -1;
    }

    .ws-recipes .ws-card.is-last-of-2 .ws-card__link {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 1.5rem;
        align-items: center;
    }

    .ws-recipes .ws-card.is-last-of-2 .ws-card__body {
        padding-top: 0;
    }
}

.ws-recipes .ws-recipes__empty {
    margin: 2rem 0 0;
    text-align: center;
    font-style: italic;
    color: var(--ws-muted);
}

@media (max-width: 991.98px) {
    .ws-recipes .ws-recipes__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .ws-recipes {
        padding-top: 6.5rem;
    }

    .ws-recipes .ws-recipes__bar {
        flex-direction: column;
        align-items: stretch;
    }

    .ws-recipes .ws-filter {
        flex-wrap: nowrap;
        gap: 1.6rem;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .ws-recipes .ws-filter__btn {
        white-space: nowrap;
    }

    .ws-recipes .ws-filter__btn::after {
        bottom: 0;
    }

    .ws-recipes .ws-recipes__bar > .ws-btn:only-child {
        margin-left: 0;
    }

    .ws-recipes .ws-recipes__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* --------------------------------------------------------------------------
   Rezeptheft – Bildschirmvorschau
   -------------------------------------------------------------------------- */

.ws-booklet {
    padding: clamp(4.5rem, 8vw, 6.5rem) var(--ws-gutter) clamp(4rem, 8vw, 6rem);
    background: var(--ws-paper);
}

.ws-booklet .ws-booklet__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem 2rem;
    max-width: 210mm;
    margin: 0 auto 2.5rem;
}

.ws-booklet .ws-booklet__hint {
    margin: 0;
    font-size: .8rem;
    font-style: italic;
    color: var(--ws-muted);
}

.ws-booklet .ws-booklet__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

.ws-booklet .ws-sheet {
    max-width: 210mm;
    margin: 0 auto 2.5rem;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 12px 40px rgba(0, 0, 0, .06);
}

.ws-booklet .ws-booklet__cover {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: min(297mm, 140vw);
    padding: 3rem 2rem;
    text-align: center;
}

.ws-booklet .ws-booklet__mark {
    width: 7.5rem;
    height: auto;
    margin-bottom: 3rem;
    filter: invert(1);
}

.ws-booklet .ws-booklet__eyebrow {
    margin: 0 0 1.5rem;
    font-size: .7rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-booklet .ws-booklet__title {
    margin: 0;
    color: var(--ws-ink);
    font-size: clamp(3rem, 9vw, 5.5rem);
    letter-spacing: .14em;
    line-height: 1;
}

.ws-booklet .ws-booklet__rule {
    display: block;
    width: 3.5rem;
    height: 1px;
    margin: 2.25rem auto;
    background: var(--ws-gold);
}

.ws-booklet .ws-booklet__subtitle {
    margin: 0;
    font-size: clamp(1rem, 2vw, 1.25rem);
    font-weight: 300;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--ws-ink);
}

.ws-booklet .ws-booklet__intro {
    max-width: 30rem;
    margin: 2.5rem auto 0;
    font-size: 1rem;
    font-weight: 300;
    font-style: italic;
    line-height: 1.8;
}

.ws-booklet .ws-booklet__address {
    margin: 4rem 0 0;
    font-size: .7rem;
    letter-spacing: .14em;
    line-height: 2;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-booklet .ws-booklet__toc {
    padding: clamp(2.5rem, 7vw, 5rem) clamp(1.5rem, 7vw, 5rem);
}

.ws-booklet .ws-booklet__toc-title {
    margin: 0 0 2.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--ws-ink);
    color: var(--ws-ink);
    font-size: 1.6rem;
    letter-spacing: .18em;
}

.ws-booklet .ws-toc {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: ws-toc;
}

.ws-booklet .ws-toc__item {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    grid-template-areas: "no course wine" "no title wine";
    gap: .2rem 1.25rem;
    align-items: baseline;
    padding: 1.1rem 0;
    border-bottom: 1px solid var(--ws-line);
    counter-increment: ws-toc;
}

.ws-booklet .ws-toc__item::before {
    content: counter(ws-toc, decimal-leading-zero);
    grid-area: no;
    font-size: 1.4rem;
    font-weight: 100;
    color: var(--ws-gold);
}

.ws-booklet .ws-toc__course {
    grid-area: course;
    font-size: .64rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-booklet .ws-toc__title {
    grid-area: title;
    font-size: 1.1rem;
    font-weight: 300;
    color: var(--ws-ink);
}

.ws-booklet .ws-toc__wine {
    grid-area: wine;
    font-size: .68rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ws-gold-dark);
    text-align: right;
}

.ws-booklet .ws-booklet__item .ws-recipe {
    padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.5rem, 6vw, 4rem);
}

.ws-booklet .ws-booklet__item .ws-recipe__hero {
    grid-template-columns: minmax(0, 1fr);
}

.ws-booklet .ws-booklet__item .ws-recipe__media--placeholder {
    display: none;
}

.ws-booklet .ws-booklet__item .ws-recipe__body {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 2.5rem;
}

.ws-booklet .ws-booklet__item .ws-recipe__ingredients {
    position: static;
}

.ws-booklet .ws-booklet__item .ws-recipe__wine {
    margin-left: 0;
    margin-right: 0;
}

@media (max-width: 575.98px) {
    .ws-booklet {
        padding-top: 6.5rem;
    }
}

@media (max-width: 767.98px) {
    .ws-booklet .ws-booklet__item .ws-recipe__body {
        grid-template-columns: minmax(0, 1fr);
    }

    .ws-booklet .ws-toc__item {
        grid-template-columns: 2.5rem minmax(0, 1fr);
        grid-template-areas: "no course" "no title" "no wine";
    }

    .ws-booklet .ws-toc__wine {
        text-align: left;
    }
}

/* ==========================================================================
   DRUCK – Rezeptkarte (Rezeptseite) und Rezeptheft
   ========================================================================== */

/* --------------------------------------------------------------------------
   Rezept aus dem Shop: „Gibt es bei" im Kopf
   -------------------------------------------------------------------------- */

.ws-recipe .ws-recipe__served {
    margin: 1rem 0 0;
    font-size: .9rem;
    color: var(--ws-text);
}

.ws-recipe .ws-recipe__served-label {
    margin-right: .6em;
    font-size: .68rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ws-gold-dark);
}

.ws-recipe .ws-recipe__served a {
    color: var(--ws-ink);
    text-decoration: underline;
    text-decoration-color: var(--ws-gold);
    text-underline-offset: .2em;
}

.ws-recipe .ws-recipe__served-date {
    color: var(--ws-muted);
}

/* --------------------------------------------------------------------------
   Verknüpfte Weine und Termine (Partials/Shop/Related.html) – unter Rezepten
   und Beiträgen. Eigene Variablen, weil der Block auch außerhalb von
   .ws-recipe steht (Plugin „Aktuelles").
   -------------------------------------------------------------------------- */

.ws-related {
    --ws-ink: #111;
    --ws-text: #3a3a3a;
    --ws-muted: #767676;
    --ws-line: #e4e2dc;
    --ws-paper: #f6f5f1;
    --ws-gold: #c8ba00;
    display: grid;
    gap: 2.5rem;
    max-width: 62rem;
    margin: 3.5rem auto 0;
    padding-top: 2.5rem;
    border-top: 1px solid var(--ws-line);
    font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.ws-related .ws-related__title {
    margin: 0 0 1.25rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .26em;
    color: var(--ws-ink);
}

.ws-related .ws-related__title::after {
    content: "";
    display: block;
    width: 2.5rem;
    height: 1px;
    margin-top: .8rem;
    background: var(--ws-gold);
}

.ws-related .ws-related__wines,
.ws-related .ws-related__events {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
    gap: 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ws-related .ws-related-wine__link,
.ws-related .ws-related-event__link {
    display: flex;
    gap: 1rem;
    align-items: center;
    height: 100%;
    padding: .9rem 1rem;
    background: var(--ws-paper);
    border: 1px solid transparent;
    color: var(--ws-text);
    text-decoration: none;
    transition: border-color .2s ease, transform .2s ease;
}

.ws-related a.ws-related-wine__link:hover,
.ws-related a.ws-related-event__link:hover,
.ws-related a:focus-visible {
    border-color: var(--ws-gold);
    transform: translateY(-2px);
}

.ws-related .ws-related-wine__media {
    flex: 0 0 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 6rem;
}

.ws-related .ws-related-wine__media img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.ws-related .ws-related-wine__placeholder {
    font-size: .6rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--ws-muted);
    writing-mode: vertical-rl;
}

.ws-related .ws-related-wine__body,
.ws-related .ws-related-event__body {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    min-width: 0;
}

.ws-related .ws-related-wine__line,
.ws-related .ws-related-event__date {
    font-size: .66rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--ws-muted);
}

.ws-related .ws-related-wine__title,
.ws-related .ws-related-event__title {
    font-size: 1.05rem;
    font-weight: 300;
    line-height: 1.3;
    color: var(--ws-ink);
    text-transform: uppercase;
}

.ws-related .ws-related-wine__facts,
.ws-related .ws-related-event__meta {
    font-size: .8rem;
    color: var(--ws-muted);
}

.ws-related .ws-related-wine__price {
    margin-top: .2rem;
    font-weight: 700;
    color: var(--ws-ink);
}

.ws-related .ws-related-wine__note {
    margin-top: .45rem;
    font-size: .88rem;
    font-style: italic;
    line-height: 1.5;
    color: var(--ws-text);
}

.ws-related .ws-related-event__media {
    flex: 0 0 4.5rem;
    height: 4.5rem;
}

.ws-related .ws-related-event__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ws-related .is-soldout .ws-related-event__body {
    opacity: .6;
}

@media (prefers-reduced-motion: reduce) {
    .ws-related .ws-related-wine__link,
    .ws-related .ws-related-event__link {
        transition: none;
    }
}

@media print {
    /* Seitenzahl und Fußzeile in den Seitenrändern (Chromium/Edge ab 131).
       Browser ohne Randboxen zeigen die Adresse trotzdem: sie steht im
       Briefkopf jeder Rezeptkarte. */
    @page {
        size: A4 portrait;
        margin: 12mm 15mm 13mm;

        @bottom-right {
            content: counter(page) " / " counter(pages);
            font-family: Lato, "Helvetica Neue", Arial, sans-serif;
            font-size: 6.5pt;
            letter-spacing: .12em;
            color: #888;
        }
    }

    @page ws-booklet {
        @bottom-left {
            content: "ONE TABLE  ·  Weingut Schürmer  ·  Kleibäckerstraße 2c  ·  91472 Ipsheim  ·  schuermer.com";
            font-family: Lato, "Helvetica Neue", Arial, sans-serif;
            font-size: 6.5pt;
            letter-spacing: .12em;
            text-transform: uppercase;
            color: #888;
        }

        @bottom-right {
            content: counter(page);
            font-family: Lato, "Helvetica Neue", Arial, sans-serif;
            font-size: 6.5pt;
            color: #888;
        }
    }

    /* Nur auf Rezeptseiten und der Heft-Seite: alles außer dem Inhalt weg */
    body:has(.ws-recipe--page, .ws-booklet) {
        display: block !important;
        background: #fff !important;
    }

    body:has(.ws-recipe--page, .ws-booklet) > :not(main) {
        display: none !important;
    }

    body:has(.ws-recipe--page, .ws-booklet) .main {
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .ws-recipe,
    .ws-booklet {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        color: #222;
        font-size: 9.5pt;
        line-height: 1.5;
    }

    .ws-screen-only {
        display: none !important;
    }

    .ws-recipe .ws-print-only,
    .ws-booklet .ws-print-only {
        display: revert !important;
    }

    /* ---- Rezeptkarte ---- */

    /* Die Karte zweispaltig: Zutaten links als Float, rechts Zubereitung,
       Weinempfehlung und Tipp untereinander. Floats brechen im Druck
       sauber über Seiten um (ein Grid mit überspannender Zutatenspalte
       reißt Lücken). So passt ein übliches Rezept auf eine A4-Seite. */
    .ws-recipe {
        display: block;
        max-width: none;
        padding: 0;
    }

    .ws-recipe .ws-recipe__body {
        display: block;
    }

    .ws-recipe .ws-recipe__ingredients {
        float: left;
        width: 58mm;
    }

    .ws-recipe .ws-recipe__steps,
    .ws-recipe .ws-recipe__wine,
    .ws-recipe .ws-recipe__tip {
        margin-left: 67mm !important;
    }

    .ws-recipe::after {
        content: "";
        display: block;
        clear: both;
    }

    .ws-recipe .ws-recipe__brand {
        display: flex !important;
        align-items: flex-end;
        justify-content: space-between;
        margin: 0 0 5mm;
        padding-bottom: 2mm;
        border-bottom: .3mm solid #111;
    }

    .ws-recipe .ws-recipe__brand-logo {
        width: 46mm;
        height: auto;
    }

    .ws-recipe .ws-recipe__brand-address {
        font-size: 6.5pt;
        letter-spacing: .16em;
        line-height: 1.7;
        text-align: right;
        text-transform: uppercase;
        color: #555;
    }

    .ws-recipe .ws-recipe__header {
        max-width: none;
        margin: 0 0 4mm;
        text-align: left;
    }

    .ws-recipe .ws-recipe__header .ws-kicker {
        justify-content: flex-start;
    }

    .ws-recipe .ws-kicker {
        margin-bottom: 2.5mm;
        font-size: 7pt;
    }

    .ws-recipe .ws-recipe__title {
        font-size: 21pt;
        letter-spacing: .05em;
    }

    .ws-recipe .ws-recipe__subtitle {
        margin-top: 1.5mm;
        font-size: 11pt;
    }

    .ws-recipe .ws-recipe__chef {
        margin-top: 2mm;
        font-size: 7pt;
    }

    .ws-recipe .ws-recipe__hero {
        display: block;
        margin: 0 0 5mm;
    }

    .ws-recipe .ws-recipe__media {
        width: 100%;
        max-height: 70mm;
        margin: 0 0 5mm;
    }

    .ws-recipe .ws-recipe__media--placeholder {
        display: none;
    }

    .ws-recipe .ws-recipe__intro {
        margin: 0 0 3mm;
        font-size: 10pt;
        line-height: 1.5;
    }

    .ws-recipe .ws-facts {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ws-recipe .ws-facts__item,
    .ws-recipe .ws-facts__item:nth-child(odd),
    .ws-recipe .ws-facts__item:nth-child(even) {
        padding: 1.6mm 3mm 1.6mm 0;
        border-left: 0;
    }

    .ws-recipe .ws-facts__item + .ws-facts__item {
        padding-left: 3mm;
        border-left: .2mm solid #ddd;
    }

    .ws-recipe .ws-facts dt {
        font-size: 6.5pt;
    }

    .ws-recipe .ws-facts dd {
        font-size: 10.5pt;
    }

    .ws-recipe .ws-recipe__ingredients {
        position: static;
    }

    .ws-recipe .ws-section-title {
        margin-bottom: 3mm;
        padding-bottom: 1.8mm;
        border-bottom-width: .3mm;
        font-size: 10.5pt;
    }

    .ws-recipe .ws-recipe__yield {
        margin: -2mm 0 3mm;
        font-size: 8pt;
    }

    .ws-recipe .ws-ingredients__group {
        margin: 4mm 0 1mm;
        font-size: 6.5pt;
        break-after: avoid;
    }

    .ws-recipe .ws-ingredients__item {
        grid-template-columns: 15mm minmax(0, 1fr);
        gap: 2.5mm;
        padding: .7mm 0;
        font-size: 8.5pt;
        line-height: 1.35;
        border-bottom-color: #e6e6e6;
        break-inside: avoid;
    }

    .ws-recipe .ws-steps__item,
    .ws-recipe .ws-steps__item + .ws-steps__item {
        grid-template-columns: 9mm minmax(0, 1fr);
        gap: 3mm;
        padding: 0 0 2.4mm;
        border-top: 0;
        break-inside: avoid;
    }

    .ws-recipe .ws-steps__no {
        font-size: 16pt;
    }

    .ws-recipe .ws-steps__title {
        margin: 0 0 1mm;
        font-size: 7pt;
    }

    .ws-recipe .ws-steps__text {
        font-size: 9pt;
        line-height: 1.45;
    }

    .ws-recipe .ws-recipe__wine {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 6mm;
        margin: 3mm 0 0;
        padding: 3.5mm 0;
        background: none;
        color: #222;
        border-top: .6mm solid var(--ws-gold);
        border-bottom: .2mm solid #ddd;
        break-inside: avoid;
    }

    .ws-recipe .ws-recipe__wine {
        text-align: left;
    }

    .ws-recipe .ws-recipe__wine .ws-kicker,
    .ws-recipe .ws-wine__meta {
        justify-content: flex-start;
        color: var(--ws-gold-dark);
    }

    .ws-recipe .ws-recipe__wine .ws-kicker::before,
    .ws-recipe .ws-recipe__wine .ws-kicker::after {
        display: none;
    }

    .ws-recipe .ws-wine__text {
        margin-left: 0;
    }

    .ws-recipe .ws-wine__name {
        margin-bottom: 2mm;
        color: #111;
        font-size: 16pt;
    }

    .ws-recipe .ws-wine__text {
        margin-bottom: 2.5mm;
        font-size: 9.5pt;
        line-height: 1.5;
    }

    .ws-recipe .ws-wine__url,
    .ws-recipe .ws-wine__sku {
        font-size: 7.5pt;
        letter-spacing: .06em;
        text-transform: none;
        color: #555;
    }

    .ws-recipe .ws-wine__qr {
        display: flex !important;
    }

    .ws-recipe .ws-qr {
        width: 22mm;
        height: 22mm;
    }

    .ws-recipe .ws-wine__qr-caption {
        font-size: 6pt;
        color: #555;
    }

    .ws-recipe .ws-recipe__tip {
        max-width: none;
        margin: 3.5mm 0 0;
        text-align: left;
        break-inside: avoid;
    }

    .ws-recipe .ws-recipe__tip .ws-kicker {
        justify-content: flex-start;
    }

    .ws-recipe .ws-recipe__tip .ws-kicker::before {
        display: none;
    }

    .ws-recipe .ws-tip__text p {
        font-size: 9.5pt;
        line-height: 1.5;
    }

    .ws-recipe .ws-tip__author {
        margin-top: 1.5mm;
        font-size: 7pt;
    }


    /* ---- Rezeptheft ---- */

    /* Deckblatt: erste Seite ohne Seitenzahl. Kein eigener benannter
       @page-Typ – Chromium fügt beim Wechsel davor eine leere Seite ein. */
    @page :first {
        @bottom-right {
            content: none;
        }
    }

    .ws-booklet {
        padding: 0;
        background: none;
    }

    .ws-booklet .ws-sheet {
        max-width: none;
        margin: 0;
        box-shadow: none;
    }

    .ws-booklet .ws-booklet__cover {
        box-sizing: border-box;
        height: 268mm;
        min-height: 0;
        padding: 10mm 12mm;
        break-after: page;
    }

    .ws-booklet .ws-booklet__mark {
        width: 40mm;
        margin-bottom: 14mm;
    }

    .ws-booklet .ws-booklet__eyebrow {
        margin-bottom: 8mm;
        font-size: 8pt;
    }

    .ws-booklet .ws-booklet__title {
        font-size: 54pt;
    }

    .ws-booklet .ws-booklet__rule {
        margin: 10mm auto;
        width: 18mm;
        height: .4mm;
    }

    .ws-booklet .ws-booklet__subtitle {
        font-size: 13pt;
    }

    .ws-booklet .ws-booklet__intro {
        max-width: 110mm;
        margin-top: 12mm;
        font-size: 10.5pt;
    }

    .ws-booklet .ws-booklet__address {
        display: block !important;
        margin-top: 22mm;
        font-size: 7pt;
    }

    .ws-booklet .ws-booklet__toc,
    .ws-booklet .ws-booklet__item {
        page: ws-booklet;
    }

    .ws-booklet .ws-booklet__toc {
        padding: 0;
        break-after: page;
    }

    .ws-booklet .ws-booklet__toc-title {
        margin-bottom: 8mm;
        padding-bottom: 3mm;
        border-bottom-width: .3mm;
        font-size: 16pt;
    }

    .ws-booklet .ws-toc__item {
        padding: 4mm 0;
    }

    .ws-booklet .ws-toc__title {
        font-size: 12pt;
    }

    .ws-booklet .ws-booklet__item {
        break-before: page;
    }

    .ws-booklet .ws-booklet__item .ws-recipe {
        padding: 0;
    }

    .ws-booklet .ws-booklet__item .ws-recipe__body {
        display: block;
    }
}
