@import url('https://fonts.googleapis.com/css2?family=Marcellus&family=Montserrat:wght@300;400;500;600&display=swap');

@font-face {
  font-family: "SaltyFeathers";
  src: url("https://yada-photography.de/wp-content/uploads/2026/05/Salty-Feathers.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

html:has(.yada-hero-slider),
body:has(.yada-hero-slider) {
  overflow-x: hidden !important;
}

.elementor-section:has(.yada-hero-slider),
.elementor-container:has(.yada-hero-slider),
.elementor-column:has(.yada-hero-slider),
.elementor-widget-wrap:has(.yada-hero-slider),
.elementor-widget-html:has(.yada-hero-slider),
.elementor-widget-container:has(.yada-hero-slider),
.e-con:has(.yada-hero-slider),
.e-con-inner:has(.yada-hero-slider) {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible !important;
}

.elementor-widget-yada_hero_slider,
.elementor-widget-yada_hero_slider > .elementor-widget-container,
.elementor-widget-mbdesign_photography_hero,
.elementor-widget-mbdesign_photography_hero > .elementor-widget-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.yada-hero-slider {
  --yhs-brown: #835a33;
  --yhs-main-text: #e2d7be;
  --yhs-sub-text: #ffffff;
  --yhs-decor: #e2d7be;
  --yhs-nav-text: #ffffff;
  --yhs-nav-active-text: #e2d7be;
  --yhs-nav-bg: rgba(55, 33, 15, 0.38);
  --yhs-nav-border: rgba(226, 215, 190, 0.28);
  --yhs-nav-active-bg: rgba(226, 215, 190, 0.22);
  --yhs-arrow-hover-bg: #e2d7be;
  --yhs-arrow-hover-text: #835a33;
  --yhs-overlay: rgba(0, 0, 0, 0.12);
  --yhs-decor-opacity: 1;
  --yhs-transition-speed: 1100ms;
  --yhs-slide-zoom-start: 1.04;

  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  min-height: 620px !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  overflow: hidden !important;
  background: var(--yhs-brown) !important;
  box-sizing: border-box !important;
}

.yada-hero-slider *,
.yada-hero-slider *::before,
.yada-hero-slider *::after {
  box-sizing: border-box !important;
}

.yada-hero-stage {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  z-index: 1 !important;
}

.yada-hero-slide {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: var(--yhs-desktop-image) !important;
  background-size: cover !important;
  background-position: var(--yhs-desktop-position, center center) !important;
  background-repeat: no-repeat !important;
  opacity: 0 !important;
  transform: scale(var(--yhs-slide-zoom-start)) !important;
  transition: opacity var(--yhs-transition-speed) ease, transform 7s ease !important;
  z-index: 1 !important;
}

.yada-hero-slide.is-active {
  opacity: 1 !important;
  transform: scale(1) !important;
  z-index: 2 !important;
}

.yada-hero-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: var(--yhs-overlay) !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

.yada-hero-caption {
  position: absolute !important;
  left: 50% !important;
  bottom: clamp(34px, 5vw, 60px) !important;
  transform: translateX(-50%) !important;
  z-index: 7 !important;
  width: min(900px, calc(100% - 40px)) !important;
  max-width: 900px !important;
  text-align: center !important;
  color: var(--yhs-sub-text) !important;
  pointer-events: none !important;
  text-shadow: 0 12px 34px rgba(0, 0, 0, 0.42) !important;
}

.yada-hero-decor {
  position: absolute !important;
  inset: -44px -24px -28px -24px !important;
  z-index: 1 !important;
  pointer-events: none !important;
  overflow: visible !important;
  opacity: var(--yhs-decor-opacity) !important;
}

.yada-hero-decor-item {
  position: absolute !important;
  color: var(--yhs-decor) !important;
  transform-origin: center center !important;
  filter: drop-shadow(0 0 16px rgba(226, 215, 190, 0.12)) !important;
  will-change: transform, opacity !important;
}

.yada-hero-decor-item svg,
.yada-hero-decor-item img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

.yada-hero-decor-item img {
  object-fit: contain !important;
}

.yada-hero-decor-item .stroke-shape {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.yada-hero-decor-item .fill-shape {
  fill: currentColor !important;
  stroke: none !important;
}

.yada-hero-caption-content {
  position: relative !important;
  z-index: 2 !important;
  will-change: transform, opacity, filter !important;
}

.yada-hero-caption-main {
  --yhs-text-offset-x: 0px;
  --yhs-text-offset-y: 0px;
  font-family: "SaltyFeathers", "Marcellus", serif;
  font-size: clamp(52px, 6.6vw, 104px);
  line-height: 0.9;
  font-weight: 400;
  color: var(--yhs-main-text) !important;
  margin: 0 0 14px !important;
  letter-spacing: 0.4px;
}

.yada-hero-caption-sub {
  --yhs-text-offset-x: 0px;
  --yhs-text-offset-y: 0px;
  font-family: "Montserrat", Arial, sans-serif;
  font-size: clamp(11px, 1.1vw, 13px);
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--yhs-sub-text) !important;
  margin: 0 !important;
}

.yhs-text-reveal {
  --yhs-reveal-init-x: 0px;
  --yhs-reveal-init-y: 0px;
  --yhs-reveal-init-scale: 1;
  --yhs-reveal-init-blur: 0px;
  opacity: 0;
  transform: translate(calc(var(--yhs-text-offset-x) + var(--yhs-reveal-init-x)), calc(var(--yhs-text-offset-y) + var(--yhs-reveal-init-y))) scale(var(--yhs-reveal-init-scale));
  filter: blur(var(--yhs-reveal-init-blur));
  animation: yhsTextReveal var(--yhs-text-duration, 900ms) cubic-bezier(0.22, 1, 0.36, 1) var(--yhs-text-delay, 0ms) forwards;
  will-change: opacity, transform, filter;
}

.yhs-text-reveal-none {
  opacity: 1;
  transform: translate(var(--yhs-text-offset-x), var(--yhs-text-offset-y)) scale(1);
  filter: none;
  animation: none;
}

.yhs-text-reveal-fade-up {
  --yhs-reveal-init-y: 28px;
}

.yhs-text-reveal-fade-down {
  --yhs-reveal-init-y: -28px;
}

.yhs-text-reveal-fade-left {
  --yhs-reveal-init-x: -36px;
}

.yhs-text-reveal-fade-right {
  --yhs-reveal-init-x: 36px;
}

.yhs-text-reveal-zoom-in {
  --yhs-reveal-init-scale: 0.92;
}

.yhs-text-reveal-zoom-out {
  --yhs-reveal-init-scale: 1.08;
}

.yhs-text-reveal-blur-soft {
  --yhs-reveal-init-y: 12px;
  --yhs-reveal-init-blur: 10px;
}

@keyframes yhsTextReveal {
  to {
    opacity: 1;
    transform: translate(var(--yhs-text-offset-x), var(--yhs-text-offset-y)) scale(1);
    filter: blur(0);
  }
}

.yada-hero-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 22px !important;
  padding: 13px 24px !important;
  border: 1px solid rgba(226, 215, 190, 0.85) !important;
  border-radius: 999px !important;
  background: #e2d7be !important;
  color: #835a33 !important;
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none !important;
  pointer-events: auto !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.22) !important;
  transition: transform 0.22s ease, background 0.22s ease, color 0.22s ease, border-color 0.22s ease !important;
}

