.elementor-kit-6{--e-global-color-primary:#119DA4;--e-global-color-secondary:#5D3A9B;--e-global-color-text:#C6C6C6;--e-global-color-accent:#FFC857;--e-global-color-ec7fb2b:#FFFFFF;--e-global-color-18690b8:#BD99E0;--e-global-color-d4e310e:#4B3F72;--e-global-color-be33f65:#3C7B8D;--e-global-color-853d1fb:#E1EBDC;--e-global-color-373fc29:#000000;--e-global-color-95e1d6e:#FFFFFFD1;--e-global-color-c6cf87d:#11121E;--e-global-color-de53e89:#F5F8FF2B;--e-global-color-54eaf1f:#F2F4F7;--e-global-color-d4a6ed7:#11121E9E;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-weight:400;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:500;color:var( --e-global-color-text );font-size:17px;--e-page-transition-entrance-animation:e-page-transition-fade-out;--e-page-transition-exit-animation:e-page-transition-fade-in;--e-page-transition-animation-duration:1500ms;--e-preloader-animation-duration:1200ms;--e-preloader-delay:0ms;--e-preloader-color:#FFFFFF4F;--e-preloader-size:30px;}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{background-color:#119DA4;color:var( --e-global-color-ec7fb2b );border-style:none;border-radius:8px 8px 8px 8px;padding:15px 30px 15px 30px;}.elementor-kit-6 button:hover,.elementor-kit-6 button:focus,.elementor-kit-6 input[type="button"]:hover,.elementor-kit-6 input[type="button"]:focus,.elementor-kit-6 input[type="submit"]:hover,.elementor-kit-6 input[type="submit"]:focus,.elementor-kit-6 .elementor-button:hover,.elementor-kit-6 .elementor-button:focus{background-color:var( --e-global-color-be33f65 );border-style:none;}.elementor-kit-6 e-page-transition{background-color:transparent;background-image:linear-gradient(45deg, #11121E 0%, #0D5B5F 100%);}.elementor-kit-6 a{color:var( --e-global-color-primary );}.elementor-kit-6 h1{font-family:"Poppins", Sans-serif;font-size:45px;font-weight:600;}.elementor-kit-6 h2{font-family:"Poppins", Sans-serif;font-size:32px;font-weight:600;line-height:120%;}.elementor-kit-6 h3{font-family:"Poppins", Sans-serif;font-size:24px;font-weight:600;line-height:120%;}.elementor-kit-6 h4{font-size:18px;line-height:120%;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1312px;}.e-con{--container-max-width:1312px;--container-default-padding-top:96px;--container-default-padding-right:5%;--container-default-padding-bottom:96px;--container-default-padding-left:5%;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */body {
    overflow-x: hidden !important;
}

.agb-datenschutz-hinweis {
    line-height: normal;
}


/* Make all Elementor spacers ignore the mouse */
.elementor-widget-spacer,
.elementor-widget-spacer .elementor-spacer,
.elementor-widget-spacer .elementor-spacer-inner {
  pointer-events: none !important;
}


