.elementor-37 .elementor-element.elementor-element-1275047{--display:flex;--min-height:379px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:1;--margin-top:-81px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-37 .elementor-element.elementor-element-1275047:not(.elementor-motion-effects-element-type-background), .elementor-37 .elementor-element.elementor-element-1275047 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://guelbahar.de/wp-content/uploads/2025/08/plisses20mm-11.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-37 .elementor-element.elementor-element-1275047::before, .elementor-37 .elementor-element.elementor-element-1275047 > .elementor-background-video-container::before, .elementor-37 .elementor-element.elementor-element-1275047 > .e-con-inner > .elementor-background-video-container::before, .elementor-37 .elementor-element.elementor-element-1275047 > .elementor-background-slideshow::before, .elementor-37 .elementor-element.elementor-element-1275047 > .e-con-inner > .elementor-background-slideshow::before, .elementor-37 .elementor-element.elementor-element-1275047 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(90deg, #FFFFFF63 25%, #FFFFFF00 69%);}.elementor-37 .elementor-element.elementor-element-eaf9d94{--display:flex;--min-height:365px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-37 .elementor-element.elementor-element-dbd3de4{text-align:center;}.elementor-37 .elementor-element.elementor-element-dbd3de4 .elementor-heading-title{font-family:"Playfair Display", Sans-serif;font-size:4.5rem;font-weight:600;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-37 .elementor-element.elementor-element-14d664a{text-align:center;font-family:"Helvetica", Sans-serif;font-size:18px;font-weight:500;text-shadow:0px 0px 10px rgba(0,0,0,0.3);color:#353535;}.elementor-37 .elementor-element.elementor-element-28b3ad2{--display:flex;--min-height:670px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--padding-top:50px;--padding-bottom:100px;--padding-left:50px;--padding-right:50px;}.elementor-37 .elementor-element.elementor-element-28b3ad2:not(.elementor-motion-effects-element-type-background), .elementor-37 .elementor-element.elementor-element-28b3ad2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-3b8be30 );}.elementor-37 .elementor-element.elementor-element-ae03e20{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(max-width:1024px){.elementor-37 .elementor-element.elementor-element-1275047{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-110px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-37 .elementor-element.elementor-element-eaf9d94{--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;}}@media(max-width:767px){.elementor-37 .elementor-element.elementor-element-1275047:not(.elementor-motion-effects-element-type-background), .elementor-37 .elementor-element.elementor-element-1275047 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://guelbahar.de/wp-content/uploads/2025/08/plisses20mm-11.jpg");background-position:center center;}.elementor-37 .elementor-element.elementor-element-1275047{--min-height:346px;--overlay-opacity:0.8;}.elementor-37 .elementor-element.elementor-element-eaf9d94{--min-height:0px;--padding-top:150px;--padding-bottom:50px;--padding-left:30px;--padding-right:30px;}.elementor-37 .elementor-element.elementor-element-dbd3de4 .elementor-heading-title{font-size:2.4rem;}.elementor-37 .elementor-element.elementor-element-14d664a{font-size:16px;}.elementor-37 .elementor-element.elementor-element-28b3ad2{--padding-top:50px;--padding-bottom:50px;--padding-left:10px;--padding-right:10px;}}@media(min-width:768px){.elementor-37 .elementor-element.elementor-element-1275047{--content-width:1441px;}}/* Start custom CSS for html, class: .elementor-element-236d312 */* { box-sizing: border-box; }

.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(300px,1fr));
  gap: 32px;
}

.product-card {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 5px 20px rgba(0,0,0,0.1);
  transition: all 0.5s ease;
  cursor: pointer;
}

.product-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

.product-image {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
}

.product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s ease;
}

.product-card:hover .product-image img {
  transform: scale(1.1);
}

.image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.2), transparent);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.product-card:hover .image-overlay {
  opacity: 1;
}

.product-content {
  padding: 24px;
}

.product-content h3 {
  font-size: 20px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 12px;
  transition: color .3s ease;
}

.product-card:hover .product-content h3 {
  color: #555;
}

.product-content p {
  font-size: 15px;
  color: #6b7280;
  line-height: 1.6;
  margin-bottom: 16px;
}

.product-content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 24px 0;
}

.product-content ul li {
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 8px;
}

.product-content ul li span {
  display: block;
  width: 8px;
  height: 8px;
  background: #000;
  border-radius: 50%;
  margin-right: 12px;
  flex-shrink: 0;
}

.more-link {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
  color: #000;
  transition: color .3s ease;
}

.more-link svg {
  width: 16px;
  height: 16px;
  margin-left: 6px;
  transition: transform .3s ease;
}

.product-card:hover .more-link {
  color: #555;
}

