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

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Variablen
\* =============================================================== */
:root {
  /* Theme */
  --ud-theme-100: #ffffff;
  --ud-theme-200: #fffef9;
  --ud-theme-200: #faf9f2;
  --ud-theme-300: #fffdf0;
  --ud-theme-400: #f5f3e6;
  --ud-theme-430: #e5e2d0;
  --ud-theme-450: #d8d3bd;
  --ud-theme-450-40: #d8d3bd71;
  --ud-theme-500: #cfcbbf;
  --ud-theme-600: #b5b1a4;
  --ud-theme-700: #8f8b80;
  --ud-theme-800: #6c6860;
  --ud-theme-900: #4a4741;
  /* Accent */
  --ud-accent-100: #fffbe0;
  --ud-accent-200: #fff5b8;
  --ud-accent-300: #ffed8a;
  --ud-accent-400: #f8e46f;
  --ud-accent-500: #f2dd61;
  --ud-accent-600: #d8c33f;
  --ud-accent-700: #ad9a2e;
  --ud-accent-800: #78691f;
  --ud-accent-900: #453b10;
  /* Text */
  --ud-text-100: #ffffff;
  --ud-text-200: #d9d9d9;
  --ud-text-300: #b5b5b5;
  --ud-text-400: #737373;
  --ud-text-500: #252525;
  --ud-text-600: #1f1f1f;
  --ud-text-700: #191919;
  --ud-text-800: #111111;
  --ud-text-900: #000000;
  /* Muted */
  --ud-muted-100: rgba(0, 0, 0, 0.08);
  --ud-muted-200: rgba(0, 0, 0, 0.16);
  --ud-muted-300: rgba(0, 0, 0, 0.24);
  --ud-muted-400: rgba(0, 0, 0, 0.32);
  --ud-muted-500: rgba(0, 0, 0, 0.38);
  --ud-muted-600: rgba(0, 0, 0, 0.48);
  --ud-muted-700: rgba(0, 0, 0, 0.58);
  --ud-muted-800: rgba(0, 0, 0, 0.68);
  --ud-muted-900: rgba(0, 0, 0, 0.78);
  /* Spacing */
  --ud-space-050: 4px;
  --ud-space-100: 8px;
  --ud-space-200: 12px;
  --ud-space-300: 16px;
  --ud-space-400: 20px;
  --ud-space-500: 24px;
  --ud-space-600: 32px;
  --ud-space-700: 40px;
  --ud-space-800: 48px;
  --ud-space-900: 64px;
  /* Radius */
  --ud-radius-100: 8px;
  --ud-radius-200: 10px;
  --ud-radius-300: 12px;
  --ud-radius-350: 16px;
  --ud-radius-400: 18px;
  --ud-radius-500: 24px;
  --ud-radius-600: 36px;
  --ud-radius-700: 42px;
  --ud-radius-800: 48px;
  --ud-radius-900: 1000px;
  /* Shadow */
  --ud-shadow-100: 6px 9px 20px rgba(0, 0, 0, 0.01);
  --ud-shadow-200: 0 -8px 20px rgba(0, 0, 0, 0.03);
  --ud-shadow-300: 0 0.25rem 1rem rgba(0, 0, 0, 0.08);
  --ud-shadow-400: 0 3px 6px rgba(0, 0, 0, 0.12);
  --ud-shadow-500: 4px 4px 8px rgba(0, 0, 0, 0.14);
  --ud-shadow-600: 5px 5px 10px rgba(0, 0, 0, 0.16);
  --ud-shadow-700: 1.25rem 1.25rem 3rem rgba(0, 0, 0, 0.12);
  --ud-shadow-800: 7px 7px 14px rgba(0, 0, 0, 0.2);
  --ud-shadow-900: 8px 8px 16px rgba(0, 0, 0, 0.22);
  /* Layout */
  --ud-site-inline-spacing: 60px;
}

/* =============================================================== *\
   Anpassungen für Mobile
\* =============================================================== */
@media screen and (max-width: 800px) {
  :root {
    --ud-site-inline-spacing: 30px;
  }
}
@media screen and (max-width: 600px) {
  :root {
    --ud-site-inline-spacing: 15px;
  }
}
/* =============================================================== *\
   CSS-Reset
\* =============================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  -webkit-font-smoothing: subpixel-antialiased; /* Safari, Chrome */
  -moz-osx-font-smoothing: auto; /* Firefox (kein subpixel support, aber auto ≈ subpixel) */
  text-rendering: optimizeLegibility; /* Optional: bessere Kerning/Lesbarkeit */
  text-size-adjust: 100%;
  line-height: 1.5;
}

body {
  line-height: inherit;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

button,
input,
textarea,
select {
  font: inherit;
  margin: 0;
}

textarea {
  resize: vertical;
}

button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}

a {
  text-decoration: none;
  color: inherit;
}

ul[role=list],
ol[role=list] {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote, dl, dd {
  margin: 0;
  padding: 0;
}

strong {
  font-weight: bold;
}

hr {
  border: none;
  height: 1px;
  background-color: currentColor;
}

blockquote {
  margin: 0;
  padding-left: 1.5rem;
  border-left: 4px solid currentColor;
}

:focus {
  outline: 2px solid #000;
  outline-offset: 2px;
}

:focus:not(:focus-visible) {
  outline: none;
}

/* =============================================================== *\ 
   Input-Elemente
\* =============================================================== */
/* Entfernt die Autofill-Hintergrundfarbe und -Textfarbe, um den Stil des Inputs zu übernehmen */
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 30px transparent inset !important; /* Setzt den Autofill-Hintergrund auf transparent */
  -webkit-text-fill-color: inherit !important; /* Vererbt die Textfarbe */
}

/* Entfernt die Pfeile (Spinners) in WebKit-basierten Browsern (Chrome, Safari, Edge) */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Entfernt die Pfeile in Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* Dropdown-Pfeil bei select-Elementen */
/* Entfernt den Standard-Pfeil in WebKit-basierten Browsern */
select::-webkit-inner-spin-button,
select::-webkit-appearance {
  -webkit-appearance: none;
}

/* Entfernt den Standard-Pfeil in Firefox */
select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  /*font-size: 100%;"*/
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  /*line-height: 1;*/
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* =============================================================== *\ 
   Form-Reset