.button-prime .elementor-button {
  background-image: linear-gradient(45deg, #5D3A9B, #119DA4) !important; /* Purple to Blue */
  background-size: 200% 100% !important;
  background-position: right center !important; /* Starts with blue on left, purple on right */
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  transition:
    background-position 0.4s ease,
    box-shadow 0.4s ease,
    transform 0.3s ease !important;

  box-shadow:
    0 0 4px rgba(17, 157, 164, 0.2),
    0 0 6px rgba(93, 58, 155, 0.15),
    0 0 2px rgba(255, 255, 255, 0.05);
}

.button-prime .elementor-button:hover {
  background-position: left center !important; /* Purple shifts to left, blue to right */
  transform: scale(1.035);
  color: #fff !important;

  box-shadow:
    0 0 6px rgba(17, 157, 164, 0.4),
    0 0 10px rgba(93, 58, 155, 0.25),
    0 0 15px rgba(255, 200, 87, 0.1),
    0 0 20px rgba(93, 58, 155, 0.15);
}

.button-prime .elementor-button:hover:not(:focus):not(:active) {
  outline: none !important;
}

/* Glass card */
.cappi-glass {
  /* defaults */
  --mx: 50%;
  --my: 50%;
  --glow: 0; /* 0 hidden, 1 visible */

  position: relative;
  background-color: rgba(225, 235, 220, 0.10);
  border-radius: 16px;
  border: 1px solid rgba(225, 235, 220, 0.40);
  backdrop-filter: blur(12px) saturate(150%);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  box-shadow:
    0 4px 20px rgba(0, 0, 0, 0.10),
    inset 0 0 0 1px rgba(255, 255, 255, 0.15);
  overflow: hidden;

  /* do not animate transform; Elementor owns that */
  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease,
    backdrop-filter 0.25s ease,
    -webkit-backdrop-filter 0.25s ease;
}

/* Prime style just for JetFormBuilder form button */
.form-button-prime {
  background-image: linear-gradient(45deg, #5D3A9B, #119DA4) !important; /* Purple to Blue */
  background-size: 200% 100% !important;
  background-position: right center !important; /* Starts with blue on left, purple on right */
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  transition:
    background-position 0.4s ease,
    box-shadow 0.4s ease,
    transform 0.3s ease !important;

  box-shadow:
    0 0 4px rgba(17, 157, 164, 0.2),
    0 0 6px rgba(93, 58, 155, 0.15),
    0 0 2px rgba(255, 255, 255, 0.05);
}

/* Hover effect */
.form-button-prime:hover {
  background-position: left center !important; /* Purple shifts to left, blue to right */
  transform: scale(1.035);
  color: #fff !important;

  box-shadow:
    0 0 6px rgba(17, 157, 164, 0.4),
    0 0 10px rgba(93, 58, 155, 0.25),
    0 0 15px rgba(255, 200, 87, 0.1),
    0 0 20px rgba(93, 58, 155, 0.15);
}

/* Remove outline on hover when not focused/active */
.form-button-prime:hover:not(:focus):not(:active) {
  outline: none !important;
}




/* Glass card */
.cappi-glass {
  /* defaults */
  --mx: 50%;
  --my: 50%;
  --glow: 0;               /* 0 hidden, 1 visible */
  --glow-fade: 280ms;      /* keep in sync with JS */

  position: relative;
  background-color: rgba(225, 235, 220, 0.15);
  border-radius: 16px;
  border: 1px solid rgba(225, 235, 220, 0.40);
  backdrop-filter: blur(12px) saturate(150%);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  box-shadow:
    0 4px 20px rgba(0, 0, 0, 0.10),
    inset 0 0 0 1px rgba(255, 255, 255, 0.15);
  overflow: hidden;

  /* do not animate transform; Elementor owns that */
  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease,
    backdrop-filter 0.25s ease,
    -webkit-backdrop-filter 0.25s ease;
}

/* Your normal hover styling */
.cappi-glass:hover {
  border-color: rgba(225, 235, 220, 0.75);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  box-shadow:
    0 6px 30px rgba(0, 0, 0, 0.15),
    inset 0 0 0 1px rgba(225, 235, 220, 0.30);
}

/* JS toggles this class while the glow is active */
.cappi-glass.is-glowing { --glow: 1; }

/* Glow layer */
.cappi-glass::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;

  background: radial-gradient(
    500px circle at var(--mx) var(--my),
    rgba(255, 255, 255, 0.033),
    transparent 70%
  );

  /* fade opacity always, but DO NOT animate background when not glowing */
  opacity: var(--glow);
  transition:
    opacity var(--glow-fade) ease,
    background 0s linear;   /* frozen when hidden */
}

/* When glowing, allow the hotspot to interpolate a bit */
.cappi-glass.is-glowing::before {
  transition:
    opacity var(--glow-fade) ease,
    background 80ms linear;  /* quick, smooth tracking */
  will-change: opacity, background;
}

/* Keep content above the glow */
.cappi-glass > * { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .cappi-glass, .cappi-glass::before { transition: none; }
}





/* Clip the last Elementor content wrapper right before the footer so
   absolutely-positioned backgrounds can't extend past it. */

/* Works when your page content wrapper (".elementor") is directly followed by the footer wrapper */
.site-main > .elementor:has(+ .elementor-location-footer),
.elementor:has(+ .elementor-location-footer) {
  position: relative;
  isolation: isolate;
  overflow: clip; /* modern, no extra scrollbars */
}

/* Fallback if overflow: clip isn't supported */
@supports not (overflow: clip) {
  .site-main > .elementor:has(+ .elementor-location-footer),
  .elementor:has(+ .elementor-location-footer) { overflow: hidden; }
}

/* Housekeeping */
html, body { overflow-x: hidden; }




#trp_ald_x_button_and_textarea{
    width: auto!important;
}
/* Glassmorphism effect for TranslatePress modal popup */
#trp_ald_modal_popup {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 9999 !important;
  width: auto;
  max-width: 90vw;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  padding: 50px;
  max-width: 550px;

  /* Glass effect core */
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.3);

  /* Optional: smooth opacity or scale animation */
  transition: all 0.3s ease;
}

