/*
 Theme Name:   Niki
 Theme URI:    
 Description:  
 Author:       
 Author URI:   
 Template:     generatepress
 Version:      0.1
*/
body {
   font-family: "mr-eaves-xl-sans", sans-serif;
}
/* THEME TWEAKS  */

/* Header padding with responsive clamp */
.site-header {
    padding-inline: clamp(1rem, 0.848rem + 0.758vw, 1.5rem);
}

/* Typography wrapping */
/* Balance headings and elements with `.balance` class */
:is(h1, h2, h3, h4, h5, h6),
.balance {
    text-wrap: balance;
}

/* Use pretty wrapping for body text elements */
p,
blockquote,
li {
    text-wrap: pretty;
}

/* Remove bottom margin from final paragraph */
p:last-child:last-of-type {
    margin-bottom: 0px;
}

/* UTILITIES */

/* Line Clamping */
.line-limit-3,
.line-limit-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-limit-3 {
    -webkit-line-clamp: 3;
}

.line-limit-2 {
    -webkit-line-clamp: 2;
}

/* Visually Hidden (accessible to screen readers) */
.visually-hidden:not(:focus):not(:active) {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

/* Smooth Transition Utility */
.transition {
    transition: all 0.25s ease-in-out;
}


/*  GP MENU ACCESSIBILITY TWEAKS */


/* 
   nur fuer Screenreader zu sehen
*/
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
/* 
   STRETCH LINK (from Bootstrap)
   Source: https://youtu.be/HBriBrnRlQE?si=DLiSXEiBHt6lw91l
   Note: Only use ONE link per card or this breaks!
*/

.stretch-link {
    position: relative;
}

.stretch-link a::after {
    content: '';
    position: absolute;
    inset: 0;
}

.stretch-link a:is(:focus-visible)::after {
    outline: 2px solid;
}

.stretch-link a:is(:hover, :focus) {
    outline: none;
}

/*  CONTAINER WRAPPER */

.site-wrapper {
    width: 100%;

    margin-inline: auto;
    background: var(--neutral-50);
}

/*  TYPOGRAPHY  */

/* Font Family Utilities */
.ff-body {
    font-family: var(--gp-font--body);
}

.ff-heading {
    font-family: var(--gp-font--headings);
}

/* Heading and utility class font assignment */
h1, h2, h3, h4, h5, h6,
[class^="fs-"] {
    font-family: var(--gp-font--headings);
}

.fs-p {
    font-family: var(--gp-font--body);
}
:root {
/* 18 22 */
  --fluid-body-font: clamp(1.125rem, 1.0673rem + 0.2564vw, 1.375rem);

/* 40 85 */
  --fluid-h1-font: clamp(2.5rem, 1.851rem + 2.8846vw, 5.3125rem);

/* 40 72 */
  --fluid-h2-font: clamp(2.5rem, 2.0385rem + 2.0513vw, 4.5rem);

  /* 30 40 */
   --fluid-h22-font: clamp(1.75rem, 1.5769rem + 0.7692vw, 2.5rem);

/* 18 30 */
  --fluid-h3-font: clamp(1.125rem, 0.9519rem + 0.7692vw, 1.875rem);
}

body {
  font-size: var(--fluid-body-font);
}

h1, .fs-h1 {
    font-size: var(--fluid-h1-font);
    font-weight: 900;
    color: var(--brand-primary);
    line-height: 1em;;
}

h2, .fs-h2 {
    font-size: var(--fluid-h2-font);
    font-weight: normal;
}
.fs-h22 {
    font-size: var(--fluid-h22-font);
    font-weight: normal;
}

h3, .fs-h3 {
    font-size: var(--fluid-h3-font);
    line-height: 1.1;
}

p, .fs-p {
    font-size: var(--fluid-body-font);
}

/* Navigation */


.header-sticky {
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}
.header-sticky .btn_big {
    padding-top:10px;
    padding-bottom: 10px;
}
.header-sticky .header_inner {
    padding-top: 5px;
    padding-bottom: 5px;
}
.header-sticky .logo-container svg {
    width: 100px;
}

.mylink::after {
  content: '';
  display: inline-block;
  width: 1.1em;              /* skaliert mit der Schrift */
  height: 1.1em;
  margin-left: 0.35em;
  vertical-align: middle;
  /* Icon-Farbe = Textfarbe */
  background-color: currentColor;
  -webkit-mask: no-repeat center / contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-420.5 297.5 25 25'><g transform='translate(-412 -902)'><g transform='translate(7.755 1.433)'><line fill='none' stroke='white' stroke-width='2' stroke-linecap='round' x1='-10.397' y1='1210.567' x2='1.388' y2='1210.567'/><path fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M-3.423,1205.758l4.81,4.81l-4.81,4.81'/></g><g transform='translate(412 902)'><circle fill='none' cx='-408' cy='310' r='12.5'/><circle fill='none' stroke='white' stroke-width='2' cx='-408' cy='310' r='11.5'/></g></g></svg>");
          mask: no-repeat center / contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-420.5 297.5 25 25'><g transform='translate(-412 -902)'><g transform='translate(7.755 1.433)'><line fill='none' stroke='white' stroke-width='2' stroke-linecap='round' x1='-10.397' y1='1210.567' x2='1.388' y2='1210.567'/><path fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M-3.423,1205.758l4.81,4.81l-4.81,4.81'/></g><g transform='translate(412 902)'><circle fill='none' cx='-408' cy='310' r='12.5'/><circle fill='none' stroke='white' stroke-width='2' cx='-408' cy='310' r='11.5'/></g></g></svg>");
}


.gb-navigation--open .sub .gb-menu-link {
    border: 0px solid transparent !important;
    font-size: 18px;
    font-weight: 200;
    padding: 3px 0 !important;
}
ul.sub-menu {
    padding-top: 10px;
    padding-bottom: 12px;
    background: var(--brand-primary);
    left: 0px !important;
    padding-top:25px;
}
.header-sticky ul.sub-menu {
    padding-top:5px;
}
#menu-offcanvasmenue ul.sub-menu {
    background: white !important;
}
ul.sub-menu li a {
    padding-top: 10px ;
    padding-bottom: 10px ;
}
ul.sub-menu li:is(:hover, :focus-within) a {
    color:black !important;
}