.yada-hero-button:hover,
.yada-hero-button:focus-visible {
  background: rgba(131, 90, 51, 0.84) !important;
  color: #e2d7be !important;
  transform: translateY(-2px) !important;
  outline: none !important;
}

.yada-hero-nav {
  position: absolute !important;
  right: clamp(18px, 4vw, 56px) !important;
  bottom: clamp(18px, 4vw, 48px) !important;
  z-index: 8 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  color: var(--yhs-nav-text) !important;
  background: var(--yhs-nav-bg) !important;
  border: 1px solid var(--yhs-nav-border) !important;
  border-radius: 999px !important;
  padding: 10px 12px !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18) !important;
  max-width: calc(100vw - 28px) !important;
}

.yada-hero-arrow,
.yada-hero-number {
  appearance: none !important;
  border: 0 !important;
  cursor: pointer !important;
  color: var(--yhs-nav-text) !important;
  background: transparent !important;
  font-family: "Montserrat", Arial, sans-serif !important;
  transition: all 0.22s ease !important;
}

.yada-hero-arrow {
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--yhs-nav-border) !important;
  font-size: 22px !important;
  line-height: 1 !important;
  padding: 0 0 3px !important;
  flex: 0 0 auto !important;
}

.yada-hero-arrow:hover,
.yada-hero-arrow:focus-visible {
  background: var(--yhs-arrow-hover-bg) !important;
  color: var(--yhs-arrow-hover-text) !important;
  border-color: var(--yhs-arrow-hover-bg) !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}

.yada-hero-numbers {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  max-width: 148px !important;
  overflow: hidden !important;
}

.yada-hero-number {
  min-width: 34px !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  letter-spacing: 1.4px !important;
  font-weight: 500 !important;
  opacity: 0.64 !important;
  padding: 0 !important;
  flex: 0 0 34px !important;
}

.yada-hero-number.is-hidden-window {
  display: none !important;
}

.yada-hero-number:hover,
.yada-hero-number:focus-visible,
.yada-hero-number.is-active {
  opacity: 1 !important;
  background: var(--yhs-nav-active-bg) !important;
  color: var(--yhs-nav-active-text) !important;
  outline: none !important;
}

.anim-none {
  animation: none !important;
}

.anim-float {
  animation: yhsItemFloat var(--yhs-anim-duration, 8s) ease-in-out infinite !important;
}

.anim-pulse {
  animation: yhsItemPulse var(--yhs-anim-duration, 9s) ease-in-out infinite !important;
}

