.elementor-kit-190{--e-global-color-primary:#006262;--e-global-color-secondary:#00302E;--e-global-color-text:#4A5C5C;--e-global-color-accent:#B34E24;--e-global-color-bg:#FFFDF6;--e-global-color-bg_alt:#F2EFE2;--e-global-color-bg_dark:#00302E;--e-global-color-border:#E3DECD;--e-global-color-danger:#B34E24;--e-global-color-muted:#5F6F6F;--e-global-color-on_dark:#EDF4F2;--e-global-color-on_primary:#FFFFFF;--e-global-color-success:#006262;--e-global-color-white:#FFFFFF;--e-global-typography-primary-font-family:"Cabin";--e-global-typography-primary-font-size:58px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-line-height:1.08em;--e-global-typography-primary-letter-spacing:-1px;--e-global-typography-secondary-font-family:"Cabin";--e-global-typography-secondary-font-size:40px;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-line-height:1.16em;--e-global-typography-secondary-letter-spacing:-0.4px;--e-global-typography-text-font-family:"Cabin";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.72em;--e-global-typography-accent-font-family:"Cabin";--e-global-typography-accent-font-size:13px;--e-global-typography-accent-font-weight:600;--e-global-typography-accent-line-height:1.2em;--e-global-typography-accent-letter-spacing:1.6px;--e-global-typography-h3-font-family:"Cabin";--e-global-typography-h3-font-size:26px;--e-global-typography-h3-font-weight:600;--e-global-typography-h3-line-height:1.26em;--e-global-typography-h4-font-family:"Cabin";--e-global-typography-h4-font-size:19px;--e-global-typography-h4-font-weight:600;--e-global-typography-h4-line-height:1.36em;--e-global-typography-lead-font-family:"Cabin";--e-global-typography-lead-font-size:20px;--e-global-typography-lead-font-weight:400;--e-global-typography-lead-line-height:1.6em;--e-global-typography-small-font-family:"Cabin";--e-global-typography-small-font-size:14px;--e-global-typography-small-font-weight:400;--e-global-typography-small-line-height:1.55em;--e-global-typography-button-font-family:"Cabin";--e-global-typography-button-font-size:16px;--e-global-typography-button-font-weight:600;--e-global-typography-button-line-height:1em;--e-global-typography-stat-font-family:"Cabin";--e-global-typography-stat-font-size:52px;--e-global-typography-stat-font-weight:600;--e-global-typography-stat-line-height:1em;background-color:var( --e-global-color-bg );color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-190 button,.elementor-kit-190 input[type="button"],.elementor-kit-190 input[type="submit"],.elementor-kit-190 .elementor-button{background-color:var( --e-global-color-primary );font-family:var( --e-global-typography-button-font-family ), Sans-serif;font-size:var( --e-global-typography-button-font-size );font-weight:var( --e-global-typography-button-font-weight );line-height:var( --e-global-typography-button-line-height );color:var( --e-global-color-on_primary );border-radius:999px 999px 999px 999px;padding:13px 26px 13px 26px;}.elementor-kit-190 button:hover,.elementor-kit-190 button:focus,.elementor-kit-190 input[type="button"]:hover,.elementor-kit-190 input[type="button"]:focus,.elementor-kit-190 input[type="submit"]:hover,.elementor-kit-190 input[type="submit"]:focus,.elementor-kit-190 .elementor-button:hover,.elementor-kit-190 .elementor-button:focus{background-color:var( --e-global-color-accent );color:var( --e-global-color-on_primary );}.elementor-kit-190 e-page-transition{background-color:#FFBC7D;}.elementor-kit-190 a{color:var( --e-global-color-primary );}.elementor-kit-190 a:hover{color:var( --e-global-color-accent );}.elementor-kit-190 h1{color:var( --e-global-color-secondary );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 );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-kit-190 h2{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-kit-190 h3{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-h3-font-family ), Sans-serif;font-size:var( --e-global-typography-h3-font-size );font-weight:var( --e-global-typography-h3-font-weight );line-height:var( --e-global-typography-h3-line-height );}.elementor-kit-190 h4{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-h4-font-family ), Sans-serif;font-size:var( --e-global-typography-h4-font-size );font-weight:var( --e-global-typography-h4-font-weight );line-height:var( --e-global-typography-h4-line-height );}.elementor-kit-190 h5{color:var( --e-global-color-secondary );}.elementor-kit-190 h6{color:var( --e-global-color-secondary );}.elementor-kit-190 label{color:var( --e-global-color-secondary );}.elementor-kit-190 input:not([type="button"]):not([type="submit"]),.elementor-kit-190 textarea,.elementor-kit-190 .elementor-field-textual{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-190{--e-global-typography-primary-font-size:44px;--e-global-typography-secondary-font-size:32px;--e-global-typography-h3-font-size:23px;--e-global-typography-h4-font-size:18px;--e-global-typography-lead-font-size:18px;--e-global-typography-stat-font-size:40px;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-190 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-kit-190 h2{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-kit-190 h3{font-size:var( --e-global-typography-h3-font-size );line-height:var( --e-global-typography-h3-line-height );}.elementor-kit-190 h4{font-size:var( --e-global-typography-h4-font-size );line-height:var( --e-global-typography-h4-line-height );}.elementor-kit-190 button,.elementor-kit-190 input[type="button"],.elementor-kit-190 input[type="submit"],.elementor-kit-190 .elementor-button{font-size:var( --e-global-typography-button-font-size );line-height:var( --e-global-typography-button-line-height );}.elementor-kit-190 input:not([type="button"]):not([type="submit"]),.elementor-kit-190 textarea,.elementor-kit-190 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-190{--e-global-typography-primary-font-size:34px;--e-global-typography-secondary-font-size:27px;--e-global-typography-text-font-size:16px;--e-global-typography-h3-font-size:21px;--e-global-typography-lead-font-size:17px;--e-global-typography-stat-font-size:34px;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-190 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-kit-190 h2{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-kit-190 h3{font-size:var( --e-global-typography-h3-font-size );line-height:var( --e-global-typography-h3-line-height );}.elementor-kit-190 h4{font-size:var( --e-global-typography-h4-font-size );line-height:var( --e-global-typography-h4-line-height );}.elementor-kit-190 button,.elementor-kit-190 input[type="button"],.elementor-kit-190 input[type="submit"],.elementor-kit-190 .elementor-button{font-size:var( --e-global-typography-button-font-size );line-height:var( --e-global-typography-button-line-height );}.elementor-kit-190 input:not([type="button"]):not([type="submit"]),.elementor-kit-190 textarea,.elementor-kit-190 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* Preset stylesheet — tools/build_preset_css.py ile uretildi.
 * Kaynak: collage.html
 * Elle duzenleme; kaynak degisince yeniden uret.
 * Renkler Elementor global token'larina baglidir (--e-global-color-*),
 * boylece aktif preset degisince bu sayfa da yeniden renklenir.
 */
/* =========================================================================
   DESIGN TOKENS — design-system/presets/collage.json
   Der einzige Ort mit festen Farbwerten. Keine Regel darunter schreibt Hex.
   =========================================================================

   Skelett: Empathia Template Kit (Fundraising & Donation Events).
   Übernommen wurden die gemessenen Werte — das Teal-Fundament (#003636 /
   #006262), die Cabin-Schriftskala und der Abschnittsrhythmus. NICHT übernommen
   wurde die Slot-Belegung: das Kit legt in `accent` die Button-Schrift ab,
   unser Vertrag reserviert `accent` für die Eyebrow. Werte ja, Zuordnung nach
   unserem Vertrag.

   Der Entwurf darüber hinaus kommt aus dem Namen des Vereins. Eine Collage
   fügt Stücke unterschiedlicher Herkunft zu einem Bild — genau das tut ein
   interkultureller Frauenverein. Daraus folgen drei Entscheidungen:

     1. ZWEI MATERIALIEN, nie verlaufend ineinander. Tiefes Teal trägt die
        Institution, warmes Terrakotta die Menschen. Sie liegen nebeneinander
        wie aufgeklebtes Papier, nie als Gradient.
     2. PAPIER STATT BILDSCHIRM. Cremeweiß als Grundfläche, keine klinische
        Weiße; sichtbare Kanten und Rahmen statt schwebender Schatten.
     3. VERSETZT STATT ZENTRIERT. Bildkacheln sitzen leicht gedreht und
        überlappen die Textspalte — die Anmutung des Zusammengesetzten.
   ========================================================================= */
:root{
  /* colors.system */   /* Marke / Aktion — aus Kit "Secondary" */   /* Überschriften-Tinte — vertieftes Kit "Primary" */   /* Fließtext */   /* Eyebrow / Hover — das warme Gegenstück */

  /* colors.custom */

  /* ---- Typografie ------------------------------------------------------
     Cabin stammt aus dem Kit. Externe Requests sind verboten, deshalb steht
     der Name vorn und der Stapel fällt sauber auf Systemschriften. --------- */
  --font-stack:"Cabin","Cabin Variable",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;

  /* typography.system — Desktop */
  --h1-size:var(--e-global-typography-primary-font-size);   --h1-weight:var(--e-global-typography-primary-font-weight); --h1-lh:var(--e-global-typography-primary-line-height); --h1-ls:var(--e-global-typography-primary-letter-spacing);
  --h2-size:var(--e-global-typography-secondary-font-size);   --h2-weight:var(--e-global-typography-secondary-font-weight); --h2-lh:var(--e-global-typography-secondary-line-height); --h2-ls:var(--e-global-typography-secondary-letter-spacing);
  --body-size:var(--e-global-typography-text-font-size); --body-weight:var(--e-global-typography-text-font-weight); --body-lh:var(--e-global-typography-text-line-height);
  --eyebrow-size:var(--e-global-typography-accent-font-size); --eyebrow-weight:var(--e-global-typography-accent-font-weight); --eyebrow-lh:var(--e-global-typography-accent-line-height); --eyebrow-ls:var(--e-global-typography-accent-letter-spacing);

  /* typography.custom */
  --h3-size:var(--e-global-typography-h3-font-size);    --h3-weight:var(--e-global-typography-h3-font-weight); --h3-lh:var(--e-global-typography-h3-line-height);
  --h4-size:var(--e-global-typography-h4-font-size);    --h4-weight:var(--e-global-typography-h4-font-weight); --h4-lh:var(--e-global-typography-h4-line-height);
  --lead-size:var(--e-global-typography-lead-font-size);  --lead-weight:var(--e-global-typography-lead-font-weight); --lead-lh:var(--e-global-typography-lead-line-height);
  --small-size:var(--e-global-typography-small-font-size); --small-weight:var(--e-global-typography-small-font-weight); --small-lh:var(--e-global-typography-small-line-height);
  --btn-size:var(--e-global-typography-button-font-size);   --btn-weight:var(--e-global-typography-button-font-weight); --btn-lh:var(--e-global-typography-button-line-height);
  --stat-size:var(--e-global-typography-stat-font-size);  --stat-weight:var(--e-global-typography-stat-font-weight); --stat-lh:var(--e-global-typography-stat-line-height);

  /* layout */
  --container:1200px;
  --gutter:24px;
  --gap:24px;
  --section-py:96px;
  --radius:14px;

  /* button */
  --btn-radius:999px;
  --btn-px:26px;
  --btn-py:13px;

  /* Kein `primary-deep`: Primary hält auf Creme 7:1 und auf allen getönten
     Flächen dieses Entwurfs ebenfalls über 4.5:1. Ein vertiefter Ableger wäre
     ein Token, das nie gelesen wird. */

  /* Abgeleitete Flächen — nur Token plus Deckkraft, keine neue Farbe. */
  --shadow-sm: 0 1px 2px color-mix(in srgb, var(--e-global-color-secondary) 8%, transparent);
  --shadow-md: 0 18px 40px -26px color-mix(in srgb, var(--e-global-color-secondary) 42%, transparent);
  --shadow-lg: 0 30px 64px -32px color-mix(in srgb, var(--e-global-color-secondary) 48%, transparent);
  --tint-primary: color-mix(in srgb, var(--e-global-color-primary) 8%, transparent);
  --tint-accent:  color-mix(in srgb, var(--e-global-color-accent) 10%, transparent);
  --tint-dark-surface: color-mix(in srgb, var(--e-global-color-on_dark) 7%, transparent);
  --tint-dark-border:  color-mix(in srgb, var(--e-global-color-on_dark) 18%, transparent);
  --tint-light-border: color-mix(in srgb, var(--e-global-color-on_primary) 34%, transparent);
}

/* Tablet: zwischen viewport_md 768 und viewport_lg 1025 */
@media (max-width:1024px){
  :root{
    --section-py:72px;
    --gap:20px;
  }
}

@media (max-width:767px){
  :root{
    --section-py:56px;
    --gutter:18px;
    --gap:16px;
  }
}

/* =========================================================================
   GRUNDLAGEN
   ========================================================================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--font-stack);
  font-size:var(--body-size);
  font-weight:var(--body-weight);
  line-height:var(--body-lh);
  color:var(--e-global-color-text);
  background:var(--e-global-color-bg);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--e-global-color-primary);text-underline-offset:3px}
a:hover{color:var(--e-global-color-accent)}

h1,h2,h3,h4{margin:0;color:var(--e-global-color-secondary);font-weight:var(--h2-weight)}
h1{font-size:var(--h1-size);font-weight:var(--h1-weight);line-height:var(--h1-lh);letter-spacing:var(--h1-ls)}
h2{font-size:var(--h2-size);font-weight:var(--h2-weight);line-height:var(--h2-lh);letter-spacing:var(--h2-ls)}
h3{font-size:var(--h3-size);font-weight:var(--h3-weight);line-height:var(--h3-lh)}
h4{font-size:var(--h4-size);font-weight:var(--h4-weight);line-height:var(--h4-lh)}
p{margin:0}
ul{margin:0;padding:0;list-style:none}

:focus-visible{
  outline:2px solid var(--e-global-color-accent);
  outline-offset:3px;
  border-radius:4px;
}

/* -- Textrollen ---------------------------------------------------------- */
.eng-eyebrow{
  display:inline-block;
  font-size:var(--eyebrow-size);
  font-weight:var(--eyebrow-weight);
  line-height:var(--eyebrow-lh);
  letter-spacing:var(--eyebrow-ls);
  text-transform:uppercase;
  color:var(--e-global-color-accent);
}
/* Der kurze Strich vor der Eyebrow ist der kleinste Träger der Collage-Idee:
   ein zweites Material, das die Überschrift anschneidet. */
.eng-eyebrow::before{
  content:"";
  display:inline-block;
  width:26px;
  height:2px;
  margin-right:10px;
  vertical-align:middle;
  background:currentColor;
}
.eng-lead{font-size:var(--lead-size);font-weight:var(--lead-weight);line-height:var(--lead-lh);color:var(--e-global-color-text)}
.eng-small{font-size:var(--small-size);font-weight:var(--small-weight);line-height:var(--small-lh);color:var(--e-global-color-muted)}
.eng-hero-note{font-size:var(--small-size);line-height:var(--small-lh);color:var(--e-global-color-muted)}

/* =========================================================================
   LAYOUT
   ========================================================================= */
.eng-container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.eng-container--narrow{max-width:800px}

.eng-section{padding-block:var(--section-py)}
.eng-section--bg{background:var(--e-global-color-bg)}
.eng-section--bg-alt{background:var(--e-global-color-bg_alt)}
.eng-section--bg-dark{background:var(--e-global-color-bg_dark);color:var(--e-global-color-on_dark)}
.eng-section--primary{background:var(--e-global-color-primary);color:var(--e-global-color-on_primary)}

.eng-section--bg-dark h2,.eng-section--bg-dark h3,.eng-section--bg-dark h4,
.eng-section--primary h2,.eng-section--primary h3,.eng-section--primary h4{color:inherit}
.eng-section--bg-dark .eng-lead,.eng-section--primary .eng-lead{color:inherit;opacity:.86}
.eng-section--bg-dark .eng-small,.eng-section--primary .eng-small{color:inherit;opacity:.72}

.eng-section-head{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  max-width:62ch;
  margin-bottom:calc(var(--gap) * 2);
}
.eng-section-head--center{align-items:center;text-align:center;margin-inline:auto}
.eng-section-head--center .eng-eyebrow::before{display:none}

/* =========================================================================
   RASTER
   ========================================================================= */
.eng-grid{display:grid;gap:var(--gap);grid-template-columns:1fr}
.eng-grid--3{grid-template-columns:repeat(3,1fr)}
.eng-stats-grid{display:grid;gap:var(--gap);grid-template-columns:repeat(4,1fr)}
.eng-process-grid{display:grid;gap:var(--gap);grid-template-columns:repeat(3,1fr)}
.eng-team-grid{display:grid;gap:var(--gap);grid-template-columns:repeat(3,1fr)}
.eng-quote-grid{display:grid;gap:var(--gap);grid-template-columns:repeat(2,1fr)}

@media (max-width:1024px){
  .eng-grid--3,.eng-process-grid,.eng-team-grid{grid-template-columns:repeat(2,1fr)}
  .eng-stats-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:767px){
  .eng-grid--3,.eng-process-grid,.eng-team-grid,.eng-quote-grid,.eng-stats-grid{grid-template-columns:1fr}
}

/* =========================================================================
   BUTTONS
   ========================================================================= */
.eng-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:var(--btn-py) var(--btn-px);
  border:1px solid transparent;
  border-radius:var(--btn-radius);
  font-family:inherit;
  font-size:var(--btn-size);
  font-weight:var(--btn-weight);
  line-height:var(--btn-lh);
  text-decoration:none;
  cursor:pointer;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.eng-btn:hover{transform:translateY(-1px)}
.eng-btn.eng-btn--primary{background:var(--e-global-color-primary);color:var(--e-global-color-on_primary)}
.eng-btn.eng-btn--primary:hover{background:var(--e-global-color-accent);color:var(--e-global-color-on_primary)}
.eng-btn.eng-btn--outline{background:transparent;color:var(--e-global-color-primary);border-color:var(--e-global-color-border)}
.eng-btn.eng-btn--outline:hover{background:var(--e-global-color-primary);color:var(--e-global-color-on_primary);border-color:var(--e-global-color-primary)}
.eng-btn.eng-btn--on-primary{background:var(--e-global-color-on_primary);color:var(--e-global-color-primary)}
.eng-btn.eng-btn--on-primary:hover{background:var(--e-global-color-secondary);color:var(--e-global-color-on_primary)}
.eng-btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}