\* =============================================================== */
input,
select,
textarea,
button {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  font-family: inherit;
  font-size: 100%;
}

/* =============================================================== *\
   Frontend Entry Point

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Basis HTML-Elemente
\* =============================================================== */
body {
  background-color: var(--ud-theme-400);
  color: var(--ud-text-500);
  line-height: 1.33;
  font-optical-sizing: auto;
  font-kerning: normal;
  font-feature-settings: "kern" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-repeat: repeat;
  mix-blend-mode: darken;
  opacity: 0.04;
  background-image: url("../assets/images/rauschen_1000_optimiert.webp");
  background-size: 500px 500px;
}

/* =============================================================== *\
   Formularfelder
\* =============================================================== */
input,
textarea {
  margin: 0;
  border: none;
  padding: 10px 16px;
  line-height: 1em;
}

input:focus,
textarea:focus {
  border: none;
  outline: none;
}

input[type=submit] {
  border: 1px solid;
  border-radius: var(--ud-radius-900);
  padding: 0.7rem 1.4rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  cursor: pointer;
}

/* =============================================================== *\
   Block-Style: Liste: Kundenliste
\* =============================================================== */
.wp-block-group.ud-section > .wp-block-list.is-style-kundenliste {
  width: 100%;
  max-width: 1120px !important;
  list-style: none;
  padding: 0;
  columns: 3 15rem;
  column-gap: clamp(2rem, 4vw, 4rem);
  line-height: 1.35;
}
.wp-block-group.ud-section > .wp-block-list.is-style-kundenliste li {
  break-inside: avoid;
  margin: 0 0 0.15em;
  padding: 0;
}

@media screen and (max-width: 900px) {
  .wp-block-group.ud-section > .wp-block-list.is-style-kundenliste {
    columns: 2 16rem;
  }
}
@media screen and (max-width: 600px) {
  .wp-block-group.ud-section > .wp-block-list.is-style-kundenliste {
    columns: 1;
  }
}
/* =============================================================== *\
   Frontend Entry Point

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Layout
\* =============================================================== */
body .wp-site-blocks > .entry-content.wp-block-post-content,
body .wp-site-blocks > .ud-single-post > .entry-content.wp-block-post-content {
  padding-right: var(--ud-site-inline-spacing);
  padding-left: var(--ud-site-inline-spacing);
}
body .wp-site-blocks > .entry-content.wp-block-post-content > :is(.wp-block-ud-ulrichdigital-section.ud-section,
.wp-block-group.ud-section),
body .wp-site-blocks > .ud-single-post > .entry-content.wp-block-post-content > :is(.wp-block-ud-ulrichdigital-section.ud-section,
.wp-block-group.ud-section) {
  margin-left: max(0px, var(--ud-section-left) - var(--ud-site-inline-spacing));
}
body .wp-site-blocks > .entry-content.wp-block-post-content > .alignfull,
body .wp-site-blocks > .ud-single-post > .entry-content.wp-block-post-content > .alignfull {
  margin-right: calc(var(--ud-site-inline-spacing) * -1);
  margin-left: calc(var(--ud-site-inline-spacing) * -1);
  width: calc(100% + var(--ud-site-inline-spacing) * 2);
  max-width: none;
}
body.single-referenz .wp-site-blocks > .entry-content.wp-block-post-content {
  margin-top: 0;
}
body.page-template-kontakt-seite {
  background: var(--ud-accent-500);
}
body.page-template-kontakt-seite::before {
  opacity: 0;
}
body.page-template-kontakt-seite main {
  min-height: 100vh;
}
body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section {
  --ud-card-grid-gap: clamp(
  	var(--ud-space-500),
  	3vw,
  	var(--ud-space-700)
  );
  gap: 0;
  padding-block: 0 clamp(80px, 9vw, 140px);
}
body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section > .ud-section__head {
  display: none;
}
body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section .ud-card-grid--contact {
  gap: var(--ud-card-grid-gap);
  width: 100%;
  max-width: none;
}
body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section .ud-contact-card {
  min-height: 140px;
  padding: 0;
  translate: 0 4px;
  transition: opacity var(--ud-motion-duration-reveal) var(--ud-motion-easing) var(--ud-motion-delay), transform var(--ud-motion-duration-reveal) var(--ud-motion-easing) var(--ud-motion-delay), translate 420ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}
body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section .ud-contact-card:hover, body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section .ud-contact-card:focus-within {
  box-shadow: var(--ud-shadow-300);
  translate: 0 0;
}
body.page-template-kontakt-seite footer {
  box-shadow: none;
  margin-top: 0;
}
body.page-template-kontakt-seite footer .ud-section {
  display: none;
  opacity: 0;
}
body.page-template-kontakt-seite .ud-dynamic-cta {
  display: none;
}
@media screen and (max-width: 900px) {
  body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section .ud-card-grid--contact {
    grid-template-columns: 1fr;
  }
  body.page-template-kontakt-seite .entry-content.wp-block-post-content > .ud-page-hero--text + .wp-block-ud-ulrichdigital-section.ud-section .ud-contact-card {
    min-height: 0;
  }
}

/* =============================================================== *\
   Seitentitel
\* =============================================================== */
body .wp-site-blocks .wp-block-post-title {
  margin-top: clamp(180px, 10vw, 200px);
  margin-right: auto;
  margin-bottom: calc(var(--ud-space-900) + var(--ud-space-500));
  margin-left: auto;
  padding-right: var(--ud-site-inline-spacing);
  padding-left: var(--ud-site-inline-spacing);
  width: 100%;
  max-width: calc(var(--wp--style--global--content-size) + var(--ud-site-inline-spacing) * 2);
}
body .wp-site-blocks > .wp-block-post-title + .entry-content.wp-block-post-content {
  margin-top: 0;
}

/* =============================================================== *\
   Listen im Content
\* =============================================================== */
.entry-content ul {
  padding-top: var(--ud-space-100);
  padding-bottom: var(--ud-space-100);
  padding-left: var(--ud-space-400);
  list-style: disc;
}

