/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 08 2026 | 19:11:05 */
/* =========================================================
   PHOENIX INTERSTELLAR – ORGANISATION ABSCHNITT
   Frisches CSS für Elementor
   ========================================================= */

/*
Empfohlene Elementor-Klassen:

Äußerer Organisations-Container:
phx-org-section

Container um die Überschrift:
phx-section-title

Container um die vier Karten:
phx-org-grid

Jede einzelne Karte:
phx-org-card

Heading-Widget in der Karte:
phx-org-card-title

Text-Widget in der Karte:
phx-org-card-text
*/


/* =========================================================
   1. HAUPTBEREICH
   ========================================================= */

.phx-org-section,
.elementor-element.phx-org-section {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;

  padding: 90px 40px 120px !important;

  /*background:
    radial-gradient(circle at center top, rgba(255, 153, 51, 0.08) 0%, transparent 34%),
    linear-gradient(180deg, #101010 0%, #050505 100%) !important;*/

  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* dezente Scanline-Atmosphäre
.phx-org-section::before,
.elementor-element.phx-org-section::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;

  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,0.016) 0px,
      rgba(255,255,255,0.016) 1px,
      transparent 1px,
      transparent 5px
    ) !important;

  opacity: 0.45 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.phx-org-section > *,
.elementor-element.phx-org-section > * {
  position: relative !important;
  z-index: 1 !important;
}*/


/* =========================================================
   2. ÜBERSCHRIFT
   Klasse: phx-section-title
   ========================================================= */