.eng-section--bg-dark .eng-btn.eng-btn--outline{color:var(--e-global-color-on_dark);border-color:var(--tint-dark-border)}
.eng-section--bg-dark .eng-btn.eng-btn--outline:hover{background:var(--e-global-color-on_dark);color:var(--e-global-color-secondary)}

/* =========================================================================
   KOPFZEILE
   ========================================================================= */
.eng-site-header{
  position:sticky;
  top:0;
  z-index:40;
  background:var(--e-global-color-bg);
  border-bottom:1px solid var(--e-global-color-border);
}
.eng-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--gap);
  min-height:76px;
}
.eng-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
/* Die Marke ist die Idee in klein: zwei versetzte Flächen, die sich
   überlappen und dabei eine dritte Fläche bilden. */
.eng-brand-mark{
  display:inline-flex;
  width:34px;
  height:34px;
  flex:none;
  color:var(--e-global-color-primary);
}
.eng-brand-name{
  font-size:21px;
  font-weight:600;
  letter-spacing:-.3px;
  color:var(--e-global-color-secondary);
}
.eng-site-nav{display:flex;align-items:center;gap:26px}
.eng-site-nav a{
  font-size:var(--small-size);
  font-weight:600;
  color:var(--e-global-color-secondary);
  text-decoration:none;
  padding-block:6px;
  border-bottom:2px solid transparent;
}
.eng-site-nav a:hover{color:var(--e-global-color-accent);border-bottom-color:var(--e-global-color-accent)}
.eng-header-actions{display:flex;align-items:center;gap:12px}
.eng-header-cta{white-space:nowrap}