/* Optional: make the background behind modal dimmed */
.trp_model_container {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(17, 18, 30, 0.5); /* dark glass background */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9998;
}


/* Strong override for TranslatePress change language button */
#trp_ald_modal_popup .trp_ald_button a#trp_ald_popup_change_language {
  display: inline-block !important;
  padding: 0.75em 1.5em !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  text-align: center !important;
  text-decoration: none !important;

  background-image: linear-gradient(45deg, #5D3A9B, #119DA4) !important;
  background-size: 200% 100% !important;
  background-position: right center !important;

  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  cursor: pointer !important;

  transition:
    background-position 0.4s ease !important,
    box-shadow 0.4s ease !important,
    transform 0.3s ease !important;

  box-shadow:
    0 0 4px rgba(17, 157, 164, 0.2),
    0 0 6px rgba(93, 58, 155, 0.15),
    0 0 2px rgba(255, 255, 255, 0.05) !important;
}

/* Hover effect */
#trp_ald_modal_popup .trp_ald_button a#trp_ald_popup_change_language:hover {
  background-position: left center !important;
  transform: scale(1.035) !important;
  color: #fff !important;

  box-shadow:
    0 0 6px rgba(17, 157, 164, 0.4),
    0 0 10px rgba(93, 58, 155, 0.25),
    0 0 15px rgba(255, 200, 87, 0.1),
    0 0 20px rgba(93, 58, 155, 0.15) !important;
}

/* Optional: remove focus outline */
#trp_ald_modal_popup .trp_ald_button a#trp_ald_popup_change_language:focus {
  outline: none !important;
}




























































/* === Spotlight Effects === */
.spotlight-hover {
  background-image: radial-gradient(
    circle at var(--x, 50%) var(--y, 50%),
    rgba(255,255,255,.7) 0%,
    transparent 60%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background-position .1s !important;
}

.soft-spotlight {
  background-image: radial-gradient(
    circle at var(--sx, 50%) var(--sy, 50%),
    rgba(255,255,255,.5) 0%,
    transparent 80%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background .3s ease !important;
}

.color-spotlight {
  background-image: radial-gradient(
    circle at var(--cx, 50%) var(--cy, 50%),
    rgba(0,200,255,0.6) 0%,
    transparent 70%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background .1s ease !important;
}

.dual-spotlights {
  background-image:
    radial-gradient(circle at var(--dx, 30%) var(--dy, 50%), rgba(255,255,255,.6) 0%, transparent 60%),
    radial-gradient(circle at var(--ex, 70%) var(--ey, 50%), rgba(255,255,255,.6) 0%, transparent 60%) !important;
  background-repeat: no-repeat !important;
}

.ring-spotlight {
  background-image: radial-gradient(
    circle at var(--rx, 50%) var(--ry, 50%),
    transparent 40%,
    rgba(255,255,255,.6) 41%,
    transparent 80%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background .1s ease !important;
}

/* === Shine Effects === */
.shine-sweep-diagonal { overflow: hidden !important; }
.shine-sweep-diagonal::before {
  content: "" !important;
  position: absolute !important;
  top: -50% !important; left: -60% !important;
  width: 60% !important; height: 200% !important;
  background: linear-gradient(120deg, rgba(255,255,255,.45) 0%, rgba(255,255,255,0) 70%) !important;
  transform: skewX(-20deg) !important;
  transition: left .6s !important;
}
.shine-sweep-diagonal:hover::before { left: 120% !important; }

.shine-sweep-vertical { overflow: hidden !important; }
.shine-sweep-vertical::before {
  content: "" !important;
  position: absolute !important;
  top: -100% !important; left: 0 !important;
  width: 100% !important; height: 80% !important;
  background: linear-gradient(180deg, rgba(255,255,255,.35) 0%, rgba(255,255,255,0) 100%) !important;
  transition: top .7s !important;
}
.shine-sweep-vertical:hover::before { top: 120% !important; }

.shine-loop { overflow: hidden !important; }
.shine-loop::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: -60% !important;
  width: 40% !important; height: 100% !important;
  background: linear-gradient(120deg, rgba(255,255,255,.35), rgba(255,255,255,0)) !important;
  transform: skewX(-20deg) !important;
  animation: shineLoop 4s linear infinite !important;
}
@keyframes shineLoop {
  0%   { left: -60% !important; }
  50%  { left: 110% !important; }
  100% { left: -60% !important; }
}

.shine-multi-stripes::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  background: repeating-linear-gradient(120deg, rgba(255,255,255,.18) 0 10px, rgba(255,255,255,0) 10px 20px) !important;
  transform: translateX(-100%) !important;
  transition: transform .8s !important;
}
.shine-multi-stripes:hover::before { transform: translateX(0) !important; }

/* === Other Light/Glare Effects === */
.glare-cross::before,
.glare-cross::after {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.15), transparent),
    linear-gradient(0deg, rgba(255,255,255,.15), transparent) !important;
  mix-blend-mode: screen !important;
}
.glare-cross::after { transform: rotate(45deg) !important; }

