/* Custom Styles */
:root {
    /* Fonts */
  /*  --font-inria: "Inria Serif", serif;
    --font-montserrat: "Montserrat", sans-serif;*/

    /* Colors */
    --black: #000000;
    --white: #ffffff;
    --brand-red: #e32b13;
    --gray-text: #555;
    --light-gray: #f2f2f2;
    --heading-brown: #715E33;
    --heading-brown-light: #6E5C32;

    /* Spacing */
    --spacing-container: clamp(1.5rem, 5vw, 6rem);
}

@font-face {
    font-family: 'Afterglow';
    src: url('../fonts/AfterglowRegular.eot');
    src: url('../fonts/AfterglowRegular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/AfterglowRegular.woff2') format('woff2'),
        url('../fonts/AfterglowRegular.woff') format('woff'),
        url('../fonts/AfterglowRegular.ttf') format('truetype'),
        url('../fonts/AfterglowRegular.svg#AfterglowRegular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Baskerville';
    src: url('../fonts/Baskerville.eot');
    src: url('../fonts/Baskerville.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Baskerville.woff2') format('woff2'),
        url('../fonts/Baskerville.woff') format('woff'),
        url('../fonts/Baskerville.ttf') format('truetype'),
        url('../fonts/Baskerville.svg#Baskerville') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Baskerville';
    src: url('../fonts/Baskerville-Bold.eot');
    src: url('../fonts/Baskerville-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Baskerville-Bold.woff2') format('woff2'),
        url('../fonts/Baskerville-Bold.woff') format('woff'),
        url('../fonts/Baskerville-Bold.ttf') format('truetype'),
        url('../fonts/Baskerville-Bold.svg#Baskerville-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Baskerville';
    src: url('../fonts/Baskerville-Italic.eot');
    src: url('../fonts/Baskerville-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Baskerville-Italic.woff2') format('woff2'),
        url('../fonts/Baskerville-Italic.woff') format('woff'),
        url('../fonts/Baskerville-Italic.ttf') format('truetype'),
        url('../fonts/Baskerville-Italic.svg#Baskerville-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Baskerville';
    src: url('../fonts/Baskerville-BoldItalic.eot');
    src: url('../fonts/Baskerville-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Baskerville-BoldItalic.woff2') format('woff2'),
        url('../fonts/Baskerville-BoldItalic.woff') format('woff'),
        url('../fonts/Baskerville-BoldItalic.ttf') format('truetype'),
        url('../fonts/Baskerville-BoldItalic.svg#Baskerville-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Baskerville';
    src: url('../fonts/Baskerville-SemiBold.eot');
    src: url('../fonts/Baskerville-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Baskerville-SemiBold.woff2') format('woff2'),
        url('../fonts/Baskerville-SemiBold.woff') format('woff'),
        url('../fonts/Baskerville-SemiBold.ttf') format('truetype'),
        url('../fonts/Baskerville-SemiBold.svg#Baskerville-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Baskerville';
    src: url('../fonts/Baskerville-SemiBoldItalic.eot');
    src: url('../fonts/Baskerville-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Baskerville-SemiBoldItalic.woff2') format('woff2'),
        url('../fonts/Baskerville-SemiBoldItalic.woff') format('woff'),
        url('../fonts/Baskerville-SemiBoldItalic.ttf') format('truetype'),
        url('../fonts/Baskerville-SemiBoldItalic.svg#Baskerville-SemiBoldItalic') format('svg');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}


.container, .container-lg, .container-md, .container-sm, .container-xl {
/*         max-width: 1200px; */
        max-width: 1500px;
    }

main {
    overflow: hidden;
}


body {    
     font-family: 'Baskerville';
     color: var(--black);
    padding-top: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--black);
    font-family: 'Afterglow';
    font-weight: 300;
    /* Adding the common font-weight from the design */
}

h1 {
    font-size: clamp(2.5rem, 5vw + 1rem, 4.5rem);
}

h2 {
    font-size: clamp(2rem, 4vw + 1rem, 3.5rem);
    text-transform: initial;
}

h3 {
    font-size: clamp(1.75rem, 3vw + 1rem, 3rem);
}

h4 {
    font-size: clamp(1.5rem, 2vw + 1rem, 2.5rem);
}

h5 {
    font-size: clamp(1.25rem, 1vw + 1rem, 2rem);
}

h6 {
    font-size: clamp(1rem, 0.5vw + 1rem, 1.5rem);
}

p {
    font-size: 1rem;
}
.apartment-table tbody tr:hover{
    background: #fff;
    /* color: red; */
    cursor: pointer;
}   
/* Header & Navigation */
.main-header {
    /* padding: 30px 0; */
    transition: all 0.3s ease;
    z-index: 1000;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(2px);
    height: 61px;  
    position: fixed;
    top: 0;
}

g#a_color,
g#b_color,
g#d_color,
g#e_color,
g#f_color,
g#g_color,
g#h_color,
g#i_color {
    display: none;
    transition: transform 0.8s cubic-bezier(.25,.1,.25,1);
} 


 
#w1_gray,
#w1_color,
#w2_gray,
#w2_color,
#w3_gray,
#w3_color,
#w4_gray,
 #w4_color,
 #w5_gray,
 #w5_color{
 transition: transform 0.8s cubic-bezier(.25,.1,.25,1);
 }

.row-1 #w5_gray,
.row-1 #w5_color,
.row-1 #w4_gray,
.row-1 #w4_color,
.row-1 #w3_gray,
.row-1 #w3_color{
  transform: translateY(-280px); 
}  

.row-1 #w1_gray {
     transition: opacity 0.4s ease, transform 0.4s ease;
    display: none !important;
}


.row-2 #w5_gray,
.row-2 #w5_color,
.row-2 #w4_gray,
.row-2 #w4_color,
.row-2 #w3_gray,
.row-2 #w3_color{
  transform: translateY(-280px); 
}  

.row-2 #w2_gray {
     transition: opacity 0.4s ease, transform 0.4s ease;
    display: none !important;
}

.row-2 #w1_gray {
     transition: opacity 0.4s ease, transform 0.4s ease;
    display: block !important;
}

.row-3 #w5_gray,
.row-3 #w5_color
{
  transform: translateY(-270px); 
}  

.row-3 #w1_gray {
    display: block !important;
}

.row-3 #w3_gray {
    display: none !important;
}


.row-4 #w3_gray {
    display: block !important;
}

.row-4 #w3_gray,
.row-4 #w3_color,
.row-4 #w5_gray,
.row-4 #w5_color
{
  transform: translateY(-270px); 
} 

.row-4 #w4_gray {
    display: none !important;
} 


.row-5 #w4_gray {
    display: block !important;
}

.row-5 #w3_gray,
.row-5 #w3_color,
.row-5 #w5_gray,
.row-5 #w5_color
{
  transform: translateY(0px); 
} 

.row-5 #w5_gray {
    display: none !important;
} 





#wohnungen .section-divider span {
    color: #5C4128;
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    line-height: 150%; /* 24px */
    letter-spacing: 8px;
    text-transform: uppercase;
}

#wohnungen h2.apartments-title {
    color: #5C4128;
    font-family: Afterglow;
    font-size: 72px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; /* 98px */
}

.table-blockdetails {
        color: #999189;
    font-family: "Baskerville";
    font-size: 24px;
    font-style: normal;
    font-weight: 100;
    line-height: 150%;
    width: 70%;;
}

.row-1 g#e,
.row-1 g#d, .row-1 g#g,.row-1 g#d,.row-1 g#f,
.row-1 g#h,.row-1 g#i{
  transform: translateY(-370px); 
}  

.row-1 g#a_color{
    display: block !important;
} 

.row-2 g#e,
.row-2 g#d, .row-2 g#g,.row-2 g#d,.row-2 g#f,
.row-2 g#h,.row-2 g#i{
  transform: translateY(-370px); 
} 




.row-2 g#b_color{
    display: block !important;
}

.row-3 g#g,
.row-3 g#h,.row-3 g#i,.row-3 g#f{
  transform: translateY(-370px); 
} 

.row-3 g#d_color{
    display: block !important;
}

.row-4 g#g,
.row-4 g#h,.row-4 g#i{
  transform: translateY(-370px); 
} 

.row-4 g#f_color{
    display: block !important;
}


