.elementor-73 .elementor-element.elementor-element-4fbe04ba{--display:flex;--min-height:72px;--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-around;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--z-index:100;}.elementor-widget-theme-site-logo .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-73 .elementor-element.elementor-element-7318b601 img{width:140px;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );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-73 .elementor-element.elementor-element-16dd1f1c .elementor-menu-toggle{margin-left:auto;}.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-73 .elementor-element.elementor-element-4fbe04ba{--content-width:1200px;}}@media(max-width:1024px){.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:767px){.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-primary-font-size );}}/* Start custom CSS *//* ===== LYVES — Cinematic Header (Elementor Nav) =====
   Apply to the header wrapper (give it class "site-header" in Elementor).
   This replaces earlier header CSS.
====================================================== */

/* Brand color (edit once) */
.site-header{ --accent:#ff7a2a; --pill:rgba(255,255,255,.08); }

/* Base header: transparent -> subtle glass when sticky */
.site-header{
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background .25s, border-color .25s, box-shadow .25s;
  z-index:100;
}
.elementor-sticky--effects.site-header{
  background:rgba(12,12,12,.45);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 6px 28px rgba(0,0,0,.35);
}

/* Align the menu (desktop) */
.site-header .elementor-nav-menu{
  display:flex;
  align-items:center;
  justify-content:center;       /* center the items */
  gap:clamp(18px, 3.8vw, 48px); /* generous but responsive spacing */
}

/* Menu links: no size change on hover (no jump) */
.site-header .elementor-nav-menu a.elementor-item{
  color:#fff;
  font-weight:700;
  font-size:clamp(14px, 1.05vw, 18px);
  letter-spacing:.02em;
  line-height:1;
  padding:.9rem 1rem;
  border-radius:999px;
  position:relative;
  text-decoration:none;
  /* lock dimensions so hover never changes box size */
  box-sizing:border-box;
}

/* Active pill (current page) */
.site-header .elementor-nav-menu .elementor-item-active{
  background:var(--pill);
}

/* Cinematic underline (single line, animated, no growth) */
.site-header .elementor-nav-menu a.elementor-item::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:.15rem;                 /* sits below the text, not baseline */
  height:3px;
  width:0;
  transform:translateX(-50%);
  background:linear-gradient(90deg, #ffb87f 0%, var(--accent) 60%, #ff8b48 100%);
  border-radius:3px;
  opacity:0;
  transition:width .26s ease, opacity .26s ease;
  filter:drop-shadow(0 6px 12px rgba(255,122,42,.25));
}

/* Show underline on hover & active — still no size change */
.site-header .elementor-nav-menu a.elementor-item:hover::after,
.site-header .elementor-nav-menu .elementor-item-active::after{
  width:66%;
  opacity:1;
}

/* Remove any transform/scale on hover to prevent "jump" */
.site-header .elementor-nav-menu a.elementor-item:hover{
  transform:none;
}

/* ---------- Mobile / tablet ---------- */
@media (max-width:1024px){
  /* put hamburger on the right */
  .site-header .elementor-menu-toggle{
    margin-left:auto;
    order:2;
  }

  /* dropdown panel with glass look */
  .site-header .elementor-nav-menu--dropdown{
    background:rgba(10,10,10,.95);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.10);
    border-radius:14px;
    right:0; left:auto;          /* open from right */
    padding:8px;
  }

  /* bigger touch targets */
  .site-header .elementor-nav-menu--dropdown a.elementor-item{
    font-size:16px;
    padding:12px 14px;
  }

  /* simpler dropdown (underline off in the dropdown) */
  .site-header .elementor-nav-menu--dropdown a.elementor-item::after{
    display:none;
  }
}

