/* ===== legacy helpers kept as-is ===== */
.dropdown-submenu{ position:relative; }
.dropdown-submenu .dropdown-menu{ top:0; left:100%; margin-top:-1px; }
ul{ list-style:none; padding:0; margin:0; }
ul li{ display:block; position:relative; float:left; }

@media (min-width: 992px){
  li ul{ display:none; }
  ul li a{
    display:block; padding:1em; text-decoration:none; white-space:nowrap; color:#fff;
  }
  li:hover > ul{ display:block; position:absolute; }
  li:hover li{ float:none; }
}
.main-navigation li ul li{ border-top:0; }
ul ul ul{ left:100%; top:0; }
ul:before, ul:after{ content:" "; display:table; } ul:after{ clear:both; }

/* Mobile footer adjustments (legacy) */
@media (max-width: 767.98px){
  .footer{ max-height:150px !important; }
  .footer h3{ font-size:1.5rem !important; }
  .footer .py-100{ padding-top:1rem !important; padding-bottom:1rem !important; }
}

/* ====== Header base ====== */
.hoh-navbar{ position:relative; z-index:1050; }
.hoh-nav-inner{ padding-left:30px; padding-right:30px; }

/* Global nav link tone */
.navbar-dark .navbar-nav .nav-link{ color:#cbd3d6; padding:0 .625rem; }
.navbar-dark .navbar-nav .nav-link:hover{ color:#fff; }

/* =========================
   DESKTOP (≥992px) — stable, overlaying dropdowns
   ========================= */
@media (min-width: 992px){
  .hoh-desktop .navbar-brand img{ max-height:32px; width:auto; display:block; }
  .hoh-desktop .navbar-brand{ margin-right:40px; }

  /* Keep navbar & menus over the hero video */
  .hoh-navbar { z-index: 3000; }
  .hoh-desktop { position: relative; z-index: 3500; }

  .hoh-mainmenu .dropdown-menu{
    display:none;
    min-width:260px;
    padding:10px 0;
    margin-top:.6rem;                 /* tiny cushion prevents hover gap */
    background:rgba(54,71,79,.90);    /* semi-transparent slate overlay */
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    border:0; border-radius:6px;
    box-shadow:0 10px 30px rgba(0,0,0,.35);
    position:absolute; z-index:4000;  /* above video */
    pointer-events:auto;
  }

  /* open first-level on hover */
  .hoh-mainmenu .nav-item.dropdown:hover > .dropdown-menu{ display:block; }

  .hoh-mainmenu .dropdown-item{
    color:#dfe7ea; padding:10px 18px; font-weight:500;
  }
  .hoh-mainmenu .dropdown-item:hover,
  .hoh-mainmenu .dropdown-item:focus{
    color:#fff; background:rgba(255,255,255,.06);
  }

  /* second-level flyouts (sub–submenu) */
  .dropdown-submenu{ position:relative; }
  .dropdown-submenu > .dropdown-menu{
    top:0; left:100%;
    margin-left:.4rem;                 /* small offset; no dead zone */
    margin-top:-10px;
    z-index:4000;
    background:rgba(54,71,79,.90);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    pointer-events:auto;
  }
  .dropdown-submenu:hover > .dropdown-menu{ display:block; }

  /* chevron */
  .dropdown-submenu > .dropdown-item{ position:relative; padding-right:28px; }
  .dropdown-submenu > .dropdown-item::after{
    content:'›'; position:absolute; right:12px; top:50%; transform:translateY(-50%);
    color:#a9bbc3; font-size:16px;
  }
}

/* Ensure hero stays below menus */
.hero-video, #heroVid { position:relative; z-index:0; }

/* Mobile header (<992px): logo + burger inline */
@media (max-width: 991.98px){
  .hoh-mobile-topbar{
    padding:6px 10px; display:flex; align-items:center; justify-content:space-between;
  }
  .hoh-mobile-topbar .brand{ display:flex; align-items:center; gap:.5rem; line-height:0; }
  .hoh-mobile-topbar .brand img{ display:block; max-height:25px; width:auto; }
  .hoh-mobile-topbar .navbar-toggler{
    display:flex; align-items:center; justify-content:center; width:40px; height:40px; padding:0; margin:0;
  }
}

/* Offcanvas polish */
.offcanvas .offcanvas-title{ font-weight:600; }
.offcanvas .list-group-item:first-child{ border-top:0; }

/* === Mobile offcanvas: dark semi-transparent + blur + visible close X === */
.offcanvas.text-bg-dark,
.offcanvas {
  background: rgba(24,24,24,.92) !important;
  background-color: rgba(24,24,24,.92) !important;
  --bs-bg-opacity: .92 !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 0;
}

/* header text + close button visibility */
.offcanvas .offcanvas-title { color: #fff; font-weight: 600; }
.offcanvas .btn-close { filter: invert(1) grayscale(100%) brightness(160%); opacity: 1; }

/* neutralize white list-group backgrounds inside offcanvas */
.offcanvas .list-group-item {
  background: transparent !important;
  color: #fff;
  border-color: rgba(255,255,255,.08);
}
.offcanvas .list-group-item a { color: #fff; text-decoration: none; }
.offcanvas .list-group-item a:hover { color: #ffd; }

/* Accordion headers inside offcanvas */
.offcanvas .accordion-button {
  background: transparent !important;
  color: #fff !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow: none;
}
.offcanvas .accordion-button:not(.collapsed) {
  background: rgba(255,255,255,.06) !important;
  color: #fff !important;
}

/* Smooth fade for panel + backdrop */
@media (max-width: 991.98px){
  .offcanvas {
    opacity: 0;
    transition: opacity .28s ease, transform .28s ease;
    will-change: opacity, transform;
  }
  .offcanvas.show { opacity: 1; }
  .offcanvas.hiding { opacity: 0; }

  .offcanvas-backdrop {
    background: rgba(0,0,0,.55);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    opacity: 0;
    transition: opacity .28s ease;
  }
  .offcanvas-backdrop.show { opacity: 1; }
}

/* Accessibility: respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .offcanvas,
  .offcanvas-backdrop { transition: none !important; }
}

/* Force accordion chevrons (arrows) to white in mobile offcanvas */
.offcanvas .accordion-button::after,
.offcanvas .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat;
  background-size: 1rem 1rem;
  filter: none !important;
  opacity: 1;
}

/* ====== HERO OVERLAY CONTROLS ====== */

/* Play button (YouTube-like) */
#playBtn{
  position:absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width:60px; height:64px;               /* slightly smaller per your last edit */
  border:0; border-radius:50%;
  background: rgba(0,0,0,.6);
  cursor:pointer;
  z-index:15;

  display:flex; align-items:center; justify-content:center;
  padding:0; line-height:0;

  transition: opacity .35s ease, transform .35s ease, background .2s ease;
}
#playBtn::before{
  content:"";
  width:0; height:0;
  border-left:22px solid #fff;
  border-top:13px solid transparent;
  border-bottom:13px solid transparent;
  transform: translateX(1px);           /* optical nudge */
}
#playBtn:hover {
  background: rgba(255,255,255,0.4);
  transform: translate(-50%, -50%) scale(1.05);
}
#playBtn.is-fading{
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.9);
  pointer-events: none;
}

