.elementor-513 .elementor-element.elementor-element-4c94184{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:18px;--padding-bottom:16px;--padding-left:0px;--padding-right:0px;}.elementor-513 .elementor-element.elementor-element-4c94184:not(.elementor-motion-effects-element-type-background), .elementor-513 .elementor-element.elementor-element-4c94184 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#02010100;}.elementor-513 .elementor-element.elementor-element-739ec7f{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-513 .elementor-element.elementor-element-dac2871 img{width:35%;}.elementor-513 .elementor-element.elementor-element-dc05c80{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:flex-end;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-513 .elementor-element.elementor-element-1395f34 .elementor-menu-toggle{margin:0 auto;}.elementor-513 .elementor-element.elementor-element-1395f34 .elementor-nav-menu .elementor-item{font-family:"Ruda", Sans-serif;font-weight:400;}.elementor-513 .elementor-element.elementor-element-1395f34 div.elementor-menu-toggle{color:#fa57b6;}.elementor-513 .elementor-element.elementor-element-1395f34 div.elementor-menu-toggle svg{fill:#fa57b6;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-513 .elementor-element.elementor-element-739ec7f{--width:20%;}.elementor-513 .elementor-element.elementor-element-dc05c80{--width:70%;}}@media(max-width:767px){.elementor-513 .elementor-element.elementor-element-4c94184{--flex-wrap:nowrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-513 .elementor-element.elementor-element-dc05c80{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-513 .elementor-element.elementor-element-1395f34{margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}}/* Start custom CSS for container, class: .elementor-element-dc05c80 *//* -----------------------------------------------------
   PINK AFFE – Sticky Banana Navigation (Final Version)
------------------------------------------------------ */

/* 2) MAIN MENU WRAPPER
   → Add class "pinkaffe-menu" to the menu container */
.pinkaffe-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    position: relative;
    padding: 20px 0;
}

/* Remove Elementor’s green dots */
.pinkaffe-menu .elementor-item:before {
    content: none !important;
}

/* 3) TOP BRANCH LINE (GREY) */
.pinkaffe-menu:before {
    content: "";
    width: 100%;
    height: 4px;
 
    border-radius: 2px;
    position: absolute;
    top: 0;
    left: 0;
}

/* 4) MENU TEXT (PINK) */
.pinkaffe-menu .elementor-item {
    position: relative;
    padding-top: 20px;
    margin: 0 25px;
    font-weight: 600;
    color: #ff4fae !important; 
}

/* 5) BANANA DOT (YELLOW ALWAYS) */
.pinkaffe-menu .elementor-item:after {
    content: "";
    position: absolute;
    top: -18px;  /* hanging effect */
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 20px;
    background: #FFD94A !important;  /* YELLOW */
    border-radius: 50%;
    transition: transform .35s ease;
}

/* 6) HOVER → little swing animation */
@keyframes pinkaffe-banana-swing {
    0%   { transform: translateX(-50%) translateY(0) rotate(0); }
    40%  { transform: translateX(-50%) translateY(4px) rotate(10deg); }
    70%  { transform: translateX(-50%) translateY(-2px) rotate(-5deg); }
    100% { transform: translateX(-50%) translateY(0) rotate(0); }
}

.pinkaffe-menu .elementor-item:hover:after {
    animation: pinkaffe-banana-swing .45s ease-out forwards;
}

/* NAV: default blurred text */
header .elementor-nav-menu--main .elementor-item {
    filter: blur(2px);
    opacity: 0.6;
    transition: filter 0.3s ease, opacity 0.3s ease;
}

/* On hover OR active page: sharp + full opacity */
header .elementor-nav-menu--main .elementor-item:hover,
header .elementor-nav-menu--main .elementor-item.elementor-item-active {
    filter: blur(0);
    opacity: 1;
}


/* =========================================
   PINK AFFE – FULLSCREEN MOBILE MENU + NO SCROLL
   ========================================= */
