/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 06 2025 | 15:06:53 */
/* ==== Soul SAIgn – Kartenraster & Fluchtung ==== */
/* Basishöhen – bei Bedarf anpassen */
.offer-card{
  --h1: 72px;   /* Höhe obere Überschrift */
  --img: 220px; /* Bildhöhe (Desktop) */
  --h2: 48px;   /* Höhe zweite Überschrift/Produktname */
  --txt: 160px; /* Mindesthöhe Textblock */
}

/* Spalten (klassischer Abschnitt) */
.offer-card > .elementor-widget-wrap,
 /* Container/Flex (falls du Container nutzt) */
.offer-card.e-con > .e-con-inner{
  display: grid;
  /* Reihen: H1 | Bild | H2 | Text (min) | Button */
  grid-template-rows: var(--h1) var(--img) var(--h2) minmax(var(--txt), 1fr) auto;
  row-gap: 14px;
  height: 100%;
}

/* Bild gleich hoch und sauber beschnitten */
.offer-card .elementor-widget-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px; /* optional */
}
/* ===== Karten/Spalten: Basis (Desktop bleibt wie gehabt) ===== */
.cards-eq .elementor-column > .elementor-widget-wrap{
  display:flex;                 /* Inhalt vertikal stapeln */
  flex-direction:column;
  gap:16px;
  height:100%;
}
.cards-eq .elementor-column > .elementor-widget-wrap > .elementor-widget:last-child{
  margin-top:auto;              /* z.B. Button nach unten drücken */
}

/* ===== Tablet (Astra/Elementor Default: <=1024px & >=768px) ===== */
@media (max-width:1024px) and (min-width:768px){
  /* Inhalte der Karte mittig ausrichten */
  .cards-eq .elementor-column > .elementor-widget-wrap{
    align-items:center;         /* horizontal mittig */
    text-align:center;
  }
  /* Bilder in der Karte mittig */
  .cards-eq .elementor-image img{ margin:0 auto; display:block; }

  /* Optional: exakt 2 Spalten pro Reihe erzwingen (falls Layout „Auto“ ist) */
  .cards-eq .elementor-column{ width:50% !important; }
  .cards-eq .elementor-column:nth-child(odd){ clear:both; } /* alte Section/Column-Layouts */
}

/* ===== Mobile (<=767px) – 1 Spalte pro Reihe, weiterhin mittig ===== */
@media (max-width:767px){
  .cards-eq .elementor-column{ width:100% !important; }
  .cards-eq .elementor-column > .elementor-widget-wrap{
    align-items:center;
    text-align:center;
  }
  .cards-eq .elementor-image img{ margin:0 auto; }
}


/* Standard-Margins neutralisieren – Abstände steuert das Grid */
.offer-card .elementor-widget{ margin: 0; }

/* Textblock bekommt die Mindesthöhe (Sicherheitsnetz) */
.offer-card .elementor-widget-text-editor{ min-height: var(--txt); }

/* Button bleibt in der letzten Zeile – überall gleiche Höhe */
.offer-card .elementor-widget-button{ align-self: start; }

/* (Optional) Kartenoptik */
.offer-card{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(200,162,74,.28);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}

/* Responsive Anpassungen */
@media (max-width: 1024px){
  .offer-card{ --h1: 64px; --img: 200px; --h2: 44px; --txt: 140px; }
}
@media (max-width: 767px){
  .offer-card{ --h1: 56px; --img: 180px; --h2: 40px; --txt: 120px; }
}

/* Falls eine Karte KEINE Unterzeile hat → zusätzliche Klasse "no-sub" vergeben */
.offer-card.no-sub > .elementor-widget-wrap,
.offer-card.no-sub.e-con > .e-con-inner{
  grid-template-rows: var(--h1) var(--img) minmax(var(--txt), 1fr) auto;
}
/* Karten eckig – keine runden Ecken mehr */
.offer-card,
.offer-card > .elementor-widget-wrap,
.offer-card.e-con,
.offer-card .elementor-widget-container{
  border-radius: 0 !important;
}

/* Bilder in den Karten ebenfalls eckig */
.offer-card .elementor-widget-image img{
  border-radius: 0 !important;
}

/* (Optional) Buttons auch eckig machen */
/* .offer-card .elementor-button{ border-radius:0 !important; } */
/* Button unten UND in der Spalte mittig zentriert */
.offer-card > .elementor-widget-wrap,
.offer-card.e-con > .e-con-inner{
  display:flex !important;
  flex-direction:column;
  height:100%;
}

.offer-card .elementor-widget-button{
  margin-top:auto !important;   /* schiebt den Button nach unten */
  align-self:center !important; /* zentriert ihn horizontal in der Spalte */
}

.offer-card .elementor-button-wrapper{ text-align:center; }
.offer-card .elementor-button{ width:auto; display:inline-flex; } /* falls Theme ihn auf 100% zieht */