/* =============================================================== *\
   Frontend Entry Point

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Header
\* =============================================================== */
header.wp-block-template-part {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
  padding: var(--ud-space-300) 0 var(--ud-space-300) var(--ud-space-300);
  width: 100%;
  background-color: rgba(0, 0, 0, 0.001);
  transition: transform 0.28s ease;
  backdrop-filter: blur(0);
}
header.wp-block-template-part > .wp-block-group {
  width: 100%;
}
header.wp-block-template-part a:focus,
header.wp-block-template-part a:focus-visible,
header.wp-block-template-part button:focus,
header.wp-block-template-part button:focus-visible {
  outline: none;
  box-shadow: none;
}
header.wp-block-template-part li a {
  color: var(--ud-text-500);
}
header.wp-block-template-part li a:hover {
  color: var(--ud-theme-600);
}

header.wp-block-template-part.is-hidden {
  transform: translateY(-100%);
}

body.ud-dynamic-cta-overlay-is-open header.wp-block-template-part {
  z-index: 0;
  pointer-events: none;
}

@media (min-width: 801px) {
  header.wp-block-template-part.is-over-page-hero li a {
    color: var(--ud-theme-100);
  }
  header.wp-block-template-part.is-over-page-hero li a:hover {
    color: var(--ud-theme-300);
  }
}
/* =============================================================== *\
   Header-Zeile
\* =============================================================== */
.ud_header_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ud-space-600);
  margin: 0;
  padding: 0;
  width: 100%;
}
.ud_header_row .wp-block-site-logo,
.ud_header_row .custom-logo-link {
  display: flex;
  align-items: center;
  margin: 0;
  width: 140px;
}
.ud_header_row .custom-logo {
  display: block;
  width: auto;
}
.ud_header_row .wp-block-list {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ud_header_row .wp-block-list li {
  display: flex;
  margin: 0;
  padding: 0;
}
.ud_header_row .wp-block-list a {
  display: inline-flex;
  align-items: center;
  padding: 0.65rem 1.25rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: color 180ms ease, transform 180ms ease;
}
.ud_header_row .wp-block-list li:last-child a {
  padding-right: var(--ud-space-300);
}

/* =============================================================== *\
   Logo
\* =============================================================== */
.ud-site-logo {
  --ud-site-logo-offset-x: 0.35rem;
  --ud-site-logo-icon-size: 0.82em;
  --ud-site-logo-icon-width: calc(var(--ud-site-logo-icon-size) * 1.25);
  --ud-site-logo-icon-gap: 0.5rem;
  --ud-site-logo-padding-x: 14px;
  --ud-site-logo-padding-right-hover: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: var(--ud-site-logo-offset-x);
  padding: 10px var(--ud-site-logo-padding-x);
  background: var(--ud-theme-100);
  border-radius: var(--ud-radius-900);
  box-shadow: var(--ud-shadow-100);
  color: var(--ud-text-900);
  font-size: 21px;
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: padding 180ms ease;
  overflow: hidden;
}
.ud-site-logo > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 0;
  width: 0;
  font-size: var(--ud-site-logo-icon-size);
  line-height: 1;
  opacity: 0;
  transform: translateX(calc(var(--ud-site-logo-icon-gap) * -0.7));
  transition: width 180ms ease, margin-right 180ms ease, opacity 180ms ease, transform 180ms ease;
  overflow: hidden;
}

body:not(.home) .ud-site-logo:hover, body:not(.home) .ud-site-logo:focus-visible {
  padding-right: var(--ud-site-logo-padding-right-hover);
}
body:not(.home) .ud-site-logo:hover > i, body:not(.home) .ud-site-logo:focus-visible > i {
  margin-right: var(--ud-site-logo-icon-gap);
  width: var(--ud-site-logo-icon-width);
  opacity: 1;
  transform: translateX(0);
}

/* =============================================================== *\
   Mobile Button
\* =============================================================== */
.ud-header-toggle {
  position: relative;
  display: none;
  align-items: center;
  justify-content: center;
  border: 0;
  padding: 0;
  width: 41px;
  height: 41px;
  background-color: var(--ud-theme-100);
  border-radius: var(--ud-radius-900);
  cursor: pointer;
}
.ud-header-toggle span {
  position: absolute;
  display: block;
  width: 18px;
  height: 2px;
  background-color: var(--ud-text-900);
  border-radius: 0;
  transition: transform 0.24s ease, opacity 0.18s ease;
}
.ud-header-toggle span:nth-child(1) {
  transform: translateY(-6px);
}
.ud-header-toggle span:nth-child(2) {
  transform: translateY(0);
}
.ud-header-toggle span:nth-child(3) {
  transform: translateY(6px);
}

