.elementor-3456 .elementor-element.elementor-element-460a565{--display:flex;}.elementor-3456 .elementor-element.elementor-element-f05893e{--display:flex;}.elementor-3456 .elementor-element.elementor-element-953040d > .elementor-widget-container{background-color:#1C1C1E;}:root{--page-title-display:none;}/* Start custom CSS for shortcode, class: .elementor-element-953040d *//* ================= ILLUMI FORM – PREMIUM FINISH ================= */

/* Mehr Luft im Formular */
.fluentform form {
  padding: 44px !important;
  backdrop-filter: blur(4px);
}

/* Label hochwertiger */
.fluentform .ff-el-input--label {
  font-size: 12px !important;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: rgba(255,255,255,.65) !important;
  margin-bottom: 8px !important;
}

/* Inputs eleganter */
.fluentform input,
.fluentform textarea,
.fluentform select {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 16px !important;
  padding: 16px 18px !important;
  transition: all .25s ease;
}

/* Hover subtil */
.fluentform input:hover,
.fluentform textarea:hover,
.fluentform select:hover {
  border-color: rgba(244,124,31,.35) !important;
}

/* Fokus stark aber nicht aggressiv */
.fluentform input:focus,
.fluentform textarea:focus,
.fluentform select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(244,124,31,.12);
}

/* Textarea etwas größer */
.fluentform textarea {
  min-height: 160px !important;
}

/* Checkbox sauber */
.fluentform .ff-el-checkbox input[type="checkbox"] {
  accent-color: #F47C1F;
  transform: scale(1.1);
  margin-right: 10px;
}

/* Button finaler Premium-Look */
.fluentform .ff-btn-submit,
.fluentform .ff-btn-submit span {
  color: #ffffff !important;
}
.fluentform .ff-btn-submit {
  width: 100% !important;
  padding: 18px !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg,#F47C1F,#ff8c2f) !important;
  box-shadow: 0 10px 25px rgba(244,124,31,.30);
  transition: all .25s ease;
}

.fluentform .ff-btn-submit:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 35px rgba(244,124,31,.40);
}

.fluentform .ff-btn-submit:active {
  transform: scale(.98);
}
/* =========================================================
   ILLUMI – Global Design System (Scoped)
   Scope: .illumi-site (set as Elementor Container class)
   ========================================================= */

/* 1) Base tokens */
:root{
  --bg:#1C1C1E;
  --surface:#242428;
  --surface2:#202024;

  --accent:#F47C1F;
  --accent-hover:#E46F17;
  --accent-active:#C95E12;

  --text:#ffffff;
  --muted:rgba(255,255,255,.78);

  --line:rgba(255,255,255,.08);
  --line2:rgba(255,255,255,.12);
  --accent-soft:rgba(244,124,31,.22);

  --max:1200px;

  --r-md:14px;
  --r-lg:18px;
  --r-xl:22px;
}

/* 2) Hard stop: no “white site background” */
body{ background: var(--bg); color: var(--text); }

/* 3) Elementor “white section” killer – but only inside our scope */
.illumi-site,
.illumi-site .elementor-section,
.illumi-site .elementor-container,
.illumi-site .e-con,
.illumi-site .e-con-inner,
.illumi-site .elementor-widget-wrap{
  background: transparent;
}

/* 4) Shared layout helper */
.illumi-site .illumi-wrap{ max-width: var(--max); margin:0 auto; padding:0 16px; }

/* =========================================================
   Buttons (same look everywhere)
   ========================================================= */
.illumi-site .illumi-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 12px 16px;
  border-radius: var(--r-md);
  font-weight: 900;
  text-decoration: none;
  letter-spacing:.2px;
  transition: transform .12s ease, box-shadow .22s ease, background-color .22s ease, border-color .22s ease, color .22s ease;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
}

.illumi-site .illumi-btn-primary{
  background: var(--accent);
  color:#fff;
  border:1px solid rgba(0,0,0,0);
  box-shadow: 0 12px 26px rgba(0,0,0,.28);
}
.illumi-site .illumi-btn-primary:hover{
  background: var(--accent-hover);
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(0,0,0,.34);
}
.illumi-site .illumi-btn-primary:active{
  background: var(--accent-active);
  transform: translateY(0) scale(.99);
}

.illumi-site .illumi-btn-outline{
  background: transparent;
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
}
.illumi-site .illumi-btn-outline:hover{
  border-color: rgba(244,124,31,.65);
  color: var(--accent);
  transform: translateY(-1px);
}
.illumi-site .illumi-btn-outline:active{
  background: rgba(244,124,31,.14);
  border-color: rgba(244,124,31,.75);
  color: var(--accent-active);
}

/* =========================================================
   Section cards – make everything “premium” by default
   ========================================================= */
.illumi-site .illumi-card{
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  box-shadow: 0 18px 40px rgba(0,0,0,.34);
}