@media (max-width:1024px){
  .eng-site-nav{display:none}
}

/* =========================================================================
   HERO
   ========================================================================= */
.eng-hero{padding-block:calc(var(--section-py) * 1.1) var(--section-py)}
.eng-hero-inner{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:calc(var(--gap) * 2);
}
.eng-hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.eng-hero-copy h1{max-width:14ch}
.eng-hero-copy .eng-lead{max-width:46ch}
.eng-hero-art{position:relative}
.eng-hero-art svg{width:100%;height:auto;display:block}

@media (max-width:1024px){
  .eng-hero-inner{grid-template-columns:1fr;gap:calc(var(--gap) * 1.5)}
  .eng-hero-art{order:-1}
}

/* =========================================================================
   KARTEN
   ========================================================================= */
/* Eine Ecke bleibt scharf. Das ist der Papierschnitt — die Karte wirkt
   aufgelegt statt eingebettet, und es kostet keine Grafik. */
.eng-card{
  padding:30px 28px;
  background:var(--e-global-color-white);
  border:1px solid var(--e-global-color-border);
  border-radius:var(--radius) var(--radius) var(--radius) 0;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.eng-card:hover{
  border-color:var(--e-global-color-primary);
  transform:translateY(-3px);
  box-shadow:var(--shadow-md);
}
.eng-card h3{margin-bottom:10px}
.eng-card-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  margin-bottom:18px;
  border-radius:12px 12px 12px 0;
  background:var(--tint-primary);
  color:var(--e-global-color-primary);
}
.eng-card-icon svg{width:26px;height:26px}

