/* ============================= */
/* 5) FORMULAR (.ect-ui scope)   */
/* ============================= */
.ect-ui{
  max-width:880px; margin:28px auto 80px; padding:0 18px;
  background:transparent !important; /* nur Step-Boxen sind weiß */
  /* Default accents for progress, arrows, etc. (can be overridden per section) */
  --accent:  var(--ect-color-5);
  --accent2: var(--ect-color-6);
}
.ect-ui .ect-logo{ width:auto; height:50px; object-fit:contain; }
.ect-ui .ect-form__head{
  display:flex;
  gap:12px;
  align-items:center;
  margin:8px 0 6px;
  /* Align header flush with inner content of the step box */
  padding-left:18px;
  text-align:left;
  justify-content:flex-start;
  flex-wrap: nowrap;
}
.ect-ui .ect-form__head-text{ display:flex; flex-direction:column; }
.ect-ui .ect-head-ico{
  width:50px; height:50px; display:block;
  /* Icon color */
  color:#CECECC; fill:#CECECC;
  flex: 0 0 auto; /* keep icon on the left */
}
/* Ensure sprite <use> inherits intended color in most setups */
.ect-ui .ect-head-ico use{ fill: currentColor; }
/* Headline styles (smaller, 700, desired color) */
.ect-ui .ect-form__head .ect-title{
  margin:0;
  font-weight:700;
  font-size: clamp(18px, 2.6vmin, 28px);
  line-height:1.2;
  color:#CECECC;
}
/* Subline tighter spacing under headline */
.ect-ui .ect-form__head .ect-sub{
  margin: 2px 0 0 0;
}
/* Subline color */
.ect-ui #ect-form-subline{ color: var(--ect-color-1); }

/* Progress */
.ect-ui{
  /* Defaults for progress track; can be overridden per section */
  --ect-progress-track-bg: rgba(255,255,255,.50);
  --ect-progress-track-border: rgba(255,255,255,.32);
}
.ect-ui .ect-progress{
  height:8px; /* slightly higher */
  background: var(--ect-progress-track-bg);
  border: 1px solid var(--ect-progress-track-border);
  border-radius:999px; overflow:hidden;
  width:100%;
  margin: clamp(4px, 1vmin, 8px) 0 clamp(8px, 1.6vmin, 12px);
}
.ect-ui .ect-progress__bar{
  height:100%; width:0%;
  background: linear-gradient(90deg,var(--accent),var(--accent2));
  transition: width .6s ease;
}

/* Modal variants: align progress with content, more top space, double height */
#ect-modal .ect-progress{
  height: 16px;
  margin-top: clamp(12px, 2vmin, 20px);
  /* Align to UI container padding */
  margin-left: 18px;
  margin-right: 18px;
}

/* Ensure questions sit above their inputs */
.ect-ui .ect-q{ display:block; margin: 0 0 6px; font-weight:600; font-size: clamp(13px, 2.2vmin, 22px); color:#CECECC; }
#ect-progress-bar{
  transition: width 0.6s cubic-bezier(.22,1,.36,1);
  will-change: width;
}

/* Fein-Progress & Timer (Slots) */
.ect-ui .ect-meta{
  display:flex; gap:14px; align-items:center; margin:6px 0 12px;
  font-size:12px; color:#666;
}
.ect-ui .ect-meta__field-progress::before{ content:"•"; margin:0 6px 0 0; opacity:.5; }

/* Steps */
.ect-ui .ect-step{ display:none; }
.ect-ui .ect-step.is-active{ display:block; }
/* Step slide animations */
/* Constrain sliding to the form body, not the header */
#ect-form-el{ position:relative; overflow:hidden; }
.ect-ui .ect-step.is-animating{ display:block; }
.ect-ui .ect-step.is-animating{ position:absolute; left:0; right:0; top:0; width:100%; }
.ect-ui .ect-step .ect-step__box{ transform: translateX(0); opacity:1; will-change: transform, opacity; }
.ect-ui .ect-step.ect-step--enter-left{ z-index:2; }
.ect-ui .ect-step.ect-step--enter-right{ z-index:2; }
.ect-ui .ect-step.ect-step--exit-left{ z-index:1; }
.ect-ui .ect-step.ect-step--exit-right{ z-index:1; }
.ect-ui .ect-step.ect-step--enter-left .ect-step__box{ transform: translateX(-80px); opacity:0; }
.ect-ui .ect-step.ect-step--enter-right .ect-step__box{ transform: translateX(80px); opacity:0; }
.ect-ui .ect-step.ect-step--enter-active .ect-step__box{ transition: transform .34s cubic-bezier(.2,.7,.2,1), opacity .34s cubic-bezier(.2,.7,.2,1); transform: translateX(0); opacity:1; }
.ect-ui .ect-step.ect-step--exit-left .ect-step__box{ transition: transform .28s cubic-bezier(.2,.7,.2,1), opacity .28s cubic-bezier(.2,.7,.2,1); transform: translateX(-80px); opacity:0; }
.ect-ui .ect-step.ect-step--exit-right .ect-step__box{ transition: transform .28s cubic-bezier(.2,.7,.2,1), opacity .28s cubic-bezier(.2,.7,.2,1); transform: translateX(80px); opacity:0; }
.ect-ui .ect-step__box{
  border:1px solid var(--line); border-radius:var(--radius);
  padding:18px; background:#fff; position:relative;
  overflow:visible; /* sicherheit */
}

/* Contact section: render inner boxes transparent to show outer glass container */
.ect-section--contact .ect-step__box{
  background: transparent !important;
  border-color: rgba(255,255,255,0.18) !important;
  box-shadow: none !important;
}

/* Fields */
.ect-ui .ect-field{
  width:100%; height:46px;
  border:1px solid #d9d9d9; border-radius:12px;
  padding:10px 12px; font-size: clamp(12px, 1.4vmin, 16px); outline:none; background:#fff;
  transition:border-color 120ms var(--ect-ease), box-shadow 120ms var(--ect-ease);
}

