.elementor-8967 .elementor-element.elementor-element-25d3240{--display:flex;--min-height:70vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--overlay-opacity:0.24;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-8967 .elementor-element.elementor-element-25d3240:not(.elementor-motion-effects-element-type-background), .elementor-8967 .elementor-element.elementor-element-25d3240 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ask-hessen.de/wp-content/uploads/2025/12/ask-gute-taten-shop-header.webp");background-position:center left;background-size:cover;}.elementor-8967 .elementor-element.elementor-element-25d3240::before, .elementor-8967 .elementor-element.elementor-element-25d3240 > .elementor-background-video-container::before, .elementor-8967 .elementor-element.elementor-element-25d3240 > .e-con-inner > .elementor-background-video-container::before, .elementor-8967 .elementor-element.elementor-element-25d3240 > .elementor-background-slideshow::before, .elementor-8967 .elementor-element.elementor-element-25d3240 > .e-con-inner > .elementor-background-slideshow::before, .elementor-8967 .elementor-element.elementor-element-25d3240 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-text );--background-overlay:'';}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );color:var( --e-global-color-primary );}.elementor-8967 .elementor-element.elementor-element-4a6b92a{text-align:center;}.elementor-8967 .elementor-element.elementor-element-4a6b92a .elementor-heading-title{font-family:"Mikado", Sans-serif;font-size:30px;font-weight:500;line-height:1em;text-shadow:0px 0px 10px rgba(0, 0, 0, 0.67);color:#FFFFFF;}.elementor-8967 .elementor-element.elementor-element-d1a0864{text-align:center;}.elementor-8967 .elementor-element.elementor-element-d1a0864 .elementor-heading-title{font-family:"Mikado", Sans-serif;font-size:60px;font-weight:600;line-height:1em;text-shadow:0px 0px 12px rgba(0, 0, 0, 0.67);color:#FFFFFF;}.elementor-8967 .elementor-element.elementor-element-1c185c83{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:5%;--padding-bottom:5%;--padding-left:0%;--padding-right:0%;}@media(min-width:2400px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}}@media(max-width:1366px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}}@media(max-width:1024px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}}@media(max-width:767px){.elementor-8967 .elementor-element.elementor-element-25d3240{--min-height:235px;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-8967 .elementor-element.elementor-element-25d3240:not(.elementor-motion-effects-element-type-background), .elementor-8967 .elementor-element.elementor-element-25d3240 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:center center;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-8967 .elementor-element.elementor-element-4a6b92a > .elementor-widget-container{margin:0px 0px 0px 0px;padding:3% 0% 0% 0%;}.elementor-8967 .elementor-element.elementor-element-4a6b92a .elementor-heading-title{font-size:25px;}.elementor-8967 .elementor-element.elementor-element-d1a0864 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:3% 0% 0% 0%;}.elementor-8967 .elementor-element.elementor-element-d1a0864 .elementor-heading-title{font-size:35px;}.elementor-8967 .elementor-element.elementor-element-5adb1dab > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}}/* Start custom CSS for html, class: .elementor-element-5adb1dab *//* =========================
   FINAL CSS – GUTE TATEN SHOP (scoped)
   ✅ Freie-Spende-Position via CSS Variable
   ✅ Popup funktioniert sowohl scoped als auch wenn es an <body> appended wird
========================== */

#ask-gutetaten-shop{
  --ask-font: "Klavika Web","Klavika", var(--e-global-typography-primary-font-family), sans-serif;

  /* ✅ Stellschrauben Freie Spende */
  --free-control-top: 90px;     /* Desktop */
  --free-control-left: 22px;
  --free-control-right: 50px;

  --card-w: 320px;
  --card-h: 450px;
  --card-radius: 15px;
}

#ask-gutetaten-shop,
#ask-gutetaten-shop *{
  font-family: var(--ask-font) !important;
}

/* =========================
   GRID / CARDS
========================== */
#ask-gutetaten-shop .spenden-grid{
  max-width: 100%;
  margin: 40px auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
}

#ask-gutetaten-shop .spenden-card{
  width: var(--card-w);
  height: var(--card-h);
  border-radius: var(--card-radius);
  color: #fff;
  padding: 20px;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

#ask-gutetaten-shop .spenden-card h3{
  font-size: 24px;
  font-weight: 600;
  color: #fff !important;
  text-transform: uppercase;
  position: absolute;
  margin: 0;
  z-index: 2;
}