/* =========================================================================
   KENNZAHLEN
   ========================================================================= */
.eng-stat{
  padding:26px 24px;
  background:var(--e-global-color-white);
  border:1px solid var(--e-global-color-border);
  border-radius:var(--radius) var(--radius) var(--radius) 0;
}
.eng-stat-value{
  display:block;
  font-size:var(--stat-size);
  font-weight:var(--stat-weight);
  line-height:var(--stat-lh);
  letter-spacing:-1px;
  color:var(--e-global-color-primary);
  margin-bottom:6px;
}

/* =========================================================================
   WARUM — dunkles Band
   ========================================================================= */
.eng-why-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:calc(var(--gap) * 2);
  align-items:start;
}
.eng-why-intro{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.eng-why-list{display:flex;flex-direction:column;gap:2px}
.eng-why-item{
  display:block;
  padding:20px 0;
  border-top:1px solid var(--tint-dark-border);
}
.eng-why-item:last-child{border-bottom:1px solid var(--tint-dark-border)}
.eng-why-item h4{margin-bottom:6px}
.eng-why .eng-eyebrow{color:var(--e-global-color-on_dark)}

@media (max-width:1024px){
  .eng-why-inner{grid-template-columns:1fr;gap:var(--gap)}
}

/* =========================================================================
   ABLAUF
   ========================================================================= */
.eng-step{
  position:relative;
  padding:28px 26px;
  background:var(--e-global-color-white);
  border:1px solid var(--e-global-color-border);
  border-radius:var(--radius) var(--radius) var(--radius) 0;
}
.eng-step-no{
  display:block;
  font-size:var(--h3-size);
  font-weight:var(--h3-weight);
  line-height:1;
  color:var(--e-global-color-primary);
  margin-bottom:14px;
}
.eng-step h4{margin-bottom:8px}

/* =========================================================================
   PERSONEN
   ========================================================================= */
.eng-person{
  background:var(--e-global-color-white);
  border:1px solid var(--e-global-color-border);
  border-radius:var(--radius) var(--radius) var(--radius) 0;
  overflow:hidden;
}
.eng-person-photo{
  display:block;
  width:100%;
  aspect-ratio:4 / 3;
  object-fit:cover;
  background:var(--e-global-color-bg_alt);
}
.eng-person-body{padding:22px 24px}
.eng-person-body h4{margin-bottom:2px}
.eng-person-role{
  display:block;
  font-size:var(--small-size);
  line-height:var(--small-lh);
  color:var(--e-global-color-primary);
}

/* =========================================================================
   STIMMEN
   ========================================================================= */
.eng-quote{
  position:relative;
  padding:30px 28px;
  background:var(--e-global-color-white);
  border:1px solid var(--e-global-color-border);
  border-radius:var(--radius) var(--radius) var(--radius) 0;
}
.eng-quote-mark{
  display:block;
  font-size:44px;
  line-height:1;
  color:var(--e-global-color-accent);
  margin-bottom:10px;
}
.eng-quote-name{
  display:block;
  margin-top:18px;
  font-size:var(--h4-size);
  font-weight:var(--h4-weight);
  color:var(--e-global-color-secondary);
}
.eng-quote-role{
  display:block;
  font-size:var(--small-size);
  line-height:var(--small-lh);
  color:var(--e-global-color-muted);
}

/* =========================================================================
   FRAGEN
   ========================================================================= */
.eng-faq-wrap{display:flex;flex-direction:column;gap:12px;max-width:840px;margin-inline:auto}
.eng-faq-wrap details{
  padding:20px 24px;
  background:var(--e-global-color-white);
  border:1px solid var(--e-global-color-border);
  border-radius:var(--radius) var(--radius) var(--radius) 0;
}
.eng-faq-wrap summary{
  cursor:pointer;
  list-style:none;
  font-size:var(--h4-size);
  font-weight:var(--h4-weight);
  color:var(--e-global-color-secondary);
}
.eng-faq-wrap summary::-webkit-details-marker{display:none}
.eng-faq-wrap summary::after{content:"+";float:right;color:var(--e-global-color-primary);font-weight:600}
.eng-faq-wrap details[open] summary::after{content:"–"}
.eng-faq-answer{margin-top:12px;color:var(--e-global-color-text)}

/* =========================================================================
   HANDLUNGSBAND
   ========================================================================= */
.eng-cta-band{background:var(--e-global-color-primary);color:var(--e-global-color-on_primary)}
.eng-cta-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:18px;
}
.eng-cta-inner h2{color:inherit;max-width:20ch}
.eng-cta-inner .eng-lead{color:inherit;opacity:.9;max-width:56ch}
.eng-cta-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}