.edge-light::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  box-shadow: inset 0 0 20px 4px rgba(255,255,255,.5) !important;
  opacity: 0 !important;
  transition: opacity .4s !important;
}
.edge-light:hover::before { opacity: 1 !important; }

.corner-pillars::before,
.corner-pillars::after {
  content: "" !important;
  position: absolute !important;
  width: 10px !important; height: 40px !important;
  background: var(--e-global-color-primary) !important;
  transition: transform .4s !important;
}
.corner-pillars::before { top: 10px !important; left: 10px !important; }
.corner-pillars::after  { bottom: 10px !important; right: 10px !important; }
.corner-pillars:hover::before { transform: translateY(-10px) !important; }
.corner-pillars:hover::after  { transform: translateY(10px) !important; }

/* === Glass Effects === */
.glass-frosted-edge::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  backdrop-filter: blur(12px) !important;
  mask: radial-gradient(circle at center, transparent 40%, black 100%) !important;
  -webkit-mask: radial-gradient(circle at center, transparent 40%, black 100%) !important;
}

.glass-split::before,
.glass-split::after {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  backdrop-filter: blur(10px) !important;
}
.glass-split::before {
  clip-path: polygon(0 0,50% 0,50% 100%,0 100%) !important;
  background: rgba(255,255,255,.25) !important;
}
.glass-split::after {
  clip-path: polygon(50% 0,100% 0,100% 100%,50% 100%) !important;
  background: rgba(255,255,255,.15) !important;
}

.glass-gradient-tint::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  backdrop-filter: blur(8px) !important;
  background: linear-gradient(135deg, rgba(255,0,150,.25), rgba(0,150,255,.25)) !important;
}

/* === Special Effects === */
.blur-on-scroll.blur-active { filter: blur(3px) !important; }

.gradient-wipe-reveal::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  background: linear-gradient(90deg, #fff 0%, transparent 40%, transparent 60%, #fff 100%) !important;
  transform: translateX(-100%) !important;
  transition: transform .8s !important;
}
.gradient-wipe-reveal:hover::before { transform: translateX(100%) !important; }

.mask-wipe-horizontal {
  --m: linear-gradient(#000 0 0) !important;
  -webkit-mask: var(--m) !important; mask: var(--m) !important;
  -webkit-mask-size: 0% 100% !important; mask-size: 0% 100% !important;
  -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important;
  background: #ccc !important;
  transition: -webkit-mask-size .6s ease !important;
}
.mask-wipe-horizontal:hover {
  -webkit-mask-size: 100% 100% !important; mask-size: 100% 100% !important;
}

/* === Glow Effects === */
.glow-inner-soft::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  box-shadow: inset 0 0 25px rgba(255,255,255,.6) !important;
}

.glow-outer-pulsing::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  border-radius: inherit !important;
  box-shadow: 0 0 20px 8px rgba(255,255,255,.45) !important;
  animation: pulseGlow 2.2s infinite !important;
}
@keyframes pulseGlow {
  0%,100% { opacity: .2 !important; }
  50%     { opacity: .8 !important; }
}

/* === Shadow Effects === */
.shadow-layered {
  box-shadow:
    0 2px 2px rgba(0,0,0,.1),
    0 6px 6px rgba(0,0,0,.08),
    0 12px 12px rgba(0,0,0,.06) !important;
}
.shadow-long { box-shadow: 0 20px 40px rgba(0,0,0,.25) !important; }
.offset-shadow { box-shadow: 8px 8px 0 rgba(0,0,0,.25) !important; }