#ask-gutetaten-shop .headline-top-left    { top: 20px; left: 20px; }
#ask-gutetaten-shop .headline-bottom-left { bottom: 80px; left: 20px; }

#ask-gutetaten-shop .top-left    { top: 90px; left: 20px; }
#ask-gutetaten-shop .top-left-2  { top: 60px; left: 20px; }
#ask-gutetaten-shop .bottom-left { bottom: 20px; left: 20px; }

#ask-gutetaten-shop .spenden-button-wrapper{ position: absolute; }

/* =========================
   BUTTONS (Standard Cards)
========================== */
#ask-gutetaten-shop .spenden-button{
  display: inline-block;
  background: transparent;
  color: #fff !important;
  border: 1px solid #fff;
  padding: 10px 20px;
  border-radius: 60px;
  font-size: 1.5rem;
  font-weight: 500;
  text-decoration: none;
  position: relative;
  z-index: 1;
}

#ask-gutetaten-shop .spenden-button:hover{
  background: rgba(255, 255, 255, 0.5);
}

#ask-gutetaten-shop .spenden-button-icon{
  position: absolute;
  top: 0;
  right: -5px;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 2px #fff;
  z-index: 2;
}

#ask-gutetaten-shop .spenden-button-icon img{
  width: 12px;
  height: 12px;
}

/* =========================
   FREIE SPENDE KARTE
========================== */
#ask-gutetaten-shop .spenden-card-free h3{
  top: 22px;
  left: 22px;
  right: 22px;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.03;
  letter-spacing: 0.01em;
}

/* ✅ Position via Variable */
#ask-gutetaten-shop .free-spende-control{
  position: absolute;
  top: var(--free-control-top) !important;
  left: var(--free-control-left);
  right: var(--free-control-right);
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 14px;
}

#ask-gutetaten-shop .free-spende-input{
  flex: 1;
  background: #fff;
  border-radius: 999px;
  height: 50px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 10px 22px rgba(0,0,0,0.08);
}

#ask-gutetaten-shop .free-spende-input .euro{
  font-size: 30px;
  font-weight: 500;
  color: #1f3350;
  line-height: 1;
  opacity: .95;
}

#ask-gutetaten-shop .free-spende-input input{
  border: none;
  outline: none;
  background: transparent;
  width: 100%;
  font-size: 30px;
  font-weight: 500;
  color: #1f3350;
  padding: 0;
  margin: 0;
}

#ask-gutetaten-shop .free-spende-input input::placeholder{
  color: rgba(31,51,80,.55);
  opacity: 1;
}

/* remove number spinners */
#ask-gutetaten-shop .free-spende-input input::-webkit-outer-spin-button,
#ask-gutetaten-shop .free-spende-input input::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}
#ask-gutetaten-shop .free-spende-input input[type=number]{ -moz-appearance: textfield; }

#ask-gutetaten-shop .free-spende-submit{
  width: 50px;
  height: 50px;
  border-radius: 999px;
  border: none;
  background: #D7F45A;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(0,0,0,0.10);
  padding: 0;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

/* ✅ Kein Hover/Active Effekt */
#ask-gutetaten-shop .free-spende-submit:hover,
#ask-gutetaten-shop .free-spende-submit:focus,
#ask-gutetaten-shop .free-spende-submit:active{
  background: #D7F45A;
  box-shadow: 0 10px 22px rgba(0,0,0,0.10);
  transform: none;
  filter: none;
}

#ask-gutetaten-shop .free-spende-submit svg{
  width: 30px;
  height: 30px;
  display: block;
}

/* =========================
   POPUP (3 Varianten)
   ✅ Doppelselektor: funktioniert scoped UND global (body append)
========================== */
#ask-gutetaten-shop .ask-cart-notice-overlay,
.ask-cart-notice-overlay{
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(0,0,0,0);
}

#ask-gutetaten-shop .ask-cart-notice,
.ask-cart-notice{
  width: min(760px, 92vw);
  border-radius: 38px;
  padding: 46px 46px 36px;
  text-align: center;
  color: #ffffff !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.18);
  font-family: "Klavika Web","Klavika", var(--e-global-typography-primary-font-family), sans-serif !important;
}

