/* ================= RESET ================= */
*{margin:0;padding:0;box-sizing:border-box;}
html,body{overflow-x:hidden;}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;}

/* ================= THEME (ASTRO DARK + ROYAL GOLD) ================= */
:root{
  --topH:36px;
  --headH:86px;

  --bg-1:#06070b;
  --bg-2:#0b0d14;
  --bg-3:#111522;
  --gold:#f6c453;
  --gold-2:#ffda78;
  --gold-soft:rgba(246,196,83,.16);
  --gold-line:rgba(246,196,83,.24);

  --text:#fff8e8;
  --muted:rgba(255,248,232,.72);

  --panel:rgba(255,255,255,.04);
  --panel-2:rgba(255,255,255,.06);

  --shadow:rgba(0,0,0,.62);
  --border:rgba(246,196,83,.18);
}

/* body offset */
body{
  padding-top:calc(var(--topH) + var(--headH));
}
body.top-hidden{ --topH:0px; }

/* ================= TOP BAR ================= */
.top-header{
  position:fixed;
  top:0;left:0;
  width:100%;
  z-index:10010;
  color:var(--text);
  background:
    linear-gradient(90deg,#0b0c12,#121623,#0e1018),
    var(--bg-1);
  border-bottom:1px solid rgba(255,255,255,.06);
  transform:translateY(0);
  transition:transform .28s ease;
}

.top-header-wrap{
  max-width:1280px;
  margin:auto;
  padding:8px 16px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.top-trust{
  font-size:14px;
  line-height:1.35;
  font-weight:800;
  color:var(--gold-2);
  letter-spacing:.2px;
  text-align:center;
}

.top-marquee{
  display:none;
  width:100%;
  overflow:hidden;
  position:relative;
  mask-image:linear-gradient(to right,transparent 0,black 10%,black 90%,transparent 100%);
  -webkit-mask-image:linear-gradient(to right,transparent 0,black 10%,black 90%,transparent 100%);
}
.top-marquee-track{
  display:flex;
  gap:28px;
  width:max-content;
  will-change:transform;
}
.top-marquee-item{
  white-space:nowrap;
  font-size:13px;
  font-weight:850;
  letter-spacing:.2px;
  color:var(--gold-2);
}

/* ================= HEADER ================= */
.site-header{
  position:fixed;
  top:var(--topH);
  left:0;
  width:100%;
  height:var(--headH);
  z-index:10009;
  background:
    radial-gradient(700px 180px at 50% -20%, rgba(246,196,83,.12), transparent 70%),
    radial-gradient(420px 200px at 12% 20%, rgba(246,196,83,.08), transparent 75%),
    radial-gradient(420px 200px at 88% 20%, rgba(246,196,83,.06), transparent 75%),
    linear-gradient(180deg,#0c0f17 0%, #090b12 60%, #07080d 100%);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(10px);
  box-shadow:0 18px 50px var(--shadow);
  transition:top .28s ease;
}

.header-wrap{
  max-width:1380px;
  margin:auto;
  height:var(--headH);
  padding:0 18px;
}

.header-3col{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:18px;
  height:100%;
}

/* ================= BRAND ================= */
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  min-width:240px;
}

.brand img{
  width:58px;
  height:58px;
  border-radius:50%;
  background:#0d0f16;
  border:1px solid rgba(246,196,83,.34);
  object-fit:contain;
  box-shadow:
    0 0 0 4px rgba(246,196,83,.06),
    0 14px 34px rgba(0,0,0,.58);
}

.brand-text{
  display:flex;
  flex-direction:column;
  min-width:0;
  line-height:1.08;
}

.brand-name{
  color:var(--text);
  font-size:20px;
  font-weight:950;
  letter-spacing:.2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.brand-sub{
  margin-top:4px;
  color:var(--gold-2);
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.4px;
  text-transform:uppercase;
}

/* ================= NAV CENTER ================= */
.nav-pill{
  justify-self:center;
  display:flex;
  align-items:center;
  gap:24px;
  padding:14px 24px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--gold-line);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 20px 50px rgba(0,0,0,.42);
  backdrop-filter:blur(12px);
  max-width:100%;
}

.nav-pill a,
.nav-pill .dropdown-toggle{
  background:none;
  border:none;
  color:var(--text);
  font-size:15px;
  font-weight:850;
  cursor:pointer;
  text-decoration:none;
  transition:.22s ease;
  white-space:nowrap;
  position:relative;
}

.nav-pill a::after,
.nav-pill .dropdown-toggle::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-6px;
  width:0;
  height:2px;
  border-radius:10px;
  background:linear-gradient(90deg,var(--gold),var(--gold-2));
  transition:width .25s ease;
}

.nav-pill a:hover,
.nav-pill .dropdown-toggle:hover{
  color:var(--gold-2);
}
.nav-pill a:hover::after,
.nav-pill .dropdown-toggle:hover::after{
  width:100%;
}

.chev{
  font-size:12px;
  margin-left:4px;
}

/* ================= DROPDOWN ================= */
.dropdown{position:relative;}

.dropdown-menu{
  position:absolute;
  top:118%;
  left:50%;
  transform:translateX(-50%);
  min-width:760px;
  max-width:calc(100vw - 32px);
  padding:18px;
  border-radius:22px;
  background:
    radial-gradient(500px 240px at 20% 18%, rgba(246,196,83,.12), transparent 70%),
    linear-gradient(180deg, rgba(13,16,24,.98), rgba(7,9,14,.98));
  border:1px solid rgba(246,196,83,.16);
  box-shadow:0 28px 80px rgba(0,0,0,.75);
  backdrop-filter:blur(14px);
  opacity:0;
  visibility:hidden;
  transition:.22s ease;
  z-index:10020;
}

.dropdown:hover .dropdown-menu{
  opacity:1;
  visibility:visible;
}

.dropdown-grid{
  display:grid;
  gap:10px;
  position:relative;
  z-index:1;
}

.services-grid{
  grid-template-columns:repeat(2, minmax(240px,1fr));
}

.dropdown-grid a{
  display:flex;
  align-items:center;
  min-height:48px;
  padding:12px 14px;
  color:rgba(255,248,232,.82);
  text-decoration:none;
  font-size:14px;
  font-weight:800;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.03);
  transition:.18s ease;
}