.pill {
  align-items: center;
  color: white !important;
  display: inline-flex;
  font-size: 1rem;
  font-weight: 400;
  text-decoration: none;
  transition: all 0.25s ease-in-out 0s;
  border-radius: 100vw;
}
.pill a {
 padding: 2px 13px 0px !important;
 border: 0px solid transparent !important;
}
.pill.green {
 background-color: var(--green) !important;
}
.pill.lila {
 background-color: var(--lila) !important;
}
.pill.pink {
 background-color: var(--pink) !important;
}
.pill.blau {
 background-color: var(--blau) !important;
}
.pill.orange {
 background-color: var(--orange) !important;
}
.pill.beige {
 background-color: var(--beige) !important;
}
.pill.gelb {
 background-color: var(--pastell-orange) !important;
}
[data-filter="*"] {
  background-color: var(--neutral-200);
}
[data-filter="dienstleistungen"] {
  background-color: var(--blau);
}
[data-filter="friseur-kosmetik"] {
  background-color: var(--lila);
}
[data-filter="essen-trinken"] {
  background-color: var(--green);
}
[data-filter="einzelhandel"] {
  background-color: var(--pink);
}
[data-filter="mode"] {
  background-color: var(--orange);
}
[data-filter="sport-bildung-und-finanzen"] {
  background-color: var(--pastell-orange);
}
[data-filter="elektronik-und-telekommunikation"] {
  background-color: var(--beige);
}
.finder_nav_pill[data-filter="*"] {
    --filter-color: var(--neutral-200);
}

.finder_nav_pill[data-filter="dienstleistungen"] {
    --filter-color: var(--blau);
}

.finder_nav_pill[data-filter="friseur-kosmetik"] {
    --filter-color: var(--lila);
}

.finder_nav_pill[data-filter="essen-trinken"] {
    --filter-color: var(--green);
}

.finder_nav_pill[data-filter="einzelhandel"] {
    --filter-color: var(--pink);
}

.finder_nav_pill[data-filter="mode"] {
    --filter-color: var(--orange);
}

.finder_nav_pill[data-filter="sport-bildung-und-finanzen"] {
    --filter-color: var(--pastell-orange);
}

.finder_nav_pill[data-filter="elektronik-und-telekommunikation"] {
    --filter-color: var(--beige);
}

/* ============================================
   Initialzustand
   ============================================ */

.finder_nav_pill {
    background-color: var(--filter-color);
}


/* ============================================
   Hover
   ============================================ */

.finder_nav_pill:is(:hover) {
    background-color: var(--brand-primary);
    color:white
}
.finder_nav_pill:is( :focus) {
    background-color: var(--brand-primary);
    color:black
}

/* ============================================
   Wenn ein echter Kategorie-Filter aktiv ist
   ============================================ */

.finder_nav:has(.finder_nav_pill.is-active:not([data-filter="*"]))
.finder_nav_pill:not(.is-active) {
    background-color: var(--neutral-200);
}


/* ============================================
   Aktiver Kategorie-Button
   behält seine ursprüngliche Farbe
   ============================================ */

