.elementor-kit-2037{--e-global-color-primary:#BECF00;--e-global-color-secondary:#412817;--e-global-color-text:#444444;--e-global-color-accent:#FFFFFF;--e-global-color-1e5c527:#FFFFFF;--e-global-color-1f0bf95:#F9FAFB;--e-global-color-c60e129:#DDDDDD;--e-global-color-1578956:#000000;--e-global-color-8b5d051:#FFFFFF00;--e-global-typography-primary-font-family:"Lato";--e-global-typography-primary-font-size:40px;--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Lato";--e-global-typography-secondary-font-size:30px;--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"Lato";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.2em;--e-global-typography-accent-font-family:"Lato";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:700;--e-global-typography-344c5db-font-family:"Lato";--e-global-typography-344c5db-font-size:19px;--e-global-typography-344c5db-font-weight:700;--e-global-typography-4c61dca-font-family:"Lato";--e-global-typography-4c61dca-font-size:28px;--e-global-typography-4c61dca-font-weight:bold;--e-global-typography-5dd5f63-font-family:"Lato";--e-global-typography-5dd5f63-font-size:14px;--e-global-typography-5dd5f63-font-weight:700;}.elementor-kit-2037 button,.elementor-kit-2037 input[type="button"],.elementor-kit-2037 input[type="submit"],.elementor-kit-2037 .elementor-button{background-color:var( --e-global-color-accent );color:var( --e-global-color-primary );border-radius:8px 8px 8px 8px;padding:12px 22px 12px 22px;}.elementor-kit-2037 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){margin-block-end:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}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:1366px){.elementor-kit-2037{--e-global-typography-secondary-font-size:28px;--e-global-typography-344c5db-font-size:19px;--e-global-typography-4c61dca-font-size:26px;}}@media(max-width:1200px){.elementor-kit-2037{--e-global-typography-primary-font-size:32px;--e-global-typography-secondary-font-size:26px;--e-global-typography-accent-font-size:14px;--e-global-typography-344c5db-font-size:16px;--e-global-typography-4c61dca-font-size:24px;}}@media(max-width:1024px){.elementor-kit-2037{--e-global-typography-5dd5f63-font-size:14px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-2037{--e-global-typography-primary-font-size:28px;--e-global-typography-secondary-font-size:21px;--e-global-typography-text-font-size:16px;--e-global-typography-accent-font-size:14px;--e-global-typography-344c5db-font-size:15px;--e-global-typography-4c61dca-font-size:20px;--e-global-typography-5dd5f63-font-size:13px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ===== EGGEHAUS Kontaktformular (von Claude eingefügt) ===== */
/* Quelle: Formular/kontaktformular.css + Formular/kontakt-section.css */

/*
 * EGGEHAUS — Kontaktformular
 * Styling für das per Universal Data Collector ausgegebene Formular.
 *
 * Nötig, weil Contact Form 7 selbst NICHT installiert ist: Das Plugin setzt zwar
 * die wpcf7-Klassen, das zugehörige Stylesheet existiert hier aber nicht.
 * Ohne diese Datei wären die Felder unformatiert.
 *
 * Einbau: Elementor → Website-Einstellungen → Benutzerdefiniertes CSS
 * (oder in die Standard-Styles übernehmen).
 * Nutzt ausschließlich die vorhandenen Tokens aus Standard-Styles/styles.css.
 *
 * @author Dario | ewtos.com
 */

.eh-form { text-align: left; }

.eh-form-row { margin-bottom: 1.25rem; }
.eh-form-row:last-child { margin-bottom: 0; }

.eh-form-row--split {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

/* Der Plugin-Wrapper soll keine eigenen Abstände einbringen */
.eh-form .wpcf7,
.eh-form .wpcf7-form { margin: 0; padding: 0; }

.eh-form .wpcf7-form-control-wrap { display: block; width: 100%; }

/* --- Felder --- */
.eh-form input[type="text"],
.eh-form input[type="email"],
.eh-form input[type="tel"],
.eh-form textarea {
    width: 100%;
    padding: 12px 16px;
    font: inherit;
    color: var(--eh-text-dark);
    background-color: var(--eh-white);
    border: 1px solid #d1d5db;
    border-radius: var(--eh-border-radius);
    transition: var(--eh-transition);
    -webkit-appearance: none;
    appearance: none;
    /* Explizit, nicht geerbt: styles.css setzt border-box nur innerhalb
       von .eh-global-wrapper. Ohne diese Zeile ragen die Felder um
       Innenabstand + Rahmen aus der Karte heraus, sobald das Formular
       außerhalb des Wrappers steht. */
    box-sizing: border-box;
}

.eh-form textarea { resize: vertical; min-height: 140px; }

.eh-form input::placeholder,
.eh-form textarea::placeholder { color: var(--eh-text-muted); opacity: 1; }

.eh-form input:focus,
.eh-form textarea:focus {
    outline: none;
    border-color: var(--eh-green);
    box-shadow: 0 0 0 3px rgba(190, 207, 0, 0.25);
}

/* Sichtbarer Fokus auch für Tastaturbedienung */
.eh-form a:focus-visible,
.eh-form input:focus-visible,
.eh-form textarea:focus-visible { outline: 2px solid var(--eh-green); outline-offset: 2px; }

/* --- Datenschutz-Checkbox --- */
.eh-form-consent .wpcf7-acceptance label {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: var(--eh-text-body);
    cursor: pointer;
}

.eh-form-consent input[type="checkbox"] {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-top: 2px;
    accent-color: var(--eh-green);
    cursor: pointer;
}

.eh-form-consent a { color: var(--eh-text-dark); text-decoration: underline; }
.eh-form-consent a:hover { color: var(--eh-green); }

/* --- Absenden --- */
.eh-form-actions { margin-top: 1.75rem; }

/* eh-btn setzt margin-top:auto für Karten-Layouts, hier unerwünscht */
.eh-form input[type="submit"] { margin-top: 0; width: auto; }

.eh-form input[type="submit"]:disabled { opacity: 0.6; cursor: not-allowed; }

/* --- Meldungen des Plugins --- */
.eh-form .udc-message,
.eh-form .wpcf7-response-output {
    margin: 1.25rem 0 0;
    padding: 12px 16px;
    border-radius: var(--eh-border-radius);
    border: 1px solid #d1d5db;
    background-color: var(--eh-bg-light);
    color: var(--eh-text-dark);
}

/* Honeypot des Plugins zuverlässig verstecken – ohne display:none,
   damit Bots das Feld nicht am fehlenden Rendering erkennen */
.eh-form .udc-honeypot,
.eh-form input[name*="honeypot"] {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

@media (max-width: 600px) {
    .eh-form-row { margin-bottom: 1rem; }
    .eh-form input[type="submit"] { width: 100%; }
}


/*
 * Ergänzendes Layout für die Kontakt-Section mit Formular.
 * Baut auf eh-grid-2 auf; nur was zusätzlich gebraucht wird.
 */

/* Formular etwas breiter als die Info-Spalte */
@media (min-width: 900px) {
    .eh-contact-split { grid-template-columns: 3fr 2fr; align-items: start; }
}

.eh-contact-aside { display: flex; flex-direction: column; gap: 2rem; }

/* .eh-card bringt height:100% mit - im zweispaltigen Kontaktbereich
   streckt sich die Formularkarte dadurch auf die Höhe der Infospalte
   und hinterlässt eine große leere Fläche unter dem Button. */
.eh-contact-split > .eh-card,
.eh-contact-aside .eh-card { height: auto; }

/* Der Anruf-Button steht als Block unter den Nummern */
.eh-btn-call { display: block; margin-top: 1rem; }

/* Die Hover-Anhebung der Cards wirkt beim Formular unruhig */
.eh-contact-split .eh-card:hover { transform: none; box-shadow: var(--eh-shadow-sm); }


/* Formularbreite in der eigenen Formular-Section */
.eh-form-section .eh-form { max-width: 720px; margin: 0 auto; }
.eh-form-head { padding-bottom: 0.5rem; }
.eh-form-section { padding-top: 0.5rem; }

/* ===== EGGEHAUS Galerie-Grid (von Claude eingefügt) ===== */
/* Quelle: Galerie/galerie-grid.css */

/*
 * EGGEHAUS — Galerie-Grid für die Neubauten-Seite
 *
 * Hintergrund: Die Klassen .eh-gallery-grid und .eh-gallery-item waren in der
 * gesamten Installation NICHT definiert — weder in Standard-Styles/styles.css,
 * noch im Kit, noch inline auf der Seite. Die Kacheln stapelten sich dadurch
 * einspaltig in der jeweiligen Originalbreite des Bildes. Das war schon vor der
 * Erweiterung so, fiel bei vier Bildern nur weniger auf als bei acht.
 *
 * Bewusst auf .eh-gallery-grid gescopet: Die Thoma-Häuser-Seite nutzt zwar
 * ebenfalls .eh-gallery-item, aber ohne diesen Grid-Container und mit eigenen
 * Regeln (aspect-ratio 3/2). Die bleibt damit unberührt.
 *
 * @author Dario | ewtos.com
 */

.eh-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

/* Einheitliche Kachelhöhe trotz gemischter Formate. Von 310 Kundenbildern sind
   282 hochkant, ohne festes Verhältnis würde das Raster völlig zerfallen. */
.eh-gallery-grid .eh-gallery-item {
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    border-radius: var(--eh-border-radius);
    box-shadow: var(--eh-shadow-sm);
    text-decoration: none;
}

.eh-gallery-grid .eh-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: var(--eh-transition);
}

.eh-gallery-grid .eh-gallery-item:hover img { transform: scale(1.04); }

/* Hover-Text kommt aus dem title-Attribut, gleiches Prinzip wie auf der
   Referenzen-Seite. alt bleibt dem SEO-Text vorbehalten. */
.eh-gallery-grid .eh-gallery-item::after {
    content: attr(title);
    position: absolute;
    inset: auto 0 0 0;
    padding: 0.75rem 1rem;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0));
    color: #fff;
    font-size: 0.9375rem;
    line-height: 1.35;
    opacity: 0;
    transition: var(--eh-transition);
}

.eh-gallery-grid .eh-gallery-item:hover::after,
.eh-gallery-grid .eh-gallery-item:focus-visible::after { opacity: 1; }

.eh-gallery-grid .eh-gallery-item:focus-visible {
    outline: 2px solid var(--eh-green);
    outline-offset: 3px;
}

@media (max-width: 600px) {
    .eh-gallery-grid { grid-template-columns: 1fr; gap: 1rem; }
}/* End custom CSS */