/* =========================================================
   CUSTOM CSS  —  replaces Tailwind utility classes.
   Bootstrap 5 is used for base grid/flex/display utilities
   (d-flex, d-none, d-lg-flex, gap-*, align-items-*, etc).
   Everything below covers colors, transforms, blur, and the
   bespoke dropdown / mobile-menu behaviour that Bootstrap
   doesn't provide out of the box.
   ========================================================= */

:root{
  --hdr-bg: rgba(5, 11, 20, 0.6);
  --panel-bg: #161a23;
  --panel-border: #1f2937;      /* gray-800 */
  --panel-border-soft: rgba(255,255,255,0.10);
  --child-border: #2a3441;
  --muted: #8b95a5;
  --muted-2: #9ca3af;           /* gray-400 */
  --muted-3: #d1d5db;           /* gray-300 */
  --icon-muted: #838894;
  --aqua: #00E5FF;
  --white: #ffffff;
  --font14: 14px;
  --golden: #d9a441;
  --orange: #ff7a00;
}

*{ box-sizing: border-box; }

.cursor-pointer{ cursor:pointer; }

body{
    margin-top:65px;
}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  top:0;
  left:0;
  width:100%;
  z-index:9999;
  background:var(--hdr-bg);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom:1px solid var(--panel-border);
   font-family: Poppins, system-ui, -apple-system, sans-serif !important;
}

.header-inner{ height:64px; }

.logo-wrap{ width:180px; }

.icon-20{ width:20px; height:20px; }

.home-icon-link{
  color:var(--muted-3);
  transition:color .2s ease;
}
.home-icon-link:hover{ color:var(--white); }

.desktop-nav{ }