/* Überschriften-Container */
.phx-section-title,
.elementor-element.phx-section-title {
  width: 100% !important;
  max-width: 1760px !important;

  margin: 0 auto 64px auto !important;
  padding: 0 !important;

  display: block !important;

  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

/* Elementor-Innencontainer entschärfen */
.phx-section-title > .e-con-inner {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  display: block !important;
}

/* Heading Widget */
.phx-section-title .elementor-widget-heading {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* Widget-Container */
.phx-section-title .elementor-widget-container {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* alte Linien am Container sicher abschalten */
.phx-section-title::before,
.phx-section-title::after {
  content: none !important;
  display: none !important;
}

/* eigentliche Headline */
.phx-section-title .elementor-heading-title {
  position: relative !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  display: grid !important;
  grid-template-columns: minmax(120px, 1fr) auto minmax(120px, 1fr) !important;
  align-items: center !important;
  column-gap: 38px !important;

  color: #ff9933 !important;

  font-family: "FranklinGothic", "Franklin Gothic Heavy", "Franklin Gothic Demi", "Arial Black", Impact, sans-serif !important;
  font-size: clamp(36px, 3.1vw, 58px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;

  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  text-align: center !important;

  /*text-shadow:
    0 0 8px rgba(255, 153, 51, 0.45),
    0 0 18px rgba(255, 153, 51, 0.22),
    0 4px 10px rgba(0, 0, 0, 0.9) !important;*/
}

/* linke Linie */
.phx-section-title .elementor-heading-title::before {
  content: "" !important;

  display: block !important;
  width: 100% !important;
  height: 1px !important;

  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 153, 51, 0.72) 100%
  ) !important;

  box-shadow:
    0 0 8px rgba(255, 153, 51, 0.32),
    0 0 18px rgba(255, 153, 51, 0.12) !important;
}

/* rechte Linie */
.phx-section-title .elementor-heading-title::after {
  content: "" !important;

  display: block !important;
  width: 100% !important;
  height: 1px !important;

  background: linear-gradient(
    90deg,
    rgba(255, 153, 51, 0.72) 0%,
    transparent 100%
  ) !important;

  box-shadow:
    0 0 8px rgba(255, 153, 51, 0.32),
    0 0 18px rgba(255, 153, 51, 0.12) !important;
}


/* =========================================================
   3. KARTENRASTER
   Klasse: phx-org-grid
   ========================================================= */

.phx-org-grid,
.elementor-element.phx-org-grid {
  width: 100% !important;
  max-width: 1780px !important;

  margin: 0 auto !important;
  padding: 0 !important;

  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 34px !important;

  box-sizing: border-box !important;
}

/* Falls Elementor einen e-con-inner erzeugt */
.phx-org-grid > .e-con-inner {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 34px !important;
}


/* =========================================================
   4. EINZELNE KARTE
   Klasse: phx-org-card
   ========================================================= */

.phx-org-card,
.elementor-element.phx-org-card {
  position: relative !important;

  min-height: 430px !important;

  padding: 42px 32px 40px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;

  text-align: center !important;

  background:
    radial-gradient(circle at center top, rgba(255, 153, 51, 0.10) 0%, transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.012) 100%) !important;

  border: 1px solid rgba(255, 153, 51, 0.82) !important;
  border-radius: 8px !important;

  box-shadow:
    inset 0 0 32px rgba(255, 153, 51, 0.035),
    0 0 20px rgba(0, 0, 0, 0.75),
    0 0 18px rgba(255, 153, 51, 0.08) !important;

  overflow: hidden !important;
  box-sizing: border-box !important;

  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease,
    background 220ms ease !important;
}

/* innerer technischer Glow */
.phx-org-card::before,
.elementor-element.phx-org-card::before {
  content: "" !important;

  position: absolute !important;
  inset: 1px !important;

  border-radius: 7px !important;

  background:
    linear-gradient(
      135deg,
      rgba(255,153,51,0.12) 0%,
      transparent 26%,
      transparent 72%,
      rgba(255,153,51,0.08) 100%
    ) !important;

  opacity: 0.75 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Karteninhalt über den Glow legen */
.phx-org-card > *,
.elementor-element.phx-org-card > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Hover */
.phx-org-card:hover,
.elementor-element.phx-org-card:hover {
  transform: translateY(-6px) !important;

  border-color: #ffcc33 !important;

  background:
    radial-gradient(circle at center top, rgba(255, 153, 51, 0.16) 0%, transparent 52%),
    linear-gradient(180deg, rgba(255,255,255,0.052) 0%, rgba(255,255,255,0.014) 100%) !important;

  box-shadow:
    inset 0 0 34px rgba(255, 153, 51, 0.06),
    0 0 30px rgba(255, 153, 51, 0.20),
    0 18px 36px rgba(0, 0, 0, 0.85) !important;
}


/* =========================================================
   5. BILDER / ABTEILUNGS-ICONS
   ========================================================= */

.phx-org-card .elementor-widget-image {
  width: 100% !important;

  margin: 0 0 28px 0 !important;
  padding: 0 !important;

  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.phx-org-card .elementor-widget-image .elementor-widget-container {
  width: 100% !important;

  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.phx-org-card .elementor-widget-image img {
  display: block !important;

  width: clamp(150px, 12vw, 230px) !important;
  height: auto !important;
  max-width: 100% !important;

  object-fit: contain !important;

  filter:
    drop-shadow(0 0 10px rgba(255, 153, 51, 0.25))
    drop-shadow(0 12px 16px rgba(0, 0, 0, 0.75)) !important;
}


/* =========================================================
   6. KARTENTITEL
   Klasse: phx-org-card-title
   ========================================================= */

.phx-org-card-title,
.elementor-element.phx-org-card-title {
  width: 100% !important;

  margin: 0 0 20px 0 !important;
  padding: 0 !important;

  text-align: center !important;
}

.phx-org-card-title .elementor-heading-title {
  margin: 0 !important;
  padding: 0 !important;

  color: #ffffff !important;

  font-family: "FranklinGothic", "Franklin Gothic Heavy", "Franklin Gothic Demi", "Arial Black", Impact, sans-serif !important;
  font-size: clamp(23px, 1.55vw, 32px) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;

  text-transform: uppercase !important;
  letter-spacing: 0.035em !important;
  text-align: center !important;

  text-shadow:
    0 2px 0 rgba(0,0,0,0.9),
    0 0 10px rgba(255,255,255,0.22) !important;
}


/* =========================================================
   7. KARTENTEXT
   Klasse: phx-org-card-text
   ========================================================= */

.phx-org-card-text,
.elementor-element.phx-org-card-text {
  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  text-align: center !important;
}

.phx-org-card-text .elementor-widget-container,
.phx-org-card-text p {
  margin: 0 !important;
  padding: 0 !important;

  color: rgba(255, 255, 255, 0.92) !important;

  font-family: "Barlow", Arial, sans-serif !important;
  font-size: clamp(17px, 1.08vw, 22px) !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;

  text-align: center !important;

  text-shadow:
    0 0 8px rgba(255,255,255,0.14),
    0 3px 8px rgba(0,0,0,0.75) !important;
}


/* =========================================================
   8. TABLET
   ========================================================= */

@media (max-width: 1400px) {
  .phx-org-grid,
  .elementor-element.phx-org-grid {
    max-width: 980px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .phx-org-grid > .e-con-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .phx-org-card,
  .elementor-element.phx-org-card {
    min-height: 390px !important;
  }

  .phx-org-card .elementor-widget-image img {
    width: clamp(145px, 18vw, 215px) !important;
  }
}


/* =========================================================
   9. MOBILE
   ========================================================= */

@media (max-width: 767px) {
  .phx-org-section,
  .elementor-element.phx-org-section {
    padding: 64px 18px 80px !important;
  }

  .phx-section-title,
  .elementor-element.phx-section-title {
    margin-bottom: 38px !important;
  }

  .phx-section-title .elementor-heading-title {
    grid-template-columns: minmax(36px, 1fr) auto minmax(36px, 1fr) !important;
    column-gap: 18px !important;

    font-size: clamp(28px, 9vw, 38px) !important;
    letter-spacing: 0.03em !important;
  }

  .phx-org-grid,
  .elementor-element.phx-org-grid {
    max-width: 100% !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .phx-org-grid > .e-con-inner {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .phx-org-card,
  .elementor-element.phx-org-card {
    min-height: auto !important;
    padding: 34px 24px 32px !important;
  }

  .phx-org-card .elementor-widget-image {
    margin-bottom: 24px !important;
  }

  .phx-org-card .elementor-widget-image img {
    width: clamp(130px, 52vw, 190px) !important;
  }

  .phx-org-card-title,
  .elementor-element.phx-org-card-title {
    margin-bottom: 16px !important;
  }

  .phx-org-card-title .elementor-heading-title {
    font-size: clamp(24px, 8vw, 32px) !important;
  }

  .phx-org-card-text .elementor-widget-container,
  .phx-org-card-text p {
    font-size: 18px !important;
    line-height: 1.6 !important;
  }
}