/* === Reflection === */
.reflection-bottom::after {
  content: "" !important;
  position: absolute !important; left: 0 !important; right: 0 !important; bottom: -100% !important;
  height: 100% !important;
  background: inherit !important;
  transform: scaleY(-1) !important;
  opacity: .2 !important; filter: blur(2px) !important;
  mask: linear-gradient(transparent, black) !important;
  -webkit-mask: linear-gradient(transparent, black) !important;
}

/* === Animated Backgrounds === */
.nebula-gradient {
  background: linear-gradient(45deg, #ff6ec4, #7873f5, #4adeb7) !important;
  background-size: 600% 600% !important;
  animation: nebula 10s ease infinite !important;
}
@keyframes nebula {
  0%   { background-position: 0% 50% !important; }
  50%  { background-position: 100% 50% !important; }
  100% { background-position: 0% 50% !important; }
}

/* === Grid Overlay === */
.grid-wireframe {
  background:
    linear-gradient(#fff 1px, transparent 1px) 0 0,
    linear-gradient(90deg, #fff 1px, transparent 1px) 0 0 !important;
  background-size: 40px 40px !important;
  animation: wire 10s infinite linear !important;
}
@keyframes wire {
  0%   { background-position: 0 0 !important; }
  100% { background-position: 40px 40px !important; }
}/* End custom CSS */
/* Start custom CSS */body {
    overflow-x: hidden !important;
}

.agb-datenschutz-hinweis {
    line-height: normal;
}


/* Make all Elementor spacers ignore the mouse */
.elementor-widget-spacer,
.elementor-widget-spacer .elementor-spacer,
.elementor-widget-spacer .elementor-spacer-inner {
  pointer-events: none !important;
}


.button-prime .elementor-button {
  background-image: linear-gradient(45deg, #5D3A9B, #119DA4) !important; /* Purple to Blue */
  background-size: 200% 100% !important;
  background-position: right center !important; /* Starts with blue on left, purple on right */
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  transition:
    background-position 0.4s ease,
    box-shadow 0.4s ease,
    transform 0.3s ease !important;

  box-shadow:
    0 0 4px rgba(17, 157, 164, 0.2),
    0 0 6px rgba(93, 58, 155, 0.15),
    0 0 2px rgba(255, 255, 255, 0.05);
}

.button-prime .elementor-button:hover {
  background-position: left center !important; /* Purple shifts to left, blue to right */
  transform: scale(1.035);
  color: #fff !important;

  box-shadow:
    0 0 6px rgba(17, 157, 164, 0.4),
    0 0 10px rgba(93, 58, 155, 0.25),
    0 0 15px rgba(255, 200, 87, 0.1),
    0 0 20px rgba(93, 58, 155, 0.15);
}

.button-prime .elementor-button:hover:not(:focus):not(:active) {
  outline: none !important;
}

/* Glass card */
.cappi-glass {
  /* defaults */
  --mx: 50%;
  --my: 50%;
  --glow: 0; /* 0 hidden, 1 visible */

  position: relative;
  background-color: rgba(225, 235, 220, 0.10);
  border-radius: 16px;
  border: 1px solid rgba(225, 235, 220, 0.40);
  backdrop-filter: blur(12px) saturate(150%);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  box-shadow:
    0 4px 20px rgba(0, 0, 0, 0.10),
    inset 0 0 0 1px rgba(255, 255, 255, 0.15);
  overflow: hidden;

  /* do not animate transform; Elementor owns that */
  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease,
    backdrop-filter 0.25s ease,
    -webkit-backdrop-filter 0.25s ease;
}

/* Prime style just for JetFormBuilder form button */
.form-button-prime {
  background-image: linear-gradient(45deg, #5D3A9B, #119DA4) !important; /* Purple to Blue */
  background-size: 200% 100% !important;
  background-position: right center !important; /* Starts with blue on left, purple on right */
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  transition:
    background-position 0.4s ease,
    box-shadow 0.4s ease,
    transform 0.3s ease !important;

  box-shadow:
    0 0 4px rgba(17, 157, 164, 0.2),
    0 0 6px rgba(93, 58, 155, 0.15),
    0 0 2px rgba(255, 255, 255, 0.05);
}

/* Hover effect */
.form-button-prime:hover {
  background-position: left center !important; /* Purple shifts to left, blue to right */
  transform: scale(1.035);
  color: #fff !important;

  box-shadow:
    0 0 6px rgba(17, 157, 164, 0.4),
    0 0 10px rgba(93, 58, 155, 0.25),
    0 0 15px rgba(255, 200, 87, 0.1),
    0 0 20px rgba(93, 58, 155, 0.15);
}

/* Remove outline on hover when not focused/active */
.form-button-prime:hover:not(:focus):not(:active) {
  outline: none !important;
}




/* Glass card */
.cappi-glass {
  /* defaults */
  --mx: 50%;
  --my: 50%;
  --glow: 0;               /* 0 hidden, 1 visible */
  --glow-fade: 280ms;      /* keep in sync with JS */

  position: relative;
  background-color: rgba(225, 235, 220, 0.15);
  border-radius: 16px;
  border: 1px solid rgba(225, 235, 220, 0.40);
  backdrop-filter: blur(12px) saturate(150%);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  box-shadow:
    0 4px 20px rgba(0, 0, 0, 0.10),
    inset 0 0 0 1px rgba(255, 255, 255, 0.15);
  overflow: hidden;

  /* do not animate transform; Elementor owns that */
  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease,
    backdrop-filter 0.25s ease,
    -webkit-backdrop-filter 0.25s ease;
}

/* Your normal hover styling */
.cappi-glass:hover {
  border-color: rgba(225, 235, 220, 0.75);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  box-shadow:
    0 6px 30px rgba(0, 0, 0, 0.15),
    inset 0 0 0 1px rgba(225, 235, 220, 0.30);
}

/* JS toggles this class while the glow is active */
.cappi-glass.is-glowing { --glow: 1; }

/* Glow layer */
.cappi-glass::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;

  background: radial-gradient(
    500px circle at var(--mx) var(--my),
    rgba(255, 255, 255, 0.033),
    transparent 70%
  );

  /* fade opacity always, but DO NOT animate background when not glowing */
  opacity: var(--glow);
  transition:
    opacity var(--glow-fade) ease,
    background 0s linear;   /* frozen when hidden */
}

/* When glowing, allow the hotspot to interpolate a bit */
.cappi-glass.is-glowing::before {
  transition:
    opacity var(--glow-fade) ease,
    background 80ms linear;  /* quick, smooth tracking */
  will-change: opacity, background;
}

/* Keep content above the glow */
.cappi-glass > * { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .cappi-glass, .cappi-glass::before { transition: none; }
}





/* Clip the last Elementor content wrapper right before the footer so
   absolutely-positioned backgrounds can't extend past it. */

/* Works when your page content wrapper (".elementor") is directly followed by the footer wrapper */
.site-main > .elementor:has(+ .elementor-location-footer),
.elementor:has(+ .elementor-location-footer) {
  position: relative;
  isolation: isolate;
  overflow: clip; /* modern, no extra scrollbars */
}

/* Fallback if overflow: clip isn't supported */
@supports not (overflow: clip) {
  .site-main > .elementor:has(+ .elementor-location-footer),
  .elementor:has(+ .elementor-location-footer) { overflow: hidden; }
}

/* Housekeeping */
html, body { overflow-x: hidden; }




#trp_ald_x_button_and_textarea{
    width: auto!important;
}
/* Glassmorphism effect for TranslatePress modal popup */
#trp_ald_modal_popup {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 9999 !important;
  width: auto;
  max-width: 90vw;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  padding: 50px;
  max-width: 550px;

  /* Glass effect core */
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.3);

  /* Optional: smooth opacity or scale animation */
  transition: all 0.3s ease;
}

/* Optional: make the background behind modal dimmed */
.trp_model_container {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(17, 18, 30, 0.5); /* dark glass background */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9998;
}


/* Strong override for TranslatePress change language button */
#trp_ald_modal_popup .trp_ald_button a#trp_ald_popup_change_language {
  display: inline-block !important;
  padding: 0.75em 1.5em !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  text-align: center !important;
  text-decoration: none !important;

  background-image: linear-gradient(45deg, #5D3A9B, #119DA4) !important;
  background-size: 200% 100% !important;
  background-position: right center !important;

  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  cursor: pointer !important;

  transition:
    background-position 0.4s ease !important,
    box-shadow 0.4s ease !important,
    transform 0.3s ease !important;

  box-shadow:
    0 0 4px rgba(17, 157, 164, 0.2),
    0 0 6px rgba(93, 58, 155, 0.15),
    0 0 2px rgba(255, 255, 255, 0.05) !important;
}

/* Hover effect */
#trp_ald_modal_popup .trp_ald_button a#trp_ald_popup_change_language:hover {
  background-position: left center !important;
  transform: scale(1.035) !important;
  color: #fff !important;

  box-shadow:
    0 0 6px rgba(17, 157, 164, 0.4),
    0 0 10px rgba(93, 58, 155, 0.25),
    0 0 15px rgba(255, 200, 87, 0.1),
    0 0 20px rgba(93, 58, 155, 0.15) !important;
}