/* Override Safari/Chrome autofill yellow (strong) */
.ect-ui input.ect-field:-webkit-autofill,
.ect-ui input.ect-field:-webkit-autofill:hover,
.ect-ui input.ect-field:-webkit-autofill:focus,
.ect-ui input.ect-field:-webkit-autofill:active{
  background-color: transparent !important;
  -webkit-box-shadow: 0 0 0 1000px color-mix(in srgb, #fff 85%, var(--ect-color-2) 15%) inset !important;
  box-shadow: 0 0 0 1000px color-mix(in srgb, #fff 85%, var(--ect-color-2) 15%) inset !important;
  -webkit-text-fill-color: #111 !important;
  caret-color: #111 !important;
  border-color: var(--ect-color-2) !important;
}
.ect-ui input.ect-field:-moz-autofill{
  background-color: transparent !important;
  box-shadow: 0 0 0 1000px color-mix(in srgb, #fff 85%, var(--ect-color-2) 15%) inset !important;
  -moz-text-fill-color: #111 !important;
  caret-color: #111 !important;
  border-color: var(--ect-color-2) !important;
}

/* kompaktere Eingaben für kleine Felder */
/* Step 4: kompaktere Mini-Felder */
.ect-ui [name="house_number"],
.ect-ui [name="postal_code"]{ flex:0 0 160px; max-width:160px; }
.ect-ui [name="state_region"]{ flex:0 0 240px; max-width:240px; }
/* Map nicht ankleben */
.ect-ui #ect-map-wrap{ margin-top:12px; }

/* grüner Fokus – eindeutig gegen Theme-Regeln */
.ect-ui .ect-step__box .ect-field:focus{
  border-color:var(--accent) !important;
  box-shadow:0 0 0 2px rgba(134,191,48,.18) !important;
  outline:none !important;
}
html.ect-mobile .ect-section--contact .ect-ui .ect-step__box .ect-field:focus{
  box-shadow:none !important;
}
html.ect-mobile .ect-section--contact .ect-ui .ect-field{
  font-size: 16px !important;
}
html.ect-mobile .ect-section--contact.contact--carousel .ect-ui{
  max-width: 100%;
  margin: clamp(10px, 3vw, 18px) auto clamp(10px, 3vw, 18px);
  padding: 0 clamp(12px, 4vw, 20px);
}
/* Fehlerzustand dominiert Fokus (rot) */
.ect-ui .ect-step__box .ect-field.error:focus{
  border-color:#e25757 !important;
  box-shadow:0 0 0 2px rgba(226,87,87,.18) !important;
}

/* Select-Pfeile neutral */
.ect-ui .ect-field--select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-image:
    linear-gradient(45deg,transparent 50%,#666 50%),
    linear-gradient(135deg,#666 50%,transparent 50%);
  background-position:calc(100% - 18px) 20px, calc(100% - 12px) 20px;
  background-size:6px 6px,6px 6px; background-repeat:no-repeat;
}

.ect-ui textarea.ect-field{ min-height:140px !important; resize:vertical !important; }

/* Fehlermarkierung */
.ect-ui .ect-field.error{
  border-color:#e25757 !important; background:#fff6f6 !important;
}

/* Grid helpers */
.ect-ui .ect-row{ display:flex; gap: clamp(10px, 2.2vmin, 16px); margin-top: clamp(12px, 2.6vmin, 20px); }
.ect-ui .ect-col{ flex:1; }
.ect-ui .ect-col--sm{ flex:0 0 48%; }
.ect-ui .ect-col--cc{ flex:0 0 180px; }

/* Inline label fields */
.ect-ui .ect-field--inline{ position:relative; }
.ect-ui .ect-field__prefix{
  position:absolute; left:12px; top:50%; transform:translateY(-50%);
  font-size: clamp(10px, 1.2vmin, 14px); line-height:1; color:#7a7f87; white-space:nowrap; pointer-events:none; z-index:2;
}
.ect-ui .is-with-prefix{ padding-left:118px !important; position:relative; z-index:1; }

/* Step 4: kompaktere Mini-Felder (Hausnummer/PLZ/Region) */
.ect-ui [name="house_number"],
.ect-ui [name="postal_code"]{ max-width:50px; }
.ect-ui [name="state_region"]{ max-width:240px; }
/* grüner Fokus – eindeutig gegen Theme-Regeln */
.ect-ui .ect-step__box .ect-field:focus{
  border-color:var(--accent) !important;
  box-shadow:0 0 0 2px rgba(134,191,48,.18) !important;
  outline:none !important;
}
/* Fehlerzustand dominiert Fokus (rot) */
.ect-ui .ect-step__box .ect-field.error:focus{
  border-color:#e25757 !important;
  box-shadow:0 0 0 2px rgba(226,87,87,.18) !important;
}

/* Select-Pfeile neutral */
.ect-ui .ect-field--select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-image:
    linear-gradient(45deg,transparent 50%,#666 50%),
    linear-gradient(135deg,#666 50%,transparent 50%);
  background-position:calc(100% - 18px) 20px, calc(100% - 12px) 20px;
  background-size:6px 6px,6px 6px; background-repeat:no-repeat;
}

/* Fehlermarkierung */
.ect-ui .ect-field.error{
  border-color:#e25757 !important; background:#fff6f6 !important;
}

/* Grid helpers */
.ect-ui .ect-row{ display:flex; gap: clamp(10px, 2.2vmin, 16px); margin-top:10px; }
.ect-ui .ect-col{ flex:1; }
.ect-ui .ect-col--sm{ flex:0 0 48%; }
.ect-ui .ect-col--cc{ flex:0 0 180px; }

/* Step 3: make phone input narrower (all variants) */
.ect-ui .ect-step[data-step="3"] #ect-phone-row .ect-col:not(.ect-col--cc){
  flex: 0 0 300px;
  max-width: 300px;
}
.ect-ui .ect-step[data-step="3"] [name="phone"]{
  max-width: 300px;
}

/* Step 2: make email input ~30% narrower */
.ect-ui .ect-step[data-step="2"] [name="email"]{
  max-width: 360px;
}

/* Modal only: make company field narrower on step 1 */
#ect-modal .ect-step[data-step="1"] [name="company"]{
  max-width: 360px;
}

/* Modal Step 5: limit message field width so hint can show on the right */
#ect-modal .ect-step[data-step="5"] [name="message"],
#ect-modal .ect-step[data-step="5"] textarea.ect-field{
  max-width: clamp(520px, 58vw, 720px);
}

/* Inline label fields */
.ect-ui .ect-field--inline{ position:relative; }
.ect-ui .ect-field__prefix{
  position:absolute; left:12px; top:50%; transform:translateY(-50%);
  font-size: clamp(10px, 1.2vmin, 14px); line-height:1; color:#7a7f87; white-space:nowrap; pointer-events:none; z-index:2;
}
.ect-ui .is-with-prefix{ padding-left:118px !important; position:relative; z-index:1; }

/* Step 4: kompaktere Mini-Felder (Hausnummer/PLZ/Region) */
.ect-ui [name="house_number"],
.ect-ui [name="postal_code"]{ max-width:160px; }
.ect-ui [name="state_region"]{ max-width:240px; }

/* Step 4: add spacing between autocomplete and field grid */
.ect-ui .ect-step[data-step="4"] #ect-address-autocomplete{ margin-bottom: 18px; }

/* Step badges removed */
.ect-ui .ect-step-badge{ display:none !important; }
@media (max-width:480px){ .ect-ui .ect-step-badge{ display:none !important; } }

/* Actions & arrows */
.ect-ui .ect-step__actions{
  display:flex; align-items:center; gap:12px;
  /* tighter spacing above actions */
  margin-top: clamp(16px, 2.6vmin, 24px);
}
.ect-ui .ect-step__arrows{
  margin-left:auto; display:inline-flex; padding:0; gap:0; background:transparent;
  border:var(--outline); border-radius:12px; box-shadow:var(--btn-shadow); overflow:hidden;
}
.ect-ui .ect-nav__arrow{
  width:26px; height:26px; display:flex; align-items:center; justify-content:center;
  border:none; border-radius:0; background:var(--accent); cursor:pointer;
  transition:background-color .15s ease, transform .06s ease; line-height:1;
}
.ect-ui .ect-nav__arrow + .ect-nav__arrow{ border-left:1px solid rgba(0,0,0,.08); }
.ect-ui .ect-nav__arrow:hover{ background:var(--accent2); }
.ect-ui .ect-nav__arrow:active{ transform:translateY(1px); }
.ect-ui .ect-nav__arrow.is-disabled,
.ect-ui .ect-nav__arrow[disabled]{ background:#eee !important; opacity:.7 !important; cursor:not-allowed !important; pointer-events:none !important; }
.ect-ui .ect-nav--prev::before,
.ect-ui .ect-nav--next::before{
  content:""; width:0; height:0; border-top:6px solid transparent; border-bottom:6px solid transparent;
}
.ect-ui .ect-nav--prev::before{ border-right:8px solid #000; }
.ect-ui .ect-nav--next::before{ border-left:8px solid #000; }

/* „Einträge löschen“ (klein, charmant) */
.ect-ui .ect-clear-data{
  font-size:12px; line-height:1; padding:6px 10px;
  border:1px solid #d9d9d9; border-radius:10px;
  background:#fff; color:#333; opacity:.85; cursor:pointer;
}
.ect-ui .ect-clear-data:hover{ opacity:1; }
.ect-ui .ect-clear-data.hidden{ display:none !important; }
.ect-ui .ect-step__actions .ect-clear-data{ margin-left:auto; }

/* Email hint */
.ect-ui .ect-email-hint{ display:flex; align-items:center; gap:8px; margin-top:8px; font-size:13px; color:var(--muted); }
.ect-ui .ect-email-hint.hidden{ display:none !important; }
.ect-ui .ect-email-hint__spinner{
  width:14px; height:14px; border-radius:50%;
  border:2px solid rgba(0,0,0,.2); border-top-color:#000;
  animation:ectspin .9s linear infinite; display:none;
}
.ect-ui .ect-email-hint--loading .ect-email-hint__spinner{ display:inline-block; }
@keyframes ectspin{ to{ transform:rotate(360deg); } }

/* Newsletter opt-in row (bigger checkbox, label like question, more spacing) */
.ect-ui #ect-newsletter-row{ margin-top: clamp(12px, 2.2vmin, 18px); }
.ect-ui #ect-newsletter-row .ect-chk{ display:flex; align-items:center; gap:10px; }
.ect-ui #ect-newsletter-row .ect-chk input[type="checkbox"]{
  width: 20px; height: 20px; transform: scale(1.25); transform-origin: left center;
  accent-color: var(--accent);
}
.ect-ui #ect-newsletter-row .ect-chk span{
  font-weight:600; font-size: clamp(13px, 2.2vmin, 22px); color:#CECECC;
}

/* Mini KPIs im Formular */
.ect-ui .ect-kpi-mini{
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--calc-col-gap, clamp(12px, 2.6vmin, 22px));
  margin-top: var(--calc-grid-mt, clamp(10px, 2.6vmin, 24px));
}
.ect-ui .ect-kpi-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding: clamp(12px, 1.8vmin, 18px) clamp(12px, 2vmin, 20px);
  background:#fff;
  box-shadow: var(--btn-shadow);
}
.ect-ui .ect-kpi-card__k{
  font-size: clamp(11px, 1.8vmin, 14px);
  color: var(--muted);
  margin-bottom: 6px;
}
.ect-ui .ect-kpi-card__v{ display:flex; align-items:baseline; gap:6px; white-space:nowrap; }
/* Odometer numbers bigger (≈2x) with clamp */
.ect-ui .ect-num{
  font-size: clamp(24px, 4.2vmin, 36px);
  font-weight:600;
  color: var(--accent);
  line-height:1;
}
.ect-ui .ect-unit{ font-weight:500; font-size: clamp(14px, 2.4vmin, 18px); color:#0D0D0D; line-height:1; }

/* Calculator-like glass look for KPI cards inside the formbox */
.ect-formbox .ect-kpi-card{
  position: relative;
  background: var(--calc-glass-bg, color-mix(in srgb, #fff 78%, transparent));
  border: 1px solid var(--calc-glass-border, color-mix(in srgb, #fff 45%, rgba(0,0,0,.06)));
  backdrop-filter: blur(var(--calc-glass-blur, 10px)) saturate(130%);
  -webkit-backdrop-filter: blur(var(--calc-glass-blur, 10px)) saturate(130%);
  box-shadow: var(--calc-shadow, 0 14px 40px rgba(0,0,0,.18));
}

/* Mini KPI card background image + veil overlay (like section KPI highlight) */
.ect-formbox #ect-kpi-mini .ect-kpi-card::before{
  content: "";
  position:absolute; inset:0;
  background-image: var(--kpi-card-image, none);
  background-size: cover; background-position: center;
  opacity: 1; /* always visible in mini cards */
  border-radius: inherit;
  z-index: 0;
  pointer-events: none;
}
.ect-formbox #ect-kpi-mini .ect-kpi-card::after{
  content: "";
  position:absolute; inset:0;
  background: color-mix(in oklab, var(--ect-color-3) 100%, transparent);
  mix-blend-mode: normal;
  opacity: .40; /* veil similar to charts */
  border-radius: inherit;
  z-index: 1;
  pointer-events: none;
}
.ect-formbox #ect-kpi-mini .ect-kpi-card > *{ position: relative; z-index: 2; }

/* Mini KPI text colors on image */
.ect-formbox #ect-kpi-mini .ect-kpi-card__k{ color: #fff; }
.ect-formbox #ect-kpi-mini .ect-unit{ color: #fff; }
.ect-formbox #ect-kpi-mini .ect-num{
  color: #CECECC;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

/* Step 6: make the calc note prominent (white, larger) */
.ect-formbox .ect-step[data-step="6"] #ect-pdf-extras .ect-note{
  color: #fff;
  font-size: clamp(13px, 2vmin, 18px);
  line-height: 1.4;
  margin-top: 6px;
}

/* Final block */
.ect-ui .ect-final{ margin-top:10px; text-align:center; display:flex; flex-direction:column; align-items:center; }
.ect-ui .ect-final__head{ display:none; }
.ect-ui .ect-final__big{
  margin: clamp(12px, 4vmin, 36px) 0 6px;
  font-weight: 800;
  line-height: 1.15;
  font-size: clamp(20px, 4.6vmin, 60px);
  color: var(--ect-color-1);
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  min-height: 1.1em; /* reserve space to avoid layout shift */
}
.ect-ui .ect-final__sub{
  font-size: clamp(15px, 2.2vmin, 28px);
  line-height: 1.35;
  color: var(--ect-color-1);
  opacity: 0; transform: translateY(6px);
  transition: opacity .25s ease, transform .25s ease;
  min-height: 1.4em; /* reserve space */
}
.ect-ui .ect-final__sub.is-visible{ opacity:1; transform: translateY(0); }
.ect-ui .ect-final__submit{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  margin-top: clamp(14px, 3vmin, 28px);
  min-width: clamp(260px, 24vw, 360px);
  padding: clamp(14px, 2.2vmin, 18px) clamp(24px, 3.2vmin, 34px);
  font-size: clamp(16px, 2.2vmin, 18px);
}
.ect-ui .ect-final__ico{ width: 28px; height: 28px; display:block; }
.ect-ui .ect-final__label{ display:block; }
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-final__submit:hover{
  background: var(--ect-color-6) !important;
  border-color: transparent !important;
  color: #fff !important;
}
.ect-ui .ect-submit-status{ margin-top:14px; display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; }
.ect-ui .ect-submit-lottie{ width:48px; height:48px; }
.ect-ui .ect-submit-status .final-submitting{
  font-weight:500;
  color: var(--ect-color-1);
  font-size: clamp(14px, 2vmin, 20px);
  line-height: 1.35;
}
/* Submitting icon (ECT Tiger) above text */
.ect-submit-ico{ width:80px; height:80px; position:relative; margin-bottom:10px; }
.ect-submit-ico svg{ width:100%; height:100%; display:block; }
.ect-submit-ico .tig-base{ color: var(--ect-color-2); }
.ect-submit-ico .tig-fill{ position:absolute; left:0; right:0; bottom:0; height:0%; overflow:hidden; }
.ect-submit-ico .tig-fill .tig-accent{ color: var(--ect-color-5); width:100%; height:100%; display:block; }

/* Success sublines stagger + spacing */
.ect-final__sub .ect-final__s1,
.ect-final__sub .ect-final__s2{ opacity:0; transform: translateY(6px); transition: opacity .25s ease, transform .25s ease; display:block; }
.ect-final__sub .ect-final__s1.is-visible{ opacity:1; transform: translateY(0); margin-top: 6px; }
.ect-final__sub .ect-final__s2.is-visible{ opacity:1; transform: translateY(0); margin-top: 12px; }

/* ============================= */
/* 6) VARIANTS                   */
/* ============================= */

/* --- FULL (Inline-Full Layout + Felderbreiten + Pfeile rechts) --- */
.ect-ui[data-ect-variant="full"]{ max-width:none !important; width:100% !important; padding:0; }
.ect-ui[data-ect-variant="full"] .ect-step__box{
  width:100% !important; max-width:none !important;
  padding-left:clamp(18px, calc((100% - 980px)/2), 6vw);
  padding-right:clamp(18px, calc((100% - 980px)/2), 6vw);
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
}
.ect-ui[data-ect-variant="full"] .ect-field{ max-width:520px; width:100%; }
.ect-ui[data-ect-variant="full"] .ect-col--cc .ect-field{ max-width:240px; }
.ect-ui[data-ect-variant="full"] .ect-step__actions{ display:flex; align-items:center; gap:12px; justify-content:flex-start; }
.ect-ui[data-ect-variant="full"] .ect-step__arrows{ margin-left:auto !important; }

/* --- LITE (kein Step 6; PDF = Yes, Hidden via Mirror) --- */
/* (Layout identisch zu FULL; Step 6 ist nicht gerendert im Template) */

/* --- EXPERT (Step 3: Calendly nach Confirm) --- */
.ect-ui[data-ect-variant="expert"] #ect-calendly-inline{ margin-top:8px; }

/* --- TRIAL (kein Calendly; Step 6 direkt sichtbar) --- */
.ect-ui[data-ect-variant="trial"] .ect-choices{ display:none !important; } /* keine Choices in Trial */
.ect-ui[data-ect-variant="trial"] #ect-badge-phone,
.ect-ui[data-ect-variant="trial"] #ect-calendly-wrap{ display:none !important; }


/* Newsletter badges removed */
.ect-ui #ect-badge-news,
.ect-ui #badgeNews{ display:none !important; }

/* ============================= */
/* Welcome (Step 0)              */
/* ============================= */


/* Tiles-Grid */
.ect-ui .ect-tiles{
  display:grid; grid-template-columns:repeat(3,minmax(180px,1fr));
  gap:14px; margin:16px 0 22px; padding:6px 4px;
}
@media (max-width:900px){ .ect-ui .ect-tiles{ grid-template-columns:repeat(2,minmax(160px,1fr)); } }
@media (max-width:560px){ .ect-ui .ect-tiles{ grid-template-columns:1fr; } }

/* Tile-Karten */
.ect-ui .ect-tile{
  background:linear-gradient(to bottom, var(--accent), var(--accent2));
  border-radius:12px; box-shadow:var(--btn-shadow);
  padding:14px 12px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:8px;
}
.ect-ui .ect-tile__ico{ width:36px; height:36px; margin-bottom:10px; }
.ect-ui .ect-tile__title{
  color:#fff; font-weight:600; text-transform:uppercase;
  line-height:1.15; font-size:15px; margin-bottom:6px;
}
.ect-ui .ect-tile__sub{ font-size:11.5px; line-height:1.45; letter-spacing:.02em; color:#2b3b16; }

/* CTA-Box */
.ect-ui .ect-welcome__box{
  border:none; border-radius:var(--radius); background:#fff; padding:18px; text-align:center;
}
.ect-ui .ect-welcome__msg{ font-size:14px; color:var(--muted); line-height:1.35; }
.ect-ui .ect-welcome__cta{ margin-top:10px; }

/* ============================= */
/* 7) MODAL helpers              */
/* ============================= */
#ect-modal{
  position:fixed; inset:0; display:none; z-index:999999;
  align-items:center; justify-content:center;
  background: color-mix(in srgb, var(--ect-color-3) 55%, transparent);
  padding:20px;
  backdrop-filter: blur(8px) saturate(120%);
  -webkit-backdrop-filter: blur(8px) saturate(120%);
}
#ect-modal.is-open{ display:flex; }
#ect-modal.is-legal{ align-items:flex-start; justify-content:flex-start; }
#ect-modal .ect-modal__pattern{
  position:fixed; inset:0; pointer-events:none; z-index:0;
  opacity: .08; /* slightly more visible */
}
#ect-modal .ect-modal__pattern-svg{ width:100%; height:100%; display:block; }
#ect-modal .ect-modal__pattern-svg use,
#ect-modal .ect-modal__pattern-svg path,
#ect-modal .ect-modal__pattern-svg rect{
  fill: color-mix(in srgb, var(--ect-color-2) 30%, transparent);
}
#ect-modal .ect-modal__panel{ position:relative; z-index:1; }
#ect-modal.is-open{ display:flex; }
#ect-modal .ect-modal__panel{
  background:rgba(255,255,255,.85); width:100%; max-width:940px; color:#111;
  border-radius:var(--radius); border:1px solid rgba(255,255,255,.45);
  box-shadow:0 22px 60px rgba(0,0,0,.35); position:relative; overflow:hidden;
}
#ect-modal .ect-modal__panel.is-form{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  /* Variants (lite/expert/trial) shown inside modal → a bit wider */
  max-width: clamp(820px, 92vw, 1180px) !important;
}
#ect-modal .ect-modal__panel.is-legal{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  max-width: none !important;
  width: 100% !important;
}
#ect-modal .ect-modal__panel.is-legal:focus{ outline: none !important; }
#ect-modal .ect-modal__panel.is-legal *:focus{ outline: none !important; }