.row-5 g#g,.row-5 g#d,.row-5 g#f,
.row-5 g#h,.row-5 g#i{
  transform: translateY(-370px); 
} 

.row-5 g#e_color{
    display: block !important;
}

.row-6 g#h,.row-6 g#i{
  transform: translateY(-220px); 
} 

.row-6 g#g_color{
    display: block !important;
}


.section-tag{
    display:block;
    font-size:11px;
    letter-spacing:5px;
    text-transform:uppercase;
    color:#b4a393;
    margin-bottom:10px;
}

.section-title{
    font-family:"afterglow", serif;
    font-size:68px;
    font-weight:300;
    color:#9b8473;
    margin-bottom:12px;
    line-height:1.1;
}

.section-subtitle{
    color:#b5aba3;
    font-size:15px;
    font-style:italic;
}

/* Image */
.interior-image img{
    width:100%;
    display:block;
}

/* Right Side */
.material-options{
    padding-left:20px;
}

.option-group{
    margin-bottom:45px;
}

.option-group h5{
    font-size:20px;
    color:#8e8279;
    margin-bottom:20px;
    font-family:"Times New Roman", serif;
}

.swatch-grid{
    display:flex;
    gap:24px;
}

.swatch-item{
    text-align:center;
}

.swatch-item p{
    margin-top:10px;
    color:#9f948b;
    font-size:14px;
}

.swatch{
    width:52px;
    height:52px;
    display:block;
}

/* Colors */
.beige{
    background:#e6dfd1;
}

.anthracite{
    background:#444341;
}

.wood-light{
    background:linear-gradient(
        45deg,
        #caa87d,
        #e3c7a0
    );
}

.wood-dark{
    background:linear-gradient(
        45deg,
        #8f6845,
        #b0845d
    );
}

/* Responsive */
@media(max-width:991px){

    .section-title{
        font-size:48px;
    }

    .material-options{
        padding-left:0;
        margin-top:20px;
    }

    .swatch-grid{
        justify-content:flex-start;
    }
}

@media(max-width:767px){

    .section-title{
        font-size:34px;
    }

    .swatch-grid{
        gap:18px;
    }

    .swatch{
        width:45px;
        height:45px;
    }
}

g{
  transition: transform 0.8s cubic-bezier(.25,.1,.25,1);
} 

.row-7 g#i{
  transform: translateY(-220px); 
} 

.row-7 g#h_color{
    display: block !important;
}

.row-8 g#i_color{
    display: block !important;
} 

path#extra_on-off_7,
path#extra_on-off_6 {
    display: none;
} 


.row-3 path#extra_on-off_3,
.row-3 path#extra_on-off_2{
    display: none;
}

.row-4 g#extra_on-off {
    display: none;
}

.row-6 path#extra_on-off_7 {
    display: block;
}  


.row-6 path#extra_on-off_7 {
    display: block;
} 



/*.row-9 g#a_color,
.row-9 g#b_color,
.row-9 g#d_color,
.row-9 g#e_color,
.row-9 g#f_color,
.row-9 g#g_color,
.row-9 g#h_color,
.row-9 g#i_color {
    display: block;
    transition: transform 0.8s cubic-bezier(.25,.1,.25,1);
} */


.building-renders svg {
    max-width: 100%;
    width:100%;
    margin: 0px auto;
    text-align: center;
}

.main-header .container-fluid {
    padding-left: 48px;
    padding-right: 48px;
}

.navbar-brand {
    padding: 0;
    margin-top: -1px;
}

.navbar {
    padding: 2px 0;
}

.navbar-brand .logo-img {
    /* height: 45px; */
    /* width: auto; */
    display: block;
    /* Fixed empty ruleset */
}

.menu-toggle {
    background: none;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0;
    cursor: pointer;
    width: 35px;
}

.menu-icon {
    display: block;
    width: 35px;
    height: 1px;
    background-color: var(--white);
    transition: all 0.3s ease;
}

.menu-icon:last-child {
    width: 20px;
}

.contact-link {
    color: var(--white);
    text-decoration: none;
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 400;
    font-family: var(--font-montserrat);
}

.contact-link:hover {
    color: rgba(255, 255, 255, 0.7);
}

.header-left,
.header-right {
    flex: 1;
    display: flex;
    align-items: center;
}

.header-right {
    justify-content: flex-end;
}

/* Hero Section */
.hero-section {
    position: relative;
    height: 100vh;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.hero-section .container-fluid {
    padding-left: var(--spacing-container);
    padding-right: var(--spacing-container);
}

.hero-title
 {
color: var(--backgrounds-grouped-secondary-elevated, #FFF);
font-family: Afterglow;
font-size: 190px;
font-style: normal;
font-weight: 400;
margin-bottom: 30px;
line-height: 78%; /* 171.716px */
    transition: transform 0.1s linear, opacity 0.1s linear;
    /* transform-origin: bottom left; */
    /* will-change: transform, opacity; */
}

.hero-btn {
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.1s ease, transform 0.1s ease;
}

.hero-title.scrolled {
    /* Transition handled by JS */
    pointer-events: none;
    /* Fixed empty ruleset */
}

.hero-section .container-fluid {
padding: 90px;
}

/* Overlay Menu */
.overlay-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    backdrop-filter: blur(10px);
    z-index: 2000;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.1);
    /* Zoomed in initial state */
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.overlay-menu.active {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    /* Zoom to original size */
}

.menu-close {
    position: absolute;
    top: 30px;
    right: 30px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
}

.overlay-nav {
    text-align: center;
}

.overlay-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.overlay-links li {
    margin-bottom: 25px;
}

.overlay-links a {
    color: var(--white);
    text-decoration: none;
    font-size: clamp(1.2rem, 3vw, 2rem);
    font-family: var(--font-montserrat);
    font-weight: 300;
    text-transform: none;
    letter-spacing: 0.05em;
    transition: color 0.3s ease;
}

.overlay-links a:hover {
    color: rgba(255, 255, 255, 0.6);
}

/* Introduction Section */
.intro {
    padding: clamp(5rem, 6.5vw, 6.5rem) 0;
}

.intro-title {
color: #AA7C51;
font-family: Afterglow;
font-size: 70px;
font-style: normal;
font-weight: 400;
line-height: 100%; /* 90px */
}

.intro-description {
color: #5C4128;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 24px */
letter-spacing: 8px;
text-transform: uppercase;
} 

.intro-description-content {
    color: #000;
    font-family: 'Baskerville';
    font-size: 30px;
    font-style: italic;
    font-weight: 400;
    line-height: 150%; /* 52.5px */
    margin-top: -30px;
}

/* Project Section */
.project {
    background-color: var(--white);
     padding-bottom: clamp(5rem, 6.5vw, 6.5rem); 
}

select,input {
    width: 100%;
    padding: 12px 0px;
    color: #5C4128;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 30px */
    border: none;
    border-bottom: 1px solid #5C4128;
}

select,input {
   width: 100%;
    padding: 12px 0px;
    color: hsl(29deg 39% 26% / 50%);
    font-family: Inter;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    border: none;
    margin-top: 0px;
    border-bottom: 1px solid #5C4128;
}

textarea.wpcf7-form-control.wpcf7-textarea {
    color: #5C4128;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 30px */
    width: 100%;
    border: none;
    border-bottom: 1px solid;
    height: 80px;
    resize: none;
    padding: 10px 0;
}

form p {
    margin-bottom: 10px;
}

input.wpcf7-form-control.wpcf7-submit.has-spinner {
    padding: 22px 41px;
    margin-top: 50px;
    color: #5C4128;
    width: auto;
    border-radius: 39.5px;
    border: 1px solid #5C4128;
    text-transform: uppercase;
}

input[type="checkbox"] {
    width: auto;
}

span.wpcf7-list-item {
    margin: 0;
}

textarea.wpcf7-form-control.wpcf7-textarea {
    color: #5C4128;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 30px */
    width: 100%;
    border: none;
    border-bottom: 1px solid;
    height: 80px;
    resize: none;
    padding: 10px 0;
}

form p {
    margin-bottom: 10px;
}

/* Section Divider (Line - Text - Line) */
.section-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-montserrat);
    color: #6E5C32;
    font-size: 18px;
    font-style: normal;
    font-weight: 300;
    line-height: 110%;
    text-transform: uppercase;
    gap: 10px;
    margin-bottom: clamp(3rem, 6.2vw, 6.2rem);
    z-index: 1;
    position: relative;
    position: relative;
    color: #5C4128;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 8px;
    text-transform: uppercase;
}