/* =========================================================================
   FUSSZEILE
   ========================================================================= */
.eng-site-footer{
  background:var(--e-global-color-bg_dark);
  color:var(--e-global-color-on_dark);
  padding-block:calc(var(--section-py) * .7) 28px;
}
.eng-footer-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:calc(var(--gap) * 1.5);
}
.eng-footer-col{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.eng-footer-col h4{color:inherit;margin-bottom:4px}
.eng-footer-col a{color:inherit;text-decoration:none;opacity:.8;font-size:var(--small-size)}
.eng-footer-col a:hover{opacity:1;color:var(--e-global-color-on_dark);text-decoration:underline}
.eng-footer-about{max-width:38ch;color:inherit;opacity:.75}
.eng-footer-bottom{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:44px;
  padding-top:22px;
  border-top:1px solid var(--tint-dark-border);
}
.eng-footer-bottom .eng-small{color:inherit;opacity:.7}
.eng-socials{display:flex;align-items:center;gap:10px}
.eng-socials a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid var(--tint-dark-border);
  color:inherit;
}
.eng-socials a:hover{background:var(--e-global-color-on_dark);color:var(--e-global-color-secondary)}
.eng-socials svg{width:17px;height:17px}
.eng-site-footer .eng-brand-name{color:var(--e-global-color-on_dark)}
.eng-site-footer .eng-brand-mark{color:var(--e-global-color-on_dark)}

