/*
 Theme Name:   Idee + concept Theme
 Template:     yootheme
 Author:       Idee + concept
 Description:  
 Version:      4.5.24
 Text Domain:  yootheme-mytheme
*/
/* {} */









/* ==========================================================================
   1. GLOBAL & FONTS
   ========================================================================== */


body {
    border: 15px solid #f7f7f7 !important;
}

.uk-link-text {
    font-size: 1.2rem;
    letter-spacing: 2px;
    font-weight: 600;
}

/* ==========================================================================
   2. HEADER & NAVIGATION (Standard & Sticky)
   ========================================================================== */
/* Allgemeiner Header & Container */
header .uk-sticky { transition: all .3s; }

.uk-navbar-container .uk-container {
    background: #f7f7f7 !important; 
    padding-top: 5px; 
    padding-bottom: 5px; 
    backdrop-filter: blur(5px); 
}

/* Logo-Skalierung im Sticky-Modus */
header .uk-sticky-fixed .uk-logo img { width: 165px; transition: all .3s; }
header .uk-sticky-fixed.uk-sticky-below .uk-logo img { width: 80px; }

/* Sticky-Klassen */
.uk-sticky-below .uk-navbar { margin-top: -20px; }
.uk-sticky-below .uk-navbar-container .uk-container { height: 60px; }

.uk-navbar-sticky {
    background: #f7f7f7 !important;
    padding: 10px 0px 0px 0px; 
    transition: all .3s;
}

