/* ============================================
   ✅ GLOBAL NAV WRAPPER
   ============================================ */
.full-nav-wrapper {
    width: 100%;
    background: #f3f9f9;
    padding: 12px 40px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 25px !important;
    position: relative;
    z-index: 999999 !important;
    box-sizing: border-box;
}

/* ============================================
   ✅ NAV MENU (DESKTOP)
   ============================================ */
.adm-menu {
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}

.adm-menu > li {
    position: relative !important;
    overflow: visible !important;
}

.adm-menu .nav-link {
    font-size: 13px;
    font-weight: 500;
  color: #000000 !important;
    text-decoration: none;
    padding: 2px 0;
    white-space: nowrap;
}

.adm-menu .nav-link:hover {
    color: #6712f2;
    text-decoration: underline;
}

/* ============================================
   ✅ DROPDOWN MENU
   ============================================ */
.adm-menu .dropdown {
    list-style: none;
    margin: 0;
    padding: 15px 0;
    background: #fff;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    box-shadow: 0 8px 18px rgba(0,0,0,.08);
    border-radius: 4px;
    display: none;
    z-index: 999999 !important;
}

.adm-menu .dropdown li a {
    display: block;
    padding: 10px 18px;
    color: #062a3b;
    font-size: 13px !important;
    text-decoration: none;
}

.adm-menu .dropdown li a:hover {
    background: #f1f1f1;
    color: #6d28d9;
    text-decoration: underline;
}

/* Show dropdown on hover (desktop) */
@media (min-width: 1025px) {
    .has-dropdown:hover > .dropdown {
        display: block !important;
    }
}

/* ============================================
   ✅ MOBILE MENU
   ============================================ */
.menu-toggle {
    display: none;
    position: absolute;
    right: 20px;
    top: 18px;
    width: 40px;
    height: 32px;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 9999999 !important;
}

.menu-toggle span,
.menu-toggle span::before,
.menu-toggle span::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 4px;
    background: #ffffff !important;
    transition: 0.3s ease;
}

.menu-toggle span {
    top: 50%;
    transform: translateY(-50%);
}

.menu-toggle span::before { top: -10px; }
.menu-toggle span::after { top: 10px; }

.menu-toggle.open span { background: transparent !important; }
.menu-toggle.open span::before {
    transform: rotate(45deg);
    top: 0;
}
.menu-toggle.open span::after {
    transform: rotate(-45deg);
    top: 0;
}

/* Mobile menu layout */
@media (max-width: 1024px) {
    .menu-toggle { display: block !important; }

    .adm-menu {
        display: none;
        flex-direction: column;
        width: 100%;
        background: #f3f9f9;
        padding: 15px 25px;
        gap: 6px !important;
    }

    .adm-menu.open { display: flex !important; }

    .adm-menu .dropdown {
        position: static;
        background: transparent;
        box-shadow: none;
        padding-left: 15px;
    }

    .dropdown li a {
        padding: 6px 14px !important;
        font-size: 13px;
    }
}

/* ============================================
   ✅ ARROWS & ICON OVERRIDES
   ============================================ */
/*.has-dropdown > .nav-link::after {
    content: "↓";
    margin-left: 6px;
    display: inline-block;
    font-size: 14px;
    line-height: 1;
}*/

/* Bootstrap glyphicon fix */
.glyphicon.glyphicon-new-window {
    font-size: 11px !important;
    opacity: 0.65 !important;
    margin-left: 4px;
}

/* ============================================
   ✅ FLIPSNACK FIX — ALLOW DROPDOWN TO OVERLAP
   ============================================ */
.fullbleed-embed {
    position: relative !important;
    overflow: visible !important;
    z-index: 1 !important;
}
/* ✅ 1. Remove grey background on dropdown hover */
.adm-menu .dropdown li a:hover {
    background: transparent !important;
    color: #6d28d9 !important;
    text-decoration: underline;
}