@media (max-width:1024px){
  .eng-footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  .eng-footer-grid{grid-template-columns:1fr}
}

/* =========================================================================
   THEME-BUILDER-TEILE
   Einzelansicht, Archiv und Suche. Der Inhalt kommt zur Laufzeit aus der
   Datenbank; hier steht nur, wie er aussieht.
   ========================================================================= */
.eng-post-head{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.eng-post-head h1{max-width:22ch}
.eng-post-meta{font-size:var(--small-size);color:var(--e-global-color-muted)}

/* Die ACF-Zeile. Jedes Feld trägt sein Label selbst (im `before` des Tags),
   damit ein leeres Feld sein Label mitnimmt statt es stehen zu lassen. */
.eng-post-fields{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 22px;
  padding:14px 0;
  border-top:1px solid var(--e-global-color-border);
  border-bottom:1px solid var(--e-global-color-border);
  width:100%;
}
.eng-post-field{
  font-size:var(--small-size);
  line-height:var(--small-lh);
  color:var(--e-global-color-text);
}
.eng-post-field::before{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  margin-right:9px;
  border-radius:2px 2px 2px 0;
  background:var(--e-global-color-accent);
  vertical-align:middle;
}

.eng-post-media{margin-block:calc(var(--gap) * 1.5)}
.eng-post-media img{
  width:100%;
  border-radius:var(--radius) var(--radius) var(--radius) 0;
  border:1px solid var(--e-global-color-border);
}
.eng-post-body{max-width:70ch}
.eng-post-body p{margin-bottom:1.1em}
.eng-post-body p:last-child{margin-bottom:0}

/* Galerie: die Klassen unten gehören WordPress' [gallery]-Shortcode, nicht
   uns. Ohne ACF Pro gibt es kein Gallery-Feld und damit kein Dynamic Tag —
   die Bilder hängen am Beitrag und der Core-Shortcode gibt sie aus. */
.eng-post-gallery{margin-top:calc(var(--gap) * 2)}
.eng-post-gallery .gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--gap);
  margin:0;
}
.eng-post-gallery .gallery-item{margin:0;width:auto !important}
.eng-post-gallery .gallery-icon img{
  width:100%;
  aspect-ratio:4 / 3;
  object-fit:cover;
  border:1px solid var(--e-global-color-border);
  border-radius:var(--radius) var(--radius) var(--radius) 0;
  transition:transform .2s ease;
}
.eng-post-gallery .gallery-icon img:hover{transform:scale(1.02)}
.eng-post-gallery .gallery-caption{
  font-size:var(--small-size);
  color:var(--e-global-color-muted);
  margin-top:6px;
}
@media (max-width:767px){
  .eng-post-gallery .gallery{grid-template-columns:repeat(2,1fr)}
}