@media (max-width: 1024px) {

  /* 1) Scroll lock ONLY when menu is open */
  html:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"]),
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"]) {
    overflow: hidden !important;
    height: 100vh !important;
    touch-action: none !important;
  }

  /* 2) Force the dropdown to be a real fullscreen overlay */
  /* Elementor can use different dropdown containers, so we target BOTH */
  #pinkaffe-menu .elementor-nav-menu--dropdown,
  #pinkaffe-menu .elementor-nav-menu__container.elementor-nav-menu--dropdown {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;

    background: #0e0e0e !important; /* fully opaque */
    opacity: 1 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    z-index: 999999 !important;
  }

  /* 3) Ensure the UL doesn’t keep a “panel width” */
  #pinkaffe-menu .elementor-nav-menu {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 28px !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  /* 4) Links */
  #pinkaffe-menu .elementor-nav-menu a {
    font-size: 28px !important;
    font-weight: 300 !important;
    letter-spacing: 0.08em !important;
    color: #e6dfd5 !important;
  }

  /* 5) Close / toggle always on top */
  #pinkaffe-menu .elementor-menu-toggle {
    position: fixed !important;
    top: 24px !important;
    right: 24px !important;
    z-index: 1000000 !important;
  }
}

/* =========================================
   PINK AFFE – FORCE MENU OVER EVERYTHING (FIX HEADING SHOWING)
   ========================================= */
@media (max-width: 1024px) {

  /* When menu is open -> bring the whole header above the page */
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header {
    position: relative !important;
    z-index: 2147483647 !important; /* max practical z-index */
  }

  /* Also force the dropdown itself to be top-most */
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  #pinkaffe-menu .elementor-nav-menu--dropdown,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  #pinkaffe-menu .elementor-nav-menu__container.elementor-nav-menu--dropdown {
    z-index: 2147483647 !important;
  }



  /* But keep the header visible */
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header {
    visibility: visible !important;
  }
}
@media (max-width: 1024px) {
  html:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"]),
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"]) {
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }
}

/* Pink Affe – injected mobile close button */
#pinkaffe-close-btn {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 2147483647;
  width: 52px;
  height: 52px;
  display: none;               /* shown via JS only when open */
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

#pinkaffe-close-btn::before {
  content: "✕";
  font-size: 34px;
  font-weight: 300;
  line-height: 1;
  color: #ff4fae;
}

#pinkaffe-close-btn{
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 2147483647;
  width: 52px;
  height: 52px;
  display: none;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#pinkaffe-close-btn::before{
  content:"✕";
  font-size:34px;
  font-weight:300;
  line-height:1;
  color:#ff4fae;
}
/* ==========================================================
   PINK AFFE – MOBILE ONLY PREMIUM MENU
   (does NOT touch desktop)
   ========================================================== */
