/*!
  Theme Name:        Lexy Pure
  Theme URI:         https://seitenmacher.media
  Description:       Entdecken Sie unser individuell entwickeltes WordPress-Theme, das auf dem bezaubernden Framework Tailwind CSS basiert. Tauchen Sie ein in eine Welt voller Kreativität und grenzenloser Möglichkeiten! T. Dicks und D. Fresh haben mit Leidenschaft und Sorgfalt dieses außergewöhnliche Theme geschaffen. Jeder Pixel und jede Linie wurde mit Liebe zum Detail gestaltet, um Ihnen ein reibungsloses und beeindruckendes Erlebnis zu bieten. Die Möglichkeiten dieses Themes sind grenzenlos. Lassen Sie Ihrer Vorstellungskraft freien Lauf und verleihen Sie Ihrer Website eine elegante und moderne Note. Genießen Sie die nahtlose Responsivität und die endlose Auswahl an Modulen und Layouts. Treten Sie ein in eine neue Dimension der Webentwicklung und erleben Sie die Macht der Kreativität mit unserem Tailwind CSS-basierten Theme. Verzaubern Sie Ihre Besucher und heben Sie Ihre Online-Präsenz auf ein neues Level. Die grenzenlosen Möglichkeiten warten auf Sie!
  Author:            seitenmacher.media
  Author URI:        https://seitenmacher.media
  Version:           1.0
  Stable tag:        1.0
  Requires at least: 5.1
  Tested up to:      5.9
  License:           This theme is protected by copyright. Any kind of use or reproduction for other purposes and projects requires the consent of seitenmacher.media. Dieses Theme ist urheberrechtlich geschützt. Jede Art der Verwendung oder Vervielfältigung für andere Zwecke und Projekte bedarf der Zustimmung von seitenmacher.media.
  Text Domain:       seitenmacher
*/

/* -------------------------------------------------------------------------------------
   Tailwind
------------------------------------------------------------------------------------- */

/*! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
*/

html {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
  tab-size: 4; /* 3 */
  font-family: Montserrat, sans-serif; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

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

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden] {
  display: none;
}

html {
  font-family: Sorts Mill Goudy, serif;
  --tw-text-opacity: 1;
  color: rgb(102 92 84 / var(--tw-text-opacity));
}

/* -------------------------------------------------------------------------------------
     Abstand für jedes Element was einen direkt Vorgänger hat
  ------------------------------------------------------------------------------------- */

html {
    scroll-behavior: smooth;
    scroll-padding-top: 4rem;
    display: relative;
  }

body {
    display: relative;
      /* * + * {
    margin: 1rem 0 0!important;
  } */
  }

*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}

.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 1.5rem;
  padding-left: 1.5rem;
}