.eng-post-nav{margin-top:calc(var(--gap) * 2);padding-top:22px;border-top:1px solid var(--e-global-color-border)}
.eng-post-list{margin-top:var(--gap)}
.eng-search-bar{width:100%;max-width:520px}

/* =========================================================================
   FORMULAR-RÜCKMELDUNGEN
   Elementors eigene Klassen — sie werden nicht mit eng- versehen. Ohne diese
   Regeln erscheint die Bestätigung des Kontaktformulars in Elementors
   Standardgrün, das neben dem Teal wie ein Fremdkörper sitzt.
   ========================================================================= */
.elementor-message{
  font-size:var(--small-size);
  line-height:var(--small-lh);
  padding:12px 16px;
  margin-top:12px;
  border-radius:10px 10px 10px 0;
  border:1px solid currentColor;
}
.elementor-message-success{
  color:var(--e-global-color-success);
  background:color-mix(in srgb, var(--e-global-color-success) 8%, transparent);
}
.elementor-message-danger,
.elementor-message.elementor-error{
  color:var(--e-global-color-danger);
  background:color-mix(in srgb, var(--e-global-color-danger) 8%, transparent);
}
.elementor-field-group .elementor-field{
  border:1px solid var(--e-global-color-border);
  border-radius:10px;
  background:var(--e-global-color-white);
  color:var(--e-global-color-text);
  font-family:inherit;
  font-size:var(--body-size);
  padding:12px 14px;
}
.elementor-field-group .elementor-field:focus{
  border-color:var(--e-global-color-primary);
  outline:none;
}

