/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/


/* 1. HEADER ALS CONTAINER FÜR DEN SLIDER – AUF 1920×1000 AUSGERICHTET */
.wd-page-wrapper header {
    position: relative;

    /* Höhe an die Fensterbreite koppeln:
       - 1920px Breite → ~1000px Höhe
       - kleiner → proportional weniger
       - aber nie kleiner als 400px und nie größer als 1000px
    */
    height: clamp(400px, calc(100vw * 1000 / 1920), 1000px);

    background-color: transparent !important;
    overflow: visible; /* wichtig für Menüs */

    /* Neuer Abstand unter dem Header */
    margin-bottom: 60px !important;
}

/* 2. SLIDER HINTEN ALS „BACKGROUND“ */
.header-bg-slider {
    position: absolute;
    inset: 0;          /* top:0; right:0; bottom:0; left:0 */
    z-index: 0;        /* liegt hinter allem anderen im Header */
    pointer-events: none;
    overflow: hidden;
}

/* Slider füllt die komplette Headerfläche (Breite + Höhe vom Header) */
.header-bg-slider .rev_slider_wrapper,
.header-bg-slider .rev_slider,
.header-bg-slider sr7-module,
.header-bg-slider sr7-content {
    width: 100% !important;
    height: 100% !important;  /* wieder 100%, damit er nicht 0px hoch ist */
}

/* 3. MENÜ- UND HEADER-EBENEN */

/* Menüleiste unten: voll weiß */
.whb-header-bottom {
    background: #ffffff !important;
}

/* Mobile-Header-Bereiche (sicherheitshalber) */
.whb-header .whb-mobile-left,
.whb-header .whb-mobile-center,
.whb-header .whb-mobile-right {
    background: #ffffff !important;
}

/* Logo-/Button-Zeile halbtransparent */
.whb-row.whb-general-header.whb-flex-flex-middle {
    background: rgba(255,255,255,0.83) !important;
}

/* Menüzeile halbtransparent */
.whb-row.whb-header-bottom.whb-flex-flex-middle {
    background: rgba(255,255,255,0.83) !important;
}


/* Timeline col primary */
.wd-timeline .wd-timeline-item .timeline-col-primary{
 background-color:#f7f7f7;
}

/* Timeline col secondary */
.wd-timeline .wd-timeline-item .timeline-col-secondary{
 background-color:#f7f7f7;
}

html {
  scroll-behavior: smooth;
}

#wasserschaeden {
  scroll-margin-top: 120px; /* Höhe anpassen */
}
#bautrocknung {
  scroll-margin-top: 120px; /* Höhe anpassen */
}
#schimmelpraevention {
  scroll-margin-top: 120px; /* Höhe anpassen */
}
#geraetevermietung {
  scroll-margin-top: 120px; /* Höhe anpassen */
}
#estrichtrocknung {
  scroll-margin-top: 120px; /* Höhe anpassen */
}
#feuchtigkeitsmessungen {
  scroll-margin-top: 120px; /* Höhe anpassen */
}
#leckortung {
  scroll-margin-top: 120px; /* Höhe anpassen */
}
#kellerentfeuchtung {
  scroll-margin-top: 120px; /* Höhe anpassen */
}

/* 1. BASIS (Hauptbox) */
.wd-price-table {
    background-color: #ffffff !important; 
    position: relative !important;        
    z-index: 20 !important;               

    /* --- DEINE RUNDUNGEN --- */
    border-top-left-radius: 110px;
    border-top-right-radius: 110px;
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;

    /* --- SCHWARZER SCHATTEN --- */
    box-shadow: 0 0 40px 5px rgba(0,0,0,0.15) !important;
    
    /* WICHTIG: Das erlaubt dem oberen Schatten, aus der Box "auszubrechen" */
    overflow: visible !important; 
}

/* Plan */
.wd-plan{
    position: relative !important;        
    background-color: #ffffff !important;

    /* --- RUNDUNGEN --- */
    border-top-left-radius: 110px;
    border-top-right-radius: 110px;
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
	
	/* --- Weiß SCHATTEN --- */
 	box-shadow:0px 0px 40px 5px #ffffff !important;

    /* WICHTIG: Das erlaubt dem oberen Schatten, aus der Box "auszubrechen" */
    overflow: visible !important; 
}


/* Rahmen & Rundung für die gesamte Zeile (Row) */
.wd-rs-692a7ab0df01e {
    /* 1. Runde Ecken erzwingen */
    border-radius: 30px !important;
    
    /* 2. Alles abschneiden, was eckig übersteht (Hintergründe, Schatten) */
    overflow: hidden !important;
    
    /* 3. Der Rahmen */
    border: 2px solid #e1e1e1 !important;
    
    /* 4. Hintergrund weiß (falls die Zeile transparent ist) */
    background-color: #ffffff !important;
    
    /* 5. Ein schöner runder Schatten für die gesamte Box */
    box-shadow: 0 0 40px 5px rgba(0,0,0,0.1) !important;
    
    /* Optional: Innenabstand, damit der Inhalt nicht am Rand klebt */
    padding: 20px !important;
}

/* Wrapper */
.wpb-content-wrapper .wpb_wrapper .wpb_wrapper .wpb_wrapper{
 padding-left:20px;
 padding-right:20px;
 padding-top:40px;
 padding-bottom:40px;
 background-color:#ffffff;
 border-top-left-radius:20px;
 border-top-right-radius:20px;
 border-bottom-left-radius:20px;
 border-bottom-right-radius:20px;
 box-shadow:0px 0px 9px 0px #e8e8e8;
 transform:translatex(0px) translatey(0px);
}

/* Wrapper */
#impressumkontakt .wpb_wrapper{
 box-shadow:0px 0px 9px 0px #ffffff;
 padding-top:0px;
 padding-bottom:0px;
}

/* Datenschutz Kontakt-Kästchen in dieser Row stylen */
.vc_row.wpb_row.vc_row-fluid .wpb_column .wpb_text_column .wpb_wrapper {
  padding: 40px 20px;
  background-color: #ffffff;
  border-radius: 20px;
  box-shadow: 0px 0px 9px 0px #e8e8e8;
  transform: translateX(0px) translateY(0px);
}