#ect-modal .ect-modal__panel.is-legal{ color: var(--ect-color-1); }
.ect-legal--modal .legal-page, .ect-privacy--modal .privacy-page{ color: var(--ect-color-1); }
.ect-legal--modal .legal-page h1, .ect-privacy--modal .privacy-page h1{ margin:0 0 8px; font-weight:800; font-size: clamp(12px, 2.2vmin, 28px); }
.ect-legal--modal .legal-page h2, .ect-privacy--modal .privacy-page h2{ margin: 14px 0 6px; font-weight:600; font-size: clamp(10px, 2vmin, 22px); color: var(--ect-color-2); }
.ect-legal--modal .legal-page p, .ect-privacy--modal .privacy-page p, .ect-legal--modal .legal-page li, .ect-privacy--modal .privacy-page li{ color: var(--ect-color-1); }
.ect-legal--modal .legal-page a, .ect-privacy--modal .privacy-page a{ color: var(--ect-color-1); text-decoration: underline; }
/* Intro paragraph directly under H1 (outside the 2-column grid) */
.ect-legal--modal .legal-page > p,
.ect-privacy--modal .privacy-page > p{
  font-size: clamp(8px, 1.6vmin, 16px);
  line-height: 1.35;
}
#ect-modal.is-legal .ect-modal__close{ display:none !important; }
.ect-inline-close{ position:absolute; top:18px; right:18px; width:28px; height:28px; border-radius:10px; border:1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.55); color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; z-index:10; }
.ect-inline-close:hover{ background: rgba(0,0,0,.75); }
#ect-modal .ect-modal__close{
  position:absolute; top:10px; right:10px; width:36px; height:36px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px; background:#fff; cursor:pointer;
  border:var(--outline); box-shadow:var(--btn-shadow);
  transition:transform .06s ease, background .2s ease;
  z-index: 100; /* stay above glass formbox */
}
#ect-modal .ect-modal__close::before{ content:"×"; font-size:22px; line-height:1; color:#000; }
#ect-modal .ect-modal__close:hover{ background:var(--accent2); }
#ect-modal .ect-modal__close:active{ transform:translateY(1px); }
body.ect-modal-open{ overflow:hidden !important; }

