/*
Theme Name: Landeseiten
Theme URI:
Author: Dominique Rademacher
Author URI:  https://landeseiten.de
Version: 1.1.0

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


/*Gravity form fixes*/
.gform_wrapper.cs-landeseiten-form {
	max-width:100% !important;
}

.gform_wrapper.cs-landeseiten-form  .ginput_container_text input, .gform_wrapper.cs-landeseiten-form  textarea, .gform_wrapper.cs-landeseiten-form  .ginput_container_number input {
	text-align:left !important;
}
.ginput_container_number input[type="number"]::-webkit-outer-spin-button,
.ginput_container_number input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox + modern browsers */
.ginput_container_number input[type="number"] {
  appearance: textfield;
  -moz-appearance: textfield;
}


html,body {
	overflow-x:hidden !important;
}

.cs-parallax-container {
	position:absolute !important;
	top:0;
	left:0;
	width:100% !important;
	height:100% !important;
	pointer-events:none;
	z-index:0;
}

.cs-gradient-text  {
  --from: var(--e-global-color-primary);       
  --to:   var(--e-global-color-accent);   
  background-image: linear-gradient(1800deg, var(--from), var(--to));
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;   /* Safari */
          color: transparent;
  display:inline; /* keep gradient tight to text */
}

.cs-gradient-border {
  --from: var(--e-global-color-primary);       
  --to:   var(--e-global-color-accent);       
  --radius: 36px;        
  --bw: 2px;            
  --fill: #0f0f11;      

  display: inline-block;
  border-radius: var(--radius);
  border: var(--bw) solid transparent;         
  background:
    linear-gradient(var(--fill), var(--fill)) padding-box,         
    linear-gradient(90deg, var(--from), var(--to)) border-box;     
  color: #fff;
  padding: .75rem 1rem; 
}

.cs-gradient-stroke {
  --from:#E20079; 
  --to:#4A5D60; 
  --radius:36px; 
  --bw:2px;
  position: relative; border-radius: var(--radius);
}
.cs-gradient-stroke::before {
  content:""; position:absolute; inset:0; padding:var(--bw);
  border-radius: inherit;
  background: linear-gradient(90deg, var(--from), var(--to));
  /* punch out the middle so only the border remains */
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events:none;
}

/* Scope to this button widget */
.cs-cta-btn .elementor-button{
  /* Tweak these */
  --h: 88px;                               /* button height */
  --padL: 42px;                            /* left padding for text */
  --rightW: clamp(120px, 22vw, 220px);     /* width of right “icon area” */
  --cutR: clamp(180px, 35vw, 360px);       /* radius of the curved bite */
  --cutX: calc(var(--rightW) * 0.55);      /* bite position from right edge */

  --left-from: #E20079;  /* pink gradient */
  --left-to:   #FF1E95;
  --right-from:#4A5D60;  /* dark/right gradient */
  --right-to:  #B01C71;

  position: relative;
  isolation: isolate;                      /* keeps z-index layers inside */
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  min-height: var(--h);
  padding: 0 var(--rightW) 0 var(--padL);
  border-radius: 999px;
  background: linear-gradient(90deg, var(--right-from), var(--right-to));
  text-decoration: none;
}


.cs-primary-button .elementor-button {
    isolation:isolate;
}

.cs-primary-button .elementor-button::after{
  content:"";
  position:absolute;
  top:0; 
	right:0; 
	bottom:0;
max-width: 160px; 
    width: 100%;


  background-image: url('/wp-content/uploads/2025/08/button-right-bg.svg');
  background-position: right center;   
  
  background-repeat: no-repeat;
  background-size:cover;
  z-index:-1;
  pointer-events:none;
  transition: max-width ease .3s;
}
.cs-primary-button .elementor-button:hover::after {
    max-width: 0;
      transition: max-width ease .3s !important;
} 


.cs-step-icon-box  {
    background: #fff1;
    backdrop-filter: blur(30px)
}
.cs-step-icon-box .elementor-icon-box-icon {
      --from:#E20079; 
  --to:#4A5D60; 
    width: fit-content;
     background: linear-gradient(to bottom, var(--from), var(--to));
    padding: 20px;
    border-radius: 50%;
    margin: auto;
}

.cs-step-icon-box .elementor-icon-box-icon  .elementor-icon {
    background: #fff;
    padding: 20px;
    border-radius: 50%;
}

.cs-job-card:hover::before {
	cursor:pointer;
	opacity:.8 !important;
}

.cs-job-card:hover * {
color:#fff !important;
}
/* ICON COLORS & TRANSITIONS */
.step-icon *, .cs-step-icon *{
  transition: fill .35s ease, stroke .35s ease;
}
.step-icon.not-active *, .cs-step-icon.not-active *{
  fill:#5D767B !important;
  stroke:#5D767B !important;
}
/* optional: ensure active state clears the gray override */
.step-icon.is-active *, .cs-step-icon.is-active *{
  fill: unset !important;
  stroke: unset !important;
}

/* TEXTS: fade/slide in when .is-visible is added */
#step-1-text,#step-2-text,#step-3-text,#step-4-text{
  opacity:0; transform:translateY(8px);
  transition:opacity .35s ease, transform .35s ease;
}
#step-1-text.is-visible,#step-2-text.is-visible,
#step-3-text.is-visible,#step-4-text.is-visible{
  opacity:1; transform:translateY(0);
}