#ask-gutetaten-shop .ask-cart-notice.variant-0,
.ask-cart-notice.variant-0{ background: #E96F47; }

#ask-gutetaten-shop .ask-cart-notice.variant-50,
.ask-cart-notice.variant-50{ background: #A996FF; }

#ask-gutetaten-shop .ask-cart-notice.variant-100,
.ask-cart-notice.variant-100{ background: #7B5AE8; }

#ask-gutetaten-shop .ask-cart-notice h4,
.ask-cart-notice h4{
  margin: 0 0 18px;
  font-size: clamp(34px, 4.2vw, 60px);
  color: #ffffff !important;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

#ask-gutetaten-shop .ask-cart-notice p,
.ask-cart-notice p{
  margin: 0;
  font-size: clamp(16px, 1.6vw, 22px);
  line-height: 1.35;
  opacity: 0.95;
}

#ask-gutetaten-shop .ask-cart-notice p strong,
.ask-cart-notice p strong{
  font-weight: 600;
  text-transform: uppercase;
}

#ask-gutetaten-shop .ask-cart-notice-actions,
.ask-cart-notice-actions{
  margin-top: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

#ask-gutetaten-shop .ask-cart-notice-continue,
.ask-cart-notice-continue{
  appearance: none;
  border: none;
  background: transparent;
  color: #fff;
  cursor: pointer;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 20px;
  padding: 10px 6px;
  opacity: 0.95;
}
#ask-gutetaten-shop .ask-cart-notice-continue:hover,
.ask-cart-notice-continue:hover{
  opacity: 1;
  text-decoration: underline;
}

#ask-gutetaten-shop .ask-cart-notice-cart,
.ask-cart-notice-cart{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 25px;
  border-radius: 999px;
  text-decoration: none;
  color: #fff !important;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 20px;
  white-space: nowrap;
  background: #3F2A8C;
}
#ask-gutetaten-shop .ask-cart-notice-cart:hover,
.ask-cart-notice-cart:hover{ filter: brightness(1.05); }

#ask-gutetaten-shop .ask-cart-notice-cart svg,
.ask-cart-notice-cart svg{
  width: 18px;
  height: 18px;
  display: block;
}

/* =========================
   RESPONSIVE – Freie Spende Position (Mobile)
   ✅ HIER änderst du den Abstand
========================== */
@media (max-width: 480px){
  #ask-gutetaten-shop{
    --free-control-top: 100px;  /* <- HIER feinjustieren */
  }

  #ask-gutetaten-shop .free-spende-input{ height: 60px; }
  #ask-gutetaten-shop .free-spende-submit{ width: 60px; height: 60px; }
  #ask-gutetaten-shop .free-spende-input .euro,
  #ask-gutetaten-shop .free-spende-input input{ font-size: 28px; }
}

@media (max-width: 360px){
  #ask-gutetaten-shop{
    --free-control-top: 100px; /* optional: für sehr schmale Geräte */
  }
}

/* Popup Mobile */
@media (max-width: 767px){
  #ask-gutetaten-shop .ask-cart-notice,
  .ask-cart-notice{
    padding: 34px 22px 22px;
    border-radius: 24px;
  }
  #ask-gutetaten-shop .ask-cart-notice-actions,
  .ask-cart-notice-actions{
    margin-top: 26px;
    justify-content: center;
  }
  #ask-gutetaten-shop .ask-cart-notice-cart,
  .ask-cart-notice-cart{
    width: 100%;
    justify-content: center;
  }
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Mikado';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://ask-hessen.de/wp-content/uploads/2025/04/Mikado-Web-Light.woff2') format('woff2');
}
@font-face {
	font-family: 'Mikado';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://ask-hessen.de/wp-content/uploads/2025/04/Mikado-Web-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'Mikado';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://ask-hessen.de/wp-content/uploads/2025/04/Mikado-Web-Medium.woff2') format('woff2');
}
@font-face {
	font-family: 'Mikado';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://ask-hessen.de/wp-content/uploads/2025/04/Mikado-Web-Bold.woff2') format('woff2');
}
@font-face {
	font-family: 'Mikado';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://ask-hessen.de/wp-content/uploads/2025/04/Mikado-Web-Black.woff2') format('woff2');
}
@font-face {
	font-family: 'Mikado';
	font-style: normal;
	font-weight: 800;
	font-display: auto;
	src: url('https://ask-hessen.de/wp-content/uploads/2025/04/Mikado-Web-Ultra.woff2') format('woff2');
}
/* End Custom Fonts CSS */