/* GlassQuote.ca v322 — compact mobile navigation (visual refresh) */

/* Keep the open/close control readable against the pale header. */
body.menu-open .landing-top-controls.unified-header .hot-menu-fab{
  border-color:#071d35!important;
  background:#071d35!important;
  color:#fff!important;
  box-shadow:0 8px 22px rgba(7,29,53,.22)!important;
}
body.menu-open .landing-top-controls.unified-header .hot-menu-fab:hover,
body.menu-open .landing-top-controls.unified-header .hot-menu-fab:focus-visible{
  background:#0b2f52!important;
  color:#fff!important;
}

/* One natural scrolling surface, without the visible inner scrollbar. */
.menu-panel{
  top:calc(var(--gq-safe-top) + 68px)!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  width:100%!important;
  max-height:none!important;
  padding:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-y:contain!important;
  scrollbar-width:none!important;
  scrollbar-gutter:auto!important;
  border:0!important;
  border-top:1px solid rgba(255,255,255,.16)!important;
  border-radius:24px 24px 0 0!important;
  background:
    radial-gradient(circle at 88% 0%,rgba(56,163,232,.24),transparent 40%),
    radial-gradient(circle at 8% 92%,rgba(255,151,0,.10),transparent 38%),
    linear-gradient(165deg,#0c2338 0,#081d35 52%,#0b2f52 100%)!important;
  box-shadow:0 -10px 40px rgba(3,14,26,.4)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  backdrop-filter:blur(18px)!important;
}
.menu-panel::-webkit-scrollbar{display:none!important}
.menu-panel[hidden]{display:none!important}
.menu-inner.menu-v320{
  width:min(760px,100%)!important;
  min-height:max-content!important;
  margin:0 auto!important;
  padding:14px 16px calc(20px + var(--gq-safe-bottom,env(safe-area-inset-bottom,0px)))!important;
}

.menu-v320 .menu-topline{
  position:static!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 0 12px!important;
  padding:2px 2px 12px!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
  background:none!important;
}
.menu-v320 .menu-topline::before{
  content:"";
  flex:0 0 34px;
  width:34px;height:34px;
  border-radius:10px;
  background:
    linear-gradient(155deg,rgba(255,255,255,.5),rgba(255,255,255,.06) 55%),
    linear-gradient(135deg,#1a5f96,#0e3a63);
  border:1px solid rgba(159,205,239,.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
}
.menu-v320 .menu-topline>div{display:grid!important;gap:2px!important}
.menu-v320 .menu-eyebrow{
  color:#fff!important;
  font-size:1.08rem!important;
  font-weight:950!important;
  letter-spacing:-.025em!important;
}
.menu-v320 .menu-eyebrow-sub{
  color:#a9bed1!important;
  font-size:.72rem!important;
  font-weight:720!important;
  line-height:1.35!important;
}
.menu-v320 .menu-scroll-note{display:none!important}

.menu-v320 .menu-section{display:grid!important;gap:8px!important}
.menu-v320 .menu-section+.menu-section{
  margin-top:14px!important;
  padding-top:14px!important;
  border-top:1px solid rgba(255,255,255,.11)!important;
}
.menu-v320 .menu-section-title{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  margin:0 2px 3px!important;
  color:#a9d7f5!important;
  font-size:.64rem!important;
  font-weight:950!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
}
.menu-v320 .menu-section-title::before{
  content:"";
  width:12px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,#38a3e8,transparent);
}

.menu-primary-stack{display:grid;gap:8px}
.menu-primary-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.menu-v320 .menu-card{
  position:relative!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  min-height:64px!important;
  padding:10px 12px!important;
  border:1px solid rgba(159,205,239,.16)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.03))!important;
  color:#fff!important;
  text-decoration:none!important;
  box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 6px 14px rgba(3,14,26,.18)!important;
  transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease!important;
}
.menu-v320 .menu-card:hover,
.menu-v320 .menu-card:focus-visible{
  border-color:rgba(123,204,255,.5)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.045))!important;
  transform:translateY(-1px)!important;
}
.menu-v320 .menu-card:active{transform:translateY(0) scale(.985)!important}

