@charset "UTF-8";
/* =============================================================== *\
   Shared Entry Point

   Styles, die im Frontend und im Editor geladen werden.

   Wird nach build/shared.css kompiliert
   und in beiden Kontexten verwendet.
\* =============================================================== */
/* =============================================================== *\
   Variablen (Farben, Spacing, Radius, Shadow)
\* =============================================================== */
:root {
  /* Theme Colors */
  --ud-theme-100: #f4f5f3;
  --ud-theme-200: #e3e5e0;
  --ud-theme-300: #c8cbc4;
  --ud-theme-400: #a4a8a0;
  --ud-theme-500: #7a7f77;
  --ud-theme-600: #51564f;
  --ud-theme-700: #2e312c;
  --ud-theme-750: #1D1D1D;
  --ud-theme-800: #161714;
  --ud-theme-850: #151613;
  --ud-theme-900: #0E0E0E;
  /* Highlight Colors */
  --ud-highlight-100: #e6f7f8;
  --ud-highlight-200: #c8eef1;
  --ud-highlight-300: #9fe0e6;
  --ud-highlight-400: #63cdd8;
  --ud-highlight-500: #1fb6c9;
  --ud-highlight-600: #1695a5;
  --ud-highlight-700: #117580;
  --ud-highlight-800: #0b555c;
  --ud-highlight-900: #06373b;
  /* Shadows */
  --ud-shadow-100: 0 1px 2px rgba(0, 0, 0, 0.06);
  --ud-shadow-200: 0 1px 3px rgba(0, 0, 0, 0.08);
  --ud-shadow-300: 0 2px 4px rgba(0, 0, 0, 0.1);
  --ud-shadow-400: 0 3px 6px rgba(0, 0, 0, 0.12);
  --ud-shadow-500: 0 4px 8px rgba(0, 0, 0, 0.14);
  --ud-shadow-700: 0 6px 12px rgba(0, 0, 0, 0.18);
  --ud-shadow-900: 0 8px 16px rgba(0, 0, 0, 0.22);
  /* =============================================================== *\
         UI-Farbschema

         Übersicht und Varianten:
         ulrichdigital_block_theme > color_system.html
     \* =============================================================== */
  /* Positive (Green) */
  --ud-positive-100: #fbfefc;
  --ud-positive-200: #e6f9ec;
  --ud-positive-300: #d1f3da;
  --ud-positive-400: #b0ebc6;
  --ud-positive-500: #30a46c;
  --ud-positive-600: #299764;
  --ud-positive-700: #18794e;
  --ud-positive-800: #193b2d;
  --ud-positive-900: #0d1912;
  /* Warning (Amber) */
  --ud-warning-100: #fefdfb;
  --ud-warning-200: #fef6e7;
  --ud-warning-300: #ffedc7;
  --ud-warning-400: #ffd386;
  --ud-warning-500: #f5a623;
  --ud-warning-600: #e08d00;
  --ud-warning-700: #ad5700;
  --ud-warning-800: #5f2a00;
  --ud-warning-900: #341500;
  /* Error (Red) */
  --ud-error-100: #fffcfc;
  --ud-error-200: #fef0ef;
  --ud-error-300: #fdd8d7;
  --ud-error-400: #fbb5b4;
  --ud-error-500: #e5484d;
  --ud-error-600: #d93d42;
  --ud-error-700: #cd2b31;
  --ud-error-800: #381316;
  --ud-error-900: #1f0a0a;
  /* Info (Blue) */
  --ud-info-100: #fbfdff;
  --ud-info-200: #edf6ff;
  --ud-info-300: #e1f0ff;
  --ud-info-400: #cee7fe;
  --ud-info-500: #0091ff;
  --ud-info-600: #0880ea;
  --ud-info-700: #0b68cb;
  --ud-info-800: #113264;
  --ud-info-900: #0a0e1c;
  /* Neutral (Gray) */
  --ud-neutral-100: #fcfcfc;
  --ud-neutral-200: #f8f9fa;
  --ud-neutral-300: #f1f3f5;
  --ud-neutral-400: #e6e8eb;
  --ud-neutral-500: #9ba1a6;
  --ud-neutral-600: #6c7278;
  --ud-neutral-700: #464b50;
  --ud-neutral-800: #11181c;
  --ud-neutral-900: #0d0f11;
  /* =============================================================== *\
      Layout & Spacing
  \* =============================================================== */
  /* Radius */
  --ud-radius-100: 8px;
  --ud-radius-200: 10px;
  --ud-radius-300: 12px;
  --ud-radius-400: 18px;
  --ud-radius-500: 24px;
  --ud-radius-600: 36px;
  --ud-radius-700: 42px;
  --ud-radius-800: 48px;
  --ud-radius-900: 1000px;
  /* Theme Layout */
  --ud-site-inline-spacing: 60px;
}