/* Optional: remove focus outline */
#trp_ald_modal_popup .trp_ald_button a#trp_ald_popup_change_language:focus {
  outline: none !important;
}




























































/* === Spotlight Effects === */
.spotlight-hover {
  background-image: radial-gradient(
    circle at var(--x, 50%) var(--y, 50%),
    rgba(255,255,255,.7) 0%,
    transparent 60%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background-position .1s !important;
}

.soft-spotlight {
  background-image: radial-gradient(
    circle at var(--sx, 50%) var(--sy, 50%),
    rgba(255,255,255,.5) 0%,
    transparent 80%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background .3s ease !important;
}

.color-spotlight {
  background-image: radial-gradient(
    circle at var(--cx, 50%) var(--cy, 50%),
    rgba(0,200,255,0.6) 0%,
    transparent 70%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background .1s ease !important;
}

.dual-spotlights {
  background-image:
    radial-gradient(circle at var(--dx, 30%) var(--dy, 50%), rgba(255,255,255,.6) 0%, transparent 60%),
    radial-gradient(circle at var(--ex, 70%) var(--ey, 50%), rgba(255,255,255,.6) 0%, transparent 60%) !important;
  background-repeat: no-repeat !important;
}

.ring-spotlight {
  background-image: radial-gradient(
    circle at var(--rx, 50%) var(--ry, 50%),
    transparent 40%,
    rgba(255,255,255,.6) 41%,
    transparent 80%
  ) !important;
  background-repeat: no-repeat !important;
  transition: background .1s ease !important;
}

/* === Shine Effects === */
.shine-sweep-diagonal { overflow: hidden !important; }
.shine-sweep-diagonal::before {
  content: "" !important;
  position: absolute !important;
  top: -50% !important; left: -60% !important;
  width: 60% !important; height: 200% !important;
  background: linear-gradient(120deg, rgba(255,255,255,.45) 0%, rgba(255,255,255,0) 70%) !important;
  transform: skewX(-20deg) !important;
  transition: left .6s !important;
}
.shine-sweep-diagonal:hover::before { left: 120% !important; }

.shine-sweep-vertical { overflow: hidden !important; }
.shine-sweep-vertical::before {
  content: "" !important;
  position: absolute !important;
  top: -100% !important; left: 0 !important;
  width: 100% !important; height: 80% !important;
  background: linear-gradient(180deg, rgba(255,255,255,.35) 0%, rgba(255,255,255,0) 100%) !important;
  transition: top .7s !important;
}
.shine-sweep-vertical:hover::before { top: 120% !important; }

.shine-loop { overflow: hidden !important; }
.shine-loop::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: -60% !important;
  width: 40% !important; height: 100% !important;
  background: linear-gradient(120deg, rgba(255,255,255,.35), rgba(255,255,255,0)) !important;
  transform: skewX(-20deg) !important;
  animation: shineLoop 4s linear infinite !important;
}
@keyframes shineLoop {
  0%   { left: -60% !important; }
  50%  { left: 110% !important; }
  100% { left: -60% !important; }
}

.shine-multi-stripes::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  background: repeating-linear-gradient(120deg, rgba(255,255,255,.18) 0 10px, rgba(255,255,255,0) 10px 20px) !important;
  transform: translateX(-100%) !important;
  transition: transform .8s !important;
}
.shine-multi-stripes:hover::before { transform: translateX(0) !important; }

/* === Other Light/Glare Effects === */
.glare-cross::before,
.glare-cross::after {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.15), transparent),
    linear-gradient(0deg, rgba(255,255,255,.15), transparent) !important;
  mix-blend-mode: screen !important;
}
.glare-cross::after { transform: rotate(45deg) !important; }