.finder_nav_pill.is-active {
    background-color: var(--filter-color);
}


/* ============================================
   Hover über ausgegrauten Button
   ============================================ */

.finder_nav:has(.finder_nav_pill.is-active:not([data-filter="*"]))
.finder_nav_pill:not(.is-active):is(:hover, :focus) {
    background-color: var(--filter-color);
    color: #000 !important;
}



#menu-offcanvasmenue li.entdecken ul {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  padding-bottom: 20px;
  row-gap: 10px;
  column-gap: 0px;
}
#menu-offcanvasmenue li.about ul {
  display: block !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  padding-bottom: 20px;
  padding-top: 0;
  row-gap: 10px;
  column-gap: 0px;
}
#menu-offcanvasmenue li.about ul li {
   border-bottom: 0px solid transparent !important;
}
#menu-offcanvasmenue li {
    border-bottom: 1px solid var(--neutral-200) !important;
    margin-left: 16px;
    margin-right: 16px;
}

.menu-item-has-children .gb-menu-link {
    border-bottom: 0px solid transparent !important;
 }


#menu-footer_menue {
  list-style: none;
  padding: 0;
  margin: 0;
}

#menu-footer_menue li {
  text-align: left;       /* Menüpunkte linksbündig */
}

#menu-footer_menue li a.gb-menu-link {
  display: inline-flex;   /* Text + Pfeil in einer Linie */
  align-items: center;    /* Vertikal zentrieren */
  gap: 4px;               /* Abstand zwischen Text und Pfeil */
  text-decoration: none;  /* optional: keine Unterstreichung */
  color: inherit;         /* Textfarbe übernehmen */
}
 
#menu-footer_menue li a.gb-menu-link::after {
  content: '';
  display: inline-block;
  width: 12.4px;
  height: 12px;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="12.401" height="11.994" viewBox="0 0 12.401 11.994"%3E%3Cg transform="translate(-466.052 -6353.003)"%3E%3Cpath d="M0,0,5.29,5.29,10.58,0" transform="translate(471.749 6364.29) rotate(-90)" fill="none" stroke="%23fff" stroke-width="2"/%3E%3Cline y2="11.006" transform="translate(466.052 6359.062) rotate(-90)" fill="none" stroke="%23fff" stroke-width="2"/%3E%3C/g%3E%3C/svg%3E');
  background-size: contain;
  background-repeat: no-repeat;
}

#menu-footer_menue li.footer_main a.gb-menu-link {
  font-weight: 800;
  color: #FFD9EB;
}
#menu-footer_menue li.footer_main a.gb-menu-link::after {
  background-image: none;
}
/* Shop Ticker */
.services-ticker-block {
  position: relative;
  display:flex; 
  align-items:center;
 
}

.stb_line_single {
  position: relative;
  white-space: nowrap;
  padding: 0;
  will-change: transform;

  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px;
  flex-shrink: 0;
 
}
.stb-item {
  padding: 0;
  font-size: 12px;
  display: inline-block;
  margin-right: 3rem;
 
  
  width: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px;
  flex-shrink: 0;
  background: white;
  border-radius: 10px;
}
.stb-item img {
  max-width: 100%;
  height: auto;
}
.stb-item .stb-title-hidden {
    display: none; /* oder: position:absolute; ... für Screen-Reader sichtbar lassen */
}
/* Shop Ticker ENDE */


/* Herz Animation  */
  #heartContainer { position: relative; }
  .mini-heart {
    position: absolute;
    bottom:50px;
    pointer-events: none;
    color: #e05;        /* gleiche Farbe wie das große Herz */
    width: 24px;
    height: 24px;
  }

/* Herz Animation  ENDE */
@media (max-width: 444px) {
.lageplan_shop_name {
    font-size:16px !important;
}
}

.lageplan_shop_link {
    height: 30px;
    line-height: 0.9;
    margin-bottom: 0;
}
.lageplan_shop_link.is-highlighted {
    /* color: var(--brand-primary); */
    font-weight: 600;
}
.lageplan_shop_link.links {
  text-align: right;
}
.shopfinder_loop .lageplan_shop_link {
    height: 30px;
    line-height: 1.2;
    font-size: 18px;
    margin-bottom: 0;
    padding: 0px 10px;
}
/* ── LAGEPLANANSICHT ───────────────────────────────────────── */

/* Leerstellen */
.leer span.gb-shape svg , [data-id="Leer"] span.gb-shape svg {
    /* color: #c8c7c7 !important; */
}
.leer .lageplan_shop_name, [data-id="Leer"] .lageplan_shop_name {
    color: transparent !important;
    display:none !important;
}
[data-id="Leer"] {
    color: transparent !important;
    display:none !important;
}
.finder_grid_text [data-cats="leer"] {
  display:none !important;

}