/* When close button is placed inside the glass formbox */
.ect-formbox .ect-modal__close{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: #fff;
  border: var(--outline);
  box-shadow: var(--btn-shadow);
}
.ect-formbox .ect-modal__close::before{ font-size: 18px; }

/* Modal content width (only affects modal variants, not inline full) */
#ect-modal .ect-ui{
  max-width: clamp(820px, 90vw, 1120px);
}

/* Modal variants: make OK button same size as in full */
#ect-modal .ect-step__actions .ect-btn--ok{
  min-width: clamp(140px, 14vw, 220px);
  padding-left:22px; padding-right:22px;
}
/* Show "Clear entries" only on step 1 in modal */
#ect-modal .ect-step:not([data-step="1"]) .ect-clear-data{ display:none !important; }
/* Modal: pin arrows to box edge at same inset as content/progress */
#ect-modal .ect-formbox .ect-step__arrows{
  position: absolute;
  right: 18px; /* keep fully inside modal panel to avoid clipping */
  bottom: 2px;
  margin-right: 0;
}
/* Bigger arrows in modal */
#ect-modal .ect-nav__arrow{ width:32px; height:32px; }
#ect-modal .ect-nav--prev::before{ border-top:7px solid transparent; border-bottom:7px solid transparent; border-right:10px solid #000; }
#ect-modal .ect-nav--next::before{ border-top:7px solid transparent; border-bottom:7px solid transparent; border-left:10px solid #000; }