/* =============================================================== *\
   Anpassungen für Mobile (Variablen)
\* =============================================================== */
@media screen and (max-width: 800px) {
  :root {
    --ud-site-inline-spacing: 30px;
  }
}
/* =============================================================== *\
   Shared Entry Point

   Styles, die im Frontend und im Editor geladen werden.

   Wird nach build/shared.css kompiliert
   und in beiden Kontexten verwendet.
\* =============================================================== */
/* =============================================================== *\
    Image
    Block-Style: abgerundete Ecken
\* =============================================================== */
.wp-block-image.is-style-ud-rounded-24 img {
  border-radius: 24px;
}
@media screen and (max-width: 800px) {
  .wp-block-image.is-style-ud-rounded-24 img {
    border-radius: 12px;
  }
}

/* =============================================================== *\
    Gallery
\* =============================================================== */
.wp-block-gallery {
  display: grid !important;
  margin-right: auto;
  margin-left: auto;
  gap: 32px;
  width: 100%;
  max-width: 1920px;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
  --gallery-block--gutter-size: 32px;
}
.wp-block-gallery > .wp-block-image,
.wp-block-gallery > .blocks-gallery-item {
  margin: 0;
  width: auto !important;
}
.wp-block-gallery img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: var(--ud-shadow-900);
}

.wp-lightbox-overlay.zoom.active .scrim {
  filter: invert(1) opacity(0.8);
}

.wp-block-site-logo.is-default-size img {
  width: 275px;
}
@media screen and (max-width: 800px) {
  .wp-block-site-logo.is-default-size img {
    width: 200px;
  }
}

/* =============================================================== *\
   Media-Text
\* =============================================================== */
@media screen and (max-width: 900px) {
  .wp-block-media-text.is-stacked-on-mobile {
    display: flex;
    flex-direction: column;
  }
}
@media screen and (max-width: 900px) {
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
    width: 100%;
    margin-bottom: 3rem;
  }
}
.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media img {
  box-shadow: var(--ud-shadow-900);
  border-radius: 24px;
}
.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
  min-width: 0;
  max-width: 100%;
}
@media screen and (max-width: 900px) {
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
    padding: 0;
  }
}
.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content > * + * {
  margin-top: 2rem;
}

/* =============================================================== *\
   Title
\* =============================================================== */
.wp-block-media-text.karte_weggis.is-stacked-on-mobile .wp-block-media-text__media img {
  box-shadow: none;
  border-radius: 0;
}

/* =============================================================== *\
   Button allgemein
\* =============================================================== */
:root :where(.wp-element-button, .wp-block-button__link),
.wp-block-button__link.wp-element-button,
.wp-block-button__link {
  width: fit-content;
  padding: 0.6rem 1rem;
  background-color: var(--ud-theme-700);
  border-radius: 100px;
  font-size: 1rem;
  line-height: 1;
}

/* =============================================================== *\
    Button
    Block-Style: Pfeil rechts oder links
\* =============================================================== */
.wp-block-button.is-style-ud-arrow-left .wp-block-button__link, .wp-block-button.is-style-ud-arrow-right .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  box-shadow: var(--ud-shadow-900);
}
.wp-block-button.is-style-ud-arrow-left .wp-block-button__link::before, .wp-block-button.is-style-ud-arrow-left .wp-block-button__link::after, .wp-block-button.is-style-ud-arrow-right .wp-block-button__link::before, .wp-block-button.is-style-ud-arrow-right .wp-block-button__link::after {
  font-family: "Font Awesome 7 Sharp";
  font-weight: 100;
  line-height: 1;
  transition: transform 0.2s ease;
}
.wp-block-button.is-style-ud-arrow-left .wp-block-button__link::before {
  content: "\f060";
  padding-right: 0.5rem;
}
.wp-block-button.is-style-ud-arrow-left .wp-block-button__link:hover::before {
  transform: translateX(-4px);
}
.wp-block-button.is-style-ud-arrow-right .wp-block-button__link::after {
  content: "\f061";
  padding-left: 0.5rem;
}
.wp-block-button.is-style-ud-arrow-right .wp-block-button__link:hover::after {
  transform: translateX(4px);
}