* {
    box-sizing: border-box;
}
html,
body {
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    overflow-x: clip;
}

.shepherd-detail__description > :first-child {
    margin-top: 0;
}

.shepherd-detail__description > :last-child {
    margin-bottom: 0;
}

body {
    margin: 0;
    font-family: "trade-gothic-next", sans-serif;
    color: #104024;
    background: #c7e6a3;
    line-height: 1.3;
    overflow-x: clip;
}

.product-detail__description strong,
.product-detail__description b {
    font-weight: 700;
}

.product-detail__summary strong,
.product-detail__summary b {
    font-weight: 700;
}

body.menu-open {
    overflow: hidden;
}

img {
    display: block;
    max-width: 100%;
}

/* ========================================
   CKEditor – Fettschrift
======================================== */

.product-detail__description strong,
.product-detail__description b,
.product-detail__summary strong,
.product-detail__summary b,
.shepherd-detail__description strong,
.shepherd-detail__description b,
.faq-item__answer strong,
.faq-item__answer b,
.sustainability-item__text strong,
.sustainability-item__text b {
    font-weight: 700;
}

/* Welle*/

.page-wave {
    display: block;
    width: 353px;
    max-width: 100%;
    height: 19px;

    margin: 0 auto 21px;

    object-fit: fill;
}

/* Header */

.site-header {
    position: sticky;
    top: 0;
    z-index: 900;

    height: 170px;

    background: #004d2c;

    transition: height 0.25s ease;
}

.site-header.is-scrolled {
    height: 88px;
}

.site-header.is-scrolled .site-title {
    top: 22px;
    left: 84px;
    transform: none;

    font-size: 34px;
    line-height: 42px;
}

.site-header.is-scrolled .menu-button {
    top: 24px;
}

.site-title,
.menu-button {
    transition:
        top 0.25s ease,
        font-size 0.25s ease,
        line-height 0.25s ease;
}

.site-title {
    position: absolute;

    top: 111px;
    left: 84px;

    margin: 0;

    font-size: 40px;
    line-height: 48px;
    font-weight: 700;

    color: #fff;
    text-decoration: none;
}

.site-title:visited,
.site-title:hover,
.site-title:focus,
.site-title:active {
    color: #ffffff;
    text-decoration: none;
}

.menu-button {
    position: absolute;
    top: 116px;
    left: 16px;

    width: 40px;
    height: 40px;

    margin: 0;
    padding: 0;

    appearance: none;
    background: transparent;
    border: 0;
    border-radius: 0;

    cursor: pointer;
}

.menu-button img {
    display: block;

    width: 40px;
    height: 40px;

    object-fit: contain;
}
.site-header__shepherd {
    display: none;
}

.site-header__right,
.site-header__languages {
    display: none;
}

/* Mobile Navigation */

.mobile-navigation {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;

    width: min(100%, 402px);
    height: 100dvh;

    background: #c7e6a3;

    transform: translateX(-100%);
    visibility: hidden;

    transition:
        transform 0.3s ease,
        visibility 0.3s ease;
}

.mobile-navigation.is-open {
    transform: translateX(0);
    visibility: visible;
}

.mobile-navigation__header {
    position: relative;

    width: 100%;
    height: 170px;
    min-height: 170px;

    padding: 0;

    background: #004d2c;
    color: #ffffff;
}

.mobile-navigation__title {
    position: absolute;

    top: 111px;
    left: 84px;

    margin: 0;

    color: #ffffff;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.mobile-navigation__title:visited,
.mobile-navigation__title:hover,
.mobile-navigation__title:focus,
.mobile-navigation__title:active {
    color: #ffffff;
    text-decoration: none;
}

.menu-close {
    position: absolute;

    top: 123px;
    left: 16px;

    width: 40px;
    height: 40px;

    margin: 0;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    appearance: none;

    background: transparent;
    border: 0;
    border-radius: 0;

    cursor: pointer;
}

.menu-close img {
    display: block;

    width: 40px;
    height: 40px;

    object-fit: contain;

    transform: translate(8px, -5px);
}

.mobile-navigation__content {
    position: relative;

    height: calc(100dvh - 170px);
    overflow-y: auto;

    display: flex;
    flex-direction: column;

    padding: 30px 24px 28px;

    background: #c7e6a3;
}

.mobile-navigation__main-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;

    flex: 0 0 auto;
    position: relative;
    z-index: 2;
}

.mobile-navigation__main-links a {
    color: #104024;
    font-size: 40px;
    line-height: 1.5;
    font-weight: 700;
    text-decoration: none;
}

.mobile-navigation__main-links a:hover,
.mobile-navigation__main-links a:focus-visible {
    text-decoration: underline;
}