/* Modal: place "Clear entries" next to OK button (not at far right) */
#ect-modal .ect-step__actions .ect-clear-data{
  margin-left: 8px !important;
  margin-right: 0 !important;
}

/* ============================= */
/* 8) Calendly viewport-fit      */
/* ============================= */

/* Host kollabiert solange hidden (kein Streifen) – hast du bereits korrekt */
.ect-ui #ect-calendly-inline.hidden,
.ect-ui #ect-calendly-inline.hidden .calendly-inline-widget,
.ect-ui #ect-calendly-inline.hidden iframe{
  height:0 !important; margin:0 !important; padding:0 !important;
  overflow:hidden !important; display:none !important;
}

/* MODAL: volle Höhe NUR wenn NICHT hidden */
#ect-modal .ect-form #ect-calendly-inline:not(.hidden),
#ect-modal .ect-form #ect-calendly-inline:not(.hidden) .calendly-inline-widget,
#ect-modal .ect-form #ect-calendly-inline:not(.hidden) iframe{
  height: min(860px, calc(100vh - var(--ect-modal-chrome))) !important;
  max-height: calc(100vh - var(--ect-modal-chrome)) !important;
  width:100% !important; display:block !important; overflow:hidden !important;
}

/* INLINE (alle Varianten): volle Höhe NUR wenn NICHT hidden */
.ect-ui[data-ect-variant="full"]   #ect-calendly-inline:not(.hidden),
.ect-ui[data-ect-variant="full"]   #ect-calendly-inline:not(.hidden) .calendly-inline-widget,
.ect-ui[data-ect-variant="full"]   #ect-calendly-inline:not(.hidden) iframe,
.ect-ui[data-ect-variant="lite"]   #ect-calendly-inline:not(.hidden),
.ect-ui[data-ect-variant="lite"]   #ect-calendly-inline:not(.hidden) .calendly-inline-widget,
.ect-ui[data-ect-variant="lite"]   #ect-calendly-inline:not(.hidden) iframe,
.ect-ui[data-ect-variant="expert"] #ect-calendly-inline:not(.hidden),
.ect-ui[data-ect-variant="expert"] #ect-calendly-inline:not(.hidden) .calendly-inline-widget,
.ect-ui[data-ect-variant="expert"] #ect-calendly-inline:not(.hidden) iframe{
  height: min(860px, calc(100vh - var(--ect-inline-chrome))) !important;
  max-height: calc(100vh - var(--ect-inline-chrome)) !important;
  width:100% !important; display:block !important; overflow:hidden !important;
}