.span-divider-left,
.span-divider-right {
    max-width: 118px;
    width: 100%;
    display: block;
}

.span-divider-left::before,
.span-divider-right::after {
    content: "";
    border-bottom: 1px solid #6E5C32;
    max-width: 0;
    /* Start at 0 width */
    width: 100%;
    display: block;
    transition: max-width 1.5s ease-out;
    /* Smooth transition */
}

/* Float the right line to the right side of its container to grow inwards-outwards if needed, 
   but since the container is flex, it grows from the text outwards naturally with max-width */
.span-divider-right::after {
    margin-left: auto;
}

/* Class added via JS when scrolled into view */
.section-divider.animate-lines .span-divider-left::before,
.section-divider.animate-lines .span-divider-right::after {
    max-width: 118px;
    /* Target width */
}

/* Complex Overlapping Grid Layout */
.project-grid-container {
/*     padding-left: 70px; */
    padding-left: 0px;
}

/* Specific Placements inside the Grid */

.project-title-box {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    padding-right: 20px;
    display: flex;
    align-items: center;
}

.project-title-box h3 {
color: #A47D5A;
font-family: "Afterglow";
font-size: 60px;
font-style: normal;
font-weight: 400;
line-height: 117%; /* 70.2px */
margin: 20px 0;
}

.left-block-content-section {
    max-width:700px;
    padding: 0 60px;
}


h5.block-subheading {
    color: #8A7867;
    font-family: "Times Now";
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 8px;
    text-transform: uppercase;
    margin: 0;
}

.project-description-block {
    color: #000;
    font-family: "Baskerville";
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 39px */
}

.project-img-top-right {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
    /* Spans down to create overlap space */
    position: relative;
    z-index: 3;
    /* Below the left image */
    margin-bottom: 80px;
    /* Space for the bottom-right text */
}

/* This is the key element for the overlap */
.project-img-bottom-left {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    position: relative;
    z-index: 20;
    /* Needs to be above the top-right image */
    /*margin-top: -300px;*/
    /* Negative margin pulls it up over the top row */
    /* margin-right: -10%; */
    /* Negative margin pulls it right over the right column */
   
    /* Ensure background is solid so top-right image doesn't show through transparent areas if any */
}

.project-desc-box {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    align-self: end;
    /* Align to the bottom of the cell */
    padding-left: 10%;
    /* Push it away from the overlapping image */
    z-index: 1;
}

.project-desc-box {
    padding: 0 70px;
}

#project-lists:after {
    background: #7E5D44;
    position: absolute;
    content: '';
    width: 100%;
    height: calc(100% + 30%);
    left: 0;
    top: -150px;
}

#project-lists .col-lg-6.col-12 {
    padding-left: 0;
}

#project-lists .project-grid-container {
       padding-right: 70px;
    padding-left: 0;
}

.swiper-pagination-bullet-active {
    background: #5C4128 !important;
}

section#eindruck {
    padding-top: 100px;
    margin-top: 100px;
}
section.video-section.position-relative.aos-init.aos-animate {
    display: none;
}
#project-lists .left-block-content-section {
    max-width: 800px;
    padding: 0 35px;
    position: relative;
    z-index: 999;
}

#project-lists .project-desc-box p {
    max-width: 474px;
    color: #C9B89C;
    font-family: "Baskerville";
    font-size: 28px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
     position: relative;
    z-index: 999;
}

#project-lists .project-img-bottom-left {
    margin-top: -150px;
    text-align: center;
}

#project-lists .project-img-bottom-left img {
    max-width: 500px;
    margin: 0px auto;
}

#project-lists h5.block-subheading {
    color: #FFEFD6;
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    line-height: 150%; /* 24px */
    letter-spacing: 8px;
    text-transform: uppercase;
}

#project-lists h3.block-heading {
    color: #FFEFD6;
    font-family: Afterglow;
    font-size: 70px;
    font-style: normal;
    font-weight: 400;
    line-height: 123%; /* 86.1px */
}

#project-lists .project-desc-box {
    position: relative;
    z-index: 9;
}

.project-desc-box p {
    font-family: "Baskerville";
    font-weight: 400;
    font-style: Regular;
    font-size: 26px;
    leading-trim: NONE;
    line-height: 150%;
    letter-spacing: 0%;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    max-width: 474px;

} 

/* Image utility */
.custom-shadow {
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.08);
}

/* Parallax Wrapper */
.parallax-wrapper {
    /* overflow: hidden; */
    /* Important so translated image doesn't break layout wildly */
    width: 100%;
    height: 100%;
}

.parallax-img {
    width: 100%;
    height: 580px;
    object-fit: cover;
    will-change: transform;
    /* Hint for browser performance */
    transform: scale(1.1);
    /* Slightly enlarge so when it translates, edges don't show background */
}

.project-img-top-right img {
    height: 599px;
    object-fit: cover;
    width: 100%;
}



/* Minergie Section */
.minergie-section {
    background-color: var(--white);
    padding-bottom: clamp(4rem, 6vw, 6rem);
}

.minergie-logo-wrapper {
    margin-bottom: clamp(2rem, 3vw, 3rem);
}

.minergie-logo {
    max-width: 363px;
    height: auto;
    width: 100%;
}

.minergie-text {
    color: var(--heading-brown-light);
    font-size: clamp(1rem, 1.5vw, 1.5rem);
    font-style: normal;
    font-weight: 400;
    line-height: 134%;
}


section.intro {
    background: #fff;
} 

main {
    overflow: hidden;
    background: #fff;
}  

/* Raumkonzept Section */

.raumkonzept-section {
    background-color: var(--white);
    /* Base color */
    padding-top: clamp(5rem, 6.5vw, 6.5rem);
	margin-bottom: clamp(5rem, 8.5vw, 8.5rem);
}
.eindruck-section .main-swiper .swiper-slide img {
    border-radius: 0;
}
.eindruck-slider {
	max-width:1440px;
	width:100%;
	margin:auto;
	display:block;
}
.thumbs-swiper .swiper-slide-thumb-active {
    border: 3px solid var(--heading-brown) !important;
}
.thumbs-swiper .swiper-slide img {
    border-radius: 0 !important;
}
.thumbs-swiper .swiper-slide-thumb-active {
   border-radius: 0 !important;
}

.raumkonzept-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 531px;
    background: #FCF0DB;
    z-index: 0;
}

.raumkonzept-title {
    color: var(--heading-brown);
    font-size: clamp(2.5rem, 4vw, 4.4rem);
    font-weight: 300;
    line-height: 118%;
    text-transform: capitalize;
    margin-bottom: clamp(3rem, 6vw, 6rem);
}