.menu-v320 .menu-card-hot{
  min-height:70px!important;
  overflow:hidden!important;
  border-color:rgba(255,177,51,.7)!important;
  background:linear-gradient(115deg,rgba(255,112,24,.26),rgba(255,183,61,.1))!important;
  box-shadow:inset 0 0 0 1px rgba(255,151,0,.08),0 10px 24px rgba(255,112,24,.16)!important;
}
.menu-v320 .menu-card-hot::after{
  content:"";
  position:absolute;
  top:-60%;left:-30%;
  width:45%;height:220%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);
  transform:rotate(12deg);
  animation:gq-menu-shine 3.4s ease-in-out infinite;
  pointer-events:none;
}
@keyframes gq-menu-shine{
  0%,18%{transform:translateX(-40%) rotate(12deg)}
  55%,100%{transform:translateX(340%) rotate(12deg)}
}
.menu-v320 .menu-card-hot:hover,
.menu-v320 .menu-card-hot:focus-visible{
  border-color:#ffb73d!important;
  background:linear-gradient(115deg,rgba(255,112,24,.34),rgba(255,183,61,.14))!important;
}

.menu-v320 .menu-ic{
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  border:1px solid rgba(105,190,247,.36)!important;
  border-radius:12px!important;
  background:linear-gradient(155deg,rgba(255,255,255,.14),rgba(19,115,191,.22))!important;
  color:#83d0ff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12)!important;
}
.menu-v320 .menu-card-hot .menu-ic{
  border-color:rgba(255,220,163,.56)!important;
  background:linear-gradient(145deg,#ff7a2e,#ffbd4e)!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(255,112,24,.24)!important;
}
.menu-v320 .menu-ic svg{width:22px!important;height:22px!important}
.menu-v320 .menu-text{display:grid!important;gap:1px!important;min-width:0!important}
.menu-v320 .menu-text b{
  color:#fff!important;
  font-size:.93rem!important;
  font-weight:950!important;
  line-height:1.12!important;
  letter-spacing:-.025em!important;
}
.menu-v320 .menu-text span{
  overflow:hidden!important;
  color:#aabfd2!important;
  font-size:.67rem!important;
  font-weight:700!important;
  line-height:1.25!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.menu-v320 .menu-arrow{
  color:#79b4dc!important;
  font-size:1.28rem!important;
  font-weight:900!important;
  line-height:1!important;
  transition:transform .15s ease!important;
}
.menu-v320 .menu-card:hover .menu-arrow{transform:translateX(2px)!important}
.menu-v320 .menu-card-hot .menu-arrow{color:#ffb73d!important}

/* Products card gets a teal accent, Services a violet accent — visually distinct instead of twin blue cards. */
.menu-primary-pair .menu-card:nth-child(1) .menu-ic{
  border-color:rgba(96,224,201,.4)!important;
  background:linear-gradient(155deg,rgba(255,255,255,.14),rgba(20,166,140,.26))!important;
  color:#6fe8cb!important;
}
.menu-primary-pair .menu-card:nth-child(2) .menu-ic{
  border-color:rgba(190,150,255,.4)!important;
  background:linear-gradient(155deg,rgba(255,255,255,.14),rgba(112,63,201,.28))!important;
  color:#c6a8ff!important;
}

/* The four browsing links are compact controls rather than full feature cards. */
.menu-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.menu-quick-link{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:9px;
  min-height:50px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:13px;
  background:rgba(255,255,255,.04);
  color:#fff;
  text-decoration:none;
  transition:transform .15s ease,border-color .15s ease,background .15s ease;
}
.menu-quick-link:hover,.menu-quick-link:focus-visible{border-color:rgba(123,204,255,.42);background:rgba(255,255,255,.08);transform:translateY(-1px)}
.menu-quick-link:active{transform:translateY(0) scale(.98)}
.menu-quick-link .menu-ic{width:34px!important;height:34px!important;flex-basis:34px!important;border-radius:10px!important}
.menu-quick-link .menu-ic svg{width:18px!important;height:18px!important}
.menu-quick-link b{min-width:0;font-size:.8rem;font-weight:900;line-height:1.15;letter-spacing:-.015em}

/* Give each Explore link its own tint so the grid reads at a glance instead of four identical blue squares. */
.menu-quick-grid .menu-quick-link:nth-child(1) .menu-ic{background:rgba(56,163,232,.2);border-color:rgba(105,190,247,.4);color:#83d0ff}
.menu-quick-grid .menu-quick-link:nth-child(2) .menu-ic{background:rgba(255,197,61,.18);border-color:rgba(255,197,61,.4);color:#ffcf5c}
.menu-quick-grid .menu-quick-link:nth-child(3) .menu-ic{background:rgba(85,209,140,.18);border-color:rgba(85,209,140,.4);color:#79e0a8}
.menu-quick-grid .menu-quick-link:nth-child(4) .menu-ic{background:rgba(255,120,150,.18);border-color:rgba(255,120,150,.4);color:#ff9ab0}

.menu-v320 .menu-link-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
.menu-v320 .menu-link-grid>a{
  display:flex!important;
  align-items:center!important;
  min-height:44px!important;
  padding:9px 11px!important;
  border:1px solid rgba(255,255,255,.1)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.038)!important;
  color:#fff!important;
  text-decoration:none!important;
  transition:transform .15s ease,border-color .15s ease,background .15s ease!important;
}
.menu-v320 .menu-link-grid>a:hover,
.menu-v320 .menu-link-grid>a:focus-visible{border-color:rgba(123,204,255,.38)!important;background:rgba(255,255,255,.075)!important;transform:translateY(-1px)!important}
.menu-v320 .menu-link-grid>a:active{transform:translateY(0) scale(.98)!important}
.menu-v320 .menu-link-grid b{font-size:.76rem!important;font-weight:900!important;line-height:1.15!important}
.menu-v320 .menu-link-grid span{display:none!important}

.menu-v320 .menu-contact-row{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  margin-top:14px!important;
  padding-top:14px!important;
  border-top:1px solid rgba(255,255,255,.11)!important;
}
.menu-v320 .menu-call,
.menu-v320 .menu-email{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;
  align-content:center!important;
  gap:9px!important;
  min-height:56px!important;
  margin:0!important;
  padding:9px 10px!important;
  border-radius:14px!important;
  text-decoration:none!important;
  box-shadow:none!important;
  transition:transform .15s ease,box-shadow .15s ease!important;
}
.menu-v320 .menu-call{
  border:1px solid rgba(255,183,61,.7)!important;
  background:linear-gradient(135deg,#ff9700,#ffbd4e)!important;
  color:#2b1700!important;
}
.menu-v320 .menu-email{
  border:1px solid rgba(105,190,247,.38)!important;
  background:rgba(19,115,191,.17)!important;
  color:#fff!important;
}
.menu-v320 .menu-call:hover,.menu-v320 .menu-call:focus-visible,
.menu-v320 .menu-email:hover,.menu-v320 .menu-email:focus-visible{
  transform:translateY(-1px)!important;
  box-shadow:0 10px 22px rgba(3,14,26,.22)!important;
}
.menu-v320 .menu-call:active,.menu-v320 .menu-email:active{transform:translateY(0) scale(.985)!important}
.menu-v320 .menu-contact-row .menu-ic{
  width:34px!important;
  height:34px!important;
  flex-basis:34px!important;
  border-radius:10px!important;
}
.menu-v320 .menu-call .menu-ic{
  border-color:rgba(62,37,0,.14)!important;
  background:rgba(255,255,255,.22)!important;
  color:#2b1700!important;
}
.menu-v320 .menu-email .menu-ic{background:rgba(19,115,191,.24)!important}
.menu-v320 .menu-contact-copy{display:grid!important;gap:0!important;min-width:0!important}
.menu-v320 .menu-contact-copy b{font-size:.78rem!important;font-weight:950!important;line-height:1.1!important;white-space:nowrap!important}
.menu-v320 .menu-contact-copy small{
  overflow:hidden!important;
  color:inherit!important;
  font-size:.62rem!important;
  font-weight:750!important;
  line-height:1.25!important;
  opacity:.73!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

@media(min-width:700px){
  .menu-panel{
    top:calc(var(--gq-safe-top) + 76px)!important;
    right:auto!important;
    bottom:16px!important;
    left:50%!important;
    width:min(920px,calc(100% - 32px))!important;
    transform:translateX(-50%)!important;
    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:22px!important;
  }
  .menu-inner.menu-v320{width:100%!important;padding:18px 20px calc(20px + var(--gq-safe-bottom,0px))!important}
  .menu-primary-stack{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:stretch}
  .menu-primary-pair{grid-template-columns:1fr;gap:8px}
  .menu-v320 .menu-card-hot{height:100%;min-height:136px!important}
  .menu-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .menu-v320 .menu-link-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:390px){
  .menu-panel{top:calc(var(--gq-safe-top) + 62px)!important;border-radius:20px 20px 0 0!important}
  .menu-inner.menu-v320{padding:12px 12px calc(18px + var(--gq-safe-bottom,0px))!important}
  .menu-v320 .menu-card{min-height:60px!important;padding:9px 10px!important;gap:8px!important}
  .menu-v320 .menu-card-hot{min-height:66px!important}
  .menu-v320 .menu-ic{width:38px!important;height:38px!important;flex-basis:38px!important}
  .menu-v320 .menu-text b{font-size:.84rem!important}
  .menu-v320 .menu-text span{font-size:.61rem!important}
  .menu-v320 .menu-arrow{display:none!important}
  .menu-quick-link{min-height:46px;padding:7px 8px;gap:7px}
  .menu-quick-link b{font-size:.74rem}
  .menu-v320 .menu-link-grid>a{min-height:41px!important;padding:8px 9px!important}
  .menu-v320 .menu-link-grid b{font-size:.7rem!important}
  .menu-v320 .menu-contact-copy b{font-size:.72rem!important}
  .menu-v320 .menu-contact-copy small{font-size:.57rem!important}
}

@media(max-height:650px){
  .menu-inner.menu-v320{padding-top:10px!important}
  .menu-v320 .menu-topline{margin-bottom:9px!important;padding-bottom:9px!important}
  .menu-v320 .menu-card{min-height:56px!important}
  .menu-v320 .menu-card-hot{min-height:62px!important}
  .menu-quick-link{min-height:44px!important}
  .menu-v320 .menu-section+.menu-section{margin-top:9px!important;padding-top:9px!important}
  .menu-v320 .menu-contact-row{margin-top:9px!important;padding-top:9px!important}
}
@media(max-width:520px){
  .menu-primary-pair .menu-text span{display:none!important}
  .menu-primary-pair .menu-card{min-height:58px!important}
}
@media(prefers-reduced-motion:reduce){
  .menu-v320 .menu-card-hot::after{animation:none!important;display:none!important}
}


/* v324 menu image icons */
.menu-v320 .menu-ic.menu-ic-img,
.menu-v320 .menu-quick-link .menu-ic.menu-ic-img,
.menu-urgent-link .menu-ic.menu-ic-img{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  overflow:visible!important;
}
.menu-v320 .menu-ic.menu-ic-img img,
.menu-urgent-link .menu-ic.menu-ic-img img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.22));
}
.menu-v320 .menu-card-hot .menu-ic.menu-ic-img img{filter:drop-shadow(0 6px 14px rgba(255,112,24,.18));}
.menu-v320 .menu-card .menu-ic.menu-ic-img{width:44px!important;height:44px!important;flex:0 0 44px!important}
.menu-v320 .menu-quick-link .menu-ic.menu-ic-img{width:38px!important;height:38px!important;flex:0 0 38px!important}
.menu-urgent-link .menu-ic.menu-ic-img{width:44px!important;height:44px!important;flex:0 0 44px!important}
@media (max-width:420px){
  .menu-v320 .menu-card .menu-ic.menu-ic-img{width:42px!important;height:42px!important;flex-basis:42px!important}
  .menu-v320 .menu-quick-link .menu-ic.menu-ic-img{width:36px!important;height:36px!important;flex-basis:36px!important}
  .menu-urgent-link .menu-ic.menu-ic-img{width:42px!important;height:42px!important;flex-basis:42px!important}
}