/* =============================================================== *\
   Mobile Menü
\* =============================================================== */
@media (max-width: 800px) {
  body.ud-menu-is-open {
    overflow: hidden;
  }
  header.wp-block-template-part {
    padding: var(--ud-space-300);
  }
  header.wp-block-template-part .ud_header_row {
    align-items: center;
    justify-content: space-between;
    gap: var(--ud-space-300);
  }
  header.wp-block-template-part .ud-header-toggle {
    display: flex;
    z-index: 1002;
    flex: 0 0 41px;
  }
  header.wp-block-template-part .ud_header_row > ul.wp-block-list,
  header.wp-block-template-part .ud-site-navigation {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    gap: var(--ud-space-600);
    z-index: 1001;
    box-sizing: border-box;
    margin: 0;
    padding: 11rem var(--ud-space-600) 3rem;
    width: 100vw;
    height: 100dvh;
    background-color: var(--ud-accent-500, #f2dd61);
    list-style: none;
    opacity: 0;
    visibility: hidden;
    transform: translateX(100%);
    transition: transform 0.28s ease, opacity 0.2s ease, visibility 0s linear 0.28s;
    pointer-events: none;
    overflow-y: auto;
  }
  header.wp-block-template-part .ud_header_row > ul.wp-block-list li,
  header.wp-block-template-part .ud-site-navigation li {
    display: block !important;
    margin: 0;
    padding: 0;
    width: auto;
    opacity: 0;
    transform: translateX(1.25rem);
    transition: opacity 0.22s ease, transform 0.32s ease;
  }
  header.wp-block-template-part .ud_header_row > ul.wp-block-list a,
  header.wp-block-template-part .ud-site-navigation a {
    display: inline-block !important;
    padding: 0;
    color: var(--ud-text-500);
    font-size: clamp(3rem, 9vw, 4.25rem);
    font-weight: 600;
    line-height: 1.15;
    text-align: right;
    text-decoration: none;
    white-space: nowrap;
    transition: color 180ms ease;
    transform: none;
  }
  header.wp-block-template-part .ud_header_row > ul.wp-block-list a:hover,
  header.wp-block-template-part .ud-site-navigation a:hover {
    color: var(--ud-text-900);
    transform: none;
  }
  header.wp-block-template-part.is-menu-open .ud-site-logo {
    opacity: 0;
    pointer-events: none;
  }
  header.wp-block-template-part.is-menu-open .ud_header_row > ul.wp-block-list,
  header.wp-block-template-part.is-menu-open .ud-site-navigation {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    transition: transform 0.28s ease, opacity 0.2s ease, visibility 0s linear 0s;
    pointer-events: auto;
  }
  header.wp-block-template-part.is-menu-open .ud_header_row > ul.wp-block-list li,
  header.wp-block-template-part.is-menu-open .ud-site-navigation li {
    opacity: 1;
    transform: translateX(0);
  }
  header.wp-block-template-part.is-menu-open .ud-site-navigation li:nth-child(1) {
    transition-delay: 0.08s;
  }
  header.wp-block-template-part.is-menu-open .ud-site-navigation li:nth-child(2) {
    transition-delay: 0.13s;
  }
  header.wp-block-template-part.is-menu-open .ud-site-navigation li:nth-child(3) {
    transition-delay: 0.18s;
  }
  header.wp-block-template-part.is-menu-open .ud-site-navigation li:nth-child(4) {
    transition-delay: 0.23s;
  }
  header.wp-block-template-part.is-menu-open .ud-header-toggle span:nth-child(1) {
    transform: rotate(45deg);
  }
  header.wp-block-template-part.is-menu-open .ud-header-toggle span:nth-child(2) {
    opacity: 0;
  }
  header.wp-block-template-part.is-menu-open .ud-header-toggle span:nth-child(3) {
    transform: rotate(-45deg);
  }
}
@media (max-width: 800px) and (prefers-reduced-motion: reduce) {
  header.wp-block-template-part .ud_header_row > ul.wp-block-list li,
  header.wp-block-template-part .ud-site-navigation li {
    transition: none;
  }
}
/* =============================================================== *\
   Frontend Entry Point

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Footer
\* =============================================================== */
footer {
  position: relative;
  z-index: 100;
  margin-top: 15vw;
  background: var(--ud-accent-500);
  box-shadow: var(--ud-shadow-200);
}

footer.wp-block-template-part > section.wp-block-group.ud-section {
  --ud-section-gap: calc(var(--ud-section-unit) * 2);
}
footer.wp-block-template-part > section.wp-block-group.ud-section .ud-section__head .ud-section__title {
  font-size: clamp(1.625rem, 2.75vw, 2rem);
  font-weight: 500;
  line-height: 1.2;
}

@media (max-width: 600px) {
  footer.wp-block-template-part > section.wp-block-group.ud-section {
    justify-content: center;
    min-height: 100svh;
  }
}
.wp-block-group.ud-footer__bottom {
  --ud-footer-inline-padding: max(
  	var(--ud-site-inline-spacing, 20px),
  	calc((100vw - 1640px) / 2 + 210px)
  );
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin-block-start: auto;
  padding: 0 var(--ud-footer-inline-padding) 20px;
  width: 100%;
  font-weight: 700;
}
.wp-block-group.ud-footer__bottom ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.wp-block-group.ud-footer__bottom li {
  margin: 0;
  padding: 0;
}
.wp-block-group.ud-footer__bottom a {
  color: inherit;
  text-decoration: none;
  text-underline-offset: 0.25em;
  transition: opacity 0.2s ease;
}
.wp-block-group.ud-footer__bottom a:hover, .wp-block-group.ud-footer__bottom a:focus-visible {
  opacity: 0.65;
}
.wp-block-group.ud-footer__bottom a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.wp-block-group.ud-footer__bottom .ud-footer__legal {
  justify-content: flex-start;
}
.wp-block-group.ud-footer__bottom .ud-footer__social {
  justify-content: flex-end;
}
@media (max-width: 700px) {
  .wp-block-group.ud-footer__bottom {
    align-items: flex-start;
    flex-direction: column-reverse;
    gap: 2.5rem;
  }
  .wp-block-group.ud-footer__bottom .ud-footer__legal,
  .wp-block-group.ud-footer__bottom .ud-footer__social {
    justify-content: flex-start;
  }
}
@media (max-width: 420px) {
  .wp-block-group.ud-footer__bottom ul {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.125rem;
  }
}

.ud-footer__credentials {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  box-sizing: border-box;
  width: 100%;
  margin-block-start: 0;
  padding: 22px 24px;
  gap: clamp(32px, 4vw, 96px);
  background: var(--ud-text-500, #252525);
}
.ud-footer__credentials .wp-block-image {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: auto;
  margin: 0;
  line-height: 0;
}
.ud-footer__credentials .wp-block-image img {
  display: block;
  width: auto;
  height: 30px;
  max-width: 110px;
  object-fit: contain;
  opacity: 0.62;
  border-radius: 0;
}
@media (max-width: 700px) {
  .ud-footer__credentials.is-layout-flex {
    display: grid;
  }
  .ud-footer__credentials {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    justify-items: center;
    column-gap: 24px;
    row-gap: 28px;
    padding: 28px 24px;
  }
  .ud-footer__credentials .wp-block-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    margin: 0;
  }
  .ud-footer__credentials .wp-block-image img {
    width: auto;
    height: 32px;
    max-width: 120px;
    object-fit: contain;
  }
  .ud-footer__credentials .wp-block-image:last-child:nth-child(odd) {
    grid-column: 1/-1;
  }
}

body::after {
  content: "";
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 50;
  height: 45vh;
  background: var(--ud-text-500, #252525);
  opacity: 0;
  pointer-events: none;
}

body:not(.page-template-kontakt-seite).is-at-page-end::after {
  opacity: 1;
}

/* =============================================================== *\
   Frontend Entry Point

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Page-Styles
\* =============================================================== */
/* =============================================================== *\
   Frontend Entry Point

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Blog-Archive

   Der Blog-Explorer übernimmt auf der Blogübersicht Abfrage, Filter,
   Suche, Karten und Pagination. Hier bleibt nur die Einordnung der
   nativen WordPress-Archive in das bestehende UD-Raster.
\* =============================================================== */
body:is(.blog, .category, .tag, .author, .date, .search-results) {
  --ud-archive-grid-width: 1430px;
  --ud-section-width: var(--ud-archive-grid-width);
  --ud-archive-copy-width: 730px;
  --ud-section-page-padding: var(--ud-site-inline-spacing, 20px);
  --ud-section-left: max(
  	var(--ud-section-page-padding),
  	calc((100vw - var(--ud-archive-grid-width)) / 2)
  );
}
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-top: clamp(160px, 12vw, 230px);
}
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive__header {
  box-sizing: border-box;
  width: min(var(--ud-section-width), 100vw - var(--ud-section-left) - var(--ud-section-page-padding));
  max-width: none;
  margin-right: auto;
  margin-left: var(--ud-section-left);
}
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive__eyebrow {
  margin: 0 0 var(--ud-space-400);
  color: var(--ud-muted-500);
  font-size: 1rem;
  font-weight: 600;
  line-height: inherit;
}
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive__eyebrow a {
  color: inherit;
  text-decoration: none;
}
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive__header .wp-block-query-title,
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive__header .wp-block-archive-title {
  max-width: var(--ud-section-width);
  margin: 0;
  font-size: clamp(2.75rem, 3.5vw, 3.5rem);
  font-weight: 520;
  line-height: 1.06;
  text-wrap: balance;
}
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive__header .wp-block-term-description {
  max-width: var(--ud-archive-copy-width);
  margin-top: clamp(24px, 2vw, 32px);
  font-size: clamp(1.125rem, 1.3vw, 1.375rem);
  line-height: 1.3;
  text-wrap: pretty;
}
body:is(.blog, .category, .tag, .author, .date, .search-results) .ud-blog-archive > .ud-blog-explorer {
  padding-top: clamp(64px, 8vw, 120px);
}

/* =============================================================== *\
   Einzelbeitrag
\* =============================================================== */
body.single-post {
  --ud-blog-grid-width: 1640px;
  --ud-blog-grid-offset: 280px;
  --ud-blog-section-width: 1220px;
  --ud-blog-copy-width: 800px;
  --ud-blog-page-padding: var(--ud-site-inline-spacing, 20px);
  --ud-section-unit: var(--ud-space-300);
  --ud-section-head-gap: var(--ud-section-unit);
  --ud-section-title-gap: calc(var(--ud-section-unit) * 2);
  --ud-blog-left: max(
  	var(--ud-blog-page-padding),
  	calc(
  		(100vw - var(--ud-blog-grid-width)) / 2 +
  			var(--ud-blog-grid-offset)
  	)
  );
  --ud-blog-content-left: max(
  	0px,
  	calc(var(--ud-blog-left) - var(--ud-blog-page-padding))
  );
}
body.single-post .ud-single-post {
  padding-block: clamp(160px, 12vw, 230px) clamp(80px, 10vw, 140px);
}
body.single-post .ud-single-post__header,
body.single-post .ud-single-post__featured-image,
body.single-post .ud-single-post__content,
body.single-post .ud-single-post__footer {
  box-sizing: border-box;
  width: min(var(--ud-blog-section-width), 100vw - var(--ud-blog-left) - var(--ud-blog-page-padding));
  max-width: none;
  margin-right: auto;
  margin-left: var(--ud-blog-left);
}
body.single-post .ud-single-post__header {
  margin-bottom: clamp(40px, 6vw, 72px);
}
body.single-post .ud-single-post__breadcrumb {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center;
  gap: 0.5em;
  margin: 0 0 var(--ud-space-400);
  color: var(--ud-muted-500);
  font-size: var(--ud-section-unit);
  font-weight: 600;
  line-height: inherit;
}
body.single-post .ud-single-post__breadcrumb .ud-single-post__breadcrumb-home,
body.single-post .ud-single-post__breadcrumb .ud-single-post__categories {
  margin: 0;
}
body.single-post .ud-single-post__breadcrumb a {
  color: inherit;
  text-decoration: none;
}
body.single-post .ud-single-post__breadcrumb-separator {
  display: block;
  flex: 0 0 auto;
  width: 0.45rem;
  height: 0.7rem;
  background-color: currentColor;
  -webkit-mask: url("../assets/icons/angle-right-sharp-solid.svg") center/contain no-repeat;
  mask: url("../assets/icons/angle-right-sharp-solid.svg") center/contain no-repeat;
}
body.single-post .ud-single-post__categories .wp-block-post-terms__separator,
body.single-post .ud-single-post__categories a:not(:first-of-type) {
  display: none;
}
body.single-post .ud-single-post__title {
  width: 100%;
  max-width: var(--ud-blog-copy-width);
  margin: 0;
  padding: 0;
  font-size: clamp(2.75rem, 3.5vw, 3.5rem);
  font-weight: 520;
  line-height: 1.06;
  text-wrap: balance;
}
body.single-post .wp-block-post-excerpt {
  margin: 2rem 0 1rem;
}
body.single-post .wp-block-post-excerpt .wp-block-post-excerpt__excerpt {
  max-width: 800px;
  margin-bottom: 1rem;
  font-size: 1.1rem;
  font-weight: 600;
}
body.single-post .ud-single-post__meta {
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: center;
  gap: 0.5rem 0.5em;
  margin: 0;
  color: var(--ud-muted-500);
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.4;
}
body.single-post .ud-single-post__meta .wp-block-post-date,
body.single-post .ud-single-post__meta .wp-block-post-author,
body.single-post .ud-single-post__meta .wp-block-post-author__content,
body.single-post .ud-single-post__meta .wp-block-post-author__byline,
body.single-post .ud-single-post__meta .wp-block-post-author__name {
  color: inherit;
  opacity: 1;
}
body.single-post .ud-single-post__meta > * {
  flex: 0 0 auto;
  width: auto;
  margin: 0;
}
body.single-post .ud-single-post__meta .wp-block-post-date::after {
  content: "·";
  display: inline-block;
  margin-left: 0.5em;
  vertical-align: middle;
}
body.single-post .ud-single-post__meta .wp-block-post-author {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: baseline;
  width: auto;
}
body.single-post .ud-single-post__meta .wp-block-post-author__content {
  display: inline-flex;
  flex: 0 0 auto;
  flex-flow: row nowrap !important;
  align-items: baseline;
  gap: 0.3em;
  width: auto;
}
body.single-post .ud-single-post__meta .wp-block-post-author__byline,
body.single-post .ud-single-post__meta .wp-block-post-author__name {
  margin: 0;
  font-size: inherit;
  white-space: nowrap;
}
body.single-post .ud-single-post__featured-image {
  margin-bottom: clamp(56px, 8vw, 104px);
  overflow: hidden;
  border-radius: var(--ud-radius-350, 16px);
  box-shadow: var(--ud-shadow-100);
}
body.single-post .ud-single-post__featured-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
}
body.single-post .ud-single-post__content.wp-block-post-content {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
  padding-block: 0;
  font-size: 1rem;
  line-height: inherit;
}
body.single-post .ud-single-post__content.wp-block-post-content .wp-block-paragraph a {
  text-decoration: underline;
}
body.single-post .ud-single-post__content.wp-block-post-content > :not(.alignwide):not(.alignfull):not(.ud-image-raster) {
  box-sizing: border-box;
  width: min(var(--ud-blog-copy-width), 100vw - var(--ud-blog-left) - var(--ud-blog-page-padding));
  max-width: none;
  margin-right: auto;
  margin-left: var(--ud-blog-content-left);
}
body.single-post .ud-single-post__content.wp-block-post-content > .alignwide:not(.ud-image-raster) {
  box-sizing: border-box;
  width: min(var(--ud-blog-section-width), 100vw - var(--ud-blog-left) - var(--ud-blog-page-padding));
  max-width: none;
  margin-right: auto;
  margin-left: var(--ud-blog-content-left);
}
body.single-post .ud-single-post__content.wp-block-post-content > .alignfull:not(.ud-image-raster) {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}
body.single-post .ud-single-post__content.wp-block-post-content > * + * {
  margin-block-start: 1.35em;
}
body.single-post .ud-single-post__content.wp-block-post-content > .wp-block-ud-ulrichdigital-section.ud-section {
  --ud-section-grid-offset: var(--ud-blog-grid-offset);
}
body.single-post .ud-single-post__content.wp-block-post-content > .wp-block-ud-ulrichdigital-section.ud-section .ud-section__title {
  margin-top: 0;
  margin-bottom: calc(var(--ud-section-title-gap) - var(--ud-section-head-gap));
  font-size: clamp(1.625rem, 2.75vw, 2rem);
  font-weight: 500;
  line-height: 1.2;
}
body.single-post .ud-single-post__content.wp-block-post-content > .wp-block-ud-ulrichdigital-section.ud-section .wp-block-ud-ulrichdigital-card.ud-card .ud-card__title {
  margin: 0;
  font-size: var(--ud-card-title-font-size);
  font-weight: 650;
  line-height: 1.2;
}
body.single-post .ud-single-post__content.wp-block-post-content > .wp-block-ud-ulrichdigital-section.ud-section .wp-block-ud-ulrichdigital-card.ud-card .ud-card__text,
body.single-post .ud-single-post__content.wp-block-post-content > .wp-block-ud-ulrichdigital-section.ud-section .wp-block-ud-ulrichdigital-card.ud-card p {
  margin: 0;
  font-size: var(--ud-card-text-font-size);
  line-height: inherit;
}
body.single-post .ud-single-post__content.wp-block-post-content h2,
body.single-post .ud-single-post__content.wp-block-post-content h3,
body.single-post .ud-single-post__content.wp-block-post-content h4 {
  margin-top: clamp(var(--ud-space-700), 5vw, var(--ud-space-900));
  margin-bottom: var(--ud-space-300);
  font-weight: 500;
  line-height: 1.2;
  text-wrap: balance;
}
body.single-post .ud-single-post__content.wp-block-post-content h2 {
  font-size: clamp(1.625rem, 2.75vw, 2rem);
}
body.single-post .ud-single-post__content.wp-block-post-content h3 {
  font-size: clamp(1.375rem, 2vw, 1.5rem);
}
body.single-post .ud-single-post__content.wp-block-post-content h4 {
  font-size: clamp(1.125rem, 1.5vw, 1.25rem);
}
body.single-post .ud-single-post__content.wp-block-post-content ul,
body.single-post .ud-single-post__content.wp-block-post-content ol {
  margin-block: var(--ud-space-300) 0;
  padding-block: 0;
  padding-left: var(--ud-space-500);
}
body.single-post .ud-single-post__content.wp-block-post-content ul {
  list-style: disc outside;
}
body.single-post .ud-single-post__content.wp-block-post-content ol {
  list-style: decimal outside;
}
body.single-post .ud-single-post__content.wp-block-post-content li + li {
  margin-top: calc(var(--ud-space-050));
}
body.single-post .ud-single-post__content.wp-block-post-content a {
  color: inherit;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25em;
}
body.single-post .ud-single-post__content.wp-block-post-content pre.wp-block-code {
  margin-block: var(--ud-space-500);
  padding: var(--ud-space-300);
  overflow-x: auto;
  border: 0;
  border-radius: var(--ud-radius-350, 16px);
  background: rgba(0, 0, 0, 0.04);
  color: inherit;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.9rem;
  line-height: 1.55;
  white-space: pre;
}
body.single-post .ud-single-post__content.wp-block-post-content pre.wp-block-code code {
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}
body.single-post .ud-single-post__content.wp-block-post-content :not(pre) > code {
  padding: 0.1em 0.35em;
  border-radius: var(--ud-radius-050, 4px);
  background: rgba(0, 0, 0, 0.04);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.9em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
body.single-post .ud-single-post__content.wp-block-post-content blockquote,
body.single-post .ud-single-post__content.wp-block-post-content .wp-block-quote {
  margin-block: var(--ud-space-600);
  padding: var(--ud-space-500);
  border: 0;
  border-radius: var(--ud-radius-350, 16px);
  background: rgba(0, 0, 0, 0.04);
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.55;
}
body.single-post .ud-single-post__content.wp-block-post-content blockquote p,
body.single-post .ud-single-post__content.wp-block-post-content .wp-block-quote p {
  margin: 0;
}
body.single-post .ud-single-post__content.wp-block-post-content blockquote cite,
body.single-post .ud-single-post__content.wp-block-post-content .wp-block-quote cite {
  display: block;
  margin-top: var(--ud-space-300);
  color: var(--ud-muted-500);
  font-size: 0.875rem;
  font-style: normal;
}
body.single-post .ud-single-post__content.wp-block-post-content figure,
body.single-post .ud-single-post__content.wp-block-post-content .wp-block-image {
  margin-block: clamp(32px, 5vw, 64px);
}
body.single-post .ud-single-post__content.wp-block-post-content .wp-block-image.ud-image-raster:not(.is-style-ud-image-card):not(.ud-browser-look):not(.ud-image-no-shadow) > img,
body.single-post .ud-single-post__content.wp-block-post-content .wp-block-image.ud-image-raster:not(.is-style-ud-image-card):not(.ud-browser-look):not(.ud-image-no-shadow) > a > img {
  box-shadow: var(--ud-shadow-300);
}
body.single-post .ud-single-post__content.wp-block-post-content figure:not(.wp-block-image):not(.wp-block-ud-ulrichdigital-image-compare) > figcaption {
  color: var(--ud-muted-700);
  font-size: 0.82rem;
  line-height: 1.45;
}
body.single-post .ud-single-post__footer {
  width: min(var(--ud-blog-copy-width), 100vw - var(--ud-blog-left) - var(--ud-blog-page-padding));
  margin-top: clamp(56px, 8vw, 96px);
  padding-top: 0;
  border: 0 !important;
}
body.single-post .ud-single-post__tags {
  margin-bottom: 0;
  color: var(--ud-muted-700);
  font-size: 0.88rem;
  line-height: 1.6;
}
body.single-post .ud-single-post__tags a {
  display: inline-block;
  margin: 0.2rem 0.25rem 0.2rem 0;
  padding: 0.3rem 0.65rem;
  color: inherit;
  text-decoration: none;
  border-radius: var(--ud-radius-900, 999px);
  background: var(--ud-theme-300, #fffdf0);
  transition: background-color 180ms ease;
}
body.single-post .ud-single-post__tags a:hover, body.single-post .ud-single-post__tags a:focus-visible {
  background: var(--ud-theme-450, #d8d3bd);
}
@media screen and (max-width: 800px) {
  body.single-post {
    --ud-blog-grid-offset: 0px;
  }
  body.single-post .ud-single-post {
    padding-top: clamp(120px, 22vw, 170px);
  }
  body.single-post .ud-single-post__meta {
    align-items: center;
  }
}

/* =============================================================== *\
   Page-Transition
\* =============================================================== */
.ud-page-transition {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  background: var(--ud-theme-430, #e5e2d0);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 480ms ease-in-out, visibility 0s linear 0s;
  will-change: opacity;
}
.ud-page-transition::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 5px;
  background: var(--ud-theme-600, #b5b1a4);
  content: "";
  transform: scaleX(0.08);
  transform-origin: left center;
  animation: ud-page-transition-progress-wait 1400ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  will-change: transform;
}

html.ud-page-transition-arriving .ud-page-transition {
  opacity: 1;
  visibility: visible;
}

html.ud-page-transition-ready .ud-page-transition {
  opacity: 0;
  visibility: hidden;
  transition: opacity 480ms ease-in-out, visibility 0s linear 480ms;
}

html.ud-page-transition-prepare .ud-page-transition {
  opacity: 0;
  visibility: visible;
  transition: none;
}
html.ud-page-transition-prepare .ud-page-transition::after {
  animation: none;
  transform: scaleX(0);
  transition: none;
}

html.ud-page-transition-leaving .ud-page-transition {
  opacity: 1;
  visibility: visible;
  transition: opacity 340ms ease-in-out, visibility 0s linear 0s;
}
html.ud-page-transition-leaving .ud-page-transition::after {
  animation: none;
  transform: scaleX(0.75);
  transition: transform 340ms cubic-bezier(0.22, 1, 0.36, 1);
}

html.ud-page-transition-complete .ud-page-transition::after {
  animation: none;
  transform: scaleX(1);
  transition: transform 160ms ease-out;
}

html.ud-motion-off .ud-page-transition {
  display: none;
}

@keyframes ud-page-transition-progress-wait {
  from {
    transform: scaleX(0.08);
  }
  to {
    transform: scaleX(0.75);
  }
}
@media (prefers-reduced-motion: reduce) {
  .ud-page-transition {
    display: none;
  }
}
/* =============================================================== *\
   Motion-System

   Dekorative Seitenanimationen. Funktionale Animationen von Menü,
   CTA und Plugins werden von diesen Regeln nicht verändert.
\* =============================================================== */
:root {
  --ud-motion-duration-reveal: 680ms;
  --ud-motion-duration-image: 880ms;
  --ud-motion-easing: cubic-bezier(0.22, 1, 0.36, 1);
  --ud-motion-distance: 14px;
}

html.ud-motion-booting .ud-page-hero__image,
html.ud-motion-booting .ud-page-hero__eyebrow,
html.ud-motion-booting .ud-page-hero__title,
html.ud-motion-booting .ud-page-hero__lead,
html.ud-motion-booting .ud-blog-hero__eyebrow,
html.ud-motion-booting .ud-blog-hero__title,
html.ud-motion-booting .ud-blog-hero__lead,
html.ud-motion-booting .ud-blog-hero__meta,
html.ud-motion-booting .ud-blog-hero__image,
html.ud-motion-booting .ud-section__head > *,
html.ud-motion-booting .ud-section__split > *,
html.ud-motion-booting .ud-section .wp-block-image,
html.ud-motion-booting .ud-section .ud-image-compare,
html.ud-motion-booting .ud-card-grid > .ud-card,
html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card,
html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__title,
html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__body > *,
html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__action,
html.ud-motion-booting .ud-referenzen-loop__grid > .ud-referenz-card,
html.ud-motion-booting .ud-image-raster,
html.ud-motion-booting .ud-browser-look,
html.ud-motion-booting body.single-post .ud-single-post__content .wp-block-image,
html.ud-motion-booting .ud-project-hero__image,
html.ud-motion-booting .ud-contact-item,
html.ud-motion-booting .ud-image-card__email,
html.ud-motion-booting footer .ud-section--collaboration > .ud-dynamic-cta,
html.ud-motion-booting .ud-footer__credentials {
  opacity: 0;
  transition: none;
}

.ud-motion-reveal {
  --ud-motion-delay: 0ms;
  opacity: 0;
  transition: opacity var(--ud-motion-duration-reveal) var(--ud-motion-easing) var(--ud-motion-delay), transform var(--ud-motion-duration-reveal) var(--ud-motion-easing) var(--ud-motion-delay);
  will-change: opacity, transform;
}
.ud-motion-reveal--up {
  transform: translate3d(0, var(--ud-motion-distance), 0);
}
.ud-motion-reveal--split {
  transform: translate3d(var(--ud-motion-x, 0), var(--ud-motion-y, 0), 0);
}
.ud-motion-reveal--card {
  transform: translate3d(0, var(--ud-motion-distance), 0) scale(0.985);
}
.ud-motion-reveal--image {
  transform: translate3d(var(--ud-motion-x, 0), 0, 0) scale(0.975);
  transition-duration: var(--ud-motion-duration-image);
}
.ud-motion-reveal--standalone-image {
  transition-duration: 1400ms;
}
.ud-motion-reveal.ud-page-hero__image {
  transform: scale(1.03);
  transition-duration: 900ms;
}
.ud-motion-reveal.ud-page-hero__title, .ud-motion-reveal.ud-page-hero__lead {
  transform: translate3d(0, 16px, 0);
}
.ud-motion-reveal.is-ud-motion-visible {
  opacity: 1;
  transform: none;
  will-change: auto;
}
.ud-motion-reveal.is-ud-motion-immediate {
  transition: none;
}

html.ud-motion-off.ud-motion-booting .ud-page-hero__image,
html.ud-motion-off.ud-motion-booting .ud-page-hero__eyebrow,
html.ud-motion-off.ud-motion-booting .ud-page-hero__title,
html.ud-motion-off.ud-motion-booting .ud-page-hero__lead,
html.ud-motion-off.ud-motion-booting .ud-blog-hero__eyebrow,
html.ud-motion-off.ud-motion-booting .ud-blog-hero__title,
html.ud-motion-off.ud-motion-booting .ud-blog-hero__lead,
html.ud-motion-off.ud-motion-booting .ud-blog-hero__meta,
html.ud-motion-off.ud-motion-booting .ud-blog-hero__image,
html.ud-motion-off.ud-motion-booting .ud-section__head > *,
html.ud-motion-off.ud-motion-booting .ud-section__split > *,
html.ud-motion-off.ud-motion-booting .ud-section .wp-block-image,
html.ud-motion-off.ud-motion-booting .ud-section .ud-image-compare,
html.ud-motion-off.ud-motion-booting .ud-card-grid > .ud-card,
html.ud-motion-off.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card,
html.ud-motion-off.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__title,
html.ud-motion-off.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__body > *,
html.ud-motion-off.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__action,
html.ud-motion-off.ud-motion-booting .ud-referenzen-loop__grid > .ud-referenz-card,
html.ud-motion-off.ud-motion-booting .ud-image-raster,
html.ud-motion-off.ud-motion-booting .ud-browser-look,
html.ud-motion-off.ud-motion-booting body.single-post .ud-single-post__content .wp-block-image,
html.ud-motion-off.ud-motion-booting .ud-project-hero__image,
html.ud-motion-off.ud-motion-booting .ud-contact-item,
html.ud-motion-off.ud-motion-booting .ud-image-card__email,
html.ud-motion-off.ud-motion-booting footer .ud-section--collaboration > .ud-dynamic-cta,
html.ud-motion-off.ud-motion-booting .ud-footer__credentials {
  opacity: 1;
}
html.ud-motion-off .ud-motion-reveal {
  opacity: 1;
  transform: none;
  transition: none;
  will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
  html.ud-motion-booting .ud-page-hero__image,
  html.ud-motion-booting .ud-page-hero__eyebrow,
  html.ud-motion-booting .ud-page-hero__title,
  html.ud-motion-booting .ud-page-hero__lead,
  html.ud-motion-booting .ud-blog-hero__eyebrow,
  html.ud-motion-booting .ud-blog-hero__title,
  html.ud-motion-booting .ud-blog-hero__lead,
  html.ud-motion-booting .ud-blog-hero__meta,
  html.ud-motion-booting .ud-blog-hero__image,
  html.ud-motion-booting .ud-section__head > *,
  html.ud-motion-booting .ud-section__split > *,
  html.ud-motion-booting .ud-section .wp-block-image,
  html.ud-motion-booting .ud-section .ud-image-compare,
  html.ud-motion-booting .ud-card-grid > .ud-card,
  html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card,
  html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__title,
  html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__body > *,
  html.ud-motion-booting .wp-block-ud-ulrichdigital-cta-card.ud-cta-card > .ud-cta-card__action,
  html.ud-motion-booting .ud-referenzen-loop__grid > .ud-referenz-card,
  html.ud-motion-booting .ud-image-raster,
  html.ud-motion-booting .ud-browser-look,
  html.ud-motion-booting body.single-post .ud-single-post__content .wp-block-image,
  html.ud-motion-booting .ud-project-hero__image,
  html.ud-motion-booting .ud-contact-item,
  html.ud-motion-booting .ud-image-card__email,
  html.ud-motion-booting footer .ud-section--collaboration > .ud-dynamic-cta,
  html.ud-motion-booting .ud-footer__credentials {
    opacity: 1;
  }
  .ud-motion-reveal {
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
  }
}
/* =============================================================== *\
   Frontend Entry Point

   Einstiegspunkt für alle Frontend-Styles.

   Wird nach build/style.css kompiliert
   und im Frontend geladen.
\* =============================================================== */
/* =============================================================== *\
   Name des Plugins
\* =============================================================== */