/* Hamburger */
.nav-toggle{
  width:32px;
  height:16px;
  position:relative;
  z-index:50;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.nav-toggle .line{
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  background:var(--white);
  transition:transform .35s ease, opacity .35s ease, top .35s ease;
}
.nav-toggle .line1{ top:0; }
.nav-toggle .line2{ top:7px; }
.nav-toggle .line3{ top:14px; }
.nav-toggle.active .line1{ top:7px; transform:rotate(45deg); }
.nav-toggle.active .line2{ opacity:0; }
.nav-toggle.active .line3{ top:7px; transform:rotate(-45deg); }

/* =========================================================
   MOBILE MENU
   ========================================================= */
.mobile-menu{
  position:fixed;
  top:64px;
  right:0;
  left:0;
  width:90%;
  max-width:24rem; /* max-w-sm */
  margin:0 auto;
  height:50vh;
  z-index:50;
  overflow:hidden;
  transition:opacity .5s ease, visibility .5s ease;
   font-family: Poppins, system-ui, -apple-system, sans-serif !important;
}
.mobile-menu.mm-open{ opacity:1; visibility:visible; }
.mobile-menu.mm-closed{ opacity:0; visibility:hidden; }

.mobile-menu-panel{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  color:var(--white);
  background:rgba(9,10,14,0.85);
  border-radius:0 0 10px 10px;
  box-shadow:0 30px 80px rgba(0,0,0,0.8);
  border:1px solid rgba(255,255,255,0.10);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
}

.mm-step{
  position:absolute;
  inset:0;
  transition:transform .5s ease-in-out;
  overflow-y:auto;
}
.mm-step-active{ transform:translateX(0); }
.mm-step-hidden-left{ transform:translateX(-100%); }
.mm-step-hidden-right{ transform:translateX(100%); background:#090A0E; }

/* Step 1 rows */
.mm-step1-home{
  width:100%;
  display:flex;
  justify-content:space-between;
  padding:20px;
  border-bottom:1px solid var(--panel-border-soft);
  color:var(--white);
  font-weight:300;
  text-decoration:none;
}
.mm-step1-row{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 8px;
  border-bottom:1px solid var(--panel-border-soft);
}
.mm-step1-link{
  flex:1;
  text-align:left;
  font-weight:300;
  color:var(--white);
  text-decoration:none;
}
.mm-step1-arrow{
  cursor:pointer;
  padding:0 12px;
  color:var(--white);
  user-select:none;
}

/* Step 2 header */
.mm-step2-head{
  display:flex;
  align-items:center;
  gap:16px;
  padding:16px 12px;
  border-bottom:1px dashed var(--muted-2);
}
.mm-back-btn{
  font-size:1.5rem;
  background:none;
  border:none;
  color:var(--white);
  line-height:1;
}
.mm-step2-title{
  color:var(--aqua);
  font-size:1.125rem;
  font-weight:400;
  margin:0;
}
.mm-items{ padding-top:8px; }

/* Accordion */
.mm-accordion-wrap{ border-bottom:1px solid var(--panel-border-soft); }
.mm-accordion-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 8px;
  transition:border-color .3s ease;
  cursor:pointer;
}
.mm-accordion-item.active{
  border-bottom:1px solid #009fc3;
  margin-bottom:20px;
}
.mm-accordion-item.active span{ color:#009fc3; }

.mm-menu-link{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--muted-3);
  text-decoration:none;
}
.mm-accordion-toggle{
  font-size:1.25rem;
  color:var(--icon-muted);
  background:none;
  border:none;
}
.mm-accordion-panel{
  max-height:0;
  overflow:hidden;
  transition:max-height .5s ease;
}
.mm-accordion-panel.mm-accordion-panel-open{
  padding:0 8px 16px;
  margin-bottom:20px;
}
.mm-accordion-panel-inner{
  background:var(--white);
  border-radius:12px;
  color:#000;
  overflow:hidden;
}
.mm-accordion-child{
  display:block;
  margin:0 8px;
  padding:12px 0;
  font-size:.875rem;
  color:#4b5563;
  border-bottom:1px dashed #9ca3af;
  text-decoration:none;
}
.mm-accordion-child:last-child{ border-bottom:none; }

/* =========================================================
   DESKTOP MEGA MENU
   ========================================================= */
.dm-group{ padding:20px 0; }

.dm-top-link{
  display:flex;
  align-items:center;
  gap:4px;
  font-size:var(--font14);
  font-weight:500;
  color:#e5e7eb; /* gray-200 */
  text-decoration:none;
}
.dm-group:hover .dm-top-link{ color:var(--aqua); }

.dm-chevron{
  width:16px;
  height:16px;
  flex-shrink:0;
  transition:transform .2s ease;
}
.dm-group:hover .dm-chevron{ transform:rotate(180deg); }

.dm-arrow-icon{
  width:16px;
  height:16px;
  flex-shrink:0;
  color:#6b7280; /* gray-500 */
  transition:color .2s ease;
}
.dm-child-link:hover .dm-arrow-icon{ color:var(--white); }

/* dropdown panel base */
.dm-dropdown{
  position:absolute;
  top:100%;
  visibility:hidden;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .3s ease, transform .3s ease, visibility .3s ease;
  z-index:50;
}
.dm-group:hover .dm-dropdown{
  visibility:visible;
  opacity:1;
  transform:translateY(0);
}

.dm-dropdown-full{ left:0; width:100%; }
.dm-dropdown-wide{ left:0; right:0; max-width:750px; margin:0 auto; }
.dm-dropdown-right{ right:0; }
.dm-dropdown-narrow{
  right:0;
  margin-top:0;
  width:300px;
  background:var(--panel-bg);
  border:1px solid var(--panel-border);
  border-radius:0 0 8px 8px;
  box-shadow:0 20px 40px rgba(0,0,0,.4);
}

.dm-panel{
  background:var(--panel-bg);
  width:100%;
  border-top:1px solid var(--panel-border);
  box-shadow:0 25px 50px rgba(0,0,0,.5);
}
.dm-panel-inner{
  max-width:1600px;
  margin:0 auto;
  display:flex;
  padding:20px;
  gap:40px;
}

.dm-grid{ display:grid; width:100%; padding-right:32px; }
.dm-grid-2{ grid-template-columns:repeat(2,1fr); gap:0 40px; }
.dm-grid-3{ grid-template-columns:repeat(3,1fr); gap:32px 48px; }
.dm-grid-4{ grid-template-columns:repeat(4,1fr); gap:0 48px; }
.dm-grid-5{ grid-template-columns:repeat(5,1fr); gap:32px 40px; }

.dm-col-span-2{ grid-column:span 2; }
.dm-mt-8{ margin-top:32px; }

.dm-col-title{
  display:block;
  font-size:1.125rem;
  font-weight:500;
  color:var(--white);
  text-decoration:none;
}

.dm-child-list{
  list-style:none;
  margin:0;
  padding:0;
}
.dm-child-item{ border-bottom:1px solid var(--child-border); }
.dm-child-item:last-child{ border-bottom:none; }
.dm-child-link{
  display:flex;
  align-items:center;
  gap:16px;
  padding:8px 0;
  color:var(--muted);
  text-decoration:none;
  transition:color .2s ease;
}
.dm-child-link:hover{ color:var(--white); }
.dm-child-text{ font-size:.875rem; }

/* Digital menu split layout (image on the right) */
.dm-panel-split{ overflow:hidden; border-radius:0 0 12px 12px; }
.dm-panel-split-inner{
  background:var(--panel-bg);
  max-width:750px;
  margin:0 auto;
  display:flex;
  border-radius:0 0 12px 12px;
  overflow:hidden;
}
.dm-panel-split-left{
  width:50%;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.dm-panel-split-right{
  width:50%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  position:relative;
}
.dm-panel-image{
  width:100%;
  height:100%;
  object-fit:cover;
}

.dm-simple-panel{ padding:8px; }

/* =========================================================
   SHARED / MISC (from original stylesheet)
   ========================================================= */
.nav-link,
.navLinks{ padding:0; }
.navLinks a span,
.navLinks a::before{ transition:transform .4s, opacity .4s; }
.nav-link,
.schedule-btn{ font-size:var(--font14); position:relative; color:var(--white); }
.nav-link,
.navLinks .navLinks-nav > li,
.schedule-btn{ position:relative; }
.nav-link,
.schedule-btn,
.schedule-btn:hover{ color:var(--white); }
.nav-link{ font-weight:500; padding-block:0; line-height:30px; }
.navLinks a span{ display:inline-block; transform-origin:top; }
.navLinks a::before{
  content:attr(data-text);
  position:absolute;
  left:0;
  top:0;
  transform-origin:bottom;
  transform:rotateX(90deg);
  opacity:0;
  color:var(--golden);
}
.navLinks a:hover::before{ transform:rotateX(0); opacity:1; }
.navLinks a:hover span{ transform:rotateX(-90deg); opacity:0; }

.schedule-btn{
  display:inline-block;
  padding:15px 28px 14px;
  border-radius:60px;
  line-height:24px;
  text-align:center;
  overflow:hidden;
  z-index:1;
  background:linear-gradient(181deg, rgba(56,202,255,.7) -90.32%, rgba(0,159,195,.7) 137.2%);
  box-shadow:
    -10.487px -10.05px 20.144px 0 rgba(67,159,198,.1) inset,
    10.487px 10.05px 16.386px 0 rgba(255,255,255,.15) inset,
    0 94.823px 26.655px 0 rgba(0,153,214,0),
    0 60.739px 24.033px 0 rgba(0,146,214,.03),
    0 34.084px 20.538px 0 rgba(0,128,214,.1),
    0 15.294px 15.294px 0 rgba(0,171,214,.17),
    0 3.933px 8.302px 0 rgba(0,160,214,.19);
}
.schedule-btn:before{
  content:"";
  width:0;
  height:0;
  position:absolute;
  left:50%;
  top:50%;
  z-index:-1;
  border-radius:50%;
  transition:.5s ease-in-out;
  background:var(--orange);
}
.schedule-btn:hover::before{
  width:190px;
  height:190px;
  left:-13%;
  top:-150%;
  transition:.5s ease-in-out;
}

@media (max-width:992px){
  .schedule-btn{
    font-size:12px;
    line-height:22px;
    padding:9px 14px 9px 15px;
  }
}

/* =========================================================
   RESPONSIVE TWEAKS FOR MEGA MENU
   ========================================================= */
@media (max-width: 1200px){
  .dm-grid-4,
  .dm-grid-5{ grid-template-columns:repeat(2,1fr); }
  .dm-col-span-2{ grid-column:span 2; }
}