/* Custom CSS Grid for overlapping images */
.raum-grid-container {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

/* Image 1: Top Center Balcony (Static) */
.raum-img-1 {
    grid-column: 2 / 12;
    /* Covers most of the width, visually centered */
    grid-row: 1 / 3;
    z-index: 1;
    position: relative;
    /* margin-bottom: 124px; */
}

/* Image 2: Middle Left Dining (Parallax) */
.raum-img-2 {
    z-index: 3;
    position: relative;
    margin-top: -80px;
    padding-right: 0;
    height: 434px;
    position: relative;
    left: -10px;
    max-width: 620px;
    margin-left: 100px;
}

/* Image 3: Middle Right Kitchen (Parallax) */
.raum-img-3 {
    z-index: 4;
    position: relative;
    margin-top: 100px;
    margin-left: 0;
    max-width: 620px;
    margin-right: 130px;
    right: 80px;
}

/* Image 4: Bottom Left Bedroom (Parallax) */
.raum-img-4 {
    z-index: 4;
    position: relative;
    margin-top: -90px;
    position: relative;
    left: 120px;
    max-width: 594px;
}

/* Element 5: Bottom Right Text Block */
.raum-text-block {
    z-index: 1;
    position: relative;
    padding: 0 20px 0 109px;
    align-self: end;
}

.raum-text-block p {
    color: var(--heading-brown-light);
    font-size: clamp(1rem, 1.5vw, 1.5rem);
    font-style: normal;
    font-weight: 400;
    line-height: 134%;
}

/* "JETZT ENTDECKEN" link styling */
.raum-link {
    color: var(--black);
    font-family: var(--font-inria);
    font-size: clamp(1.5rem, 2.2vw, 2.2rem);
    text-decoration: none;
    padding-bottom: 5px;
    border-bottom: 2px solid var(--black);
    font-weight: 400;
    line-height: 90%;
    text-transform: capitalize;
}

.raum-link:hover {
    color: var(--black);
    opacity: 0.7;
}

/* Specific Parallax Initial Scales */
/* We scale them slightly larger than their container so when we translate them within the overflow-hidden wrapper, the edges aren't exposed */
.parallax-img-2,
.parallax-img-3,
.parallax-img-4 {
    will-change: transform;
    transform: scale(1.15);
    /* Slightly higher scale for larger translations */
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/* Wrapper Utility to constrain height if needed, though aspect ratio of image usually governs if width is set */
/* .raum-img-1 img,
.raum-img-2 .parallax-wrapper,
.raum-img-3 .parallax-wrapper,
.raum-img-4 .parallax-wrapper {
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
} */

/* .raum-grid-container-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 1170px;
    margin: auto;
    width: 100%;
    flex-wrap: wrap;
} */

/* Eindruck Section */
.eindruck-section {
    /* padding-top: clamp(4rem, 6.5vw, 6.5rem); */
    padding-bottom: clamp(4rem, 6.5vw, 6.5rem);
    background-color: var(--white);
    overflow: hidden;
}

.eindruck-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 55%;
    background: #F4E1BE;
    z-index: 0;
    display: none;
}

.eindruck-title {
    text-transform: capitalize;
    color: #5C4128;
    text-align: center;
    font-family: Afterglow;
    font-size: 80px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
}

.title-subheading {
    color: #C9B89C;
    text-align: center;
    font-size: 32px;
    font-style: italic;
    font-weight: lighter;
    line-height: 150%; /* 48px */
    margin-bottom: 40px;
} 

.eindruck-slider .slider-item {
    margin: 0 15px;
    transition: transform 0.3s ease;
    outline: none;
}

.eindruck-slider .slider-item img {
    width: 100%;
    height: 654px;
    object-fit: cover;
}

@media (max-width: 991px) {
    .eindruck-slider .slider-item img {
        height: 400px;
    }
}

@media (max-width: 768px) {
    .eindruck-slider .slider-item img {
        height: 300px;
    }
}

/* Video Section */
.video-section {
    background-color: var(--white);
    overflow: hidden;
    margin-bottom: clamp(4rem, 6.5vw, 6.5rem);
}

.video-container {
    width: 100%;
    line-height: 0;
}

#project-video {
    display: block;
    cursor: pointer;
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    transition: background 0.3s ease;
    z-index: 10;
    pointer-events: none;
    /* Let clicks pass through if we want to click the button or the video */
}

.play-btn {
    background: none;
    border: none;
    cursor: pointer;
    transition: transform 0.3s ease, opacity 0.3s ease;
    pointer-events: auto;
    /* Re-enable pointer events for the button */
    padding: 0;
}

.play-btn:hover {
    transform: scale(1.1);
}

.video-section.playing .video-overlay {
    opacity: 0;
    visibility: hidden;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
    .main-header {
        padding: 6px 0;
    }

    /* Adjust project grid overlap for tablets */
    .project-grid-container {
        grid-template-columns: 1fr;
        /* Switch to single column */
        grid-template-rows: auto;
        gap: 30px;
    }

    .project-title-box,
    .project-img-top-right,
    .project-img-bottom-left,
    .project-desc-box {
        grid-column: 1 / -1;
        /* Everyone takes full width */
        grid-row: auto;
        /* Automatic rows */
        margin: 0;
        /* Reset negative margins */
        padding: 0;
        /* Reset specific paddings */
        z-index: 1;
    }

    .project-title-box {
        margin-bottom: 20px;
    }

    .project-desc-box {
        margin-top: 20px;
    }

    /* Adjust Raumkonzept grid overlap for tablets */
    .raum-grid-container {
        grid-template-columns: 1fr;
        /* Single column */
        grid-template-rows: auto;
        gap: 30px;
        padding: 0 15px;
    }

    .raum-img-1,
    .raum-img-2,
    .raum-img-3,
    .raum-img-4,
    .raum-text-block {
        /* grid-column: 1 / -1; */
        /* Take full width */
        /* grid-row: auto; */
        /* Flow naturally */
        margin: 0;
        /* Reset all negative margins that create overlap */
        padding: 0;
        /* Reset specific paddings */
    }

    .raumkonzept-bg {
        height: 15%;
        /* Reduce height of beige background on mobile */
    }

    .raum-text-block {
        margin-top: 20px;
        text-align: center;
        /* Center text on mobile */
    }

    .raum-link {
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .hero-section {
        padding-bottom: 60px;
    }

    .contact-link {
        font-size: 0.7rem;
    }

    .navbar-brand .logo-img {
        height: 45px;
        width: 45px;
    }
}

/* Apartments Section */
.apartments-section {
   /*background: #F0E7DC;*/
   position: relative;
    padding: clamp(4rem, 6.5vw, 6.5rem) 0;
}  


section#wohnungen:after {
    position: absolute;
    background: #F0E7DC;
    width: 100%;
    height: calc(100% - 30%);
    content: '';
    top: 27%;
    z-index: 1;
    left: 0;
}

.table-responsive {
    position: relative;
    z-index: 9;
}

.building-renders {
    position: relative;
    z-index: 9;
}


#interior-preview {
    transition: opacity 0.35s ease;
}
.swatch-item { cursor: pointer; }
.swatch {
    display: block;
    width: 52px;
    height: 52px;
    border: 2px solid transparent;
}
.swatch-item.active .swatch {
    outline: 2px solid #7B5C3E;
    outline-offset: 3px;
}

section#wohnungen .col-lg-8 {
    position: relative;
    z-index: 9;
}

section#wohnungen:before {
    background: border-radius: 0 270.5px 8px 378px;
    background: #F0E7DC;
}

section#wohnungen:before {
    border-radius: 0 270.5px 8px 378px;
    background: #F0E7DC;
    position: absolute;
    content: '';
    width: 60%;
    height: 60%;
    top: 0;
} 

.table>:not(caption)>*>* {
    background: none;
}

.apartments-title {
    font-family: var(--font-inria);
    font-size: 3.25rem;
    font-weight: 300;
    color: var(--heading-brown);
    line-height: 1.2;
    text-transform: capitalize;
}

.apartment-table {
    border-collapse: separate;
    border-spacing: 0;
    background-color: transparent;
    color: #8C7A5B;
    margin-bottom: 0;
}

.apartment-table thead th {
    border: none;
    text-transform: capitalize;
    padding: 20px 10px;    
    border-bottom: 1px solid #E5DFD3;
    color: #5C4128;
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 110%; /* 17.6px */
}

.apartment-table tbody td {
    border: none;
    vertical-align: middle;
    padding: 12px 10px;
    border-bottom: 1px solid #E5DFD3;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    color: #8B5E3B;
}
table.table.apartment-table tr {
    padding: 20px 0px 20px 0px !important;
    height: 70px;
    max-height: 100%;
}

.apartment-table tbody tr:last-child td {
    border-bottom: none;
}

.btn-download {
    font-family: var(--font-inria);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    text-transform: capitalize;display: inline-flex;
    padding: 4px 6px;
    justify-content: center;
    align-items: center;
    gap: 3px;
    height: 20px;
    text-decoration: none;
    color: #999189;
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 110%; /* 17.6px */
}

p.table-bottom {
    color: #5C4128;
    font-family: "Times Now";
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    line-height: 110%; /* 17.6px */
    margin: 40px 0 0;
}

.status-available {
    text-decoration: none;
}

.building-img {
    transition: transform 0.5s ease;
}

.building-img:hover {
    transform: scale(1.02);
}

@media (max-width: 991px) {
    .apartments-title {
        font-size: 2.22rem;
    }

    .building-renders {
        margin-top: 50px;
    }

    .apartments-section {
        padding: 60px 0;
    }
}