/* Mobile Header */
.tm-header-mobile .uk-navbar-container .uk-container { background: #f7f7f7 !important; }

/* Hamburger Menu / Toggle Icon */
.uk-navbar-toggle { z-index: 999; }
.uk-navbar-toggle-icon {        
    background: #D6D698 !important;
    border: 1px solid #D6D698 !important;
    padding: 15px !important;
    transition: all .5s ease-in;
}
.uk-navbar-toggle-icon:hover svg { width: 25px; } 
.uk-navbar-toggle-icon svg { transition: all .3s; color: #435d4a !important; }
.uk-navbar-toggle-icon svg > .line-3 { opacity: 1 !important; }

/* Mobile Dialog / Fullscreen Menu */
#tm-dialog-mobile { height: 100vh; }
#tm-dialog-mobile li a { font-size: 1.5rem !important; }

/* ==========================================================================
   3. FARBEN & SEKTIONEN
   ========================================================================== */
.uk-beige { background: #E6DFD6 !important; }
.uk-red { background-color: #BC7D5B !important; }
.uk-beige-dark { background: #D2C2AE !important; }
.uk-blau { background-color: #CADBDA !important; }
.uk-dunkelblau { background-color: #91B0AF !important; }
.uk-grün { background-color: #E3E2D7 !important; }
.uk-hellgrün { background-color: #D6EAD8 !important; }
.uk-light { color: white !important; }

/* Highlight-Boxen (Green/White) */
.green-box { background: #D6D698; line-height: 1.2 !important; padding: 0px 10px; }
.highlight-green span { color: white !important; }

.white-box { background: white !important; line-height: 1.2 !important; padding: 0px 10px; }
.highlight-white span { color: #D6D698 !important; }

.highlight-box {
    background-color: #ffffff !important;
    padding: 10px 15px !important;
    display: inline-block !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
}

/* ==========================================================================
   4. TYPOGRAFIE (STROKE TEXT)
   ========================================================================== */
.stroke, .stroke_black, .stroke_grün, .stroke_red, .stroke_blau {
    letter-spacing: 0.2rem;
    font-weight: 600;
    color: transparent;
    font-family: 'Poppins', sans-serif;
    -webkit-text-stroke-width: 2px;
}

.stroke { font-size: 6.5rem; -webkit-text-stroke-color: white; }
.stroke_black { font-size: 80px; -webkit-text-stroke-color: #515151; }
.stroke_grün { font-size: 80px; -webkit-text-stroke-color: #97937A; }
.stroke_red { font-size: 6.5rem; -webkit-text-stroke-color: #BC7D5B; }
.stroke_blau { font-size: 6.5rem; -webkit-text-stroke-color: #91B0AF; }

.eckigerpunkt {
    letter-spacing: 0.2rem;
    font-size: 6.5rem;
    font-weight: 200;
    color: transparent;
    -webkit-text-stroke: 0.5px #515151;
}

/* ==========================================================================
   5. KARTEN, PANELS & HOVER-EFFEKTE
   ========================================================================== */
/* Clip-Paths */
.uk-card-base { 
    clip-path: polygon(0 0, calc(100% - 50px) 0, 100% 100px, 100% 100%, 0 100%); 
    transition: all .3s ease-in-out; 
}
.uk-card-base-bottom { 
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 100px), calc(100% - 50px) 100%, 0 100%); 
    transition: all .3s ease-in-out; 
}
.card-small { clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 80px, 100% 100%, 0 100%); }

/* Kontakt-Panel Hover */
.kontakt-panel { transition: all .3s; }
.kontakt-panel.uk-card-base:hover { clip-path: polygon(0 0, calc(100% - 100px) 0, 100% 50px, 100% 100%, 0 100%) !important; }
.kontakt-panel:hover { transform: scale(1.02) !important; }

/* Home-Boxen Animationen */
.home-box-unterseiten { transition: all .3s; }
.home-box-unterseiten:hover { transform: scale(1.02) !important; }
.home-box-unterseiten .uk-overlay { transition: all .3s; }
.home-box-unterseiten:hover .uk-overlay { transform: translateY(-20px) !important; cursor: pointer; }

.home-box-unterseiten-green .el-image { transition: all .3s; }
.home-box-unterseiten-green:hover .el-image { transform: rotate(45deg); }
.home-box-unterseiten-green .el-title { transition: all .3s !important; }
.home-box-unterseiten-green:hover .el-title { transform: translateY(-20px) !important; cursor: pointer; }

/* Panel Höhen */
.quartier-panel-3 .uk-card-secondary { height: 700px; display: flex; flex-direction: column; justify-content: flex-end; }
.quartier-panel-2 .uk-card-primary { height: 490px; display: flex; flex-direction: column; justify-content: flex-end; }
.quartier-panel-1 .uk-card-default { height: 680px; display: flex; flex-direction: column; justify-content: flex-end; }

/* Hero Panel */
.hero-panel { background: #d9d99fde !important; }
.hero-panel .uk-card { background-color: rgb(79 102 82 / 76%); backdrop-filter: blur(3px); }

/* ==========================================================================
   6. ICONS, BUTTONS & FORMULARE
   ========================================================================== */
.contact-icons .el-item span svg { color: white; width: 30px; margin-right: 20px; transition: all .3s; }
.contact-icons .el-item span:hover svg { transform: rotate(10deg); }
.contact-icons a.el-content { display: flex; }

.feature-icon {
    background: white;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    padding: 51px;
    border-radius: 100%;
    height: 200px; width: 200px;
}

.expose-button { position: fixed; right: -120px; transform: rotate(-90deg); }
.expose-button .uk-button { color: #4F6652; border-radius: 20px 20px 0px 0px !important; transition: all .3s; }
.expose-button .uk-button:hover { background-color: #f7f7f7; }

/* Formular Styles */
.uk-input, .uk-select, .uk-textarea { border: 1px solid #7f8a64 !important; }
.uk-input, .uk-select { padding: 0px 22px !important; height: 40px !important; }
.uk-textarea { padding: 10px 22px !important; min-width: 100%; min-height: 220px !important; }

.uk-form-label { font-size: 12px !important; font-weight: 600 !important; letter-spacing: 2px !important; }
span.uk-form-icon { background-color: #7f8a64 !important; margin-right: 8px; margin-top: 5px; width: 30px; height: 30px; transition: all .3s; }
.uk-form-controls:hover span.uk-form-icon { width: 36px; }

#formular .uk-button { background: #7f8a64; color: white; }
#formular .uk-button:hover { background: transparent; border: 1px solid #7f8a64 !important; color: #4F6652; }


/* ==========================================================================
   6. EXTERNE TOOLS / GRUNDRISS-STYLES (IREP)
   ========================================================================== */
.irep-flat-preview__right { padding: 60px !important; }
.irep-flat-modal-price-container { background-color: #7f8a64 !important; }
.irep-flat-preview__right .\!ire-text-2xl { font-size: .8rem !important; }

/* Filter & Tabellen (IREP) */
.irep-flats-list-filters select { padding: 15px 30px; border-radius: 0px; border: 1px solid #7f8a64!important; }
.irep-flats-list-filters .flat-preview-button {
    background: #7f8a64; font-family: 'Cabin'; text-transform: uppercase; font-weight: 700; letter-spacing: 2px;
    padding: 10px 30px; border: 2px solid #7f8a64; width: 100% !important; border-radius: 0px;
}

/* Tabellen-Anpassung (ca. Prefix) */
.irep-flats-list__table tr td:nth-child(3):before { content: 'ca.'; margin-right: 10px; }
.irep-flats-list__table tr td:nth-child(3) { display: flex; }

.irep-flats-list-filters > div {padding: 0px 20px 20px 0px;}
.irep-flats-list-filters > div:nth-child(5) {
    display: none !important;
}
.irep-flats-table {margin-top: 50px;}


/* ==========================================================================
   7. MODALS & UTILITIES
   ========================================================================== */
.uk-modal-dialog {
    height: 30vh !important;
    margin-top: 200px !important;
    width: 1480px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    border-radius: 0px !important; 
    z-index: 900;
}
.uk-modal-body { min-height: 30vh !important; }

.shadow { box-shadow: 0 14px 25px rgba(0, 0, 0, .16); }
.uk-background-fixed { background-attachment: fixed !important; }
.border-top { border-top: 20px solid #f7f7f7 !important; }




.sticky-download-desktop {
    position: absolute;
    bottom: -45vh;
    transform: rotate(-90deg);
    right: -193px;
}

.sticky-download-desktop .uk-button, .sticky-download-desktop .uk-light .uk-button {
	
	padding-bottom: 20px;
	padding-top: 10px;
    border-radius: 20px 20px 0px 0px;
    background-color: #f7f7f7 !important;
    color: #7f8a64 !important;
    border: transparent !important;
    z-index: 999;
    box-shadow: 5px -20px 20px 0 rgb(0 0 0 / 4%);
}


.sticky-download-desktop .uk-icon {
    content: url(../../wp-content/uploads/2026/02/booklet1.svg) !important;
    transition: all .3s;
    margin-left: 20px !important;
   }



.contact-icons .uk-icon svg {color: #435d4a !important;}

.uk-button-text:hover:not(:disabled)::before {display: none !important;}
.anfordern-link {color: #7f8a64 !important;}


.anfordern-link {display: flex; flex-direction: column-reverse;}
.anfordern-link:before {content: ''; height: 2px; width: 10%; background: #7f8a64; opacity: 0; display: block; transition: all .3s;}
.anfordern-link:hover:before {content: ''; height: 2px; width: 100%; background: #7f8a64; opacity: 1;}

/* ==========================================================================
   8. MEDIA QUERIES
   ========================================================================== */
@media (max-width: 960px) {
    .mobile-section-prb, .mobile-section-prb .uk-section { padding-bottom: 20px !important; }
    .mobile-section-prt, .mobile-section-prt .uk-section { padding-top: 20px !important; }
    .uk-button { padding: 0px 20px !important; }
     .uk-h3, .uk-h4, .uk-heading-small, .uk-heading-medium, .uk-heading-large {hyphens: auto;}
}

@media (min-width: 1800px) {
    .uk-navbar-container { padding-top: 0px !important; }
}