/* Abstand NUR wenn sichtbar */
.ect-ui #ect-calendly-inline:not(.hidden){ margin:25px 0 50px; }

/* ============================= */
/* 9) Google Places              */
/* ============================= */
.ect-ui #ect-map-wrap{ border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.ect-ui #ect-map{ width:100%; height:260px; }
.pac-container{ z-index:999999 !important; }

/* ============================= */
/* 10) A11y / Motion             */
/* ============================= */
@media (prefers-reduced-motion:reduce){
  .ect-kpi-hero .ect-btn, .ect-calc .ect-btn, .ect-ui .ect-btn,
  .ect-calc__bar, .ect-ui #ect-progress-bar, #ect-form-subline{ transition:none !important; animation:none !important; }
}

/* ============================= */
/* 11) Hardening / Utilities     */
/* ============================= */
.ect-ui .hidden, .ect-calc .hidden, .ect-kpi-hero .hidden { display:none !important; }
.ect-ui a, .ect-calc a, .ect-kpi-hero a { text-decoration:none !important; }

/* ============================= */
/* 12) Subline Fade              */
/* ============================= */
#ect-form-subline{
  opacity:1; transform:translateY(0);
  transition:opacity var(--ect-anim-fast) var(--ect-ease), transform var(--ect-anim-fast) var(--ect-ease);
  will-change:opacity, transform;
}
#ect-form-subline.fade-start{ opacity:0; transform:translateY(4px); }
#ect-form-subline.fade-in{ opacity:1; transform:translateY(0); }
/* Utility: visually hidden for a11y (keep in DOM for screen readers) */
.visually-hidden{
  position:absolute !important;
  width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ============================= */
/* 13) Legal overlay (modal)     */
/* ============================= */
/* Consolidated spacing: left/top aligned, minimal overrides */
.ect-legal--modal,
.ect-privacy--modal{
  /* respect header/adminbar height; keep gap minimal */
  padding: calc(var(--adminbar-offset, 0px) + var(--header-offset, 64px)) 0 24px;
}
.ect-legal--modal .ect-legal__inner,
.ect-privacy--modal .ect-legal__inner{
  max-width: 1140px;
  margin-left: 12px;
  margin-right: auto;
  padding: 12px 50px 20px; /* tighter top padding */
  position: relative; /* anchor for close button positioning */
}
/* Move close button further down inside legal/privacy */
.ect-legal--modal .ect-modal__close,
.ect-privacy--modal .ect-modal__close{
  top: 18px !important;
  right: 18px !important;
}
.ect-legal__grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); gap: clamp(12px, 2.6vmin, 24px); margin-top: 8px; }
.ect-legal__head{ margin:0 0 6px; font-weight:800; font-size: clamp(12px, 2.6vmin, 26px); color: var(--ect-color-1); }
.ect-legal__sub{ margin:0 0 10px; color: var(--ect-color-2); }
.ect-legal__list{ margin:0; padding:0; }
.ect-legal__list dt{ font-weight:700; color: var(--ect-color-2); }
.ect-legal__list dd{ margin: 0 0 8px; color: var(--ect-color-1); }