@media (max-width: 768px) {
    .apartments-title {
        font-size: 1.8rem;
    }

    .apartment-table thead th,
    .apartment-table tbody td {
        padding: 15px 5px;
        font-size: 0.85rem;
    }
}

/* Materials Section */
.materials-section {
    overflow: hidden;
}

.materials-title {
    color: var(--heading-brown);
    font-size: clamp(2.3rem, 4.38vw, 4.38rem);
    /* text-transform: uppercase; */
    font-family: var(--font-inria);
}

.materials-description {
    color: var(--heading-brown-light);
    font-size: clamp(1rem, 1.5vw, 1.5rem);
    font-style: normal;
    font-weight: 400;
    line-height: 134%;
}

.collage-wrapper {
    position: relative;
    margin-top: 50px;
}

.materials-collage {
position: relative;
    width: 100%;
    min-height: 1471px;
}

.collage-item {
    position: absolute;
    /* transition: transform 0.5s ease; */
    /* Removed as it causes lag in parallax */
    overflow: hidden;
    /* Contain the scaled parallax image */
}
.collage-item img {
    width: 100%;
    height: 100%;
    display: block;
    will-change: transform;
    object-fit: cover;
}

/* Specific Positions */
.building-f-1
 {
    width: 100%;
    top: 640px;
    left: 18%;
    z-index: 2;
    max-width: 458px;
}
.lifestyle-c-1
 {
    width: 55%;
    top: 0;
    left: 0;
    z-index: 1;
    right: 0;
    margin: auto;
    height: 651px;
}



.lifestyle-l-1 {
    width: 100%;
    bottom: 0;
    left: 20%;
    z-index: 3;
    top: 1160px;
    height: 725px;
    max-width: 661px;
}

.lifestyle-center {
    width: 100%;
    bottom: 0;
    left: 56.5%;
    z-index: 5;
    max-width: 482px;
    height: 490px;
    max-width: 417px;
    top: 1059px;
}

.building-f-2 {
    width: 100%;
    bottom: 0px;
    right: 31%;
    z-index: 3;
    top: 748px;
    height: 334px;
    max-width: 482px;
}

@media (max-width: 991px) {
    .materials-collage {
        min-height: 700px;
    }

    .building-f-1 {
        width: 35%;
        left: 5%;
    }

    .lifestyle-c-1 {
        width: 50%;
        left: 40%;
    }

    .lifestyle-l-1 {
        width: 30%;
        bottom: 50px;
    }

    .lifestyle-center {
        width: 35%;
        left: 30%;
    }

    .building-f-2 {
        width: 30%;
        right: 2%;
    }
}

@media (max-width: 768px) {
    .materials-section {
        padding: 80px 0;
    }

    .materials-collage {
        display: flex !important;
        flex-direction: column !important;
        min-height: auto;
        gap: 30px;
        padding: 0 15px;
    }

    .collage-item {
        position: static;
        width: 100% !important;
    }
}

/* Material Configurator Section */
.configurator-section {
    background-color: var(--white);
}

.configurator-main-title {
    color: var(--heading-brown);
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    line-height: 1.1;
    text-transform: uppercase;
    font-weight: 300;
}

.config-sub-title {
    font-family: var(--font-inria);
    font-weight: 300;
    color: var(--heading-brown);
    font-size: clamp(1.2rem, 2vw, 2rem);
    text-transform: uppercase;
}

.config-group-title {
    font-family: var(--font-inria);
    font-weight: 300;
    color: var(--heading-brown);
    font-size: clamp(1.8rem, 3.15vw, 3.15rem);
    text-transform: uppercase;
}

.swatch-box {
    width: 164px;
    height: 116px;
    background-size: cover;
    background-position: center;
    transition: transform 0.3s ease;
    cursor: pointer;
}

.swatch-box:hover {
    transform: translateY(-5px);
}

.swatch-label {
    display: block;
    font-family: var(--font-montserrat);
    font-size: 0.8rem;
    font-weight: 400;
    color: var(--heading-brown-light);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 10px;
}

.config-preview-wrapper img {
width: 100%;
    border-radius: 2px;
    height: 783px;
    object-fit: cover;
}

@media (max-width: 991px) {
    .swatch-box {
        width: 110px;
        height: 110px;
    }

    .config-controls {
        text-align: center;
    }

    .swatch-grid {
        justify-content: center;
    }
}

/* Pilatusweg Section */
.pilatusweg-section {    
    overflow: hidden;
}

.pilatusweg-left-col,
.pilatusweg-right-col {
    min-height: 500px;
    /* Ensure columns have enough height to push content apart */
}

/* Adjusting padding for top and bottom content to spread them out */
.pilatusweg-content-top {
    margin-top: 10%;
}

/* .pilatusweg-content-bottom {
    margin-bottom: 5%;
} */

.pilatusweg-title {
    font-size: 22px;
    color: var(--heading-brown);
    font-family: var(--font-inria);
    font-weight: 300;
    line-height: 118%;
    text-transform: capitalize;
    margin-bottom: clamp(4rem, 5vw, 5rem);
}

.pilatusweg-link {
    color: var(--heading-brown);
    font-family: var(--font-montserrat);
    font-size: clamp(0.9rem, 1vw, 1rem);
    text-decoration: none;
    font-weight: 400;
    transition: opacity 0.3s ease;
}

.pilatusweg-link:hover {
    opacity: 0.7;
    color: var(--black);
}

.pilatusweg-link .arrow-icon {
font-size: 1.2rem;
    font-weight: 300;
    display: flex;
}

/* Iframe Wrapper to remove default spacing issues */
.pilatusweg-iframe-wrapper {
    line-height: 0;
    font-size: 0;
}

.pilatusweg-iframe-wrapper iframe {
    display: block;
    /* box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05); */
    /* Soft shadow for depth */
}

.pilatusweg-number {
    font-family: var(--font-montserrat);
    font-weight: 600;
    font-size: clamp(1rem, 1.2vw, 1.2rem);
    color: var(--heading-brown);
    border-bottom: 2px solid var(--heading-brown);
    line-height: 1;
    padding-bottom: 2px;
}

.pilatusweg-right-col {
    height: 100%;
}

@media (max-width: 991px) {
    .pilatusweg-left-col {
        min-height: auto;
        padding: 3rem 1.5rem !important;
        /* Override p-5 */
        gap: 2rem;
    }

    .pilatusweg-right-col {
        min-height: auto;
        padding: 0 1.5rem 3rem 1.5rem !important;
    }

    .pilatusweg-content-top,
    .pilatusweg-content-bottom {
        margin: 0;
    }

    .pilatusweg-title {
        text-align: center;
    }

    .pilatusweg-content-bottom {
        text-align: center;
    }
}

/* Standort Section */
.standort-section {
    background-color: var(--white);
    padding-top: clamp(4rem, 6.5vw, 6.5rem);
}

.standort-title {
    font-family: var(--font-inria);
    font-weight: 300;
    color: var(--heading-brown);
    font-size: clamp(2.3rem, 4.38vw, 4.38rem);
    line-height: 118%;
    /* text-transform: uppercase; */
}

.standort-description {
    color: var(--heading-brown-light);
    font-size: clamp(1rem, 1.5vw, 1.5rem);
    font-style: normal;
    font-weight: 400;
    line-height: 134%;
}

.standort-visuals-container {
    max-width: 1200px;
    margin: 60px auto 0;
    padding-bottom: 0;
}

.standort-map-wrapper {
    width: 100%;
    margin-left: auto;
    position: relative;
    z-index: 1;
}

.standort-foreground-img {
    position: relative;
    width: 60%;
    left: 0;
    bottom: 0;
    z-index: 2;
    top: 0;
}

.standort-foreground-img img {
    width: 100%;
    border-radius: 2px;
    will-change: transform;
    /* transform: scale(1.1); */
    /* Ensure coverage during translation */
}

@media (max-width: 991px) {
    .standort-visuals-container {
        padding-bottom: 0;
    }

    .standort-map-wrapper {
        width: 100%;
        margin-bottom: 30px;
    }

    .standort-foreground-img {
        position: static;
        width: 100%;
    }
}

/* Brochure Section */
.brochure-section {
    background-color: #f3ebd7;
    /* Design match beige */
    overflow: hidden;
}