/* =========================================================================
   BEWEGUNG
   ========================================================================= */
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
  .eng-btn:hover,.eng-card:hover{transform:none}
}


/* Layout tokenlari — preset JSON'dan uretildi */
:root{
  --container:1200px;
  --gutter:24px;
  --gap:24px;
  --section-py:96px;
  --radius:14px;
  --btn-radius:999px;
  --btn-px:26px;
  --btn-py:13px;
}
@media (max-width:1024px){
  :root{ --section-py:72px; }
}
@media (max-width:767px){
  :root{ --section-py:56px; --gutter:20px; }
}

/* ===================================================================
   ELEMENTOR UYUM KATMANI  (tools/build_preset_css.py tarafindan uretildi)

   Elementor her container'a kendi varsayilanlarini basar:
     --width:100%  ·  10px dolgu  ·  --widgets-spacing  ·  flex-wrap:wrap
   Bunlar motorun satirlarini sisirir ve son ogeyi alt satira atar.
   Asagidaki blok yalnizca motorun kendi sarmalayicilarinda o varsayilanlari
   geri alir; izgara (grid) siniflari ve Elementor'un kendi widget'lari
   etkilenmez.
   =================================================================== */

.eng-header-inner,
.eng-header-actions,
.eng-btn-row,
.eng-cta-actions,
.eng-post-fields,
.eng-hero-copy,
.eng-hero-art,
.eng-why-list,
.eng-why-intro,
.eng-section-head,
.eng-stats-grid,
.eng-process-grid,
.eng-team-grid,
.eng-quote-grid,
.eng-footer-grid,
.eng-footer-col,
.eng-faq-wrap{
  --padding-block-start:0px; --padding-block-end:0px;
  --padding-inline-start:0px; --padding-inline-end:0px;
  --widgets-spacing:0px; --widgets-spacing-row:0px;
}

.eng-header-inner,
.eng-header-actions,
.eng-btn-row,
.eng-cta-actions,
.eng-post-fields,
.eng-hero-copy,
.eng-hero-art,
.eng-why-list,
.eng-why-intro,
.eng-section-head,
.eng-stats-grid,
.eng-process-grid,
.eng-team-grid,
.eng-quote-grid,
.eng-footer-grid,
.eng-footer-col,
.eng-faq-wrap > .elementor-widget{
  margin-block-end:0;
}

.eng-header-inner,
.eng-header-actions,
.eng-btn-row,
.eng-cta-actions,
.eng-post-fields > *{
  --width:auto;
  width:auto;
  flex:0 0 auto;
}

/* html widget'i satir icinde blok gibi davranmasin */
.eng-header-inner,
.eng-header-actions,
.eng-btn-row,
.eng-cta-actions,
.eng-post-fields > .elementor-widget-html{
  display:inline-flex;
  align-items:center;
}

/* Bolum kabuklari tam genislik kalir; ic genisligi .eng-container verir. */
.eng-site-header,
.eng-site-footer,
.eng-section{
  --width:100%;
  --content-width:100%;
}

/* Satir container'i olan sarmalayicilar Elementor'dan --width:auto miras
   alabiliyor (header-inner'da gozlendi: 717px, beklenen 1245px). Container
   sarmalayicisi her zaman tam genislik alir; ust siniri .eng-container'in
   kendi max-width kurali belirler. */
.eng-container{
  --width:100%;
  width:100%;
}/* End custom CSS */