@media (max-width: 1024px){

  :root{
    --pa-pink: #ff4fae;
    --pa-yellow: #FFD94A;
    --pa-ink: #0e0e0e;
    --pa-ink-2: #111111;
    --pa-text: #e6dfd5;
  }

  /* Fullscreen overlay: cinematic background + smooth intro */
  #pinkaffe-menu .elementor-nav-menu--dropdown,
  #pinkaffe-menu .elementor-nav-menu__container.elementor-nav-menu--dropdown{
    background:
      radial-gradient(900px 600px at 50% 28%, rgba(255,79,174,.10), transparent 62%),
      radial-gradient(700px 500px at 50% 70%, rgba(255,217,74,.07), transparent 60%),
      linear-gradient(180deg, var(--pa-ink), var(--pa-ink-2)) !important;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    /* entrance */
    opacity: 0;
    transform: translateY(10px) scale(.985);
    animation: paOverlayIn .38s cubic-bezier(.2,.8,.2,1) forwards;
  }

  @keyframes paOverlayIn{
    to { opacity:1; transform: translateY(0) scale(1); }
  }

  /* Menu list spacing */
  #pinkaffe-menu .elementor-nav-menu{
    gap: 30px !important;
    padding: 0 18px !important;
  }

  /* Mobile links: premium typography + staggered entrance */
  #pinkaffe-menu .elementor-nav-menu a{
    color: var(--pa-text) !important;
    font-size: 30px !important;
    font-weight: 300 !important;
    letter-spacing: .08em !important;

    position: relative;
    transform: translateY(10px);
    opacity: 0;
    animation: paItemIn .46s cubic-bezier(.2,.8,.2,1) forwards;
    will-change: transform, opacity;
  }

  /* Stagger */
  #pinkaffe-menu .elementor-nav-menu li:nth-child(1) a{ animation-delay: .10s; }
  #pinkaffe-menu .elementor-nav-menu li:nth-child(2) a{ animation-delay: .16s; }
  #pinkaffe-menu .elementor-nav-menu li:nth-child(3) a{ animation-delay: .22s; }
  #pinkaffe-menu .elementor-nav-menu li:nth-child(4) a{ animation-delay: .28s; }
  #pinkaffe-menu .elementor-nav-menu li:nth-child(5) a{ animation-delay: .34s; }
  #pinkaffe-menu .elementor-nav-menu li:nth-child(6) a{ animation-delay: .40s; }

  @keyframes paItemIn{
    to { opacity:1; transform: translateY(0); }
  }

  /* Hover/focus underline (works on desktop + keyboard, harmless on iOS) */
  #pinkaffe-menu .elementor-nav-menu a::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:-12px;
    width:0;
    height:2px;
    border-radius: 999px;
    background: rgba(255,79,174,.65);
    transform: translateX(-50%);
    transition: width .28s cubic-bezier(.2,.8,.2,1);
  }
  #pinkaffe-menu .elementor-nav-menu a:hover::after,
  #pinkaffe-menu .elementor-nav-menu a:focus-visible::after{
    width: 56%;
  }

  /* Tap feedback on iPhone */
  #pinkaffe-menu .elementor-nav-menu a:active{
    transform: translateY(2px);
    opacity: .92;
  }

  /* Optional: remove Elementor's background highlight on active item */
  #pinkaffe-menu .elementor-nav-menu a.elementor-item-active{
    color: #ffffff !important;
  }

  /* ==========================================================
     Mobile close button – premium glass pill + micro-animations
     (keep ONLY this block, remove duplicates)
     ========================================================== */
  #pinkaffe-close-btn{
    position: fixed;
    top: 18px;
    right: 18px;
    z-index: 2147483647;
    width: 54px;
    height: 54px;
    display: none; /* JS controls it */
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(255,79,174,.22);
    background: rgba(14,14,14,.35);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    border-radius: 999px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform .18s ease, background .18s ease, border-color .18s ease;
  }

  #pinkaffe-close-btn::before{
    content: "✕";
    font-size: 26px;
    font-weight: 400;
    line-height: 1;
    color: var(--pa-pink);
  }

  #pinkaffe-close-btn:hover{
    transform: scale(1.05);
    background: rgba(14,14,14,.50);
    border-color: rgba(255,79,174,.38);
  }

  #pinkaffe-close-btn:active{
    transform: scale(.97);
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce){
    #pinkaffe-menu .elementor-nav-menu--dropdown,
    #pinkaffe-menu .elementor-nav-menu a{
      animation: none !important;
      transform: none !important;
      opacity: 1 !important;
    }
    #pinkaffe-close-btn{ transition: none !important; }
  }
}

@media (max-width: 1024px){

  /* If any Elementor wrapper in the header has transform/filter,
     fixed children get constrained -> overlay becomes "half". */
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .elementor-element,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .e-con,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .elementor-container,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .elementor-section {
    transform: none !important;
    filter: none !important;
    perspective: none !important;
  }

  /* also remove clipping if any wrapper has overflow hidden */
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .elementor-element,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .e-con,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .elementor-container,
  body:has(#pinkaffe-menu .elementor-menu-toggle[aria-expanded="true"])
  .elementor-location-header .elementor-section {
    overflow: visible !important;
  }

  /* (optional) more robust fullscreen) */
  #pinkaffe-menu .elementor-nav-menu--dropdown,
  #pinkaffe-menu .elementor-nav-menu__container.elementor-nav-menu--dropdown{
    inset: 0 !important;      /* replaces top/left/right/bottom */
    width: 100vw !important;
    height: 100vh !important;
  }
}/* End custom CSS */