.brochure-title {
    font-family: var(--font-inria);
    font-weight: 300;
    color: #3e4a59;
    /* Darker blue/grey from design */
    font-size: clamp(2.5rem, 4.5vw, 4.5rem);
    line-height: 1.1;
}

.address-text {
    font-family: var(--font-montserrat);
    font-weight: 400;
    color: #5d4a44;
    font-size: 1rem;
    letter-spacing: 0.05em;
}

.brochure-iframe-wrapper {
    background: white;
    padding: 20px;
    border-radius: 4px;
    transition: transform 0.3s ease;
}

.brochure-iframe-wrapper:hover {
    transform: translateY(-5px);
}

@media (max-width: 991px) {
    .brochure-title {
        text-align: center;
        margin-bottom: 30px !important;
    }

    .brochure-location {
        justify-content: center;
        margin-bottom: 40px;
    }
}

/* Footer Section */
.site-footer {
    background: #FCF0DB;
    font-family: var(--font-montserrat);
    margin-top: clamp(4rem, 6.5vw, 6.5rem);
}

.footer-title {
    color: var(--heading-brown);
    font-family: var(--font-inria);
    font-size: clamp(2.3rem, 3.2vw, 3.2rem);
    font-weight: 300;
    line-height: 118%;
}

/* Form Styles */
.form-label-custom {
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 106%;
    text-transform: capitalize;
}

.form-control-custom {
    background: transparent;
    border: none;
    border-bottom: 1px solid #1A1A1A;
    border-radius: 0;
    padding: 0.5rem 0;
    font-size: 0.9rem;
    color: #1A1A1A;
    transition: border-color 0.3s ease;
    font-style: normal;
    font-family: var(--font-montserrat);
}

.form-control-custom:focus {
    background: transparent;
    box-shadow: none;
    border-color: #555;
    outline: none;
}

.form-control-custom::placeholder {
    color: #8C8C8C;
    font-style: italic;
    font-weight: 300;
}

/* Checkbox */
.custom-checkbox .form-check-input {
    background-color: transparent;
    border: 1px solid #1A1A1A;
    border-radius: 0;
    width: 1rem;
    height: 1rem;
    margin-top: 0.2rem;
    cursor: pointer;
    border-radius: 4px;
    box-shadow: none !important;
}

.custom-checkbox .form-check-input:checked {
    background-color: #1A1A1A;
    border-color: #1A1A1A;
    box-shadow: none !important;
}

.custom-checkbox .form-check-label {
    color: #000;
    text-align: left;
    font-family: var(--font-montserrat);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: capitalize;
    cursor: pointer;
}

/* Submit Button */
.btn-submit-custom {
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    text-transform: uppercase;
    border-radius: 60px;
    border: 1px solid #FFF;
    background: #FFF;
    height: 60px;
    padding: 0 35px 0 36px;
    transition: all 0.5s ease;
}

.btn-submit-custom:hover {
    background-color: var(--heading-brown);
    transform: scale(1.02);
    color: #FFF;
}

/* Info Box */
.footer-info-box {
    background: #C4A36A;
    backdrop-filter: blur(20px);
    height: 100%;
}

.info-title {
    font-family: var(--font-inria);
    color: var(--black);
    font-size: clamp(1.8rem, 1.9vw, 1.9rem);
    font-weight: 300;
}

.info-text {
    color: var(--black);
    font-size: clamp(1rem, 1.5vw, 1.25rem);
    line-height: 1.6;
    font-weight: 400;
}

.info-link {
    color: var(--black);
    text-decoration: underline;
    text-underline-offset: 4px;
    transition: opacity 0.3s ease;
}

.info-link:hover {
    color: var(--black);
    opacity: 0.7;
}

/* Copyright Bottom Bar */
.footer-copyright {
    color: #715E32;
    text-align: center;
    font-family: var(--font-montserrat);
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding: 0 20px;
    background: #F4E1BE;
}

.copyright-title {
color: #000;
    font-size: 26px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    text-transform: capitalize;
}

.footer-copyright p
 {
    color: #000;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    text-transform: capitalize;
}

.footer-copyright p a {
     color: #000;
    text-decoration: none;
}

@media (max-width: 991px) {
    .footer-info-box {
        margin-top: 2rem;
    }
}

.hide-on-desktop {
    display: none;
}

.footer-bottom p {
    color: #715E32;
    text-align: center;
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.van-den {
    padding: clamp(4rem, 6.5vw, 6.5rem) 0;
}

.van-den p {
    margin-bottom: clamp(4rem, 8vw, 8rem);
}

.footer-logo-img {
    max-width: 150px;
    height: auto;
}

.standort-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 852px;
    background: #FCF0DB;
    z-index: 0;
}
.materials-section .materials-description.mx-auto {
    margin-bottom: 70px !important;
}
.form-check.custom-checkbox br {
    display: none;
}
.form-check.custom-checkbox.mb-5 {
    margin-bottom: 2rem !important;
}
.btn-submit-custom {
	border-radius: 60px;
border: 1px solid #FFF !important;
background: #FFF  !important;
	height: 60px;
padding: 0 35px 0 36px;
	color: #000 !important;
font-size: 16px;
font-style: normal;
font-weight: 300;
line-height: normal;
text-transform: uppercase;
}
.pil-text {
    transform: rotate(-90deg);
    color: #715E32;
    font-family: Montserrat;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 126%;
    position: absolute;
    right: 0;
    top: 110px;
}
.minergie-section-content {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.minergie-section-content {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.minergie-logo-wrapper
 {
    margin-top: auto;
    margin-bottom: 1rem !important;
}
  
/* For swipper slider */
.gallery-container {
    max-width: 1200px;
    margin: 0 auto;
}

.main-swiper {
    width: 100%;
    height: 500px;   
    padding-bottom: 40px !important;
}

.main-swiper .swiper-slide img {
      max-width: 100%;
    height: auto;
    object-fit: cover !important;
    border-radius: 8px;
    margin:0px auto; 
    max-height:900px;
}

/*.swiper-button-next,
.swiper-button-prev{
    display: none !important;
}*/


.swiper-free-mode>.swiper-wrapper {
    justify-content: center;
}


/* Thumbs Slider */
.thumbs-swiper {
    width: 100%;
    height: 120px; 
	margin-top:20px;
}

.thumbs-swiper .swiper-slide {
    opacity: 0.6;
    transition: opacity 0.3s;
    cursor: pointer;
}

.thumbs-swiper .swiper-slide-thumb-active {
    opacity: 1;
    border: 3px solid #007aff;
    border-radius: 6px;
}

.thumbs-swiper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
}
.main-swiper {
    height: 774px;
}
/* Navigation arrows (optional) */
.swiper-button-next,
.swiper-button-prev {
    color:#715e33 !important;
}

/*.hero-section .align-items-end {
    align-items: flex-end !important;
    align-items: center;
    justify-content: center;
    text-align: center;
}*/

#raumkonzept .parallax-wrapper {
    max-height: 400px;
}
.lifestyle-l-1 a
 {
    height: 100%;
    display: flex;
}
.lifestyle-l-1 {
    height: 415px;
}
    .main-swiper .swiper-slide img {
        width: 100%;
    }
.swiper-wrapper {
    max-width: 1300px;
    height: 82vh !important;
    margin-left: auto;
    margin-right: auto;
}

.main-swiper .swiper-slide img {
    object-fit: cover !important;
    object-position: 53% 50%;
    width: 100%;
    height: 100% !important;
}
.swiper-fade .swiper-slide
 {
    max-width: 1300px;
    height: 100vh !important;
    margin-left: auto;
    margin-right: auto;
    width: 100% !important;
}
.thumbs-swiper .swiper-wrapper {
	 height: 100% !important;
}
/* /// End For swipper slider */


h6.footer-tagline {
    color: #FFF;
    font-family: Afterglow;
    font-size: 50px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; /* 144px */
}

/***New home page css***/
.bottom-hero-section{
    background:url(../images/bottom-hero-bg.png;);
    padding:30px;
    height: 588px;
        background-size: cover;
    background-position: bottom;
}
.footer-hero-content h2{
        font-size: 144px;
    color: #00000078;
    line-height: 100%;
}
/* ===================
   FOOTER INFO
=================== */

