:root{
  --menu-width: 440px;
  --bg: #ffffff;
  --muted: #8f8f8f;
  --accent: #007aff;
  --overlay: rgba(16,20,24,0.36);
}

/* ---------- NAVBAR ---------- */
/*.navbar-clean {*/
/*  top: 0; left: 0; right: 0;*/
/*  height: 64px;*/
/*  display:flex;*/
/*  align-items:center;*/
/*  gap:12px;*/
/*  padding:0 18px;*/
/*  background: rgba(255,255,255,0.86);*/
/*  backdrop-filter: blur(6px) saturate(120%);*/
/*  border-bottom: 1px solid #eee;*/
/*  z-index: 1200;*/
/*}*/
.menu-title-clean{ font-size:18px; font-weight:600; color:#222; }

/* ---------- HAMBURGER ---------- */
.home .menu-btn-clean {
    width: 25px;
}
.menu-btn-clean{
  width:25px;height:40px;border-radius:10px;border:none;background:transparent !important;cursor:pointer;padding:0px !important;display:flex;align-items:center;justify-content:center;
  transition: transform .24s ease;
}
button#clean-hamburger {
    padding: 10px;
}
.hamburger-line{
  display:block;width:22px;height:2px;background:currentColor;margin:3px 0;transition: transform .32s cubic-bezier(.2,.9,.3,1), opacity .2s, width .22s;
  color: #222;
}
.menu-btn-clean.open { transform: scale(0.98); }
.menu-btn-clean.open .line-top { transform: translateY(6px) rotate(45deg); }
.menu-btn-clean.open .line-mid { opacity: 0; width: 0; }
.menu-btn-clean.open .line-bot { transform: translateY(-6px) rotate(-45deg); }
button.icon-btn-clean {
    font-size: 40px;
    background: transparent !important;
    padding: 0;
}
button.icon-btn-clean {
    display: none;
}

/* ---------- OVERLAY ---------- */
.clean-menu-overlay {
  position: fixed;
  inset: 0;
  background: var(--overlay);
  backdrop-filter: blur(4px) saturate(120%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .28s ease;
  z-index: 1190;
}
.clean-menu-overlay.open { opacity: 1; pointer-events: auto; }

/* ---------- SIDE MENU (LEVEL 1) ---------- */
.side-menu-clean {
  position: fixed;
  top: 0;
  left: calc(-1 * var(--menu-width));
  width: var(--menu-width);
  height: 100vh;
  background: var(--bg);
  box-shadow: 0 24px 46px rgba(10,12,14,0.08);
  transition: left .36s cubic-bezier(.2,.9,.3,1);
  z-index: 1205;
  overflow-y: auto;
  will-change: left;
}
.side-menu-clean.open { left: 0; }

.header-row-clean { padding: 50px 20px 0px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #f3f3f3; font-weight:600; }

/* main lists */
.main-menu-clean, .panel-list-clean { list-style:none; margin:0; padding:12px; }
.main-menu-clean li, .panel-list-clean li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 8px;
    margin: 8px 6px;
    transition: background .18s, transform .18s, box-shadow .18s;
    cursor: pointer;
    color: #3E3E3E;
    user-select: none;
    font-size: 24px;
    font-family: 'Manrope';
    line-height: 19px;
}
.main-menu-clean li:hover, .panel-list-clean li:hover {
    transform: translateY(-2px);
    color: #3E3E3E;
    font-weight: bold;
}
.panel-list-clean li {
    font-size: 17px;
}
.menu-item-icon { width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; color:#666; }

/* ACTIVE highlight */
/*.main-menu-clean li.active, .panel-list-clean li.active {*/
/*  background: linear-gradient(90deg, rgba(0,122,255,0.08), rgba(0,122,255,0.03));*/
/*  color: var(--accent);*/
/*  box-shadow: 0 8px 20px rgba(0,122,255,0.06);*/
/*}*/

/* base state: no arrow */
.panel-list-clean li.has-children::before {
  content: '';
  position: absolute;
  right: 14px;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 0 solid currentColor;
  opacity: 0;
  transition: opacity .18s, border-left-width .18s;
}

/* show icon when hovered or active */
.panel-list-clean li.has-children:hover::before,
.panel-list-clean li.has-children.open::before {
  border-left-width: 6px;
  opacity: 1;
}

/* make sure li is positioned */
.panel-list-clean li {
  position: relative;
  padding-left: 30px; /* room for arrow */
}


/* subtle divider */
.main-menu-clean .divider { height:1px; background:#f3f3f3; margin:8px 6px; border-radius:2px; }

/* ---------- PANELS LEVEL 2 / 3 ---------- */
.panel-clean {
  position: fixed;
  top: 0;
  width: var(--menu-width);
  height: 100vh;
  background: #fff;
  box-shadow: 0 18px 38px rgba(12,12,14,0.06);
  display: none;
  z-index: 1210;
  overflow-y: auto;
  transition: transform .34s cubic-bezier(.2,.9,.3,1), opacity .28s;
  opacity: 0;
  transform: translateX(14px); /* small offset for fade/slide */
}
#clean-panel-l2 { left: calc(var(--menu-width)); }
#clean-panel-l3 { left: calc(var(--menu-width) * 2); }
.panel-clean.open { display:block; opacity:1; transform: translateX(0); }

/* panel header */
.panel-header-clean { padding: 50px 30px 0px; display:flex; justify-content:space-between; align-items:center; font-weight:600; }

.panel-header-clean .title {
    font-weight: 600;
    font-size: 32px;
    margin: 0;
    color:#3E3E3E;
}

.footer-row-clean {
    padding: 30px;
    bottom: 0;
    position: absolute;
}
.footer-row-clean p.f-phone a,
.footer-row-clean p.f-email a{
    font-size: 16px;
    color:#3E3E3E;
}
.footer-row-clean p.f-phone a:hover,
.footer-row-clean p.f-email a:hover{
    font-weight: 600;
}
p.f-links a:hover {
    font-weight: 600;
}
/* list items style */
.panel-list-clean li { padding:12px 14px; border-radius:6px; transition: background .16s, transform .12s; }

/* ---------- MOBILE: slide-from-right & full-screen panels ---------- */
@media (max-width: 900px) {
  /* side menu slides from left but with transform for smoother behavior */
  .side-menu-clean { left: -100%; width: 100%; max-width: 360px; transform: translateX(-6%); transition: transform .36s cubic-bezier(.2,.9,.3,1), left .36s; }
  .side-menu-clean.open { left: 0; transform: translateX(0); }

  #clean-panel-l2, #clean-panel-l3 {
    left: 0;
    transform: translateX(100%);
    width: 100%;
    max-width: none;
  }
  .panel-clean.open {
    transform: translateX(-13px);
    width: 100%;
    }
    button.icon-btn-clean {
        display: block;
    }
    .panel-header-clean .title {
        font-size: 24px;
    }
}

/* small scrollbar styling */
.side-menu-clean::-webkit-scrollbar, .panel-clean::-webkit-scrollbar { width: 8px; }
.side-menu-clean::-webkit-scrollbar-thumb, .panel-clean::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.06); border-radius:8px; }

/* accessibility focus */
.menu-btn-clean:focus, .icon-btn-clean:focus, .main-menu-clean li:focus, .panel-list-clean li:focus { outline: 3px solid rgba(0,122,255,0.12); outline-offset:2px; }

/* small responsive tweaks */
@media (max-width:480px){
  .menu-title-clean{ display:none; } /* hide title on tiny screens */
}