.edge-light::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  box-shadow: inset 0 0 20px 4px rgba(255,255,255,.5) !important;
  opacity: 0 !important;
  transition: opacity .4s !important;
}
.edge-light:hover::before { opacity: 1 !important; }

.corner-pillars::before,
.corner-pillars::after {
  content: "" !important;
  position: absolute !important;
  width: 10px !important; height: 40px !important;
  background: var(--e-global-color-primary) !important;
  transition: transform .4s !important;
}
.corner-pillars::before { top: 10px !important; left: 10px !important; }
.corner-pillars::after  { bottom: 10px !important; right: 10px !important; }
.corner-pillars:hover::before { transform: translateY(-10px) !important; }
.corner-pillars:hover::after  { transform: translateY(10px) !important; }

/* === Glass Effects === */
.glass-frosted-edge::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  backdrop-filter: blur(12px) !important;
  mask: radial-gradient(circle at center, transparent 40%, black 100%) !important;
  -webkit-mask: radial-gradient(circle at center, transparent 40%, black 100%) !important;
}

.glass-split::before,
.glass-split::after {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  backdrop-filter: blur(10px) !important;
}
.glass-split::before {
  clip-path: polygon(0 0,50% 0,50% 100%,0 100%) !important;
  background: rgba(255,255,255,.25) !important;
}
.glass-split::after {
  clip-path: polygon(50% 0,100% 0,100% 100%,50% 100%) !important;
  background: rgba(255,255,255,.15) !important;
}