/* ---------- Safety: neutralize Elementor’s default underline if present ---------- */
.site-header .elementor-nav-menu a.elementor-item .e-n-menu-title:after,
.site-header .elementor-nav-menu a.elementor-item:before{
  content:none !important;
}
/* ===== MOBILE & TABLET ONLY — side drawer, vertical links, X close ===== */
@media (max-width:1024px){

  /* Keep the logo bigger and pinned left on mobile */
  .site-header .site-logo img,
  .site-header .site-logo svg{
    height: 28px;                 /* tweak if needed: 26–32px */
    width: auto;
    display:block;
  }

  /* Make the header row space-between:
     logo left, hamburger right */
  .site-header .elementor-container,
  .site-header .elementor-row{
    align-items:center;
    justify-content:space-between;
  }

  /* Hamburger on the right */
  .site-header .elementor-menu-toggle{
    margin-left:auto;
    order:2;
    width:42px; height:42px;
    border-radius:12px;
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 8px 22px rgba(0,0,0,.35);
    transition: background .2s ease, box-shadow .2s ease;
  }
  .site-header .elementor-menu-toggle:hover{
    background: rgba(255,255,255,.12);
    box-shadow: 0 12px 28px rgba(0,0,0,.45);
  }

  /* Turn hamburger into an X when active (text icon fallback) */
  .site-header .elementor-menu-toggle.elementor-active .eicon-menu-bar:before{
    content:"✕";
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-size: 20px;
    line-height: 42px;
    display: inline-block;
    width: 100%;
    text-align: center;
  }
  /* Hide the default bars when active (covers icon fonts/SVGs) */
  .site-header .elementor-menu-toggle.elementor-active i,
  .site-header .elementor-menu-toggle.elementor-active svg{
    opacity:0;
  }

  /* Drawer panel (right side, glassy, slim) */
  .site-header .elementor-nav-menu--dropdown{
    position: fixed;
    top: calc(var(--header-h, 68px));
    right: 12px;
    left: auto;
    width: min(86vw, 360px);   /* slimmer than before */
    max-height: calc(100dvh - 24px - var(--header-h, 68px));
    overflow: auto;
    margin: 0;
    padding: 10px;
    border-radius: 16px;
    background: rgba(12,12,12,.92);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 20px 60px rgba(0,0,0,.55);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    /* smooth reveal */
    transform: translateX(8px);
    opacity: 0;
    pointer-events: none;
    transition: transform .24s ease, opacity .24s ease;
  }

  /* Reveal the drawer when the toggle is active */
  /* (Elementor renders the dropdown right after the toggle button) */
  .site-header .elementor-menu-toggle[aria-expanded="true"] + .elementor-nav-menu__container .elementor-nav-menu--dropdown,
  .site-header .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container .elementor-nav-menu--dropdown{
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
  }

  /* Vertical list, large touch targets, orange accent on active */
  .site-header .elementor-nav-menu--dropdown .elementor-item{
    display:block;
    width:100%;
    color:#fff;
    font-weight:700;
    font-size: 20px;
    letter-spacing:.02em;
    padding: 14px 18px;
    border-radius: 12px;
    text-decoration:none;
    line-height:1.2;
    transition: background .18s ease, color .18s ease;
  }
  .site-header .elementor-nav-menu--dropdown .elementor-item:hover{
    background: rgba(255,255,255,.08);
  }
  .site-header .elementor-nav-menu--dropdown .elementor-item.elementor-item-active{
    background: rgba(255,255,255,.14);
  }

  /* No animated underline in the drawer */
  .site-header .elementor-nav-menu--dropdown .elementor-item::after{ display:none !important; }

  /* Remove any default Elementor separators in dropdown */
  .site-header .elementor-nav-menu--dropdown .elementor-item:before,
  .site-header .elementor-nav-menu--dropdown .elementor-item .e-n-menu-title:after{
    content:none !important;
  }
}
/* ===== Mobile / Tablet fixes: logo size + working side drawer ===== */
@media (max-width:1024px){

  /* 1) Logo: lock height, let width auto (prevents stretching) */
  /* Give the logo widget the class "site-logo" (Advanced → CSS classes) */
  .site-header .site-logo img,
  .site-header .site-logo svg{
    height:28px;                 /* tweak: 26–32px */
    width:auto !important;       /* keep natural aspect ratio */
    max-width:none;              /* avoid Elementor scaling */
    display:block;
  }

  /* Header row: logo left, burger right */
  .site-header .elementor-container,
  .site-header .elementor-row{
    align-items:center;
    justify-content:space-between;
  }

  /* Burger button styling (optional) */
  .site-header .elementor-menu-toggle{
    margin-left:auto;
    order:2;
    width:42px; height:42px;
    border-radius:12px;
    background:rgba(255,255,255,.08);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    box-shadow:0 8px 22px rgba(0,0,0,.35);
    transition:background .2s, box-shadow .2s;
  }
  .site-header .elementor-menu-toggle:hover{
    background:rgba(255,255,255,.12);
    box-shadow:0 12px 28px rgba(0,0,0,.45);
  }

  /* Turn hamburger into X when open (covers most icon sets) */
  .site-header .elementor-menu-toggle.elementor-active .eicon-menu-bar:before{
    content:"✕";
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    font-size:20px; line-height:42px; width:100%; text-align:center; display:inline-block;
  }
  .site-header .elementor-menu-toggle.elementor-active i,
  .site-header .elementor-menu-toggle.elementor-active svg{
    opacity:0;
  }

  /* 2) Drawer: make Elementor’s dropdown visible + side panel look */
  /* Elementor sets display:none; we force block and drive visibility with opacity */
  .site-header .elementor-nav-menu--dropdown{
    position:fixed;
    top:calc(var(--header-h,68px));
    right:12px; left:auto;             /* change to left:12px; right:auto; to open from left */
    width:min(86vw,360px);
    max-height:calc(100dvh - 24px - var(--header-h,68px));
    overflow:auto;
    margin:0; padding:10px;
    border-radius:16px;
    background:rgba(12,12,12,.92);
    border:1px solid rgba(255,255,255,.10);
    box-shadow:0 20px 60px rgba(0,0,0,.55);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    display:block !important;          /* kill display:none */
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    transform:translateX(8px);
    transition:transform .24s ease, opacity .24s ease, visibility 0s .24s;
    z-index:9999;
  }

  /* Show when Elementor toggles the menu open */
  .site-header .elementor-nav-menu--dropdown.elementor-active,
  .site-header .elementor-nav-menu--dropdown[aria-hidden="false"]{
    visibility:visible;
    opacity:1;
    pointer-events:auto;
    transform:translateX(0);
    transition-delay:0s;
  }

  /* Vertical links with comfy tap targets */
  .site-header .elementor-nav-menu--dropdown .elementor-item{
    display:block;
    width:100%;
    color:#fff;
    font-weight:700;
    font-size:20px;
    letter-spacing:.02em;
    padding:14px 18px;
    border-radius:12px;
    text-decoration:none;
    line-height:1.2;
    transition:background .18s ease, color .18s ease;
  }
  .site-header .elementor-nav-menu--dropdown .elementor-item:hover{
    background:rgba(255,255,255,.08);
  }
  .site-header .elementor-nav-menu--dropdown .elementor-item.elementor-item-active{
    background:rgba(255,255,255,.14);
  }

  /* No animated underline inside the drawer */
  .site-header .elementor-nav-menu--dropdown .elementor-item::after{ display:none !important; }

  /* Kill Elementor’s default separators in the dropdown */
  .site-header .elementor-nav-menu--dropdown .elementor-item:before,
  .site-header .elementor-nav-menu--dropdown .elementor-item .e-n-menu-title:after{
    content:none !important;
  }
}
/* === Force vertical menu in the hamburger drawer (tablet & mobile) === */
@media (max-width:1024px){

  /* 1) Make sure Elementor swaps to the dropdown */
  .site-header .elementor-nav-menu--main{
    display: none !important;              /* hide the horizontal desktop list */
  }
  .site-header .elementor-menu-toggle{
    display: flex !important;              /* ensure the burger shows */
    align-items: center; justify-content: center;
  }

  /* 2) Stack items vertically inside the dropdown */
  .site-header .elementor-nav-menu--dropdown ul.elementor-nav-menu{
    display: flex !important;
    flex-direction: column !important;     /* the key line */
    align-items: stretch !important;
    gap: 6px;                               /* small vertical spacing */
    padding: 6px 0;
  }

  /* Make each entry fill the drawer’s width */
  .site-header .elementor-nav-menu--dropdown li,
  .site-header .elementor-nav-menu--dropdown .menu-item{
    width: 100%;
  }
  .site-header .elementor-nav-menu--dropdown a.elementor-item{
    display: block;
    width: 100%;
    text-align: left;
    white-space: normal;                    /* prevent one-line squeeze */
  }

  /* Safety: kill any horizontal separators/underlines Elementor may inject */
  .site-header .elementor-nav-menu--dropdown .elementor-item:before,
  .site-header .elementor-nav-menu--dropdown .elementor-item .e-n-menu-title:after{
    content: none !important;
  }
}
/* ===== X icon FIX (works with any Elementor icon variant) ===== */
@media (max-width:1024px){
  .site-header .elementor-menu-toggle{
    position: relative;
    color:#fff;                 /* color of the ✕ */
  }

  /* Create the X overlay (hidden by default) */
  .site-header .elementor-menu-toggle::after{
    content:"✕";
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    font-size:20px;             /* adjust 18–22 if you want */
    line-height:1;
    opacity:0;
    transform:scale(.85);
    z-index:2;                  /* ensure it sits above the bars */
    transition:opacity .18s ease, transform .18s ease;
    pointer-events:none;
  }

  /* When menu is open, show the X and hide ALL inner icons */
  .site-header .elementor-menu-toggle[aria-expanded="true"]::after,
  .site-header .elementor-menu-toggle.elementor-active::after{
    opacity:1;
    transform:scale(1);
  }

  /* Hide everything inside the button (covers i, svg, span…) */
  .site-header .elementor-menu-toggle[aria-expanded="true"] > *,
  .site-header .elementor-menu-toggle.elementor-active > *{
    opacity:0 !important;
  }
}
/* === Bring the X above the drawer === */
@media (max-width:1024px){
  /* create a stacking context for the header */
  .site-header{ position: relative; z-index: 100; }

  /* the burger/X button must sit on top of the drawer */
  .site-header .elementor-menu-toggle{
    position: relative;           /* ensure it can stack */
    z-index: 10002;               /* higher than the drawer */
  }

  /* the X overlay itself sits even above any inner icon */
  .site-header .elementor-menu-toggle::after{
    z-index: 10003;               /* ensure it's in front */
  }

  /* lower the drawer just a bit */
  .site-header .elementor-nav-menu--dropdown{
    z-index: 10000;               /* below the toggle/X */
  }

  /* optional: keep the toggle tappable even if overlapping */
  .site-header .elementor-nav-menu--dropdown{ pointer-events:auto; }
  .site-header .elementor-menu-toggle{ pointer-events:auto; }
}
/* === Keep the X above the drawer, even while scrolling === */
@media (max-width:1024px){

  /* Make sure the header has a stacking context */
  .site-header{
    position: relative;
    z-index: 100;
    transform: translateZ(0); /* iOS/WebKit stacking fix */
  }

  /* Drawer sits below the toggle/X */
  .site-header .elementor-nav-menu--dropdown{
    z-index: 10000;
  }

  /* Default (closed): normal positioning */
  .site-header .elementor-menu-toggle{
    position: relative;
    z-index: 10002;
  }

  /* When OPEN: pin the toggle/X fixed to the corner so it stays on top on scroll */
  .site-header .elementor-menu-toggle.elementor-active,
  .site-header .elementor-menu-toggle[aria-expanded="true"]{
    position: fixed;         /* pin to viewport */
    top: 12px;               /* adjust if your header is taller */
    right: 12px;             /* keep it on the right */
    z-index: 10003;          /* above the drawer */
  }

  /* Ensure the X overlay itself stacks above any inner icon */
  .site-header .elementor-menu-toggle::after{
    z-index: 10004;
  }
}/* End custom CSS */