/* Inline field hints */
/* Inline field hints → bubble to the right of field */
.ect-hint-layer{
  position:absolute; inset:0; pointer-events:none; overflow:visible; z-index:50;
}
.ect-step__box .ect-col{ position: relative; }
.ect-hint{
  position:absolute; top: -6px; left: calc(100% + 10px);
  font-size: clamp(12px, 1.8vmin, 16px); line-height:1.35;
  color:#fff; background: rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.22); border-radius:10px;
  padding:8px 10px; max-width: 300px; box-shadow: 0 8px 24px rgba(0,0,0,.18);
  pointer-events:none; z-index: 5; opacity:0; transform: translateY(6px);
  transition: opacity .25s ease, transform .25s ease;
  /* Better readability: justified with smart hyphenation */
  text-align: justify;
  text-align-last: left;
  text-justify: inter-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  word-break: normal;
  overflow-wrap: anywhere; /* let long URLs/names break if needed */
}
.ect-hint::after{ content:""; position:absolute; left:-6px; top:12px; width:0; height:0; border-top:6px solid transparent; border-bottom:6px solid transparent; border-right:6px solid rgba(0,0,0,.55); }
.ect-hint--align-middle::after{ top:50%; transform:translateY(-50%); }
.ect-hint.is-visible{ opacity:1; transform: translateY(0); }
.ect-hint--flip{ left:auto; }
.ect-hint--flip::after{ left:auto; right:-6px; border-right:none; border-left:6px solid rgba(0,0,0,.55); }
.ect-hint--align-middle.ect-hint--flip::after{ top:50%; transform:translateY(-50%); }
.ect-hint--below{ transform: translateY(-6px); }
.ect-hint--below.is-visible{ transform: translateY(0); }
.ect-hint--bubble{ animation: ectFloat 6s ease-in-out infinite; }
@keyframes ectFloat{ 0%{ transform: translateY(0);} 50%{ transform: translateY(-2px);} 100%{ transform: translateY(0);} }

/* Opt-in bubble: position at row right side */
.ect-ui #ect-newsletter-row{ position:relative; }
.ect-ui #ect-newsletter-row .ect-hint--optin{ position:absolute; }
.ect-ui #ect-newsletter-row .ect-note .ect-note-measure{ display:inline-block; width:0; height:1em; vertical-align:baseline; }
.ect-ui #ect-newsletter-row .ect-hint--optin::after{ display:block; }

/* Mobile: stack hints below field */
@media (max-width: 900px){
  .ect-hint{ position:static; display:block; margin-top:6px; left:auto; top:auto; max-width:unset; opacity:1; }
  .ect-hint::after{ display:none; }
}

/* Step title (in-form headline) */
.ect-step__title{ margin: 0 0 16px; font: 800 clamp(14px, 2.4vmin, 34px)/1.2 'Source Sans 3', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; color: var(--ect-color-1); text-shadow: 0 1px 2px rgba(0,0,0,.25); }
/* Generic glass form container (migrated from sections) */
.ect-formbox{
  position: relative;
  border-radius: 16px;
  background: color-mix(in srgb, var(--ect-color-2) 26%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--ect-color-2) 45%, white) !important;
  box-shadow: 0 14px 40px rgba(0,0,0,.22) !important;
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  /* Horizontal padding off so content aligns with section container */
  padding-left: 0; padding-right: 0;
  /* Vertical breathing room only */
  padding-top: 16px; padding-bottom: 8px;
  /* Only top margin; bottom margin 0 to avoid extra gap inside the section glass */
  margin: clamp(16px, 3vmin, 28px) 0 0;
  overflow: hidden;
  z-index: 1;
}
/* Remove default outer margins from inner form host to avoid large bottom gap */
.ect-formbox > .ect-ui{
  margin: 0 !important; /* overrides .ect-ui { margin:28px auto 80px } */
}
/* Inner boxes transparent inside glass */
.ect-formbox .ect-step__box{ background: transparent !important; border-color: rgba(255,255,255,0.18) !important; box-shadow: none !important; }

/* Alignment: match section container padding (50px on contact) */
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-step__box{
  padding-left: 50px; padding-right: 50px; padding-bottom: 6px; position: relative;
}
/* Keep form height stable across steps (min 280, max 480); allow taller content to grow */
.ect-formbox .ect-step__box{ min-height: clamp(280px, 42vh, 480px); }
.ect-formbox.is-expand .ect-step__box{ min-height: auto; }
html.ect-mobile .ect-section--contact .ect-formbox .ect-step__box{
  min-height: clamp(260px, 56vh, 420px);
}
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-progress{
  margin-left: 50px; margin-right: 50px;
  height:12px; border:none; background: rgba(255,255,255,.66);
  width: auto; /* override global 100% to respect margins on both sides */
}
.ect-formbox{ padding-bottom: clamp(24px, 3vmin, 30px); }

/* Actions layout — OK left, Clear + arrows right */
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-step__actions{
  display:flex; align-items:center; gap:12px;
  margin-top: clamp(18px, 3vmin, 26px);
}
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-step__actions .ect-btn--ok{ justify-self:start; }
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-step__actions .ect-btn--ok{ min-width: clamp(140px, 14vw, 220px); padding-left:22px; padding-right:22px; }
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-step__arrows{ margin-left:auto; }
/* Pin arrows to bottom-right of the glass box */
.ect-formbox .ect-step__arrows{ position:absolute; right:50px; bottom:2px; }
/* override global auto-margin so clear doesn’t jump */
.ect-formbox .ect-ui[data-ect-variant="full"] .ect-step__actions .ect-clear-data{ margin-left:0; }

/* Buttons in glass */
.ect-formbox .ect-ui .ect-btn{ padding:10px 14px; border-radius:12px; font-weight:600; font-size:15px; border:1px solid rgba(0,0,0,.08); }
.ect-formbox .ect-ui .ect-btn--ghost{ background:#fff; color:#333; }
.ect-formbox .ect-ui .ect-btn--primary{ background:linear-gradient(90deg,var(--accent),var(--accent2)); color:#fff; border-color:transparent; }
.ect-formbox .ect-ui .ect-btn[disabled]{ opacity:.6; cursor:not-allowed; }

/* Form buttons: local hover/active scale + sheen (no CTA core) */
.ect-formbox .ect-ui .ect-btn,
.ect-formbox .ect-btn{
  position: relative;
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .18s ease, box-shadow .18s ease;
}
.ect-formbox .ect-ui .ect-btn:hover,
.ect-formbox .ect-btn:hover{ transform: scale(1.015); }
.ect-formbox .ect-ui .ect-btn:active,
.ect-formbox .ect-btn:active{ transform: scale(0.985); }
/* Sheen sweep */
/* CTA-like sheen: angled gradient, screen blend, brief sweep then idle gap */
@keyframes ectSheenSweepX{
  0%   { transform: translateX(-150%); opacity: 0; }
  6%   { opacity: .9; }
  46%  { transform: translateX(150%); opacity: .9; }
  52%  { opacity: 0; }
  100% { transform: translateX(150%); opacity: 0; }
}
/* Disable ::after sheen when GSAP-based sheen is used */
.ect-formbox .ect-btn::after{ display:none; }

/* GSAP-driven sheen element for form buttons (mirrors CTA core) */
.ect-formbox .ect-btn__sheen{
  position:absolute; inset:0; pointer-events:none; opacity:0;
  background:
    linear-gradient(75deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.25) 45%,
      rgba(255,255,255,.55) 50%,
      rgba(255,255,255,.25) 55%,
      rgba(255,255,255,0) 100%);
  filter: blur(1.5px);
  mix-blend-mode: screen;
  border-radius: inherit;
  will-change: transform, opacity;
  z-index: 2;
  transform: translateX(0);
}

/* Final submit icon idle bounce */
.ect-formbox .ect-final__ico{ animation: none; }
@keyframes ectFinalBtnBounce{ 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(-2px);} }
.ect-formbox .ect-final__submit{ animation: ectFinalBtnBounce 3s ease-in-out infinite; }
.ect-formbox .ect-final__submit:hover,
.ect-formbox .ect-final__submit:active{ animation: none; }