.footer-info-section{
    background:#7E5D44;
    padding:80px 0 40px;
}

.footer-content.footer-heading h2 {
    margin: 0;
    color: #FFFFFF;
    font-size: 144px;
}

.footer-top {
    display: flex;
    gap: 140px;
    align-items: center;
    margin-bottom: 40px;
}

.footer-logo{
    flex:0 0 320px;
}

.footer-logo img{
    width:100%;
    max-width:260px;
}

.footer-content{
    flex:1;
}

.footer-content h2{
    font-size:96px;
    line-height:.9;
    font-weight:300;
    margin-bottom:80px;
}

.footer-grid{
    display:grid;
    grid-template-columns:
    1fr
    1fr
    1fr
    1fr
    1.2fr;
    gap:40px;
}



.footer-col-left{
    width: 310px; 
}
.footer-col h3 {
    font-size: 30px;
    margin-bottom: 14px;
    font-weight: 300;
    font-family: "Inter", sans-serif;
    color: #fff;
}
.footer-col p{
    font-size:12px;
    line-height:1.8;
      font-family: "Inter", sans-serif;
    color:#fff;
    font-weight: 300;
    margin: 0px;
}

.footer-bottom{
    border-top:1px solid #FFFFFF;
    margin-top:60px;
    padding-top:25px;
}

.footer-bottom p{
    font-size:16px;
    text-align: left;
     font-family: "Inter", sans-serif;
    margin: 0px;
    color: #FFFFFF;
    font-weight: 400;
}


h5.product-lists-title {
    FONT-SIZE: 60PX;
    color: #5C4128;
    margin-bottom: 0px;
}

/* ===================
   RESPONSIVE
=================== */

@media(max-width:991px){

    .hero-content{
        flex-direction:column;
        text-align:center;
        padding-top:80px;
    }

    .hero-left,
    .hero-right{
        width:100%;
    }

    .hero-left h1{
        font-size:72px;
        margin-bottom:40px;
    }

    .footer-top{
        flex-direction:column;
    }

    .footer-content h2{
        font-size:64px;
    }

    .footer-grid{
        grid-template-columns:1fr;
    }
}


section#brochure {
    padding: 80px 0;
}


#interior-preview {
    transition: opacity 0.35s ease;
}
.swatch-item { cursor: pointer; }
.swatch-item.active .swatch {
    outline: 2px solid #7B5C3E;
    outline-offset: 3px;
}

.swatch {
    display: block;
    width: 52px;
    height: 52px;
    background-size: cover;
    background-position: center;
    border: 2px solid transparent;
    transition: outline 0.2s;
}
.swatch-item.active .swatch {
    outline: 2px solid #7B5C3E;
    outline-offset: 3px;
}


    .contact-section {
    color: #8d735f;
  
}

.contact-label {
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    display: block;
    margin-bottom: 10px;
}

.contact-title {
    font-size: 60px;
    color: #5C4128;
    line-height: 1;
    font-weight: 300;
    margin-bottom: 40px;
}

.form-control-custom {
    width: 100%;
    border: none;
    border-bottom: 1px solid #c8b9ab;
    background: transparent;
    padding: 12px 0;
    color: #8d735f;
    font-size: 14px;
    outline: none;
}

.form-control-custom::placeholder {
    color: #b8a99a;
}

.form-control-custom:focus {
    border-bottom-color: #8d735f;
}

select.form-control-custom {
    cursor: pointer;
}

.textarea-custom {
    min-height: 90px;
    resize: none;
}

.form-check-label {
    font-size: 12px;
    color: #9f8d7f;
}

.send-btn {
    background: transparent;
    border: 1px solid #b59b83;
    border-radius: 30px;
    padding: 12px 28px;
    font-size: 11px;
    letter-spacing: 1px;
    color: #8d735f;
    transition: .3s;
}

.send-btn:hover {
    background: #8d735f;
    color: #fff;
}

.contact-card {
    background: #8b684f;
    color: #e8d8c7;
    padding: 70px 55px;
    min-height: 620px;
    display: flex;
    flex-direction: column;
}

.contact-card p {
    font-size: 30px;
    color: #C9B89C;
	line-height:1.8;
    margin-bottom: 50px;
}

.contact-info {
    margin-bottom: 30px;
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
}

.interior-image {
    position: relative;
    background: #000; /* or match your last image's dominant color */
    overflow: hidden;
}

.hero-btn {
    border-radius: 39.5px;
    border: 1px solid #FFF;
    background: rgba(255, 255, 255, 0.32);
    color: #FFF;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 111%;
    text-transform: uppercase;
    padding: 20px 40px 18px;
    text-decoration: none;
    display: inline-block;
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.hero-btn:hover {
    background: #FFF;
    color: #000;
    border-color: #FFF;
} 

#interior-preview {
    transition: opacity 0.35s ease;
    display: block;
    width: 100%;
}

.contact-info span {
   display: block;
    font-size: 20px;
    opacity: 1;
    color: #C9B89C;
    font-family: "Inter";
    margin-bottom: 5px;
}

.contact-info a {
    color: #C9B89C;
    text-decoration: none;
    font-size: 30px;
    font-family: "Inter";
}

.languages {
    margin-top: 50px;
    margin-bottom: 40px;
    font-family: Inter;
    font-weight: 400;
    text-align: center;
    color: #C9B89C;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 0%;
    opacity: .8;
}
.brand-name {
    font-size: 55px;
    font-family: "Inter";
    font-weight: 700;
    letter-spacing: 1px;
    color: #d7c0a1;
    margin: 0;
    margin-top: 40px;
}

@media (max-width: 991px) {
    .contact-title {
        font-size: 38px;
    }

    .contact-card {
        min-height: auto;
        padding: 50px 35px;
    }

    .brand-name {
        font-size: 36px;
    }
}

section.komfort-block {
    background: url(/wp-content/uploads/2026/06/1-1.jpg);
    padding: 100px 0;
    background-size: cover;
    background-repeat: no-repeat;
}


.product-details {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 10px 0;
}

.products-lists {
    padding: 0 50px;
} 

.product-item-lists p {
    color: #000;
    font-family: "'Baskerville'";
    font-size: 22px;
    font-style: italic;
    font-weight: 400;
    margin-top: 22px;
    line-height: 150%;
}

img.img-fluid.product-image-1 {
    margin-top: 100px;
    position: relative;
    z-index: 2;
}


.container-fluid {
    max-width: 1500px;
}



.map-imge-block .container-fluid {
    padding: 0;
}

img.img-fluid.product-image-5 {
    margin-top: -200px;
    /* max-width: 400px; */
    margin: -200px auto 0;
}

.map-detils-block {
    margin: 0px auto;
    text-align: center;
    max-width: 450px;
}

h5.map-block-title {
    text-align: left;
    color: #5C4128;
    font-family: Afterglow;
    font-size: 50px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    margin: 100px 0px 50px;

}

p.map-block-content {
color: #999189;
    font-family: "Baskerville";
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-align: left;
    margin-bottom: 100px;
    margin: 0 0px 100px;
}

section.komfort-block {
    padding-bottom: 180px;
}

img.img-fluid.product-image-4 {
    margin: 100px 0;
}

img.img-fluid.product-image-2 {
    margin-top: -50px;
    z-index: 1;
    position: relative;
}

img.img-fluid.product-image-3 {
    position: relative;
    margin-top: -50px;
    z-index: 9;
}

section.komfort-block {background-position: center;}



.product-item-lists {
    padding-bottom: 40px;
    border-bottom: 1px solid #BBA799;
    margin-bottom: 40px;
}