/* =========================================================
   Fluent Forms – Premium Finish (no red text, no weird overrides)
   Only on project page, but also safe on .illumi-site
   ========================================================= */

/* Form wrapper */
.illumi-site .fluentform form{
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 44px;
  box-shadow: 0 18px 40px rgba(0,0,0,.34);
}

/* Field groups spacing */
.illumi-site .fluentform .ff-el-group{ margin-bottom: 18px; }

/* Labels */
.illumi-site .fluentform .ff-el-input--label{
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: rgba(255,255,255,.65);
  margin-bottom: 8px;
  font-weight: 850;
}

/* Inputs */
.illumi-site .fluentform input,
.illumi-site .fluentform textarea,
.illumi-site .fluentform select{
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  padding: 16px 18px;
  color: #fff;
  transition: border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}

.illumi-site .fluentform input::placeholder,
.illumi-site .fluentform textarea::placeholder{
  color: rgba(255,255,255,.42);
}

/* Hover */
.illumi-site .fluentform input:hover,
.illumi-site .fluentform textarea:hover,
.illumi-site .fluentform select:hover{
  border-color: rgba(244,124,31,.35);
}

/* Focus */
.illumi-site .fluentform input:focus,
.illumi-site .fluentform textarea:focus,
.illumi-site .fluentform select:focus{
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(244,124,31,.12);
  outline: none;
}

/* Textarea height */
.illumi-site .fluentform textarea{ min-height: 160px; }

/* Checkbox */
.illumi-site .fluentform .ff-el-checkbox label{
  color: var(--muted);
  font-weight: 650;
}
.illumi-site .fluentform input[type="checkbox"]{
  accent-color: var(--accent);
  transform: scale(1.05);
}

/* Submit button – force white text (fixes your “pink/red” issue) */
.illumi-site .fluentform .ff-btn-submit{
  width: 100%;
  padding: 18px 18px;
  border-radius: 18px;
  border: none;
  background: linear-gradient(135deg, #F47C1F, #FF8C2F);
  color: #ffffff;
  font-weight: 950;
  font-size: 16px;
  letter-spacing: .4px;
  box-shadow: 0 10px 25px rgba(244,124,31,.30);
  transition: transform .18s ease, box-shadow .22s ease, filter .22s ease;
}
.illumi-site .fluentform .ff-btn-submit:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 35px rgba(244,124,31,.40);
}
.illumi-site .fluentform .ff-btn-submit:active{
  transform: scale(.985);
}

/* Success message */
.illumi-site .fluentform .ff-message-success{
  background: rgba(244,124,31,.10);
  border: 1px solid rgba(244,124,31,.35);
  color: #fff;
  border-radius: var(--r-md);
  padding: 16px 18px;
}

/* =========================================================
   Optional: tighten typography inside scope
   ========================================================= */
.illumi-site h1, .illumi-site h2, .illumi-site h3{ color: var(--text); }
.illumi-site p{ color: var(--muted); }
/* Native Select dropdown: limited control */
.illumi-site .fluentform select{
  color-scheme: dark;
  background-color: rgba(0,0,0,.22);
  color:#fff;
}
.illumi-site .fluentform select{
  color-scheme: dark;
}
/* ===== ILLUMI: Radio als Premium-Kacheln (statt weißem Dropdown) ===== */

.illumi-site .fluentform .ff-el-radios{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top:10px;
}

@media (max-width:620px){
  .illumi-site .fluentform .ff-el-radios{
    grid-template-columns:1fr;
  }
}

/* native radio verstecken */
.illumi-site .fluentform .ff-el-radios input[type="radio"]{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

/* label als kachel */
.illumi-site .fluentform .ff-el-radios .ff-el-form-check{
  margin:0 !important;
}

.illumi-site .fluentform .ff-el-radios .ff-el-form-check-label{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  border-radius:16px;
  background: rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-weight:850;
  cursor:pointer;
  transition: transform .12s ease, border-color .18s ease, background-color .18s ease;
}

/* kleiner marker links */
.illumi-site .fluentform .ff-el-radios .ff-el-form-check-label:before{
  content:"";
  width:10px;height:10px;
  border-radius:50%;
  background: rgba(244,124,31,.18);
  border:1px solid rgba(244,124,31,.25);
}

/* hover */
.illumi-site .fluentform .ff-el-radios .ff-el-form-check-label:hover{
  transform: translateY(-1px);
  border-color: rgba(244,124,31,.35);
  background: rgba(255,255,255,.03);
}

/* selected */
.illumi-site .fluentform .ff-el-radios input[type="radio"]:checked + .ff-el-form-check-label{
  border-color: rgba(244,124,31,.60);
  background: rgba(244,124,31,.10);
}

.illumi-site .fluentform .ff-el-radios input[type="radio"]:checked + .ff-el-form-check-label:before{
  background: var(--accent);
  border-color: rgba(244,124,31,.80);
  box-shadow: 0 0 0 3px rgba(244,124,31,.12);
}/* End custom CSS */