/* ✅ 2. Fix double arrow on "Our company" */
.has-dropdown > .nav-link span.arrow {
    display: none !important; /* Hide any extra arrow markup */
}
/*
.has-dropdown > .nav-link::after {
    content: "↓" !important;
    margin-left: 6px;
    font-size: 14px;
    line-height: 1;
    position: relative;
    top: -1px; /* slight vertical alignment */
}
*/
/* ✅ 3. Reduce spacing between nav items (desktop only) */
@media (min-width: 1025px) {
    .adm-menu {
        gap: 14px !important;   /* adjust to taste, 12–18 is nice */
    }
}
/* ✅ Force Bootstrap glyphicon-new-window to display */
.glyphicon.glyphicon-new-window::before {
    content: "\e164";  /* the correct Bootstrap 3 icon code */
    font-family: "Glyphicons Halflings" !important;
    font-style: normal;
    font-weight: 400;
    font-size: 11px;        /* smaller like you wanted */
    margin-left: 6px;
    position: relative;
    top: -1px;              /* alignment tweak */
}
/* ✅ Dropdown hover text grey */
.adm-menu .dropdown li a:hover {
    background: transparent !important;
    color: #777 !important;   /* soft grey */
    text-decoration: underline;
}
/* ✅ Replace broken glyphicon with reliable SVG */
.new-window-icon {
  display: inline-block;
  width: 11px;
  height: 11px;
  margin-left: 6px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23062a3b' viewBox='0 0 16 16'><path d='M10.5 2a.5.5 0 0 0 0 1h2.793L7.146 9.146a.5.5 0 1 0 .708.708L14 3.707V6.5a.5.5 0 0 0 1 0v-4a.5.5 0 0 0-.5-.5h-4z'/><path d='M13.5 14a.5.5 0 0 1-.5.5h-11A.5.5 0 0 1 1.5 14v-11a.5.5 0 0 1 .5-.5H6a.5.5 0 0 1 0 1H2v10h10V10a.5.5 0 0 1 1 0v4z'/></svg>");
  background-repeat: no-repeat;
  background-size: 11px;
  vertical-align: middle;
  opacity: 0.8;
}
/* Tighten dropdown spacing */
.adm-menu .dropdown li a {
  padding: 4px 14px !important;   /* smaller vertical padding */
  line-height: 1.1 !important;    /* reduce line height */
  font-size: 13px !important;     /* still readable */
}
.full-nav-wrapper {
  padding: 12px 40px;
}
/* Desktop nav spacing — tighter */
@media (min-width: 1025px) {
  .adm-menu {
    gap: 12px !important;   /* adjust between 10–16px depending on taste */
    margin-left: 0 !important;
  }
}
/* Purple hover on main nav items */
.adm-menu > li > .nav-link:hover {
  color: #7A2A90 !important;   /* your purple */
  text-decoration: underline;
}

/* Purple hover on dropdown items */
.adm-menu .dropdown li a:hover {
  color: #7A2A90 !important;   /* your purple */
  text-decoration: underline;
}
/* === MATCH adm-indicia.com HOVER STYLE === */

/* Exact purple from main site */
:root {
  --adm-purple: #4C2982;
}

/* Main nav hover (purple with underline) */
.adm-menu > li > .nav-link:hover {
  color: var(--adm-purple) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--adm-purple) !important;
  text-underline-offset: 3px !important;
  font-weight: 600 !important;
}

/* Dropdown hover */
.adm-menu .dropdown li a:hover {
  color: var(--adm-purple) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--adm-purple) !important;
  background: transparent !important;
  text-underline-offset: 2px !important;
  font-weight: 600 !important;
}