/* Pause button (two bars) — shown only on hover while playing */
#pauseBtn{
  position:absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width:84px; height:84px;
  border:0; border-radius:50%;
  background: rgba(0,0,0,.6);
  color:#fff;
  z-index:15;
  display:flex; align-items:center; justify-content:center;
  padding:0; line-height:0;

  opacity:0; pointer-events:none;
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
}
#pauseBtn::before, #pauseBtn::after{
  content:""; display:block;
  width:6px; height:22px; background:#fff; border-radius:1px; margin:0 3px;
}
.hero-video.show-pause #pauseBtn{ opacity:1; pointer-events:auto; }
#pauseBtn:hover{ background: rgba(255,255,255,0.4); transform: translate(-50%,-50%) scale(1.05); }

/* Hero container + video sizing (desktop & mobile) */
.hero-video{
  position:relative;
  overflow:hidden;
  height:100vh;
  width:100vw;
}
#heroVid{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
@media (max-width: 767.98px){
  .hero-video{
    height:auto;
    width:100%;
    aspect-ratio:16 / 9;
    max-height:100vh;
  }
  #heroVid{ object-fit:cover; }
}

/* ---------- New footer block (replaces .py-100 need) ---------- */
.hoh-footer{
  padding-top: 2rem;
  padding-bottom: 1.5rem;
  background-color: rgba(0,0,0,0.85);
}
.hoh-footer .text-muted{ color:#b8c0c4 !important; }
.hoh-footer h3{ margin:0; }

/* ---------- Mobile footer reordering ---------- */
@media (max-width: 767.98px){
  .hoh-footer .row { display:flex; flex-direction:column; }
  /* copyright block (currently 2nd) → move last */
  .hoh-footer .row .col-12:nth-child(2){ order:3; }
  /* phone block (currently 3rd) → middle */
  .hoh-footer .row .col-12:nth-child(3){ order:2; }
  /* email block (currently 4th) → first */
  .hoh-footer .row .col-12:nth-child(4){ order:1; }
}