.dropdown-grid a:hover{
  transform:translateY(-1px);
  color:var(--text);
  border-color:rgba(246,196,83,.22);
  background:rgba(246,196,83,.08);
}

/* ================= ACTIONS ================= */
.actions-right{
  justify-self:end;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  min-width:0;
}

.btn-call,
.btn-book{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  text-decoration:none;
  font-weight:900;
  white-space:nowrap;
  transition:.2s ease;
}

.btn-call{
  color:#16120a;
  background:linear-gradient(180deg,#ffe39e 0%, #f7cb64 55%, #e9b947 100%);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 14px 34px rgba(246,196,83,.20);
}
.btn-call:hover{
  transform:translateY(-1px);
  filter:brightness(1.04);
}

.btn-book{
  color:#16120a;
  background:linear-gradient(180deg,#ffe39e 0%, #f7cb64 55%, #e9b947 100%);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 14px 34px rgba(246,196,83,.20);
}
.btn-book:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}

/* ================= BURGER ================= */
.burger{
  display:none;
}

/* ================= MOBILE MENU ================= */
.nav-mobile{
  display:none;
}

/* top hidden */
body.top-hidden .top-header{
  transform:translateY(-110%);
}

/* ================= MOBILE ================= */
@media (max-width:900px){
  :root{ --headH:68px; }

  .top-trust{display:none;}
  .top-marquee{display:block;}
  .top-header-wrap{padding:7px 10px;}

  @keyframes topMarqueeScroll{
    0%{transform:translateX(0);}
    100%{transform:translateX(-33.333%);}
  }
  .top-marquee-track{
    animation:topMarqueeScroll 14s linear infinite;
  }
  .top-header:hover .top-marquee-track{
    animation-play-state:paused;
  }
  @media (prefers-reduced-motion: reduce){
    .top-marquee-track{animation:none;}
  }

  .header-3col{
    grid-template-columns:1fr auto;
    gap:10px;
  }

  .nav-pill{display:none;}
  .btn-call{display:none;}
  .brand-sub{display:none;}

  .brand{
    min-width:0;
    overflow:hidden;
  }

  .brand img{
    width:48px;
    height:48px;
  }

  .brand-name{
    max-width:52vw;
    font-size:16px;
  }

  .actions-right{
    gap:10px;
  }

  .btn-book{
    min-height:40px;
    padding:0 14px;
    font-size:14px;
  }

  .burger{
    display:flex !important;
    width:42px;
    height:42px;
    border-radius:14px;
    border:1px solid rgba(246,196,83,.24);
    background:rgba(255,255,255,.05);
    box-shadow:0 10px 28px rgba(0,0,0,.45);
    align-items:center;
    justify-content:center;
    flex-direction:column;
    cursor:pointer;
    padding:0;
    z-index:10050;
  }

  .burger span{
    display:block;
    width:20px;
    height:2.4px;
    margin:3px 0;
    border-radius:999px;
    background:var(--gold);
  }

  .nav-mobile{
    display:flex;
    position:fixed;
    top:0;
    left:-100%;
    width:100%;
    height:100vh;
    background:
      radial-gradient(600px 320px at 20% 12%, rgba(246,196,83,.10), transparent 65%),
      linear-gradient(180deg,#0c1018,#080b12,#06080d);
    flex-direction:column;
    padding:calc(var(--topH) + 84px) 20px 24px;
    gap:16px;
    transition:left .35s ease;
    z-index:10005;
    overflow-y:auto;
    border-right:1px solid rgba(246,196,83,.16);
  }

  .nav-mobile.active{
    left:0;
  }

  .nav-mobile a,
  .nav-mobile button{
    color:var(--text);
    font-weight:900;
    text-decoration:none;
    background:none;
    border:none;
    cursor:pointer;
    text-align:left;
    font-size:16px;
  }

  .nav-mobile a:hover,
  .nav-mobile button:hover{
    color:var(--gold-2);
  }

  .mobile-close{
    position:fixed;
    top:14px;
    right:14px;
    width:44px;
    height:44px;
    border-radius:14px;
    border:1px solid rgba(246,196,83,.18);
    background:rgba(255,255,255,.05);
    display:grid;
    place-items:center;
    color:var(--gold);
    cursor:pointer;
    z-index:10006;
    box-shadow:0 14px 34px rgba(0,0,0,.50);
    opacity:0;
    pointer-events:none;
    transform:translateY(-6px);
    transition:.22s ease;
  }

  .nav-mobile.active .mobile-close{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
  }

  .nav-mobile .dropdown{
    position:static;
  }

  .nav-mobile .dropdown-menu{
    position:static;
    transform:none;
    min-width:0;
    max-width:100%;
    opacity:1;
    visibility:visible;
    display:none;
    margin-top:8px;
    padding:12px;
    border-radius:16px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(246,196,83,.14);
    box-shadow:none;
  }

  .nav-mobile .dropdown-menu.active{
    display:block !important;
  }

  .nav-mobile .dropdown-menu a{
    display:block;
    width:100%;
    padding:11px 12px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.07);
    background:rgba(255,255,255,.02);
    margin-bottom:8px;
  }

  .nav-mobile .dropdown-menu a:last-child{
    margin-bottom:0;
  }

  .nav-mobile .dropdown-menu a:hover{
    background:rgba(246,196,83,.08);
    border-color:rgba(246,196,83,.18);
    color:var(--text);
  }

  .nav-mobile .btn-book,
  .nav-mobile .btn-call{
    width:100%;
    justify-content:center;
    margin-top:4px;
  }

  .nav-mobile .btn-call{
    display:flex;
  }
}

@media (max-width:520px){
  .btn-book{
    min-height:38px;
    padding:0 12px;
    font-size:13px;
  }
  .brand-name{max-width:48vw;}
  .nav-mobile{padding-left:18px;padding-right:18px;}
}

@media (max-width:380px){
  .btn-book{display:none;}
  .brand-name{max-width:66vw;}
}