/* Dropdown item sizing to match main site */
.adm-menu .dropdown li a {
  font-size: 13px !important;
  padding: 8px 16px !important;
}
/* Brand purple from the main site */
:root { --adm-purple: #4C2982; }

/* 1) Top-level item turns/stays purple when its dropdown (or any child) is hovered/focused */
.adm-menu > li.has-dropdown:hover > .nav-link,
.adm-menu > li.has-dropdown:focus-within > .nav-link,
.adm-menu > li > .nav-link:hover {
  color: var(--adm-purple) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 2) Dropdown items hover = grey text, no background */
.adm-menu .dropdown li a:hover {
  color: #777 !important;               /* grey */
  background: transparent !important;   /* no grey box */
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* (Optional) keep the arrow next to the parent purple when submenu active */
.adm-menu > li.has-dropdown:hover > .nav-link::after {
  color: var(--adm-purple) !important;
}
/* Make the burger background fully transparent */
.menu-toggle {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Always white burger lines */
.menu-toggle span,
.menu-toggle span::before,
.menu-toggle span::after {
  background: #ffffff !important;
}

/* X animation (white lines) */
.menu-toggle.open span {
  background: transparent !important;
}
.menu-toggle.open span::before {
  transform: rotate(45deg);
  top: 0;
}
.menu-toggle.open span::after {
  transform: rotate(-45deg);
  top: 0;
}
@media (max-width: 1024px) {
  .menu-toggle { display: block !important; }

  .adm-menu {
    display: none;
    flex-direction: column;
    width: 100%;
    background: #f3f9f9;
    padding: 20px;
  }
  .adm-menu.open {
    display: flex !important;
  }
}
/* Burger must sit on top and be clickable */
.menu-toggle{
  position: absolute;
  right: 20px;
  top: 26px;
  z-index: 100000;           /* above everything */
  background: transparent !important;
  border: 0;
  cursor: pointer;
  pointer-events: auto;      /* ensure clicks pass */
}

/* White lines + X animation */
.menu-toggle span,
.menu-toggle span::before,
.menu-toggle span::after{
  content:"";
  position:absolute;
  left:0; width:100%; height:3px;
  background:#fff !important;
  transition:.3s;
}
.menu-toggle span{ top:50%; transform:translateY(-50%); width:34px; }
.menu-toggle span::before{ top:-10px; }
.menu-toggle span::after{ top:10px; }
.menu-toggle.open span{ background:transparent !important; }
.menu-toggle.open span::before{ top:0; transform:rotate(45deg); }
.menu-toggle.open span::after{ top:0; transform:rotate(-45deg); }

/* Mobile behaviour: show burger, hide menu until open */
@media (max-width:1024px){
  .menu-toggle{ display:block !important; }
  .adm-menu{
    display:none; flex-direction:column; width:100%;
    background:#f3f9f9; padding:12px 20px; margin:0;
  }
  .adm-menu.open{ display:flex !important; }

  /* allow dropdowns to expand in flow on mobile */
  .adm-menu .dropdown{ position:static; display:none; box-shadow:none; }
  .adm-menu .dropdown.open{ display:block !important; }
}

/* Desktop: hide burger, keep hover dropdowns */
@media (min-width:1025px){
  .menu-toggle{ display:none !important; }
  .has-dropdown:hover > .dropdown{ display:block !important; }
}

/* Safety: ensure nothing blocks the burger */
.full-nav-wrapper{ position:relative; z-index:99999; }
.full-nav-wrapper *{ pointer-events:auto; }
/* Reduce spacing between logo and first nav item (desktop only) */
@media (min-width: 1025px) {

  /* Reduce overall padding */
  .full-nav-wrapper {
    padding-left: 20px !important;   /* was 40px */
    gap: 10px !important;            /* was higher */
  }

  /* Reduce logo spacing */
  .nav-logo {
    margin-right: 1px !important;   /* was bigger / negative */
  }

  /* Shift menu slightly left */
  .adm-menu {
    margin-left: 0 !important;       /* ensure no forced offset */
    gap: 18px !important;            /* controls spacing between items */
  }
}
/* Purple hover for main nav items – matches adm-indicia.com */
.adm-menu > li > .nav-link:hover {
  color: #6C1E72 !important;
  text-decoration: underline;
}

/* Purple hover for dropdown items */
.adm-menu .dropdown li a:hover {
  color: #6C1E72 !important;
  background: none !important;
}

/* === FINAL COLOUR OVERRIDES TO MATCH adm-indicia.com === */
:root {
  --adm-purple: #6C1E72;   /* main-site purple */
  --adm-grey:   #7C7C7C;   /* dropdown hover grey */
}

/* Base (leave your black top-level colour) */
.adm-menu > li > .nav-link {
  color: #000000 !important;
  font-weight: 500 !important;
}

/* Top-level hover = purple (and stays purple when submenu is active) */
.adm-menu > li > .nav-link:hover,
.adm-menu > li.has-dropdown:hover > .nav-link,
.adm-menu > li.has-dropdown:focus-within > .nav-link {
  color: var(--adm-purple) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 500 !important; /* prevent darker look */
}

/* Dropdown items (base) */
.adm-menu .dropdown li a {
  color: #062A3B !important;
  font-weight: 500 !important;
}

/* Dropdown hover = grey (no purple here) */
.adm-menu .dropdown li a:hover {
  color: var(--adm-grey) !important;
  background: transparent !important;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 500 !important; /* no bold-on-hover */
}