.materials-section{
                overflow:hidden;
                padding:250px 0;
            }

            .materials-section-two {
                    overflow: visible;
				padding-top:460px;
				padding-bottom: 100px;
            }

            .materials-section-two .container-fluid{
/*                 padding-left: 100px;
                padding-right: 100px; */
            }

            /* Left Card */
            .materials-content {
                background: #e7dfd4;
                padding: 130px 170px 130px 130px;
                margin-top: -200px;
                width: calc(100% + 100px);
            }

            .materials-title {
                font-family: 'Afterglow';
                font-size: 60px;
                line-height: 1.05;
                font-weight: 300;
                color: #28190B;
                margin-bottom: 35px;
            }

            .materials-text {
                color: #9a8c80;
                font-size: 28px;
                font-style: italic;
                margin: 0;
                font-family: 'Baskervville';
            }

            /* Moodboard */
            .moodboard-wrapper {
                position: relative;
                margin-left: -100px;
                z-index: 1;
            }

            /* Shared Style */

            .moodboard-wrapper img{
                width:100%;
                height:100%;
                object-fit:cover;
                display:block;
            }

            /* Responsive */
            @media (max-width:1600px){
                .materials-content {
                    padding: 100px 170px 100px 100px;
                }
                .materials-title {
                    font-size: 50px;
                }
                .materials-text {
                    font-size: 24px;
                }
            }

            @media (max-width:1500px){
                .materials-content {
                    padding: 80px 170px 80px 80px;
                }
                .materials-title {
                    font-size: 45px;
                }
            }
            
            @media (max-width:1400px){
                .materials-section-one {
                    padding-bottom: 200px;
                }
                .materials-content {
                    margin-top: -150px;
                    padding: 60px 170px 60px 60px;
                }  
                .materials-text {
                    font-size: 20px;
                }
             }
            
            @media (max-width:1199px){
                .materials-section-two .container-fluid {
                padding-left: 50px;
                padding-right: 50px;
                }
                .materials-content {
                    margin-top: -150px;
                    padding: 50px 170px 50px 50px;
                }
                .materials-text {
                    font-size: 16px;
                }
            }
            
            @media (max-width:991px){
               
                .materials-section-two .container-fluid {
                    padding-left: 0;
                    padding-right: 0;
                }
                .materials-content {
                    width: 100%;
                    margin-top: 0;
                    padding: 50px 15px;
                }
                .moodboard-wrapper {
                    margin-left: 0;
                }
            }
            
            @media (max-width:767px){
                .materials-content {
                    padding: 50px 15px;
                }
                .moodboard-wrapper{
                    transform:scale(.8);
                    transform-origin:center top;
                    height:380px;
                }
            }
        </style>



        <!-------------------------------------------------------- r-3nth ----------------------------------------------->
        <style>

            .section-tag{
                display:block;
                font-size:11px;
                letter-spacing:5px;
                text-transform:uppercase;
                color:#b4a393;
                margin-bottom:10px;
            }

            .section-title{
                font-family:"afterglow", serif;
                font-size:88px;
                font-weight:300;
                color:#5C4128;
                margin-bottom:12px;
                line-height:1.1;
            }

            .section-subtitle{
                color:#999189;
                font-size:24px;
    font-family: "Times Now";
    font-style: italic;
            }

            /* Image */
            .interior-image img{
                width:100%;
                display:block;
            }

            /* Right Side */
            .material-options{
                padding-left:20px;
            }

            .option-group{
                margin-bottom:45px;
            }

            .option-group h5{
                font-size:20px;
                color:#8e8279;
                margin-bottom:20px;
                font-family:"Times New Roman", serif;
            }

            .swatch-grid{
                display:flex;
                gap:24px;
            }

            .swatch-item{
                text-align:center;
            }

            .swatch-item p{
                margin-top:10px;
                color:#9f948b;
                font-size:14px;
            }

            .swatch{
                width:93px;
                height:93px;
                display:block;
            }
.option-group h5 {
    font-size: 28px;
    color: #000000;
    font-weight: 400;
    margin-bottom: 40px;
    font-family: 'Afterglow';
}
.interior-image,
.material-options{
    margin-top: 80px;
}
            /* Colors */
            .beige{
                background:#e6dfd1;
            }

            .anthracite{
                background:#444341;
            }

            .wood-light{
                background:linear-gradient(
                    45deg,
                    #caa87d,
                    #e3c7a0
                    );
            }

            .wood-dark{
                background:linear-gradient(
                    45deg,
                    #8f6845,
                    #b0845d
                    );
            }

            /* Responsive */
            @media(max-width:991px){

                .section-title{
                    font-size:48px;
                }

                .material-options{
                    padding-left:0;
                    margin-top:20px;
                }

                .swatch-grid{
                    justify-content:flex-start;
                }
            }

            @media(max-width:767px){

                .section-title{
                    font-size:34px;
                }

                .swatch-grid{
                    gap:18px;
                }

                .swatch{
                    width:45px;
                    height:45px;
                }
            }  


 .swatch-item.active .swatch-box{
        border:3px solid #000;
    }

   
    .materials-section-one .container-fluid {
        padding-left: 200px;
        padding-right: 200px;
    }
    .materials-heading {
        font-family: 'Afterglow';
        font-size: 128px;
        line-height: 1.05;
        font-weight: 300;
        color: #28190B;
    }
    .materials-description {
           line-height: 1.5;
    font-family: "'Baskerville'";
    font-style: italic;
    font-size: 26px;
    font-weight: 300;
    color: #8A7867;
    }

    .container.w-900.text-center.mb-5 {
    max-width: 1000px;
    margin: 0px auto;
} 
    .collage-item-1 {
        width: 40%;
        height: 700px;
        top: 0;
        left: 0;
        z-index: 2;
    }
    .collage-item-2 {
        width: 50%;
        top: 200px;
        right: 0;
        height: 500px;
        z-index: 2;
    }
    .collage-item-3 {
        width: 45%;
        height: 660px;
        z-index: 1;
        top: 100px;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
    }
    .collage-item-4 {
        width: 50%;
        top: 900px;
        left: 0;
        height: 530px;
    }
    .collage-item-5 {
        width: 40%;
        right: 0;
        top: 980px;
        height: 650px;
    }

    @media (max-width: 1700px){
        .materials-section.collage .container-fluid {
            padding-left: 100px;
            padding-right: 100px;
        }
    }
    @media (max-width: 1500px){
        .collage-item-1 {
            height: 600px;
        }
        .collage-item-2 {
            height: 400px;
        }
        .collage-item-3 {
            height: 560px;
        }
        .collage-item-4 {
            height: 430px;
            top: 800px;
        }
        .collage-item-5 {
            height: 550px;
            top: 880px;
        }
    }

    @media (max-width: 1400px){
        .materials-section {
            padding: 100px 0;
        }
        .materials-collage {
            min-height: 1200px;
        }
        .collage-item-1 {
            height: 500px;
        }
        .collage-item-2 {
            height: 300px;
        }
        .collage-item-3 {
            height: 460px;
        }
        .collage-item-4 {
            height: 330px;
            top: 650px;
        }
        .collage-item-5 {
            height: 450px;
            top: 730px;
        }
    }



  @media (max-width: 1370px){

        .container, .container-lg, .container-md, .container-sm, .container-xl
                 {
                   max-width: 1200px;
                }
           h6.footer-tagline {
                    font-size: 40px;
                }
       }       




    @media (max-width: 1199px){
        .materials-heading {
            font-size: 90px;
        }
        .materials-collage {
            min-height: 1100px;
        }
        .collage-item-1 {
            height: 450px;
        }
        .collage-item-2 {
            height: 250px;
        }
        .collage-item-3 {
            height: 410px;
        }
        .collage-item-4 {
            height: 280px;
            top: 600px;
        }
        .collage-item-5 {
            height: 400px;
            top: 680px;
        }
    }
    @media (max-width: 991px){
         .materials-section-one {
            padding-bottom: 100px;
        }
        .materials-section-one .container-fluid {
            padding-left: 0;
            padding-right: 0;
        }
        .materials-collage {
            min-height: auto;
        }
        .collage-item-1, .collage-item-2, .collage-item-3, .collage-item-4, .collage-item-5 {
            height: 450px;
        }
        
    }
    @media (max-width: 767px){

        a.hero-btn {
    display: none;
}
    .project-description-block {
        margin-bottom: 0px !important;
    }
        .materials-section {
            padding: 70px 0;
        }
        .materials-section-one {
        padding-bottom: 70px;
    }
        .materials-section-one .container-fluid {
            padding-left: 0;
            padding-right: 0;
        }
        .materials-section.collage .container-fluid {
            padding-left: 15px;
            padding-right: 15px;
        }
        .materials-heading {
            font-size: 55px;
        }
        .materials-description {
            font-size: 18px;
        }
        .collage-item-1, .collage-item-2, .collage-item-3, .collage-item-4, .collage-item-5 {
            height: 210px;
        }