.shop-item-img-cont, .img-cont, .header_shop {
    position: relative;
}

.shop-item-img-cont::after, .img-cont::after, .header_shop::after {
    content: "KI-generiert";
    position: absolute;
    bottom: 30px;
    right: -29px;
    transform: translateY(-50%) rotate(-90deg);
    transform-origin: center center;

    font-size: 12px;
    line-height: 1;
    font-weight: 500;
    letter-spacing: 0.06em;
    background: #ffffffc4;
    color: #635f61;
    padding: 0 3px 3px 3px;
    border-radius: 5px 5px 0 0;
    /*
    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.95),
        0 0 4px rgba(0, 0, 0, 0.8);
*/


    white-space: nowrap;
    z-index: 2;
}
.img-cont::after {
   bottom: 60px !important;
}





.active {
    color: #e05 !important;
    background-color: var(--neutral-100);
}
.shopfinder_loop .lageplan_shop_link.rechts.first {
    height:15px;
    color:transparent;
}
.shopfinder_loop .rechts .gb-shape svg, .shopfinder_loop .links .gb-shape svg {
  width: 9px;
}
.shopfinder_loop .links .gb-shape {
  transform: translate3d(15px,0px,0px) ;
}
.shopfinder_loop .rechts .gb-shape {
  transform: translate3d(-15px,0px,0px);
}
@media (max-width: 440px) {
    .shopfinder_loop .lageplan_shop_link.rechts.first {
        height:11px;
        color:transparent;
    }
    .shopfinder_loop .lageplan_shop_link {
        height: 22px;
        font-size: 14px;
        line-height: 0.9;
    }
    .shopfinder_loop .rechts .gb-shape svg, .shopfinder_loop .links .gb-shape svg {
        width: 7px !important;
    }
    .shopfinder_loop .links .gb-shape {
        transform: translate3d(14px,0px,0px) ;
    }
    .shopfinder_loop .rechts .gb-shape {
        transform: translate3d(-14px,0px,0px);
    }
    .shopfinder_loop .lageplan_col_heading {
        row-gap: 0px !important;
    }

}
.shop-item-shopfinder {
    cursor: pointer;
}
/* folgende Seiten bekommen in der mobilen Ansicht einen anderen Header */
@media (max-width: 1002px) {
    .page-essen-trinken .gb-site-header {
        background-color: transparent !important;
        position: absolute !important;
    }
    .page-shopping .gb-site-header {
        background-color: transparent !important;
        position: absolute !important;
    }
    .page-beauty .gb-site-header {
        background-color: transparent !important;
        position: absolute !important;
    }
    .page-alltaegliches .gb-site-header {
        background-color: transparent !important;
        position: absolute !important;
    }
}

/* Headerbilder  */
.header_video {
    background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%);
}
.header_shop {
    background-blend-mode: normal,normal;
}
.page-shopping .header_shop {
    background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-shopping.jpg) top center /cover no-repeat;
}
.page-beauty .header_shop {
    background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-beauty.jpg) center center /cover no-repeat;
}
.page-alltaegliches .header_shop {
    background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-alltaegliches.jpg) top center /cover no-repeat;
}
.page-essen-trinken .header_shop {
    background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-essen-trinken.jpg) top center /cover no-repeat;
}

@media (max-width: 1002px) {
    .page-shopping .header_shop {
        background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-shopping-mobil.jpg) top center /cover no-repeat;
    }
    .page-beauty .header_shop {
        background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-beauty-mobil.jpg) center center /cover no-repeat;
    }
    .page-alltaegliches .header_shop {
        background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-alltaegliches-mobil.jpg) top center /cover no-repeat;
    }
    .page-essen-trinken .header_shop {
        background: linear-gradient(180deg,rgba(0,0,0,0.32) 0%,rgba(255,255,255,0) 52%,rgba(0,0,0,0.48) 100%),url(/wp-content/uploads/2026/04/header-essen-trinken-mobil.jpg) top center /cover no-repeat;
    }
}

/* video Seite 1 */
.background-video {
    position: absolute;
    opacity: 0.5;
}
video[poster] {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.background-video-content  {
    text-decoration: none !important;
}




.swiper-free-mode > .swiper-wrapper {
    transition-timing-function: linear  !important;
}



.c-carousel {
  overflow-x: hidden;
  position: relative;
  width: 100%;
}

.c-carousel__wrapper.swiper {
  position: static;
}

.c-carousel__inner-wrapper.swiper-wrapper {
  display: flex;
  align-items: center;
}

.c-carousel img {
  margin: 0 auto;
  max-height: 80px;
}