.mobile-navigation__bottom {
    position: relative;
    flex: 0 0 auto;

    width: calc(100% + 48px);
    aspect-ratio: 402 / 282.1;

    margin-left: -24px;
    margin-right: -24px;
    margin-top: auto;
    margin-bottom: -28px;

    color: #000000;

    background-image: url("/images/content/footer-mobile.svg");
    background-position: center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

@media (max-height: 760px) and (max-width: 899px) {
    .mobile-navigation__bottom {
        margin-top: 40px;
    }
}

.mobile-navigation__meta-row {
    position: absolute;

    top: 44px;
    left: 48px;
    right: 48px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    margin: 0;
    transform: none;
}

.mobile-navigation__legal {
    position: absolute;

    top: 118px;
    left: 0;
    right: 0;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;

    margin: 0;

    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.mobile-navigation__socials {
    display: flex;
    align-items: center;
    gap: 14px;
}

.mobile-navigation__socials a {
    display: block;
}

.mobile-navigation__socials img {
    width: auto;
    height: 34px;
}

.mobile-navigation__languages {
    display: flex;
    align-items: center;
    gap: 4px;

    font-size: 18px;
    font-weight: 700;
}

.mobile-navigation__languages a {
    color: #000000;
    text-decoration: none;
}

.mobile-navigation__languages a.is-active {
    font-weight: 700;
}

.mobile-navigation__legal a,
.site-footer__legal a {
    color: #000000;
    font-size: inherit;
    font-weight: inherit;
    text-decoration: none;
}
/* Dunkler Hintergrund hinter dem Menü */

.navigation-backdrop {
    position: fixed;
    inset: 0;
    z-index: 999;

    background: rgba(0, 0, 0, 0.35);

    opacity: 0;
    visibility: hidden;

    transition:
        opacity 0.3s ease,
        visibility 0.3s ease;
}

.navigation-backdrop.is-visible {
    opacity: 1;
    visibility: visible;
}

/* Hero */

.hero {
    padding: 42px 24px 0;
    overflow: visible;
}

.hero__inner {
    width: 100%;
    margin: 0 auto;
}

.hero__logo {
    width: 245px;
    height: auto;
    margin: 0 auto 24px;
}

.hero__content {
    width: min(100%, 353px);
    margin: 0 auto;
}

.hero h1 {
    margin: 0 0 22px;

    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
    text-align: center;
}

.hero__intro {
    margin: 0 0 9px;

    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
    text-align: left;
}

.hero__text {
    margin: 0;

    font-size: 22px;
    line-height: 26px;
    font-weight: 300;
    color: #000000;
    text-align: left;
}

/* Footer – Mobile */

.site-footer {
    position: relative;

    width: 100%;
    height: auto;
    min-height: 0;

    margin-top: 28px;
    overflow: hidden;

    aspect-ratio: 402 / 282.1;

    background-image: url("/images/content/footer-mobile.svg");
    background-position: center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.site-footer__image {
    display: none;
}

.site-footer__content {
    position: absolute;
    inset: 0;
    z-index: 1;

    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0 24px;

    display: block;
    color: #000000;
}

/* Social Icons und Sprachen */

.site-footer__meta-row {
    position: absolute;

    top: 44px;
    left: 24px;
    right: 24px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    margin: 0;
    transform: none;
}

.site-footer__socials {
    display: flex;
    align-items: center;
    gap: 14px;
}

.site-footer__socials a {
    display: block;
    line-height: 0;
}

.site-footer__socials img {
    display: block;
    width: auto;
    height: 34px;
}

.site-footer__languages {
    display: none;
    align-items: center;
    gap: 4px;

    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.site-footer__languages a {
    color: #000000;
    text-decoration: none;
}

/* Impressum, Datenschutz und Kontakt */

.site-footer__legal {
    position: absolute;

    top: 118px;
    left: 0;
    right: 0;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;

    margin: 0;
    transform: none;

    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.site-footer__legal a {
    color: #000000;
    text-decoration: none;
}

/* Neue Desktop-Inhalte mobil ausblenden */

.site-footer__address,
.site-footer__contact {
    display: none;
}

/* Kleine Smartphones */

@media (max-width: 380px) {
    .site-title,
    .mobile-navigation__title {
        font-size: 36px;
    }

    .mobile-navigation__main-links a {
        font-size: 34px;
    }
}

/* Produkte */

.products {
    padding: 35px 24px 0;
    background: #c7e6a3;
    color: #104024;
}

.products__inner {
    width: min(100%, 353px);
    margin: 0 auto;
}

.products__header {
    text-align: center;
}

.products__heading {
    margin: 0;

    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
}

.products__list {
    display: flex;
    flex-direction: column;
}

.product-card {
    position: relative;

    width: 100%;
    padding: 0 0 20px;
    border-bottom: 2px solid rgba(16, 64, 36, 0.35);
}

.product-card + .product-card {
    padding-top: 21px;
}

.product-card__title {
    margin: 0;

    font-size: 30px;
    line-height: 38px;
    font-weight: 700;
    text-align: center;
}

.product-card__image {
    width: 237px;
    height: 321px;
    margin: 11px auto 11px;

    object-fit: contain;
}

.product-card__summary {
    margin: 0;

    color: #104024;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
    text-align: left;
}

.product-card__link {
    display: block;
    width: max-content;
    margin: 0 0 0 auto;

    color: #104024;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
    text-align: right;
    text-decoration: none;
}

.product-card__link span {
    letter-spacing: 0.02em;
}

.product-card__link:hover,
.product-card__link:focus-visible {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Produktdetail */

.product-detail {
    padding: 35px 24px 80px;
    background: #c7e6a3;
    color: #104024;
}

.product-detail__inner {
    width: min(100%, 353px);
    margin: 0 auto;
}

.product-detail__header {
    text-align: center;
}

.product-detail__title {
    margin: 0;

    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
    text-align: center;
}

.product-detail__image {
    width: 350px;
    height: 350px;
    margin: 0 auto 29px;

    object-fit: contain;
}

.product-detail__summary {
    margin: 0 0 12px;

    color: #104024;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
    text-align: left;
}

.product-detail__description {
    margin: 0;

    color: #000000;
    font-size: 22px;
    line-height: 26px;
    font-weight: 300;
    text-align: left;
}

/* Inspirationen */

.inspirations {
    padding: 35px 24px 0;
}

.inspirations__inner {
    width: min(100%, 355px);
    margin: 0 auto;
}

.inspirations__header {
    text-align: center;
}

.inspirations__heading {
    margin: 0;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
}

.inspirations__list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.inspiration-card {
    width: 355px;
    max-width: 100%;
    min-height: 355px;

    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    align-items: center;

    margin: 0 auto 20px;
    padding: 19px 14px 20px;

    color: inherit;
    text-decoration: none;
}

.inspiration-card--cream {
    background: #f9f5eb;
}

.inspiration-card--green {
    background: #a3d26f;
    color: #000000;
}

.inspiration-card__image {
    width: 265px;
    height: auto;
    margin: 0 auto 8px;
    display: block;
}

.inspiration-card__content {
    width: 100%;
    margin-top: auto;
    text-align: center;
}

.inspiration-card__title {
    margin: 0 0 6px;
    font-size: 22px;
    line-height: 28px;
    font-weight: 700;
}

.inspiration-card__summary {
    margin: 0;
    font-size: 22px;
    line-height: 28px;
    font-weight: 300;
}

.inspiration-card:hover,
.inspiration-card:focus-visible {
    outline: 2px solid #104024;
    outline-offset: 2px;
}

/* Sustainability */

.sustainability {
    background: #c7e6a3;
    color: #104024;
    padding: 35px 0 80px;
}

.sustainability__inner {
    width: min(100% - 48px, 355px);
    margin: 0 auto;
}

.sustainability__header {
    text-align: center;
}

.sustainability__heading {
    margin: 0;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
}

.sustainability__introduction {
    margin-bottom: 32px;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.sustainability__items {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.sustainability-item__summary::-webkit-details-marker {
    display: none;
}

.sustainability-item__title {
    max-width: 289px;
    margin: 0;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.sustainability-item__icon {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;

    background: url("/images/content/accordion-down.svg") center center / contain no-repeat;

    transform: rotate(0deg);
    transform-origin: center;
    transition: transform 0.3s ease;
}

.sustainability-item[open] .sustainability-item__icon {
    transform: rotate(180deg);
}

.sustainability-item {
    overflow: hidden;
    background: #a3d26f;
    border-top: 3px solid #004d2c;
}

.sustainability-item__summary {
    min-height: 57px;
    padding: 5px 14px 5px 7px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    cursor: pointer;
    list-style: none;
}

.sustainability-item__summary::-webkit-details-marker {
    display: none;
}

.sustainability-item__content {
    background: #dcefd0;
}

.sustainability-item__image {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.sustainability-item__text {
    padding: 10px 7px 18px;
    font-size: 22px;
    line-height: 24px;
    font-weight: 300;
    color: #104024;

}

.sustainability-item__text h2 {
    line-height: 34px;
}


/* FAQ */

.faq-page {
    padding: 35px 0 80px;
    background: #c7e6a3;
    color: #104024;
}

.faq-page__inner {
    width: min(100% - 48px, 355px);
    margin: 0 auto;
}

.faq-page__header {
    text-align: center;
}

.faq-page__heading {
    margin: 0;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
}

.faq-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.faq-item {
    overflow: hidden;
    background: #a3d26f;
    border-top: 3px solid #004d2c;
}

.faq-item__summary {
    min-height: 57px;
    padding: 5px 14px 5px 8px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    cursor: pointer;
    list-style: none;
}

.faq-item__summary::-webkit-details-marker {
    display: none;
}

.faq-item__title {
    max-width: 297px;

    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.faq-item__icon {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;

    background: url("/images/content/accordion-down.svg")
        center center / contain
        no-repeat;

    transform: rotate(0deg);
    transform-origin: center;
    transition: transform .3s ease;
}

.faq-item[open] .faq-item__icon {
    transform: rotate(180deg);
}

.faq-item__content {
    background: #deebd6;
}

.faq-item__answer {
    padding: 12px 8px 18px;

    font-size: 22px;
    line-height: 26px;
    font-weight: 300;

    color: #104024;


}

.faq-item__answer a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}
/* Recipe detail */

.recipe-detail {
    padding: 35px 24px 80px;
    background: #f9f5eb;
    color: #104024;
}

.recipe-detail__inner {
    width: min(100%, 353px);
    margin: 0 auto;
}

.recipe-detail__header {
    text-align: center;
}

.recipe-detail__heading {
    margin: 0;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
}

.recipe-detail__image {
    width: 100%;
    aspect-ratio: 1 / 1;
    margin: 0 auto 15px;
    object-fit: cover;
}

.recipe-detail__intro {
    margin: 0 0 32px;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
    text-align: left;
}

.recipe-detail__body {
    color: #000000;
    font-size: 22px;
    line-height: 26px;
    font-weight: 300;
}

.recipe-section + .recipe-section {
    margin-top: 26px;
}

.recipe-section__heading {
    margin: 0 0 4px;
    color: #000000;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.recipe-section__list {
    margin: 0;
    padding-left: 29px;
}

.recipe-section__list li {
    margin: 0 0 5px 0;
    padding: 0;
}

.recipe-section__list--ordered {
    padding-left: 32px;
}

.recipe-detail__external {
    margin-top: 32px;
}

.recipe-detail__external-link {
    display: inline-block;
    color: #104024;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.recipe-detail__external-link:hover,
.recipe-detail__external-link:focus-visible {
    text-decoration-thickness: 2px;
}

.recipe-detail__summary {
    margin: 0 0 26px;

    font-size: 22px;
    line-height: 26px;
    font-weight: 700;

    color: #104024;
}

/* Shepherd article overview */

.shepherd-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.shepherd-card {
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;

    color: #104024;
    text-decoration: none;
}

.shepherd-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.shepherd-card__title-wrap {
    position: absolute;
    inset: 0 0 auto;

    padding: 1px 5px 2px;
    background: rgba(163, 210, 111, 0.8);
}

.shepherd-card__title {
    margin: 0;
    font-size: 16px;
    line-height: 18px;
    font-weight: 700;
    text-align: left;
}

.shepherd-card:focus-visible {
    outline: 3px solid #104024;
    outline-offset: 2px;
}

/* Shepherd article detail */

.shepherd-detail {
    padding: 35px 24px 80px;
    background: #c7e6a3;
    color: #104024;
}

.shepherd-detail__inner {
    width: min(100%, 353px);
    margin: 0 auto;
}

.shepherd-detail__header {
    text-align: center;
}

.shepherd-detail__heading {
    margin: 0;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
}

.shepherd-detail__image {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    margin: 0 auto 29px;
    object-fit: cover;
}

/* Inspiration detail / recipe overview */

.inspiration-detail {
    padding: 35px 24px 80px;
    background: #f9f5eb;
    color: #104024;
}

.inspiration-detail__inner {
    width: min(100%, 355px);
    margin: 0 auto;
}

.inspiration-detail__header {
    text-align: center;
}

.inspiration-detail__heading {
    margin: 0;
    font-size: 40px;
    line-height: 48px;
    font-weight: 700;
}

.inspiration-detail + .site-footer,
.recipe-detail + .site-footer {
    margin-top: 0;
    background-color: #f9f5eb;
}

.inspiration-detail--aus-der-welt-des-schaefers + .site-footer {
    background-color: #c7e6a3;
}

.inspiration-detail__introduction {
    margin: 0 0 23px;
    color: #000000;
    font-size: 22px;
    line-height: 26px;
    font-weight: 300;
}
.inspiration-detail--aus-der-welt-des-schaefers {
    background: #c7e6a3;
}

.recipe-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.recipe-card {
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    color: #104024;
    text-decoration: none;
}

.recipe-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.recipe-card__title-wrap {
    position: absolute;
    inset: 0 0 auto;

    padding: 0 5px 3px;
    background: rgba(249, 245, 235, 0.8);
}

.recipe-card__title {
    margin: 0;
    font-size: 16px;
    line-height: 18px;
    font-weight: 700;
}

.recipe-card:focus-visible {
    outline: 3px solid #104024;
    outline-offset: 2px;
}

/* =====================
   Rechtliche Seiten
===================== */

.legal-page {
    width: 100%;
    margin: 0 auto;

    background: #c7e6a3;
    color: #104024;
}

.legal-page__inner {
    width: 100%;
    margin: 0 auto;
}

.legal-page__header {
    text-align: center;
}

.legal-page__heading {
    margin: 0;
    font-weight: 700;
}

.legal-page__content {
    color: #000;
}

.legal-page__content h2,
.legal-page__content h3 {
    color: #104024;
}

.legal-page__content p:first-child {
    margin-top: 0;
}

.legal-page__content a {
    color: #104024;
}



    .legal-page {
        padding: 35px 24px 60px;
    }

    .legal-page__inner {
        max-width: 100%;
    }

    .legal-page__heading {
        font-size: 40px;
        line-height: 48px;
    }

    .legal-page__content {
        margin-top: 40px;

        font-size: 20px;
        line-height: 28px;
    }

    .legal-page__content h2 {
        margin: 36px 0 12px;

        font-size: 28px;
        line-height: 34px;
    }

    .legal-page__content h3 {
        margin: 28px 0 10px;

        font-size: 22px;
        line-height: 28px;
    }

    .legal-page__content p {
        margin: 0 0 18px;
    }

/* ========================================
   Kontakt – Mobile / Basis
======================================== */

.contact-page {
    width: 100%;
    padding: 35px 24px 60px;

    background: #c7e6a3;
    color: #104024;
}

.contact-page__inner {
    width: 100%;
    margin: 0 auto;
}

.contact-page__header {
    text-align: center;
}

.contact-page__heading {
    margin: 0;

    font-size: 40px;
    line-height: 44px;
    font-weight: 700;
}

.contact-page .page-wave {
    display: block;

    width: 260px;
    max-width: 100%;
    height: auto;

    margin: 12px auto 38px;
}

.contact-page__intro {
    margin: 0 0 30px;

    font-size: 20px;
    line-height: 26px;
    font-weight: 700;
}

.contact-form {
    width: 100%;
}

.contact-form__row {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.contact-form__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.contact-form__field label {
    font-size: 20px;
    line-height: 26px;
    font-weight: 700;
}

.contact-form__field input,
.contact-form__field textarea {
    width: 100%;

    box-sizing: border-box;

    border-top: 1px solid #75b63c;
    border-right: 1px solid #75b63c;
    border-bottom: 2px solid #75b63c;
    border-left: 1px solid #75b63c;

    background: #fff;
    color: #000;

    font-family: "trade-gothic-next", sans-serif;
    font-size: 20px;
    line-height: 26px;
    font-weight: 300;
}

.contact-form__field input {
    height: 56px;
    padding: 0 16px;
}

.contact-form__field textarea {
    min-height: 300px;
    padding: 14px 16px;

    resize: vertical;
}

.contact-form__field input::placeholder,
.contact-form__field textarea::placeholder {
    color: #c7e6a3;
    opacity: 1;
}

.contact-form__field--email,
.contact-form__field--message {
    width: 100%;
    margin-top: 18px;
}

.contact-form__submit {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 56px;

    margin-top: 28px;

    border: 0;
    border-radius: 10px;

    background: #75b63c;
    color: #fff;

    font-family: "trade-gothic-next", sans-serif;
    font-size: 20px;
    line-height: 26px;
    font-weight: 700;

    cursor: pointer;
}

.contact-form__submit:hover,
.contact-form__submit:focus-visible {
    filter: brightness(0.95);
}

.contact-form__errors {
    margin-top: 24px;

    color: #8b0000;

    font-size: 20px;
    line-height: 26px;
}

.contact-form__errors ul {
    margin: 8px 0 0;
    padding-left: 24px;
}


/* Danke – Mobile / Basis */

.contact-success {
    width: 100%;

    padding: 100px 24px 80px;

    background: #c7e6a3;
    color: #104024;
}

.contact-success__inner {
    width: 100%;
    margin: 0 auto;
}

.contact-success__message {
    margin: 0;

    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
}














/* ========================================
   Tablet
======================================== */

@media (min-width: 600px) and (max-width: 1199px) {

    html,
    body {
        min-height: 100%;
    }

    body {
        min-height: 100vh;
        display: flex;
        flex-direction: column;

        margin: 0;

        background: #dfe8d7;
    }

    body > main {
        flex: 1 0 auto;
        width: 100%;
        max-width: 1199px;
        margin-left: auto;
        margin-right: auto;
    }


    /* =====================
       Header
    ===================== */

    .site-header {
        position: sticky;
        top: 0;
        z-index: 900;

        width: 100%;
        max-width: 1199px;
        height: 100px;

        margin-left: auto;
        margin-right: auto;

        background: #004d2c;
    }

    .site-header__inner {
        position: relative;

        width: 100%;
        height: 100px;
    }

    .site-title {
        top: 33px;
        left: 50%;

        transform: translateX(-50%);

        font-size: 40px;
        line-height: 48px;
        white-space: nowrap;
    }

    .menu-button {
        display: block;

        top: 41px;
        left: 36px;

        width: 40px;
        height: 40px;
    }

    .menu-button img {
        width: 40px;
        height: 40px;
    }

    .site-header__right {
        position: absolute;

        top: 8px;
        right: 33px;

        display: block;

        width: 100px;
        height: 90px;
    }

    .site-header__shepherd {
        display: block;

        width: 100px;
        height: 90px;

        object-fit: contain;
    }

    /* Im Tablet-Figma keine Sprache im Header */
    .site-header__languages {
        display: none;
    }

        /* Header beim Scrollen – Tablet */

    .site-header.is-scrolled {
        height: 72px;
    }

    .site-header.is-scrolled .site-header__inner {
        height: 72px;
    }

    .site-header.is-scrolled .site-header__shepherd {
        width: 74px;
        height: 66px;
    }

    .site-header.is-scrolled .site-header__right {
        top: 3px;
        right: 33px;

        width: 74px;
        height: 66px;
    }

    .site-header.is-scrolled .site-title {
        top: 12px;

        font-size: 34px;
        line-height: 42px;
    }

    .site-header.is-scrolled .menu-button {
        top: 16px;
    }


    /* =====================
       Homepage
    ===================== */

    body.home-page > main {
        display: flex;
        flex-direction: column;

        background: #c7e6a3;
    }

    .hero {
        flex: 1 0 auto;

        padding: 58px 34px 40px;

        background: #c7e6a3;
    }

    .hero__inner {
        width: 100%;
        max-width: 832px;

        margin: 0 auto;
    }

    .hero__logo {
        width: 329px;
        height: auto;

        margin: 0 auto 44px;

        object-fit: contain;
    }

    .hero__content {
        width: 100%;
        max-width: 832px;

        margin: 0 auto;
    }

    .hero h1 {
        margin: 0 0 27px;

        font-size: 46px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }

    .hero__intro {
        margin: 0 0 12px;

        font-size: 22px;
        line-height: 30px;
        font-weight: 700;

        text-align: left;
    }

    .hero__text {
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;

        text-align: left;
    }


    /* =====================
       Navigation
    ===================== */

    .mobile-navigation {
        top: 0;
        left: 0;

        width: 550px;
        max-width: min(550px, 90vw);
        height: 100dvh;

        box-shadow: 10px 0 7px rgba(0, 0, 0, 0.25);
    }

    .mobile-navigation__header {
        width: 100%;
        height: 100px;
        min-height: 100px;
    }

    .mobile-navigation__title {
        display: none;
    }

    .menu-close {
        top: 41px;
        left: 36px;

        width: 40px;
        height: 40px;
    }

    .menu-close img {
        width: 40px;
        height: 40px;

        transform: none;
    }

    .mobile-navigation__content {
        height: calc(100dvh - 100px);

        padding: 111px 60px 40px;

        background: #c7e6a3;
    }

    .mobile-navigation__main-links {
        align-items: flex-start;
        gap: 5px;
    }

    .mobile-navigation__main-links a {
        min-height: 60px;

        font-size: 40px;
        line-height: 60px;
        font-weight: 700;
    }

    .mobile-navigation__bottom {
        display: none;
    }


    /* =====================
       Footer
    ===================== */

    .site-footer {
        width: 100%;
        max-width: 1199px;

        height: 260px;
        min-height: 260px;

        margin: 0 auto;

        overflow: hidden;
        aspect-ratio: auto;

        background-color: #c7e6a3;

        background-image:
            url("/images/content/footer-tablet.svg"),
            linear-gradient(
                to bottom,
                #c7e6a3 0%,
                #c7e6a3 83%,
                #75b63c 83%,
                #75b63c 100%
            );

        background-repeat: no-repeat, no-repeat;
        background-position: center, center;
        background-size: 100% 100%, 100% 100%;
    }

    .site-footer__content {
        position: absolute;

        top: 0;
        bottom: 0;
        left: 50%;

        width: min(100%, 900px);
        height: 100%;

        margin: 0;
        padding: 0;

        transform: translateX(-50%) translateY(50px);

        z-index: 1;
    }

    .site-footer__meta-row {
        position: static;
        margin: 0;
    }

    .site-footer__socials {
        position: absolute;
        top: 46px;
        left: 34px;

        display: flex;
        align-items: center;
        gap: 50px;
    }

    .site-footer__socials img {
        width: auto;
        height: 56px;
    }

    .site-footer__languages {
        position: none;

        top: 33px;
        right: 33px;

        display: flex;

        font-size: 26px;
        line-height: 26px;
        font-weight: 700;
    }

    .site-footer__legal {
        position: absolute;

        top: 41px;
        left: 50%;

        transform: translateX(-50%);

        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 16px;

        font-size: 24px;
        line-height: 26px;
        font-weight: 700;
    }

    .site-footer__address,
    .site-footer__contact {
        display: none;
    }

    /* ========================================
       Produkte – Tablet
    ======================================== */

    .products {
        width: 100%;
        max-width: 1199px;

        min-height: calc(100vh - 100px - 260px);

        margin-left: auto;
        margin-right: auto;

        padding: 70px 32px 80px;

        background: #c7e6a3;
        color: #104024;
    }

    .products__inner {
        width: 100%;
        max-width: 836px;

        margin: 0 auto;
    }


    /* Überschrift */

    .products__header {
        text-align: center;
    }

    .products__heading {
        margin: 0;

        font-size: 48px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .products .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 14px auto 48px;

        object-fit: fill;
    }


    /* Produkt-Grid */

    .products__list {
        display: grid;

        grid-template-columns: repeat(2, minmax(0, 1fr));

        column-gap: 26px;
        row-gap: 24px;

        align-items: start;
    }


    /* Produktkarte */

    .product-card {
        position: relative;

        width: 100%;
        min-height: 568px;

        margin: 0;

        padding: 27px 12px 14px;

        display: flex;
        flex-direction: column;
        align-items: center;

        gap: 10px;

        border: 3px solid #75b63c;
        background: transparent;
    }


    /* Titel */

    .product-card__title {
        width: 100%;
        margin: 0;

        color: #104024;

        font-size: 34px;
        line-height: 38px;
        font-weight: 700;

        text-align: center;
    }


    /* Produktbild */

    .product-card__image {
        display: block;

        width: 230px;
        height: 369px;

        margin: 0 auto;

        object-fit: contain;
    }


    /* Beschreibung */

    .product-card__summary {
        width: 100%;
        margin: 0;

        color: #104024;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;

        text-align: left;
    }


    /* Mehr-Link */

    .product-card__link {
        width: 100%;
        margin: 0;

        color: #75b63c;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;

        text-align: right;
        text-decoration: none;
    }

    .product-card__link:hover,
    .product-card__link:focus-visible {
        text-decoration: underline;
        text-underline-offset: 3px;
    }

    /* ========================================
    Produktdetail – Tablet
    ======================================== */

    .product-detail {
        width: 100%;
        max-width: 1199px;

        margin-left: auto;
        margin-right: auto;

        padding: 70px 34px 80px;

        background: #c7e6a3;
        color: #104024;
    }

    .product-detail__inner {
        width: 100%;
        max-width: 832px;

        margin: 0 auto;
    }


    /* Überschrift */

    .product-detail__header {
        text-align: center;
    }

    .product-detail__title {
        margin: 0;

        font-size: 46px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .product-detail .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 11px auto 48px;

        object-fit: fill;
    }


    /* Kurzbeschreibung über beide Spalten */

    .product-detail__summary {
        width: 100%;

        margin: 0 0 0;

        color: #104024;

        font-size: 22px;
        line-height: 30px;
        font-weight: 700;

        text-align: left;
    }


    /* Bild + Beschreibung */

    .product-detail__content {
        display: grid;

        grid-template-columns:
            minmax(0, 397px)
            minmax(0, 399px);

        column-gap: 34px;

        align-items: start;

        margin-top: 0;
    }


    /* Bild */

    .product-detail__image {
        display: block;

        width: 397px;
        height: 397px;
        max-width: 100%;

        margin: 0;

        object-fit: contain;
    }


    /* Beschreibung */

    .product-detail__description {
        width: 100%;
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;

        text-align: left;
    }



    /* ========================================
    Inspirationen – Tablet
    ======================================== */

    .inspirations {
        width: 100%;
        max-width: 1199px;

        min-height: calc(100vh - 100px - 260px);

        margin-left: auto;
        margin-right: auto;

        padding: 70px 32px 80px;

        background: #c7e6a3;
        color: #104024;
    }

    .inspirations__inner {
        width: 100%;
        max-width: 836px;

        margin: 0 auto;
    }


    /* Überschrift */

    .inspirations__header {
        text-align: center;
    }

    .inspirations__heading {
        margin: 0;

        font-size: 46px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .inspirations .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 11px auto 48px;

        object-fit: fill;
    }


    /* Karten-Grid */

    .inspirations__list {
        display: grid;

        grid-template-columns: repeat(2, minmax(0, 1fr));

        column-gap: 26px;
        row-gap: 26px;

        align-items: start;
    }


    /* Karte */

    .inspiration-card {
        width: 100%;
        height: 537px;

        margin: 0;

        display: flex;
        flex-direction: column;
        align-items: center;

        box-sizing: border-box;

        color: #104024;
        text-decoration: none;
    }


    /* Shiba-Karte */

    .inspiration-card--shibas-kitchen {
        padding: 31px 15px 14px;

        gap: 25px;

        background: #f9f5eb;
    }


    /* Schäfer-Karte */

    .inspiration-card--aus-der-welt-des-schaefers {
        padding: 12px 15px 15px;

        gap: 13px;

        background: #a3d26f;
    }


    /* Bilder */

    .inspiration-card__image {
        display: block;

        width: 100%;

        object-fit: cover;
    }


    /* Shiba-Bild */

    .inspiration-card--shibas-kitchen .inspiration-card__image {
        height: 245px;

        object-fit: contain;
    }


    /* Schäfer-Bild */

    .inspiration-card--aus-der-welt-des-schaefers .inspiration-card__image {
        height: 390px;

        object-fit: cover;
    }


    /* Kartentitel */

    .inspiration-card__title {
        width: 100%;

        margin: 0;

        font-size: 34px;
        line-height: 38px;
        font-weight: 700;

        text-align: center;
    }


    /* Beschreibung */

    .inspiration-card__summary {
        width: 100%;

        margin: 0;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;

        text-align: center;
    }

    /* ========================================
    Shibas Kitchen – Tablet
    ======================================== */

    .inspiration-detail--shibas-kitchen {
        width: 100%;
        max-width: 1199px;

        margin-left: auto;
        margin-right: auto;

        padding: 70px 32px 80px;

        background: #f9f5eb;
        color: #104024;
    }

    .inspiration-detail--shibas-kitchen .inspiration-detail__inner {
        width: 100%;
        max-width: 836px;

        margin: 0 auto;
    }


    /* Überschrift */

    .inspiration-detail--shibas-kitchen .inspiration-detail__header {
        text-align: center;
    }

    .inspiration-detail--shibas-kitchen .inspiration-detail__heading {
        margin: 0;

        font-size: 46px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .inspiration-detail--shibas-kitchen .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 11px auto 48px;

        object-fit: fill;
    }


    /* Einleitung */

    .inspiration-detail--shibas-kitchen .inspiration-detail__introduction {
        width: 100%;

        margin: 0 0 40px;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;

        color: #104024;

        text-align: left;
    }


    /* Rezept-Grid */

    .inspiration-detail--shibas-kitchen .recipe-grid {
        display: grid;

        grid-template-columns: repeat(2, minmax(0, 1fr));

        column-gap: 29px;
        row-gap: 40px;

        width: 100%;
    }


    /* Rezeptkarte */

    .inspiration-detail--shibas-kitchen .recipe-card {
        position: relative;

        width: 100%;
        aspect-ratio: 1 / 1;

        overflow: hidden;

        color: #104024;
        text-decoration: none;

        cursor: pointer;
    }


    /* Bild */

    .inspiration-detail--shibas-kitchen .recipe-card__image {
        display: block;

        width: 100%;
        height: 100%;

        object-fit: cover;
    }


    /* Titelband */

    .inspiration-detail--shibas-kitchen .recipe-card__title-wrap {
        position: absolute;

        top: 0;
        left: 0;
        right: 0;

        padding: 17px 19px 13px;

        background: rgba(249, 245, 235, 0.8);
    }


    /* Titel */

    .inspiration-detail--shibas-kitchen .recipe-card__title {
        margin: 0;

        font-size: 34px;
        line-height: 42px;
        font-weight: 700;

        color: #104024;
        text-align: left;
    }

    /* ========================================
    Rezeptdetail – Tablet
    ======================================== */

    .recipe-detail {
        width: 100%;
        max-width: 1199px;

        margin-left: auto;
        margin-right: auto;

        padding: 70px 32px 80px;

        background: #f9f5eb;
        color: #104024;
    }

    .recipe-detail__inner {
        width: 100%;
        max-width: 836px;

        margin: 0 auto;
    }


    /* Überschrift */

    .recipe-detail__header {
        text-align: center;
    }

    .recipe-detail__heading {
        margin: 0;

        font-size: 46px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .recipe-detail .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 11px auto 48px;

        object-fit: fill;
    }


    /* Einleitung */

    .recipe-detail__intro {
        width: 100%;

        margin: 0 0 48px;

        color: #104024;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;

        text-align: left;
    }


    /* Hauptbereich: Bild links / Rezept rechts */

    .recipe-detail__content {
        display: grid;

        grid-template-columns:
            minmax(0, 404px)
            minmax(0, 399px);

        column-gap: 30px;

        align-items: start;

        width: 100%;
    }


    /* Bild */

    .recipe-detail__image {
        display: block;

        width: 404px;
        height: 404px;
        max-width: 100%;

        margin: 0;

        object-fit: cover;
    }


    /* rechte Rezeptspalte */

    .recipe-detail__body {
        width: 100%;
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;
    }


    /* einzelne Bereiche */

    .recipe-section {
        margin: 0 0 28px;
    }

    .recipe-section__heading {
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;
    }

    .recipe-section__content,
    .recipe-section__tips {
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;
    }


    /* Listen */

    .recipe-detail__body ul,
    .recipe-detail__body ol {
        margin-top: 0;
        margin-bottom: 28px;

        padding-left: 29px;
    }

    .recipe-detail__body li {
        margin: 0;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;
    }


    /* Step-by-step-Link */

    .recipe-detail__external-link {
        display: block;

        margin-top: 28px;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;

        text-align: right;
    }


    /* ========================================
    Aus der Welt des Schäfers – Tablet
    ======================================== */

    .inspiration-detail--aus-der-welt-des-schaefers {
        width: 100%;
        max-width: 1199px;

        margin-left: auto;
        margin-right: auto;

        padding: 70px 32px 80px;

        background: #c7e6a3;
        color: #104024;
    }

    .inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__inner {
        width: 100%;
        max-width: 836px;

        margin: 0 auto;
    }


    /* Überschrift */

    .inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__header {
        text-align: center;
    }

    .inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__heading {
        margin: 0;

        font-size: 46px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .inspiration-detail--aus-der-welt-des-schaefers .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 11px auto 48px;

        object-fit: fill;
    }


    /* Einleitung */

    .inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__introduction {
        width: 100%;

        margin: 0 0 48px;

        color: #104024;

        font-size: 22px;
        line-height: 30px;
        font-weight: 700;

        text-align: left;
    }


    /* Schäfer-Grid */

    .inspiration-detail--aus-der-welt-des-schaefers .shepherd-grid {
        display: grid;

        grid-template-columns: repeat(2, minmax(0, 1fr));

        column-gap: 24px;
        row-gap: 24px;

        width: 100%;
    }


    /* Karte */

    .inspiration-detail--aus-der-welt-des-schaefers .shepherd-card {
        position: relative;

        width: 100%;
        aspect-ratio: 1 / 1;

        overflow: hidden;

        color: #104024;
        text-decoration: none;

        cursor: pointer;
    }


    /* Bild */

    .inspiration-detail--aus-der-welt-des-schaefers .shepherd-card__image {
        display: block;

        width: 100%;
        height: 100%;

        object-fit: cover;
    }


    /* Titelband */

    .inspiration-detail--aus-der-welt-des-schaefers .shepherd-card__title-wrap {
        position: absolute;

        top: 0;
        left: 0;
        right: 0;

        padding: 17px 19px 13px;

        background: rgba(163, 210, 111, 0.8);
    }


    /* Kartentitel */

    .inspiration-detail--aus-der-welt-des-schaefers .shepherd-card__title {
        margin: 0;

        font-size: 34px;
        line-height: 42px;
        font-weight: 700;

        color: #104024;

        text-align: left;
    }



/* ========================================
   Schäfer Artikel Detail – Tablet
======================================== */

.shepherd-detail {
    width: 100%;
    max-width: 1199px;

    margin-left: auto;
    margin-right: auto;

    padding: 70px 32px 80px;

    background: #c7e6a3;
    color: #104024;
}

.shepherd-detail__inner {
    width: 100%;
    max-width: 836px;

    margin: 0 auto;
}

.shepherd-detail__header {
    text-align: center;
}

.shepherd-detail__heading {
    margin: 0;

    font-size: 46px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}

.shepherd-detail .page-wave {
    display: block;

    width: 406px;
    max-width: 100%;
    height: 22px;

    margin: 11px auto 48px;

    object-fit: fill;
}

/* Kurzbeschreibung wie bei Rezepten */
.shepherd-detail__summary {
    width: 100%;

    margin: 0 0 28px;

    color: #104024;

    font-family: "trade-gothic-next", sans-serif;
    font-size: 22px;
    line-height: 28px;
    font-weight: 700;

    text-align: left;
}

/* Bild links / Text rechts */
.shepherd-detail__content {
    display: grid;

    grid-template-columns:
        minmax(0, 404px)
        minmax(0, 399px);

    column-gap: 30px;

    align-items: start;

    width: 100%;
}

/* Bildbereich */
.shepherd-detail__image-wrap {
    width: 404px;
    max-width: 100%;
}

.shepherd-detail__image {
    display: block;

    width: 404px;
    height: 404px;
    max-width: 100%;

    margin: 0;

    object-fit: cover;
}

/* Text rechts – exakt wie Rezepttext */
.shepherd-detail__description {
    width: 100%;
    margin: 0;

    color: #000000;

    font-family: "trade-gothic-next", sans-serif;
    font-size: 22px;
    line-height: 28px;
    font-weight: 300;

    text-align: left;
}

    /* ========================================
    Nachhaltigkeit – Tablet
    ======================================== */

    .sustainability {
        width: 100%;
        max-width: 1199px;

        min-height: calc(100vh - 100px - 260px);

        margin-left: auto;
        margin-right: auto;

        padding: 70px 32px 80px;

        background: #c7e6a3;
        color: #104024;
    }

    .sustainability__inner {
        width: 100%;
        max-width: 836px;

        margin: 0 auto;
    }


    /* Überschrift */

    .sustainability__header {
        text-align: center;
    }

    .sustainability__heading {
        margin: 0;

        font-size: 46px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .sustainability .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 11px auto 48px;

        object-fit: fill;
    }


    /* Einleitung */

    .sustainability__introduction {
        width: 100%;

        margin: 0 0 36px;

        color: #104024;

        font-size: 22px;
        line-height: 28px;
        font-weight: 700;

        text-align: left;
    }


    /* Accordion-Liste */

    .sustainability__items {
        width: 100%;

        display: flex;
        flex-direction: column;

        gap: 5px;

        margin: 0;
    }


    /* Einzelner Eintrag */

    .sustainability-item {
        width: 100%;

        margin: 0;

        background: transparent;
    }


    /* Accordion-Kopf */

    .sustainability-item__summary {
        position: relative;

        width: 100%;
        min-height: 60px;

        display: flex;
        align-items: center;

        padding: 7px 55px 7px 11px;

        box-sizing: border-box;

        border-top: 3px solid #104024;

        background: #a3d26f;

        cursor: pointer;

        list-style: none;
    }


    /* Browser-Standardpfeil entfernen */

    .sustainability-item__summary::-webkit-details-marker {
        display: none;
    }

    .sustainability-item__summary::marker {
        display: none;
    }


    /* Titel */

    .sustainability-item__title {
        display: block;

        color: #104024;

        font-size: 22px;
        line-height: 26px;
        font-weight: 700;

        text-align: left;
    }


    /* Unser Accordion-Pfeil */

    .sustainability-item__icon {
        position: absolute;

        right: 12px;
        top: 50%;

        width: 30px;
        height: 20px;

        transform: translateY(-50%);

        transition: transform 0.2s ease;
    }


    /* Pfeil beim geöffneten Element drehen */

    .sustainability-item[open] .sustainability-item__icon {
        transform:
            translateY(-50%)
            rotate(180deg);
    }


    /* Geöffneter Inhalt */

    .sustainability-item__content {
        width: 100%;

        padding: 24px 11px 30px;

        box-sizing: border-box;
    }


    /* Bild */

    .sustainability-item__image {
        display: block;

        width: 100%;
        height: auto;

        margin: 0 0 24px;

        object-fit: cover;
    }


    /* Text */

    .sustainability-item__text {
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;

        text-align: left;

    }



    /* ========================================
    Fragen & Antworten – Tablet
    ======================================== */

    .faq-page {
        width: 100%;
        max-width: 1199px;

        min-height: calc(100vh - 100px - 260px);

        margin-left: auto;
        margin-right: auto;

        padding: 70px 32px 80px;

        background: #c7e6a3;
        color: #104024;
    }

    .faq-page__inner {
        width: 100%;
        max-width: 836px;

        margin: 0 auto;
    }


    /* Überschrift */

    .faq-page__header {
        text-align: center;
    }

    .faq-page__heading {
        margin: 0;

        font-size: 48px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }


    /* Welle */

    .faq-page .page-wave {
        display: block;

        width: 406px;
        max-width: 100%;
        height: 22px;

        margin: 11px auto 48px;

        object-fit: fill;
    }


    /* FAQ-Liste */

    .faq-list {
        width: 100%;

        display: flex;
        flex-direction: column;

        gap: 5px;

        margin: 0;
    }


    /* einzelner Eintrag */

    .faq-item {
        width: 100%;

        margin: 0;

        overflow: hidden;

        background: transparent;
    }


    /* Frage */

    .faq-item__summary {
        position: relative;

        width: 100%;
        min-height: 60px;

        display: flex;
        align-items: center;

        padding: 7px 74px 7px 12px;

        box-sizing: border-box;

        border-top: 3px solid #104024;

        background: #a3d26f;

        cursor: pointer;
        list-style: none;
    }


    /* Browser-Standardmarker entfernen */

    .faq-item__summary::-webkit-details-marker {
        display: none;
    }

    .faq-item__summary::marker {
        display: none;
    }


    /* Fragetext */

    .faq-item__title {
        display: block;

        max-width: none;

        color: #104024;

        font-size: 22px;
        line-height: 26px;
        font-weight: 700;

        text-align: left;
    }


    /* Pfeil */

    .faq-item__icon {
        position: absolute;

        right: 8px;
        top: 50%;

        width: 30px;
        height: 20px;

        transform: translateY(-50%);
        transform-origin: center;

        transition: transform 0.3s ease;
    }


    /* geöffnet */

    .faq-item[open] .faq-item__icon {
        transform:
            translateY(-50%)
            rotate(180deg);
    }


    /* Antwortbereich */

    .faq-item__content {
        width: 100%;

        background: #deebd6;
    }


    /* Antworttext */

    .faq-item__answer {
        padding: 18px 12px 24px;

        color: #104024;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;

        text-align: left;


    }

    .legal-page {
        max-width: 1199px;
        padding: 70px 32px 100px;
    }

    .legal-page__inner {
        max-width: 836px;
    }

    .legal-page__heading {
        font-size: 46px;
        line-height: 48px;
    }

    .legal-page__content {
        margin-top: 55px;

        font-size: 22px;
        line-height: 30px;
    }

    .legal-page__content h2 {
        margin: 44px 0 14px;

        font-size: 32px;
        line-height: 38px;
    }

    .legal-page__content h3 {
        margin: 32px 0 12px;

        font-size: 26px;
        line-height: 32px;
    }

    .legal-page__content p {
        margin: 0 0 20px;
    }

/* ========================================
   Kontakt – Tablet
======================================== */

    .contact-page {
        width: 100%;
        max-width: 1199px;

        padding: 70px 32px 80px;
    }

    .contact-page__inner {
        max-width: 836px;
    }

    .contact-page__heading {
        font-size: 46px;
        line-height: 48px;
    }

    .contact-page .page-wave {
        width: 406px;

        margin: 11px auto 48px;
    }

    .contact-page__intro {
        margin-bottom: 30px;

        font-size: 22px;
        line-height: 28px;
    }

    .contact-form__row {
        gap: 30px;
    }

    .contact-form__field label {
        font-size: 22px;
        line-height: 28px;
    }

    .contact-form__field input,
    .contact-form__field textarea {
        font-size: 22px;
        line-height: 28px;
    }

    .contact-form__field--email {
        width: calc((100% - 30px) / 2);
    }

    .contact-form__field textarea {
        min-height: 420px;
    }

/* Tablet Danke */

    .contact-success {
        width: 100%;
        max-width: 1199px;

        padding: 170px 32px 100px;
    }

    .contact-success__inner {
        max-width: 836px;
    }

    .contact-success__message {
        font-size: 22px;
        line-height: 30px;
    }




}



























/* Desktop */

@media (min-width: 1200px) {

    html {
        min-height: 100%;
        background: #ffffff;
    }

    body {
        min-height: 100vh;

        display: flex;
        flex-direction: column;

        margin: 0;

        background: #dfe8d7;
    }
    body::before {
    content: "";

    position: fixed;
    top: 0;
    bottom: 0;

    left: 50%;
    width: min(100%, 1440px);

    transform: translateX(-50%);

    pointer-events: none;
    z-index: 0;

    box-shadow:
        -6px 0 18px -6px rgba(16, 64, 36, 0.30),
        6px 0 18px -6px rgba(16, 64, 36, 0.30);
    }


    body > main {
        flex: 1 0 auto;

        width: min(100%, 1440px);

        margin-left: auto;
        margin-right: auto;
    }

    .site-header {
        width: min(100%, 1440px);

        margin-left: auto;
        margin-right: auto;
    }

    .site-footer {
        flex: 0 0 auto;
    }
    body > main,
    .site-footer {
        position: relative;
        z-index: 1;
    }

    .site-header {
        position: sticky;
        top: 0;
        z-index: 900;
    }



    /* Header */
.site-header {
    width: min(100%, 1440px);
    height: 100px;

    margin-left: auto;
    margin-right: auto;
}

.site-header.is-scrolled {
    height: 72px;
}

.site-header__inner {
    position: relative;
    width: 100%;
    height: 100px;

    transition: height 0.25s ease;
}

.site-header.is-scrolled .site-header__inner {
    height: 72px;
}

.site-title {
    top: 33px;
    left: 50%;

    transform: translateX(-50%);

    font-size: 40px;
    line-height: 48px;
    white-space: nowrap;
}

.menu-button {
    display: block;

    top: 41px;
    left: 120px;

    width: 40px;
    height: 40px;
}

.menu-button img {
    width: 40px;
    height: 40px;
}

.site-header__right {
    position: absolute;

    top: 5px;
    right: 119px;

    width: 197px;
    height: 90px;

    display: block;

    transition:
        top 0.25s ease,
        height 0.25s ease;
}

.site-header__shepherd {
    position: absolute;

    top: 0;
    right: 0;

    display: block;

    width: 100px;
    height: 90px;

    object-fit: contain;

    transition:
        width 0.25s ease,
        height 0.25s ease;
}

.site-header__languages {
    position: absolute;

    top: 41px;
    left: 0;

    display: flex;
    align-items: center;
    gap: 4px;

    font-size: 26px;
    line-height: 26px;
    font-weight: 700;

    transition:
        top 0.25s ease,
        font-size 0.25s ease,
        line-height 0.25s ease;

    span {
    color: #ffffff;
    }
}

.site-header__languages a {
    color: #ffffff;
    text-decoration: none;
}


.site-header__languages a:visited,
.site-header__languages a:hover,
.site-header__languages a:focus,
.site-header__languages a:active {
    color: #ffffff;
    text-decoration: none;
}

.site-header.is-scrolled .site-title {
    top: 12px;
    left: 50%;

    transform: translateX(-50%);

    font-size: 34px;
    line-height: 42px;
}

.site-header.is-scrolled .menu-button {
    top: 16px;
}

.site-header.is-scrolled .site-header__right {
    top: 3px;
    height: 66px;
}

.site-header.is-scrolled .site-header__shepherd {
    width: 74px;
    height: 66px;
}

.site-header.is-scrolled .site-header__languages {
    top: 23px;
    left: auto;
    right: 88px;

    font-size: 22px;
    line-height: 24px;
}

    /* Desktop-Navigation */

    .mobile-navigation {
        top: 0;
        left: max(0px, calc((100vw - 1440px) / 2));

        width: 550px;
        max-width: min(550px, 90vw);
        height: 100dvh;

        /* globale Mobile-Bewegung überschreiben */
        transform: none;

        /* geschlossen */
        clip-path: inset(0 100% 0 0);
        visibility: hidden;

        box-shadow: 10px 0 7px rgba(0, 0, 0, 0.25);

        transition:
            clip-path 0.5s ease,
            visibility 0.5s ease;
    }

    .mobile-navigation.is-open {
        transform: none;
        clip-path: inset(0 0 0 0);
        visibility: visible;
    }

    .mobile-navigation__header {
        width: 100%;
        height: 100px;
        min-height: 100px;
    }

    .mobile-navigation__title {
        display: none;
    }

    .menu-close {
        top: 41px;
        left: 120px;

        width: 40px;
        height: 40px;
    }

    .menu-close img {
        width: 40px;
        height: 40px;
        transform: none;
    }

    .mobile-navigation__content {
        position: relative;

        height: calc(100dvh - 100px);
        padding: 111px 60px 40px;

        display: block;

        background: #c7e6a3;
    }

    .mobile-navigation__main-links {
        align-items: flex-start;
        gap: 5px;
    }

    .mobile-navigation__main-links a {
        min-height: 60px;

        font-size: 40px;
        line-height: 60px;
        font-weight: 700;
    }

    .mobile-navigation__bottom {
        display: none;
    }
    
    .navigation-backdrop {
        background: rgba(0, 0, 0, 0.3);
    }

    .hero {
        position: relative;

        min-height: 100%;

        padding:
            70px
            120px
            20px;

        background: #c7e6a3;
    }
    body.home-page > main {
    display: flex;
    flex-direction: column;
    }

    body.home-page > main .hero {
        flex: 1 0 auto;
    }

    .hero__inner {
        width: 100%;
        max-width: 1202px;

        margin: 0 auto;
    }

    .hero__logo {
        width: 329px;
        height: auto;

        margin:
            0
            auto
            44px;

        object-fit: contain;
    }

    .hero__content {
        width: 100%;
        max-width: 1202px;

        margin: 0 auto;
    }

    .hero h1 {
        margin: 0 0 20px;

        color: #104024;

        font-size: 55px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }

    .hero__intro {
        margin: 0 0 13px;

        color: #104024;

        font-size: 24px;
        line-height: 30px;
        font-weight: 700;

        text-align: left;
    }

    .hero__text {
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;

        text-align: left;
    }

/* Footer – Desktop */

.site-footer__content {
    position: relative;
    z-index: 1;

    width: 1440px;
    max-width: 100%;
    height: 240px;

    margin: 0 auto;
    padding: 0;

    color: #104024;
}

.site-footer {
    position: relative;

    width: min(100%, 1440px);
    max-width: 1440px;
    height: 240px;
    min-height: 240px;

    left: auto;

    margin-top: 0;
    margin-left: auto;
    margin-right: auto;

    overflow: hidden;

    background-color: #c7e6a3;
    background-image: url("/images/content/footer-desktop.svg");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 240px;
}

.site-footer__contact a {
    color: #104024;
    text-decoration: none;
}



/* Meta-Wrapper */

.site-footer__meta-row {
    position: static;
    display: block;
    margin: 0;
}


/* Social Icons */

    .site-footer__socials {
        position: absolute;
        inset: 0;
        display: block;
    }

    .site-footer__socials a {
        position: absolute;
        display: block;
        top: 88px;
    }

    /* Instagram */
    .site-footer__socials a:first-child {
        left: 121px;
        width: 59px;
        height: 59px;
    }

    /* YouTube */
    .site-footer__socials a:last-child {
        left: 276px;
        width: 83px;
        height: 59px;
    }

    .site-footer__socials img {
        display: block;
        width: 100%;
        height: 100%;
    }

/* Sprache im Desktop-Footer nicht anzeigen */

.site-footer__languages {
    display: none;
}

/* Impressum / Datenschutz / Kontakt */

.site-footer__legal {
    position: absolute;

    top: 88px;
    left: 1100px;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 11px;

    margin: 0;

    font-size: 20px;
    line-height: 26px;
    font-weight: 700;
}

.site-footer__legal a {
    color: #104024;
    text-decoration: none;
}


/* Adresse */

.site-footer__address {
    position: absolute;

    top: 87px;
    left: 737px;

    display: flex;
    flex-direction: column;

    width: 260px;

    font-size: 20px;
    line-height: 26px;

    color: #104024;
}

.site-footer__address strong {
    font-weight: 700;
}

.site-footer__address span {
    font-weight: 300;
}


/* Kontakt */

.site-footer__contact {
    position: absolute;
    top: 88px;
    left: 1046px;

    display: block;

    width: 275px;

    font-size: 20px;
    line-height: 26px;
    font-weight: 300;

    color: #104024;
    z-index: 2;
}
.site-footer__contact a {
    color: #104024;
    text-decoration: none;
}


/* Produkte – Desktop */

.products {
    width: 1440px;
    max-width: 100%;

    min-height: calc(100vh - 100px - 240px);

    margin-left: auto;
    margin-right: auto;

    padding: 70px 0 0;

    background: #c7e6a3;
    color: #104024;
}

.products__inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.products__header {
    text-align: center;
}

.products__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;
    text-align: center;
}

.products .page-wave {
    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 16px auto 79px;

    object-fit: fill;
}

.products__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 32px;
    row-gap: 35px;

    align-items: start;
}

.product-card {
    position: relative;

    width: 100%;
    min-height: 624px;

    padding: 27px 36px 14px 22px;

    display: flex;
    flex-direction: column;
    align-items: center;

    gap: 20px;

    border: 3px solid #75b63c;
    background: transparent;
}

.product-card__title {
    width: 100%;
    margin: 0;

    color: #104024;

    font-size: 36px;
    line-height: 38px;
    font-weight: 700;

    text-align: center;
}

.product-card__image {
    width: 230px;
    height: 369px;

    margin: 0 auto;

    object-fit: contain;
}

.product-card__summary {
    width: 100%;
    margin: 0;

    color: #104024;

    font-size: 24px;
    line-height: 28px;
    font-weight: 700;

    text-align: left;
}

.product-card__link {
    width: 100%;
    margin: 0;

    color: #75b63c;

    font-size: 24px;
    line-height: 28px;
    font-weight: 700;

    text-align: right;
    text-decoration: none;
}

.product-card__link:hover,
.product-card__link:focus-visible {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Produktdetail – Desktop */

    .product-detail {
        padding: 70px 120px 77px;

        background: #c7e6a3;
        color: #104024;
    }

    .product-detail__inner {
        width: 100%;
        max-width: 1200px;

        margin: 0 auto;
    }

    .product-detail__header {
        text-align: center;
    }

    .product-detail__title {
        margin: 0;

        font-size: 55px;
        line-height: 48px;
        font-weight: 700;

        text-align: center;
    }

    .product-detail .page-wave {
        width: 583px;
        height: 31px;

        margin: 21px auto 58px;

        object-fit: fill;
    }

    .product-detail__summary {
        width: 100%;
        margin: 0 0 32px;

        color: #104024;

        font-size: 24px;
        line-height: 30px;
        font-weight: 700;

        text-align: left;
    }

    .product-detail__content {
        display: grid;
        grid-template-columns: 584px 585px;

        column-gap: 32px;

        margin-top: 0;
    }

    .product-detail__image {
        display: block;

        width: auto;
        height: 500px;
        max-width: 100%;

        margin: 0 auto;

        object-fit: contain;
    }

    .product-detail__description {
        width: 100%;
        margin: 0;

        color: #000000;

        font-size: 22px;
        line-height: 28px;
        font-weight: 300;

        text-align: left;
    }

    .product-detail__description p {
        margin: 0 0 5px;
    }

    .product-detail__description p:last-child {
        margin-bottom: 0;
    }

/* Inspirationen – Desktop */

.inspirations {
    width: 1440px;
    max-width: 100%;

    min-height: calc(100vh - 100px - 240px);

    margin-left: auto;
    margin-right: auto;

    padding: 70px 120px 217px;

    background: #c7e6a3;
    color: #104024;
}

.inspirations__inner {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;
}

.inspirations__header {
    text-align: center;
}

.inspirations__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}


/* Welle unter "Inspirationen" */

.inspirations .page-wave {
    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 59px;

    object-fit: fill;
}


/* Zwei Karten nebeneinander */

.inspirations__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 32px;
}


/* Grundaufbau Karte */

.inspiration-card {
    position: relative;

    width: 100%;
    max-width: none;
    height: 584px;
    min-height: 584px;

    margin: 0;
    padding: 0;

    display: block;

    color: #104024;
    text-decoration: none;

    overflow: hidden;
}


/* Creme Karte */

.inspiration-card--cream {
    background: #f9f5eb;
}


/* Grüne Karte */

.inspiration-card--green {
    background: #a3d26f;
    color: #000000;
}


/* Bilder */

.inspiration-card__image {
    position: absolute;

    top: 32px;
    left: 50%;

    width: 435px;
    height: 303px;

    margin: 0;

    transform: translateX(-50%);

    object-fit: contain;
}


/* Textbereich */

.inspiration-card__content {
    position: absolute;

    left: 23px;
    right: 23px;
    top: 365px;

    width: auto;
    margin: 0;

    text-align: center;
}


/* Titel */

.inspiration-card__title {
    margin: 0 0 4px;

    font-size: 36px;
    line-height: 42px;
    font-weight: 700;

    text-align: center;
}


/* Beschreibung */

.inspiration-card__summary {
    margin: 0;

    font-size: 24px;
    line-height: 30px;
    font-weight: 300;

    text-align: center;
}


/* Kein Mobile-Hover-Rahmen auf Desktop */

.inspiration-card:hover,
.inspiration-card:focus-visible {
    outline: none;
}

/* Nachhaltigkeit – Desktop */

.sustainability {
    padding: 70px 120px 47px;

    background: #c7e6a3;
    color: #104024;
}

.sustainability__inner {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;
}

.sustainability__header {
    text-align: center;
}

.sustainability__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}


/* Welle unter Überschrift */

.sustainability .page-wave {
    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 56px;

    object-fit: fill;
}


/* Einleitung */

.sustainability__introduction {
    width: 100%;

    margin: 0 0 23px;

    font-size: 24px;
    line-height: 30px;
    font-weight: 700;

    color: #104024;
}


/* Akkordeon-Liste */

.sustainability__items {
    display: flex;
    flex-direction: column;

    gap: 5px;

    width: 100%;
}


/* Einzelner Eintrag */

.sustainability-item {
    width: 100%;

    margin: 0;

    overflow: hidden;

    background: #a3d26f;

    border-top: 3px solid #104024;
}


/* Kopfzeile */

.sustainability-item__summary {
    position: relative;

    width: 100%;
    min-height: 60px;

    padding: 0 52px 0 11px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 16px;

    cursor: pointer;
    list-style: none;

    background: #a3d26f;
}


/* Standard-Dreieck des Browsers entfernen */

.sustainability-item__summary::-webkit-details-marker {
    display: none;
}


/* Titel */

.sustainability-item__title {
    max-width: none;

    margin: 0;

    font-size: 24px;
    line-height: 26px;
    font-weight: 700;

    color: #104024;
}


/* Pfeil */

.sustainability-item__icon {
    position: absolute;

    right: 9px;
    top: 50%;

    width: 30px;
    height: 20px;

    transform: translateY(-50%);
    transform-origin: center;

    background:
        url("/images/content/accordion-down.svg")
        center center / contain
        no-repeat;

    transition: transform 0.3s ease;
}


/* geöffnet */

.sustainability-item[open] .sustainability-item__icon {
    transform: translateY(-50%) rotate(180deg);
}


/* aufgeklappter Inhalt */

.sustainability-item__content {
    background: #dcefd0;
}


/* Bild */

.sustainability-item__image {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* Text */

.sustainability-item__text {
    padding: 18px 11px 24px;

    font-size: 22px;
    line-height: 28px;
    font-weight: 300;

    color: #104024;
}



/* FAQ – Desktop */

.faq-page {
    padding: 70px 120px 53px;

    background: #c7e6a3;
    color: #104024;
}

.faq-page__inner {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;
}

.faq-page__header {
    text-align: center;
}

.faq-page__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}


/* Welle unter Überschrift */

.faq-page .page-wave {
    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 57px;

    object-fit: fill;
}


/* Liste */

.faq-list {
    display: flex;
    flex-direction: column;

    gap: 5px;

    width: 100%;
}


/* Eintrag */

.faq-item {
    width: 100%;

    margin: 0;

    overflow: hidden;

    background: #a3d26f;

    border-top: 3px solid #104024;
}


/* Frage */

.faq-item__summary {
    position: relative;

    width: 100%;
    min-height: 60px;

    padding: 0 74px 0 12px;

    display: flex;
    align-items: center;

    cursor: pointer;
    list-style: none;

    background: #a3d26f;
}

.faq-item__summary::-webkit-details-marker {
    display: none;
}


/* Fragetext */

.faq-item__title {
    max-width: none;

    font-size: 24px;
    line-height: 26px;
    font-weight: 700;

    color: #104024;
}


/* Pfeil */

.faq-item__icon {
    position: absolute;

    right: 10px;
    top: 50%;

    width: 30px;
    height: 20px;

    background:
        url("/images/content/accordion-down.svg")
        center center / contain
        no-repeat;

    transform: translateY(-50%);
    transform-origin: center;

    transition: transform 0.3s ease;
}


/* geöffnet */

.faq-item[open] .faq-item__icon {
    transform: translateY(-50%) rotate(180deg);
}


/* Antwort */

.faq-item__content {
    background: #deebd6;
}

.faq-item__answer {
    padding: 18px 12px 24px;

    font-size: 22px;
    line-height: 28px;
    font-weight: 300;

    color: #104024;


}

/* Aus der Welt des Schäfers – Desktop */

.inspiration-detail--aus-der-welt-des-schaefers {
    padding: 70px 120px 45px;

    background: #c7e6a3;
    color: #104024;
}

.inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__inner {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;
}

.inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__header {
    text-align: center;
}

.inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}


/* Welle */

.inspiration-detail--aus-der-welt-des-schaefers .page-wave {
    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 58px;

    object-fit: fill;
}


/* Intro */

.inspiration-detail--aus-der-welt-des-schaefers .inspiration-detail__introduction {
    width: 100%;

    margin: 0 0 48px;

    color: #104024;

    font-size: 24px;
    line-height: 30px;
    font-weight: 700;

    text-align: left;
}


/* Karten-Grid */

.inspiration-detail--aus-der-welt-des-schaefers .shepherd-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 32px;
    row-gap: 48px;
}


/* Einzelne Karte */

.inspiration-detail--aus-der-welt-des-schaefers .shepherd-card {
    position: relative;

    width: 100%;
    aspect-ratio: 1 / 1;

    overflow: hidden;

    color: #104024;
    text-decoration: none;
}


/* Bild */

.inspiration-detail--aus-der-welt-des-schaefers .shepherd-card__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* Titelband */

.inspiration-detail--aus-der-welt-des-schaefers .shepherd-card__title-wrap {
    position: absolute;

    top: 0;
    left: 0;
    right: 0;

    padding: 17px 19px 13px;

    background: rgba(163, 210, 111, 0.8);
}


/* Titel */

.inspiration-detail--aus-der-welt-des-schaefers .shepherd-card__title {
    margin: 0;

    font-size: 36px;
    line-height: 44px;
    font-weight: 700;

    text-align: left;
}


/* Fokus */

.inspiration-detail--aus-der-welt-des-schaefers .shepherd-card:focus-visible {
    outline: 3px solid #104024;
    outline-offset: 2px;
}

/* ========================================
   Schäfer Artikel Detail – Desktop
======================================== */

.shepherd-detail {
    padding: 70px 120px 71px;

    background: #c7e6a3;
    color: #104024;
}

.shepherd-detail__inner {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;
}


/* Überschrift */

.shepherd-detail__header {
    text-align: center;
}

.shepherd-detail__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}


/* Welle */

.shepherd-detail .page-wave {
    display: block;

    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 58px;

    object-fit: fill;
}


/* Kurzbeschreibung über beide Spalten */

.shepherd-detail__summary {

    margin: 0 0 28px;

    font-family: "trade-gothic-next", sans-serif;
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
}

/* ========================================
   Schäferwissen – Richtext
======================================== */

.shepherd-detail__description {
    font-family: "trade-gothic-next", sans-serif;
    color: #000;
}

.shepherd-detail__description h1,
.shepherd-detail__description h2,
.shepherd-detail__description h3,
.shepherd-detail__description p,
.shepherd-detail__description ul,
.shepherd-detail__description ol {
    margin-top: 0;
}

.shepherd-detail__description > :first-child {
    margin-top: 0;
}

.shepherd-detail__description p {
    margin: 0 0 26px;

    font-size: 22px;
    line-height: 28px;
    font-weight: 300;
}

.shepherd-detail__description h2 {
    margin: 22px 0 2px;

    font-size: 30px;
    line-height: 34px;
    font-weight: 700;
}

.shepherd-detail__description ul,
.shepherd-detail__description ol {
    margin: 0 0 26px;
    padding-left: 24px;

    font-size: 22px;
    line-height: 28px;
    font-weight: 300;
}

.shepherd-detail__description li {
    margin-bottom: 6px;
}

.shepherd-detail__description li:last-child {
    margin-bottom: 0;
}

.shepherd-detail__description strong,
.shepherd-detail__description b {
    font-weight: 700;
}




/* Bild + Text */

.shepherd-detail__content {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    column-gap: 34px;

    align-items: start;

    width: 100%;
}


/* Bildbereich */

.shepherd-detail__image-wrap {
    width: 100%;
    max-width: 584px;

    aspect-ratio: 1 / 1;

    overflow: hidden;
}

.shepherd-detail__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}




/* ========================================
   Shibas Kitchen – Desktop
======================================== */

.inspiration-detail--shibas-kitchen {
    padding: 70px 120px 40px;

    background: #f9f5eb;
    color: #104024;
}

.inspiration-detail--shibas-kitchen .inspiration-detail__inner {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;
}


/* Überschrift */

.inspiration-detail--shibas-kitchen .inspiration-detail__header {
    text-align: center;
}

.inspiration-detail--shibas-kitchen .inspiration-detail__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}


/* Welle */

.inspiration-detail--shibas-kitchen .page-wave {
    display: block;

    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 58px;

    object-fit: fill;
}


/* Einleitung */

.inspiration-detail--shibas-kitchen .inspiration-detail__introduction {
    width: 100%;

    margin: 0 0 72px;

    font-size: 24px;
    line-height: 30px;
    font-weight: 700;

    color: #104024;

    text-align: left;
}


/* Shibas Kitchen – Desktop */

.inspiration-detail--shibas-kitchen {
    padding: 70px 120px 40px;
    background: #f9f5eb;
    color: #104024;
}

.inspiration-detail--shibas-kitchen .inspiration-detail__inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.inspiration-detail--shibas-kitchen .inspiration-detail__header {
    text-align: center;
}

.inspiration-detail--shibas-kitchen .inspiration-detail__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    text-align: center;
}

.inspiration-detail--shibas-kitchen .page-wave {
    display: block;

    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 58px;

    object-fit: fill;
}

.inspiration-detail--shibas-kitchen .inspiration-detail__introduction {
    width: 100%;

    margin: 0 0 72px;

    font-size: 24px;
    line-height: 30px;
    font-weight: 700;

    color: #104024;
    text-align: left;
}

/* Rezept-Grid */

.inspiration-detail--shibas-kitchen .recipe-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 32px;
    row-gap: 59px;

    width: 100%;
}

/* Rezeptkarte */

.inspiration-detail--shibas-kitchen .recipe-card {
    position: relative;

    width: 100%;
    aspect-ratio: 1 / 1;

    overflow: hidden;

    color: #104024;
    text-decoration: none;

    cursor: pointer;
}

/* Bild */

.inspiration-detail--shibas-kitchen .recipe-card__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

/* Titelband */

.inspiration-detail--shibas-kitchen .recipe-card__title-wrap {
    position: absolute;

    top: 0;
    left: 0;
    right: 0;

    padding: 17px 19px 13px;

    background: rgba(249, 245, 235, 0.8);
}

/* Titel */

.inspiration-detail--shibas-kitchen .recipe-card__title {
    margin: 0;

    font-size: 36px;
    line-height: 44px;
    font-weight: 700;

    color: #104024;
    text-align: left;
}

.inspiration-detail--shibas-kitchen .recipe-card:focus-visible {
    outline: 3px solid #104024;
    outline-offset: 2px;
}

.recipe-detail {
    width: min(100%, 1440px);
    max-width: 1440px;

    margin-left: auto;
    margin-right: auto;

    padding: 70px 120px 80px;

    background-color: #f9f5eb;
    color: #104024;
}

.recipe-detail__inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.recipe-detail__header {
    width: 100%;
    text-align: center;
}

.recipe-detail__heading {
    margin: 0;

    font-size: 55px;
    line-height: 48px;
    font-weight: 700;

    color: #104024;
}

.recipe-detail .page-wave {
    display: block;
    width: 583px;
    max-width: 100%;
    height: 31px;

    margin: 21px auto 59px;

    object-fit: fill;
}

.recipe-detail__intro {
    width: 100%;
    margin: 0 0 23px;

    font-size: 24px;
    line-height: 30px;
    font-weight: 700;

    color: #104024;
}

.recipe-detail__content {
    display: grid;
    grid-template-columns: minmax(0, 584px) minmax(0, 584px);
    column-gap: 32px;
    align-items: start;
}

.recipe-detail__media {
    width: 100%;
}

.recipe-detail__image {
    display: block;
    width: 100%;
    height: 584px;

    object-fit: cover;
}

.recipe-detail__body {
    width: 100%;

    font-size: 22px;
    line-height: 28px;
    font-weight: 300;

    color: #000000;
}

.recipe-section {
    margin: 0 0 28px;
}

.recipe-section__heading {
    margin: 0;

    font-size: 22px;
    line-height: 28px;
    font-weight: 700;

    color: #000000;
}

.recipe-section__list {
    margin: 0;
    padding-left: 29px;

    font-size: 22px;
    line-height: 28px;
    font-weight: 300;
}

.recipe-section__list li {
    margin: 0 0 5px 0;
    padding: 0;
}

.recipe-detail__external {
    margin-top: 0;
    text-align: right;
}

.recipe-detail__external-link {
    font-size: 22px;
    line-height: 28px;
    font-weight: 700;

    color: #000000;
    text-decoration: none;
}

.recipe-detail__external-link:hover {
    text-decoration: underline;
}

.recipe-detail__summary {
    margin: 0 0 28px;
    font-size: 22px;
    line-height: 28px;
    font-weight: 700;
    color: #104024;
}

.legal-page {
        max-width: 1440px;
        padding: 90px 120px 120px;
    }

    .legal-page__inner {
        max-width: 1200px;
    }

    .legal-page__heading {
        font-size: 48px;
        line-height: 52px;
    }

    .legal-page__content {
        max-width: 1000px;
        margin: 60px auto 0;

        font-size: 22px;
        line-height: 32px;
    }

    .legal-page__content h2 {
        margin: 48px 0 16px;

        font-size: 34px;
        line-height: 40px;
    }

    .legal-page__content h3 {
        margin: 34px 0 12px;

        font-size: 27px;
        line-height: 34px;
    }

    .legal-page__content p {
        margin: 0 0 22px;
    }

/* ========================================
   Kontakt – Desktop
======================================== */

.contact-page {
    width: 1440px;
    max-width: 100%;

    margin: 0 auto;
    padding: 70px 120px 100px;
}

.contact-page__inner {
    max-width: 1200px;
}

.contact-page__heading {
    font-size: 55px;
    line-height: 48px;
}

.contact-page .page-wave {
    width: 583px;
    margin: 21px auto 50px;
}

.contact-page__intro {
    margin-bottom: 14px;

    font-size: 24px;
    line-height: 30px;
}

.contact-form__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
}

.contact-form__field {
    gap: 8px;
}

.contact-form__field label {
    font-size: 22px;
    line-height: 26px;
}

.contact-form__field input,
.contact-form__field textarea {
    font-size: 22px;
    line-height: 28px;
}

.contact-form__field input {
    height: 60px;
    padding: 0 20px;
}

.contact-form__field textarea {
    min-height: 528px;
    padding: 16px 20px;
}

.contact-form__field--email {
    width: calc((100% - 40px) / 2);
    margin-top: 16px;
}

.contact-form__field--message {
    margin-top: 16px;
}

.contact-form__submit {
    width: 200px;
    height: 60px;

    margin-top: 36px;

    font-size: 22px;
}

.contact-success {
    width: 1440px;
    max-width: 100%;

    margin: 0 auto;
    padding: 220px 120px 100px;
}

.contact-success__inner {
    max-width: 1200px;
}

.contact-success__message {
    font-size: 24px;
    line-height: 30px;
}








}