/* === HERO === */

@media screen and (max-width: 1023px) {
    #start__hero > img,
    #start__img-alpakas,
    .cntnr-hero__img {
        aspect-ratio: 1 / 1;
    }
}

/* === MENU === */

.menu > :last-child {
    border-bottom: 2px solid var(--brand-color-main);
}

.menu-cols {
    border-top: 2px solid var(--brand-color-main);
    border-bottom: 2px solid var(--brand-color-main);
}

.menu-cols > :nth-child(2) {
    border-left: 2px solid var(--brand-color-main);
}

@media screen and (max-width: 1023px) {
    .menu-cols > :first-child {
        border-right: none;
    }
    .menu-cols > :nth-child(2) {
        border-left: none;
    }
}

.menu-cols > * {
    padding-top: var(--grid__medium);
    padding-bottom: var(--grid__medium);
}

@media screen and (max-width: 1023px) {
    .menu-cols > * {
        padding-top: 0;
        padding-bottom: var(--grid__medium);
    }
}

@media screen and (max-width: 1023px) {
    .menu-cols {
        padding-top: var(--grid__medium);
    }
}

.menu-footer > * {
    padding-top: var(--grid__medium);
    padding-bottom: var(--grid__medium);
}

.menu .menu__title {
    text-transform: uppercase;
    font-size: var(--font-size__regular);
    font-weight: var(--font-weight__bold);
}

.menu .menu__subtitle {
    font-size: var(--font-size__small-reg);
    font-weight: var(--font-weight__medium);
    font-style: italic;
}

.menu .menu__descr {
    font-size: var(--font-size__regular);
    font-weight: var(--font-weight__regular);
}

.menu .menu__price {
    text-transform: uppercase;
    font-size: var(--font-size__small-reg);
    font-weight: var(--font-weight__bold);

}

.menu .menu__amount {
    text-transform: uppercase;
    font-size: var(--font-size__small-reg);
    font-weight: var(--font-weight__regular);

}

.menu__badge {
    display: block;
    width: 100%;
    max-width: 700px;
    margin-inline: auto;
    overflow: visible;
}

.arc-text {
    display: block;
    width: 300px;          /* beide GLEICH breit halten, sonst unterschiedliche Schriftgröße */
    max-width: 100%;
    height: auto;
    overflow: visible;
  }

#marquee__menu {
    transform: rotate(-1.5deg);
}

#menu__nav {
    overflow-x: auto;
    overflow-y: hidden;
}

#menu__nav .button-general {
    white-space: nowrap;
    flex-shrink: 0;
}

/* === EVENTS === */

#events > * {
    border-top: 2px solid var(--main-light);
    gap: 0px !important;
}

#events article {
    border-bottom: 2px solid var(--main-light);
    padding: var(--grid__small) 0 !important;
}

#events article > div {
    gap: var(--grid__small) !important;
}

#events .event__date {
    font-family: 'sltr-font-h';
    font-size: var(--font-size__large);

}

#events .event__month {
    font-size: var(--font-size__regular);
    font-weight: var(--font-weight__medium);
    text-transform: uppercase;
}

#events .event__title {
    font-size: var(--font-size__regular);
    font-weight: var(--font-weight__bold);
    text-transform: uppercase;
}

#events .event__descr * {
    text-align: left;
}

/* === PARTIES === */



/* === BACKGROUNDS === */

#start__about {
    background-image: url("/wp-content/uploads/2026/08/Saliterhof_KEYVISUAL_Bckgrnd-001_001_1000_SCREENtrans.png");
    background-position: left -25% bottom -10%;
    background-repeat: no-repeat;
}

/* === BREAKDANCE MENU - OFFCANVAS === */

#offcanvas__menu .breakdance-menu a {
  justify-content: flex-end !important;
}

#offcanvas__menu .breakdance-menu a:hover,
#offcanvas__menu .breakdance-menu a:hover > span {
  color: var(--brand-color-sec) !important;
}

#offcanvas__menu .breakdance-menu-list * {
  font-size: var(--font-size__medium-large) !important;
  text-align: right;
}

#offcanvas__menu .breakdance-dropdown-body {
  width: 100%;
  background-color: transparent !important;
  box-shadow: none !important;
  border-radius: none !important;
  overflow: hidden;
}


#offcanvas__menu .breakdance-menu-list > .menu-item {
  border-bottom: 2px solid var(--main-light) !important;
}

#offcanvas__menu .breakdance-menu-item--active * {
    color: var(--main-light) !important;
}

#offcanvas__menu .breakdance-menu-link-arrow:after {
  font-size: var(--link-arrow-size);
  width: 1em;
  height: 1em;
  background-color: var(--main-light) !important;
}

/* === BLOGPOSTS === */

#blogposts article {
    border-radius: var(--radius-small);
    border: 2px solid var(--brand-color-sec);
    background-color: var(--main-lightest);
}

#blogposts article > .cntnr-content > div {
    padding: 0 var(--grid__x-small) var(--grid__x-small) var(--grid__x-small);

    text-align: left;

}

/* === JOBS === */

#jobs article {
    border-radius: var(--radius-small);
    border: 2px solid var(--brand-color-sec);
    background-color: var(--main-lightest);
}

#jobs article > .cntnr-content > div {
    padding: var(--grid__x-small);

    text-align: left;

}