@media (min-width: 640px) {

  .container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {

  .container {
    max-width: 768px;
    padding-right: 1rem;
    padding-left: 1rem;
  }
}

@media (min-width: 1024px) {

  .container {
    max-width: 1024px;
  }
}

@media (min-width: 1280px) {

  .container {
    max-width: 1280px;
  }
}

@media (min-width: 1536px) {

  .container {
    max-width: 1536px;
  }
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.inset-0 {
  inset: 0px;
}

.bottom-4 {
  bottom: 1rem;
}

.left-0 {
  left: 0px;
}

.left-4 {
  left: 1rem;
}

.right-0 {
  right: 0px;
}

.-z-10 {
  z-index: -10;
}

.z-0 {
  z-index: 0;
}

.z-10 {
  z-index: 10;
}

.z-20 {
  z-index: 20;
}

.z-50 {
  z-index: 50;
}

.order-last {
  order: 9999;
}

.col-span-2 {
  grid-column: span 2 / span 2;
}

.col-span-3 {
  grid-column: span 3 / span 3;
}

.col-span-4 {
  grid-column: span 4 / span 4;
}

.col-span-5 {
  grid-column: span 5 / span 5;
}

.col-span-6 {
  grid-column: span 6 / span 6;
}

.col-span-7 {
  grid-column: span 7 / span 7;
}

.col-start-7 {
  grid-column-start: 7;
}

.my-10 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

.my-20 {
  margin-top: 5rem;
  margin-bottom: 5rem;
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.mb-20 {
  margin-bottom: 5rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.mt-10 {
  margin-top: 2.5rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mt-auto {
  margin-top: auto;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.flex {
  display: flex;
}

.grid {
  display: grid;
}

.hidden {
  display: none;
}

.aspect-\[3\/4\] {
  aspect-ratio: 3/4;
}

.aspect-\[4\/3\] {
  aspect-ratio: 4/3;
}

.aspect-square {
  aspect-ratio: 1 / 1;
}

.h-28 {
  height: 7rem;
}

.h-auto {
  height: auto;
}

.h-full {
  height: 100%;
}

.w-1\/2 {
  width: 50%;
}

.w-16 {
  width: 4rem;
}

.w-20 {
  width: 5rem;
}

.w-28 {
  width: 7rem;
}

.w-full {
  width: 100%;
}

.grow {
  flex-grow: 1;
}

.-rotate-12 {
  --tw-rotate: -12deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.grid-cols-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.grid-cols-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.grid-cols-\[repeat\(auto-fill\2c _minmax\(280px\2c _1fr\)\)\] {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.flex-col {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.content-center {
  align-content: center;
}

.items-center {
  align-items: center;
}

.justify-between {
  justify-content: space-between;
}

.gap-4 {
  gap: 1rem;
}

.gap-8 {
  gap: 2rem;
}

.overflow-hidden {
  overflow: hidden;
}

.rounded-lg {
  border-radius: 0.5rem;
}

.rounded-sm {
  border-radius: 0.125rem;
}

.border {
  border-width: 1px;
}

.border-cd-dark {
  --tw-border-opacity: 1;
  border-color: rgb(102 92 84 / var(--tw-border-opacity));
}

.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}

.bg-cd {
  --tw-bg-opacity: 1;
  background-color: rgb(208 203 198 / var(--tw-bg-opacity));
}

.bg-cd-dark {
  --tw-bg-opacity: 1;
  background-color: rgb(102 92 84 / var(--tw-bg-opacity));
}

.bg-cd-light {
  --tw-bg-opacity: 1;
  background-color: rgb(236 234 232 / var(--tw-bg-opacity));
}

.bg-cd-light\/70 {
  background-color: rgb(236 234 232 / 0.7);
}

.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.bg-opacity-30 {
  --tw-bg-opacity: 0.3;
}

.object-cover {
  -o-object-fit: cover;
  object-fit: cover;
}

.object-\[75\%_center\] {
  -o-object-position: 75% center;
  object-position: 75% center;
}

.p-2 {
  padding: 0.5rem;
}

.p-8 {
  padding: 2rem;
}

.px-0 {
  padding-left: 0px;
  padding-right: 0px;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.px-\[min\(10vw\2c 200px\)\] {
  padding-left: min(10vw,200px);
  padding-right: min(10vw,200px);
}

.px-\[min\(20vw\2c 400px\)\] {
  padding-left: min(20vw,400px);
  padding-right: min(20vw,400px);
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.py-20 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.pb-\[2px\] {
  padding-bottom: 2px;
}

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

.font-sans {
  font-family: Montserrat, sans-serif;
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}

.text-\[min\(10vw\2c 140px\)\] {
  font-size: min(10vw,140px);
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.font-bold {
  font-weight: 700;
}

.font-thin {
  font-weight: 100;
}

.uppercase {
  text-transform: uppercase;
}

.leading-none {
  line-height: 1;
}

.text-cd-dark {
  --tw-text-opacity: 1;
  color: rgb(102 92 84 / var(--tw-text-opacity));
}

.text-cd-light {
  --tw-text-opacity: 1;
  color: rgb(236 234 232 / var(--tw-text-opacity));
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.text-white\/50 {
  color: rgb(255 255 255 / 0.5);
}

.underline {
  -webkit-text-decoration-line: underline;
  text-decoration-line: underline;
}

.underline-offset-4 {
  text-underline-offset: 4px;
}

.opacity-60 {
  opacity: 0.6;
}

.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.drop-shadow-lg {
  --tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-colors {
  transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.duration-1000 {
  transition-duration: 1000ms;
}

.duration-200 {
  transition-duration: 200ms;
}

.duration-500 {
  transition-duration: 500ms;
}

.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* -------------------------------------------------------------------------------------
Custom
------------------------------------------------------------------------------------- */

@font-face {
    font-family: 'Montserrat';
    font-display: swap;
    src: url('assets/fonts/Montserrat-VF.woff2') format('woff2'),
         url('assets/fonts/Montserrat-VF.ttf') format('truetype');
    font-weight: 100 900; /* Hier den Bereich für Schriftschnitt festlegen */
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    font-display: swap;
    src: url('assets/fonts/Montserrat-Italic-VF.woff2') format('woff2'),
         url('assets/fonts/Montserrat-Italic-VF.ttf') format('truetype');
    font-weight: 100 900; /* Hier den Bereich für Schriftschnitt festlegen */
    font-style: italic;
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Sorts Mill Goudy';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/sorts-mill-goudy-v15-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('assets/fonts/sorts-mill-goudy-v15-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* barlow-300 - latin */

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 300;
  src: url('assets/fonts/barlow-v12-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-300italic - latin */

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: italic;
  font-weight: 300;
  src: url('assets/fonts/barlow-v12-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-regular - latin */

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/barlow-v12-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-500 - latin */

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  src: url('assets/fonts/barlow-v12-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-600 - latin */

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 600;
  src: url('assets/fonts/barlow-v12-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-700 - latin */

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 700;
  src: url('assets/fonts/barlow-v12-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

.content {

    /* * + p {
        @apply mt-6;
    } */
}

.content h1,.content h2,.content h3,.content h4,.content h5,.content h6 {
  font-family: Montserrat, sans-serif !important;
  text-transform: uppercase !important;
  line-height: 1.375 !important;
        text-wrap: balance;
}

.content h1 {
  font-size: 2.25rem;
  line-height: 2.5rem;
  font-weight: 700;
}

@media (min-width: 768px) {

  .content h1 {
    font-size: 3rem;
    line-height: 1;
  }
}

@media (min-width: 1024px) {

  .content h1 {
    font-size: 3.75rem;
    line-height: 1;
  }
}

.content h2 {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 700;
}

@media (min-width: 768px) {

  .content h2 {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

@media (min-width: 1024px) {

  .content h2 {
    font-size: 3rem;
    line-height: 1;
  }
}

.content h3 {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
}

@media (min-width: 768px) {

  .content h3 {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

@media (min-width: 1024px) {

  .content h3 {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

.content p {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}

@media (min-width: 768px) {

  .content p {
    font-size: 1.5rem;
    line-height: 1.5;
  }
}

@media (min-width: 1024px) {

  .content p {
    font-size: 1.875rem;
    line-height: 1.5;
  }
}

#main-menu {
  display: flex;
  align-items: center;
}

#main-menu ul {
  display: flex;
  gap: 1.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  text-transform: uppercase;
}

#footer-menu ul {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  text-transform: uppercase;
}

@media (min-width: 768px) {

  #footer-menu ul {
    align-items: flex-end;
  }
}

#footer-menu ul li a {
  -webkit-text-decoration-line: underline;
  text-decoration-line: underline;
  text-underline-offset: 4px;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

#footer-menu ul li a:hover {
  text-underline-offset: 8px;
}

.project .desc {
  padding: 1.5rem;
}

@media (min-width: 1024px) {

  .project .desc {
    padding: 2.5rem;
  }
}

.project .project-bg {
  position: absolute;
  top: 0px;
  height: 100%;
  width: 100%;
}

@media (min-width: 768px) {

  .project .project-bg {
    width: 50%;
  }
}

.project .project-bg.left-bg {
  left: 0px;
  display: none;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

@media (min-width: 768px) {

  .project .project-bg.left-bg {
    display: block;
  }
}

.project .project-bg.right-bg {
  right: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(236 234 232 / var(--tw-bg-opacity));
}

.project.even * {
  justify-content: flex-end;
}

@media (min-width: 768px) {

  .project.even .image {
    order: 9999;
  }
}

.project.even .desc {
  text-align: right;
}

.project.even .project-bg.left-bg {
  display: block;
  --tw-bg-opacity: 1;
  background-color: rgb(236 234 232 / var(--tw-bg-opacity));
}

.project.even .project-bg.right-bg {
  display: none;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

@media (min-width: 768px) {

  .project.even .project-bg.right-bg {
    display: block;
  }
}

.project .scroll-text-effect {
		cursor: grab;
		position: relative;
		overflow: hidden;
		transition: transform 0.5s;
		display: block;
	}

.project .scroll-text-effect::after {
			content: attr(data-after);
			display: inline-block;
			transform: translateY(100%);
			position: absolute;
			left: 0;
			right: 0;
			transition: inherit;
		}

@media (min-width: 768px) {

  .project .scroll-text-effect::after {
    --tw-text-opacity: 1;
    color: rgb(102 92 84 / var(--tw-text-opacity));
  }
}

.project .scroll-text-effect > span {
			cursor: grab;
			display: inline-block;
			transform: translateY(0%);
			transition: inherit;
		}

.project .scroll-text-effect:hover > span {
				transform: translateY(-100%);
			}

.project .scroll-text-effect:hover::after {
				transform: translateY(0%);
			}

.member .icon {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

.member .icon svg {
            position: absolute;
            top: 50%;
            left: 50%;
            translate: -50% -68%;
            width: 105%;
        }

.member:nth-child(n+4) .icon svg {
                translate: -50% -31%;
            }

/* -------------------------------------------------------------------------------------
   ACF Form Styling
------------------------------------------------------------------------------------- */

.acf-form .acf-fields > .acf-field {
  border-style: none;
  padding: 0px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.acf-form .acf-field > .acf-label {
  margin-bottom: 0.25rem;
  font-family: Montserrat, sans-serif;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgb(102 92 84 / var(--tw-text-opacity));
}

/* Focus states for all interactive elements */

.acf-form .acf-input input:focus,
        .acf-form .acf-input select:focus,
        .acf-form .acf-input textarea:focus,
        .acf-form .acf-input button:focus {
            outline: none;
        }

/* Input field styling */

.acf-form .acf-input input[type="text"],
        .acf-form .acf-input input[type="email"],
        .acf-form .acf-input input[type="tel"],
        .acf-form .acf-input input[type="number"],
        .acf-form .acf-input input[type="url"],
        .acf-form .acf-input input[type="search"],
        .acf-form .acf-input input[type="password"],
        .acf-form .acf-input textarea {
  --tw-bg-opacity: 1;
  background-color: rgb(236 234 232 / var(--tw-bg-opacity));
  padding: 0.75rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(102 92 84 / var(--tw-text-opacity));
}

.acf-form .acf-form-submit {
  margin-top: 2.5rem;
  text-align: right;
  font-family: Montserrat, sans-serif;
  text-transform: uppercase;
}

.acf-form .acf-form-submit input[type="submit"] {
  text-align: right;
  font-family: Montserrat, sans-serif;
  text-transform: uppercase;
  --tw-bg-opacity: 1;
  background-color: rgb(102 92 84 / var(--tw-bg-opacity));
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  text-align: center;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.acf-form .acf-form-submit input[type="submit"]:hover {
  background-color: rgb(102 92 84 / 0.8);
}

.acf-form .acf-form-submit input[type="submit"] {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
  cursor: pointer;
  border-style: none;
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  width: 100%;
}

.hover\:rotate-0:hover {
  --tw-rotate: 0deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:scale-110:hover {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:scale-\[103\%\]:hover {
  --tw-scale-x: 103%;
  --tw-scale-y: 103%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:scale-\[105\%\]:hover {
  --tw-scale-x: 105%;
  --tw-scale-y: 105%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:scale-\[108\%\]:hover {
  --tw-scale-x: 108%;
  --tw-scale-y: 108%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:cursor-grab:hover {
  cursor: grab;
}

.hover\:bg-cd-dark:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(102 92 84 / var(--tw-bg-opacity));
}

.hover\:bg-cd-light:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(236 234 232 / var(--tw-bg-opacity));
}

.hover\:text-cd-dark:hover {
  --tw-text-opacity: 1;
  color: rgb(102 92 84 / var(--tw-text-opacity));
}

.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.hover\:underline-offset-8:hover {
  text-underline-offset: 8px;
}

.hover\:opacity-100:hover {
  opacity: 1;
}

@media (min-width: 640px) {

  .sm\:bottom-8 {
    bottom: 2rem;
  }

  .sm\:left-8 {
    left: 2rem;
  }

  .sm\:m-0 {
    margin: 0px;
  }

  .sm\:w-20 {
    width: 5rem;
  }

  .sm\:flex-row {
    flex-direction: row;
  }

  .sm\:py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}

@media (min-width: 768px) {

  .md\:bottom-12 {
    bottom: 3rem;
  }

  .md\:left-12 {
    left: 3rem;
  }

  .md\:order-none {
    order: 0;
  }

  .md\:my-20 {
    margin-top: 5rem;
    margin-bottom: 5rem;
  }

  .md\:mb-3 {
    margin-bottom: 0.75rem;
  }

  .md\:mt-3 {
    margin-top: 0.75rem;
  }

  .md\:mt-4 {
    margin-top: 1rem;
  }

  .md\:block {
    display: block;
  }

  .md\:grid {
    display: grid;
  }

  .md\:w-1\/2 {
    width: 50%;
  }

  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:items-end {
    align-items: flex-end;
  }

  .md\:gap-24 {
    gap: 6rem;
  }

  .md\:gap-8 {
    gap: 2rem;
  }

  .md\:px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .md\:px-\[min\(20vw\2c 400px\)\] {
    padding-left: min(20vw,400px);
    padding-right: min(20vw,400px);
  }

  .md\:py-20 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  .md\:py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }

  .md\:text-right {
    text-align: right;
  }

  .md\:text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .md\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

@media (min-width: 1024px) {

  .lg\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .lg\:row-span-2 {
    grid-row: span 2 / span 2;
  }

  .lg\:mb-4 {
    margin-bottom: 1rem;
  }

  .lg\:mb-40 {
    margin-bottom: 10rem;
  }

  .lg\:mt-4 {
    margin-top: 1rem;
  }

  .lg\:mt-5 {
    margin-top: 1.25rem;
  }

  .lg\:block {
    display: block;
  }

  .lg\:aspect-\[2\/3\] {
    aspect-ratio: 2/3;
  }

  .lg\:w-5\/12 {
    width: 41.666667%;
  }

  .lg\:w-7\/12 {
    width: 58.333333%;
  }

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:px-36 {
    padding-left: 9rem;
    padding-right: 9rem;
  }

  .lg\:px-\[min\(15vw\2c 400px\)\] {
    padding-left: min(15vw,400px);
    padding-right: min(15vw,400px);
  }

  .lg\:py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .lg\:py-20 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  .lg\:text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }

  .lg\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }
}




/*# sourceMappingURL=style.css.map */