.glass-gradient-tint::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  backdrop-filter: blur(8px) !important;
  background: linear-gradient(135deg, rgba(255,0,150,.25), rgba(0,150,255,.25)) !important;
}

/* === Special Effects === */
.blur-on-scroll.blur-active { filter: blur(3px) !important; }

.gradient-wipe-reveal::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  background: linear-gradient(90deg, #fff 0%, transparent 40%, transparent 60%, #fff 100%) !important;
  transform: translateX(-100%) !important;
  transition: transform .8s !important;
}
.gradient-wipe-reveal:hover::before { transform: translateX(100%) !important; }

.mask-wipe-horizontal {
  --m: linear-gradient(#000 0 0) !important;
  -webkit-mask: var(--m) !important; mask: var(--m) !important;
  -webkit-mask-size: 0% 100% !important; mask-size: 0% 100% !important;
  -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important;
  background: #ccc !important;
  transition: -webkit-mask-size .6s ease !important;
}
.mask-wipe-horizontal:hover {
  -webkit-mask-size: 100% 100% !important; mask-size: 100% 100% !important;
}

/* === Glow Effects === */
.glow-inner-soft::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  box-shadow: inset 0 0 25px rgba(255,255,255,.6) !important;
}

.glow-outer-pulsing::before {
  content: "" !important;
  position: absolute !important; inset: 0 !important;
  border-radius: inherit !important;
  box-shadow: 0 0 20px 8px rgba(255,255,255,.45) !important;
  animation: pulseGlow 2.2s infinite !important;
}
@keyframes pulseGlow {
  0%,100% { opacity: .2 !important; }
  50%     { opacity: .8 !important; }
}

/* === Shadow Effects === */
.shadow-layered {
  box-shadow:
    0 2px 2px rgba(0,0,0,.1),
    0 6px 6px rgba(0,0,0,.08),
    0 12px 12px rgba(0,0,0,.06) !important;
}
.shadow-long { box-shadow: 0 20px 40px rgba(0,0,0,.25) !important; }
.offset-shadow { box-shadow: 8px 8px 0 rgba(0,0,0,.25) !important; }

/* === Reflection === */
.reflection-bottom::after {
  content: "" !important;
  position: absolute !important; left: 0 !important; right: 0 !important; bottom: -100% !important;
  height: 100% !important;
  background: inherit !important;
  transform: scaleY(-1) !important;
  opacity: .2 !important; filter: blur(2px) !important;
  mask: linear-gradient(transparent, black) !important;
  -webkit-mask: linear-gradient(transparent, black) !important;
}

/* === Animated Backgrounds === */
.nebula-gradient {
  background: linear-gradient(45deg, #ff6ec4, #7873f5, #4adeb7) !important;
  background-size: 600% 600% !important;
  animation: nebula 10s ease infinite !important;
}
@keyframes nebula {
  0%   { background-position: 0% 50% !important; }
  50%  { background-position: 100% 50% !important; }
  100% { background-position: 0% 50% !important; }
}

/* === Grid Overlay === */
.grid-wireframe {
  background:
    linear-gradient(#fff 1px, transparent 1px) 0 0,
    linear-gradient(90deg, #fff 1px, transparent 1px) 0 0 !important;
  background-size: 40px 40px !important;
  animation: wire 10s infinite linear !important;
}
@keyframes wire {
  0%   { background-position: 0 0 !important; }
  100% { background-position: 40px 40px !important; }
}/* End custom CSS */