.anim-twinkle {
  animation: yhsItemTwinkle var(--yhs-anim-duration, 5s) ease-in-out infinite !important;
}

.anim-drift {
  animation: yhsItemDrift var(--yhs-anim-duration, 12s) ease-in-out infinite !important;
}

@keyframes yhsItemFloat {
  0% { margin-top: 0; }
  50% { margin-top: -8px; }
  100% { margin-top: 0; }
}

@keyframes yhsItemPulse {
  0% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.08); }
  100% { transform: translate(-50%, -50%) scale(1); }
}

@keyframes yhsItemTwinkle {
  0% { opacity: inherit; filter: drop-shadow(0 0 8px rgba(226, 215, 190, 0.06)); }
  50% { opacity: 1; filter: drop-shadow(0 0 20px rgba(226, 215, 190, 0.28)); }
  100% { opacity: inherit; filter: drop-shadow(0 0 8px rgba(226, 215, 190, 0.06)); }
}

@keyframes yhsItemDrift {
  0% { margin-left: 0; margin-top: 0; }
  50% { margin-left: 8px; margin-top: -6px; }
  100% { margin-left: 0; margin-top: 0; }
}

@media (max-width: 620px) {
  .yada-hero-slider {
    min-height: 560px !important;
  }

  .yada-hero-slide {
    background-image: var(--yhs-mobile-image, var(--yhs-desktop-image)) !important;
    background-position: var(--yhs-mobile-position, var(--yhs-desktop-position, center center)) !important;
  }

  .yada-hero-caption {
    bottom: 82px !important;
    width: calc(100% - 28px) !important;
  }

  .yada-hero-decor {
    inset: -24px -8px -14px -8px !important;
  }

  .yada-hero-caption-main {
    font-size: clamp(34px, 11vw, 48px);
    margin-bottom: 10px !important;
  }

  .yada-hero-caption-sub {
    font-size: 10px;
    letter-spacing: 2.4px;
  }

  .yhs-text-reveal {
  --yhs-reveal-init-x: 0px;
  --yhs-reveal-init-y: 0px;
  --yhs-reveal-init-scale: 1;
  --yhs-reveal-init-blur: 0px;
  opacity: 0;
  transform: translate(calc(var(--yhs-text-offset-x) + var(--yhs-reveal-init-x)), calc(var(--yhs-text-offset-y) + var(--yhs-reveal-init-y))) scale(var(--yhs-reveal-init-scale));
  filter: blur(var(--yhs-reveal-init-blur));
  animation: yhsTextReveal var(--yhs-text-duration, 900ms) cubic-bezier(0.22, 1, 0.36, 1) var(--yhs-text-delay, 0ms) forwards;
  will-change: opacity, transform, filter;
}

.yhs-text-reveal-none {
  opacity: 1;
  transform: translate(var(--yhs-text-offset-x), var(--yhs-text-offset-y)) scale(1);
  filter: none;
  animation: none;
}

.yhs-text-reveal-fade-up {
  --yhs-reveal-init-y: 28px;
}

.yhs-text-reveal-fade-down {
  --yhs-reveal-init-y: -28px;
}

.yhs-text-reveal-fade-left {
  --yhs-reveal-init-x: -36px;
}

.yhs-text-reveal-fade-right {
  --yhs-reveal-init-x: 36px;
}

.yhs-text-reveal-zoom-in {
  --yhs-reveal-init-scale: 0.92;
}

.yhs-text-reveal-zoom-out {
  --yhs-reveal-init-scale: 1.08;
}

.yhs-text-reveal-blur-soft {
  --yhs-reveal-init-y: 12px;
  --yhs-reveal-init-blur: 10px;
}

@keyframes yhsTextReveal {
  to {
    opacity: 1;
    transform: translate(var(--yhs-text-offset-x), var(--yhs-text-offset-y)) scale(1);
    filter: blur(0);
  }
}

.yada-hero-button {
    margin-top: 16px !important;
    padding: 12px 18px !important;
    font-size: 10px;
    letter-spacing: 1.6px;
  }

  .yada-hero-nav {
    left: 50% !important;
    right: auto !important;
    bottom: 16px !important;
    transform: translateX(-50%) !important;
    gap: 7px !important;
    padding: 8px 9px !important;
  }

  .yada-hero-arrow {
    width: 34px !important;
    height: 34px !important;
  }

  .yada-hero-numbers {
    max-width: 128px !important;
  }

  .yada-hero-number {
    min-width: 29px !important;
    width: 29px !important;
    height: 30px !important;
    flex-basis: 29px !important;
    font-size: 11px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .yada-hero-slide,
  .yada-hero-decor-item,
  .yhs-text-reveal {
    animation: none !important;
    transition: none !important;
  }

  .yhs-text-reveal {
    opacity: 1 !important;
    transform: translate(var(--yhs-text-offset-x), var(--yhs-text-offset-y)) scale(1) !important;
    filter: none !important;
  }
}