.product-card:hover .more-link svg {
  transform: translateX(4px);
}
/* scoped reset */
.produkte-gulbahar *, .produkte-gulbahar *::before, .produkte-gulbahar *::after { box-sizing: border-box; }

/* FILTER-PILLS */
.produkte-gulbahar .produkte-gulbahar-filters{
  display:flex; flex-wrap:wrap; gap:14px; margin:8px 0 28px;
}
.produkte-gulbahar .produkte-gulbahar-btn{
  appearance:none;
  border:1px solid #e6dfcc;
  background:#ffffff;

  padding:10px 16px;
  border-radius:14px;
  font-weight:600;
  cursor:pointer;
  transition:transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.produkte-gulbahar .produkte-gulbahar-btn:hover{ transform:translateY(-1px); }
.produkte-gulbahar .produkte-gulbahar-btn.is-active{
  background:#cdbb8b !important;
  color:#000000 !important;
  border-color:#cdbb8b !important;
}


.produkte-gulbahar .produkte-gulbahar-filters{
  display:flex;
  flex-wrap:nowrap;           /* eine Zeile */
  overflow-x:auto;            /* swipebar */
  -webkit-overflow-scrolling: touch;
  gap:12px;
  margin:8px 0 16px;
  padding:4px 2px 8px;
  scrollbar-width:none;       /* Firefox */
  position:relative;
}
.produkte-gulbahar .produkte-gulbahar-filters::-webkit-scrollbar{ display:none; } /* Chrome/Safari */

.produkte-gulbahar .produkte-gulbahar-btn{
  appearance:none;
  border:1px solid #000 !important;
  background:#ffffff !important;
  color:#000 !important;
  padding:10px 16px;
  border-radius:14px;
  font-weight:500;
  cursor:pointer;
  transition:transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease;
  flex:0 0 auto;              /* verhindert Umbruch */
  white-space:nowrap;         /* Text bleibt in einer Zeile */
}
.produkte-gulbahar .produkte-gulbahar-btn:hover{ transform:translateY(-1px); }
.produkte-gulbahar .produkte-gulbahar-btn.is-active{
  background:#000 !important;
  color:#fff !important;
  border-color:#cdbb8b !important;
}


@media (min-width: 768px){
  .produkte-gulbahar .produkte-gulbahar-filters{
    overflow:visible;
    flex-wrap:wrap;
    gap:14px;
    margin:8px 0 28px;
    padding:0;
  }
}


.produkte-gulbahar .produkte-gulbahar-hidden{ display:none !important; }


.produkte-gulbahar .product-grid{
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
}


@media (min-width: 1024px){
  .produkte-gulbahar .product-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-371f53e */>
    /* ------------------ Section Wrapping ------------------ */
    .feature-section{
      position: relative;
      overflow: hidden;
      isolation: isolate;
      color: #0f172a;
    }
    .feature-section .bg-layer{
      position: absolute;
      inset: 0;
      z-index: -1;
      background-image: linear-gradient(135deg, #f5efe3, #ffffff 40%, #ece3d2);
    }
    .feature-section .blob{
      position: absolute;
      right: -12rem;
      bottom: -12rem;
      width: 40rem;
      height: 40rem;
      opacity: .3;
      color: #ece3d2;
    }

    /* ------------------ Layout ------------------ */
    .feature-section .container{
      max-width: 80rem;             /* 1280px */
      margin: 0 auto;
      padding: 5rem 1rem;
      display: grid;
      grid-template-columns: 1fr;   /* Mobile/Tablet: Text und Bilder übereinander */
      gap: 2.5rem;
      align-items: center;
    }
    @media (min-width: 640px){
      .feature-section .container{ padding: 5rem 1.5rem; }
    }
    @media (min-width: 1024px){
      .feature-section .container{
        padding: 7rem 2rem;
        grid-template-columns: repeat(12, minmax(0, 1fr));
      }
      .feature-section .text{ grid-column: span 6 / span 6; }
      .feature-section .collage{ grid-column: span 6 / span 6; }
    }

    /* ------------------ Textblock ------------------ */
    .text{
      text-align: center;           /* Mobile/Tablet: mittig */
      margin-inline: auto;
      max-width: 46rem;
    }
    @media (min-width:1024px){
      .text{ text-align: left; }    /* Desktop: linksbündig */
    }

    .eyebrow{
      font-size: .8125rem;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: #8f6f3c;
    }
    .headline{
      margin-top: .75rem;
      font-family: "Playfair Display", Georgia, "Times New Roman", serif;
      font-weight: 700;
      line-height: 1.05;
      font-size: clamp(2rem, 2.6vw + 1rem, 2.5rem);
    }
    .lead{
      margin-top: 1.25rem;
      font-size: 1.125rem;
      color: #334155;
    }

    .actions{
      margin-top: 2rem;
      display: flex;
      flex-wrap: wrap;
      gap: .75rem;
      justify-content: center;      /* Mobile/Tablet: mittig */
    }
    @media (min-width:1024px){
      .actions{ justify-content: flex-start; }
    }
    .btn{
      display: inline-block;
      padding: .875rem 1.25rem;
      border-radius: 8px;
      font-weight: 400;
      line-height: 1;
      text-decoration: none;
      transition: background-color .2s ease, color .2s ease, border-color .2s ease, filter .2s ease, transform .1s ease;
      will-change: transform;
    }
    .btn:hover{ transform: translateY(-1px); }
    .btn:active{ transform: translateY(0); }
    
    
    .btn2:hover{
        color:#fff;
    }
    
    .btn-white:hover{
        color:#000;
    }
    
    /* Schwarz/Weiß Buttons */
    .btn-white{
      background: #ffffff;
      color: #000000;
      border: 1px solid #000000;
    }
    .btn-white:hover{ background: #f5f5f5; }
    .btn-black{
      background: #000000;
      color: #ffffff;
      border: 1px solid #000000;
    }
    .btn-black:hover{ filter: brightness(1.1); }

    .meta{
      margin-top: 1.25rem;
      display: flex;
      gap: 1.5rem;
      flex-wrap: wrap;
      color: #475569;
      font-size: .9375rem;
      justify-content: center;      /* Mobile/Tablet: mittig */
    }
    @media (min-width:1024px){
      .meta{ justify-content: flex-start; }
    }
    .meta .dot{
      display: inline-flex;
      align-items: center;
      gap: .5rem;
    }
    .meta .dot i{
      width: .5rem; height: .5rem;
      border-radius: 999px;
      background: #10b981;
      display: inline-block;
    }

    /* ------------------ Collage ------------------ */
    /* WICHTIG: Immer 3 Spalten – auch auf Mobil – für gleiche Anordnung wie Desktop */
    .collage{
      display: grid;
      grid-template-columns: repeat(3, 1fr);  /* <- 3 Spalten auf ALLEN Breakpoints */
      gap: 1rem;
      width: 100%;
    }
    .collage .tile{
      position: relative;
      border-radius: 1rem;
      background: #eee center/cover no-repeat;
      box-shadow:
        0 12px 20px -8px rgba(0,0,0,.15),
        0 6px 12px -8px rgba(0,0,0,.08);
    }
    /* Spannen wie am Desktop beibehalten */
    .collage .tile.wide{ grid-column: span 2; aspect-ratio: 4 / 3; }
    .collage .tile.tall{ grid-column: span 1; aspect-ratio: 4 / 5; }

    /* Optional: auf sehr kleinen Geräten ein wenig mehr Höhe geben,
       damit die Thumbnails nicht zu klein wirken */
    @media (max-width: 420px){
      .collage .tile.wide{ aspect-ratio: 3 / 2; } /* etwas höher */
      .collage .tile.tall{ aspect-ratio: 3 / 4; } /* etwas höher */
    }

    /* Fallback ohne aspect-ratio */
    @supports not (aspect-ratio: 1 / 1){
      .collage .tile{ padding-top: 75%; }
      .collage .tile.tall{ padding-top: 125%; }
      .collage .tile > *{ position:absolute; inset:0; }
    }

    /* Motion Pref */
    @media (prefers-reduced-motion: reduce){
      .btn{ transition: none; }
    } /* dunkler, kontrastreicher Hintergrund – overflow-sicher */
    .cta-section{
      position: relative;
      overflow: hidden;
      color: #f8fafc; /* Basis-Schrift hell */
    background: radial-gradient(80rem 80rem at 100% 120%, rgb(0 0 0 / 15%) 0%, rgb(0 0 0 / 0%) 60%), linear-gradient(180deg, #282727 0%, #282727 60%, #282727 100%);
    }

    /* Container-Abstände analog zu deinen anderen Sektionen */
    .cta-section .container{
      max-width: 80rem;
      margin: 0 auto;
      padding: 5rem 1rem;
    }
    @media (min-width:640px){
      .cta-section .container{ padding: 5rem 1.5rem; }
    }

    /* Inhalt zentriert halten */
    .cta-content{
      text-align: center;
      margin: 0 auto;
      max-width: 46rem;
    }

    /* Farb-Overrides nur innerhalb des CTA (kein globales Duplizieren) */
    .cta-section .eyebrow{ color: #e5e7eb; opacity: .9; }
    .cta-section .headline{ color: #ffffff; }
    .cta-section .lead{ color: #cbd5e1; }

    /* Buttons mittig (auch mobil) */
    .cta-actions{
      margin-top: 1.75rem;
      display: flex;
      justify-content: center;
      gap: .75rem;
      flex-wrap: wrap;
    }/* End custom CSS */