/* OK button: solid accent (no gradient), smooth hover */
.ect-formbox .ect-ui .ect-step.is-active .ect-btn--ok{
  background: var(--ect-color-5) !important; /* Accent 5 */
  color: #fff !important;
  border-color: transparent;
  transition: background-color .22s ease, transform .06s ease;
}
.ect-formbox .ect-ui .ect-step.is-active .ect-btn--ok:hover:not([disabled]){
  background: var(--ect-color-6) !important; /* Accent 6 on hover */
}
.ect-formbox .ect-ui .ect-step.is-active .ect-btn--ok[disabled]{
  background: #eee !important; color:#666 !important;
}

/* Bigger arrows in glass */
.ect-formbox .ect-ui .ect-nav__arrow{ width:36px; height:36px; }
.ect-formbox .ect-ui .ect-nav--prev::before{ border-top:7px solid transparent; border-bottom:7px solid transparent; border-right:11px solid #000; }
.ect-formbox .ect-ui .ect-nav--next::before{ border-top:7px solid transparent; border-bottom:7px solid transparent; border-left:11px solid #000; }

/* Bring last name field closer to first name (Step 1 first row) */
.ect-formbox .ect-ui .ect-step[data-step="1"] .ect-row:first-of-type{
  justify-content:flex-start;
  gap: 20px; /* tighter than default */
}
.ect-formbox .ect-ui .ect-step[data-step="1"] .ect-row + .ect-row{ margin-top: 18px; }
.ect-formbox .ect-ui .ect-step[data-step="1"] .ect-row:first-of-type .ect-col{
  flex: 0 0 460px; /* keep two fixed columns next to each other */
  max-width: 460px;
}
@media (max-width: 1100px){
  .ect-formbox .ect-ui[data-ect-variant="full"] .ect-step[data-step="1"] .ect-row:first-of-type .ect-col{
    flex: 1 1 auto; max-width: none; /* stack responsively */
  }
}

/* Step 6 actions: allow skip-button under OK with same width, half height */
.ect-formbox .ect-step[data-step="6"] .ect-step__actions{ flex-wrap: nowrap; align-items: center; }
.ect-formbox .ect-step[data-step="6"] .ect-step__actions .ect-btn--ok{ min-width: clamp(180px, 16vw, 260px); }
.ect-formbox .ect-step[data-step="6"] .ect-step__actions [data-choice="pdf_no"]{
  display: inline-block;
  min-width: clamp(180px, 16vw, 260px); /* match OK button width */
  padding: 6px 14px; /* roughly half height */
  font-size: clamp(12px, 1.6vmin, 14px);
  line-height: 1.2;
  margin-top: 0;      /* align with OK button baseline */
  margin-left: auto;  /* push to the right edge of the row */
  margin-right: 0;
  flex: 0 0 auto;     /* keep natural width; stay on same row */
  text-align: center;
}

/* Step 6: make the three inputs (country, hours, rest) equal width and avoid overflow gaps */
.ect-ui .ect-step[data-step="6"] #ect-pdf-extras .ect-row.ect-row--tight > .ect-col,
.ect-ui .ect-step[data-step="6"] #ect-pdf-extras .ect-row.ect-row--tight > .ect-field.ect-col{
  flex: 1 1 0; /* distribute evenly */
  min-width: 0; /* allow shrink inside flex to avoid extra gap */
}
/* Step 6: ensure inner fields stretch to full column width (override max-width from variant) */
.ect-ui[data-ect-variant="full"] .ect-step[data-step="6"] #ect-pdf-extras .ect-row.ect-row--tight .ect-field{
  max-width: none !important;
  width: 100% !important;
}
/* Right-align numbers for hours/day and rest/week */
.ect-ui .ect-step[data-step="6"] .pf-hours,
.ect-ui .ect-step[data-step="6"] .pf-rest{ text-align: right; }
/* Add a touch more right padding for right-aligned values */
.ect-ui .ect-step[data-step="6"] .pf-hours,
.ect-ui .ect-step[data-step="6"] .pf-rest{
  padding-right: 16px;
}
/* Two-column layout for legal and privacy pages */
.legal-page .legal-cols,
.privacy-page .legal-cols{ display:grid; grid-template-columns: clamp(30%, 36vw, 50%) clamp(30%, 36vw, 50%); column-gap: clamp(24px, 5vw, 60px); row-gap: clamp(12px, 3vmin, 24px); align-items:start; }
.legal-page .legal-col--span2,
.privacy-page .legal-col--span2{ grid-column: 1 / -1; }
.legal-page .legal-col h2,
.privacy-page .legal-col h2{ color: var(--ect-color-2); font-weight:600; margin: 0 0 6px; font-size: clamp(10px, 2vmin, 20px); }
.legal-page .legal-col p,
.legal-page .legal-col ul,
.legal-page .legal-col li,
.privacy-page .legal-col p,
.privacy-page .legal-col ul,
.privacy-page .legal-col li{ color: var(--ect-color-1); font-size: clamp(8px, 1.6vmin, 16px); }
.legal-page .legal-col ul,
.privacy-page .legal-col ul{ margin: 0 0 8px 18px; padding:0; }
.legal-page .legal-col li,
.privacy-page .legal-col li{ list-style: disc; }