/* Tandem V11 | Shared, mobile-first navigation. Desktop navigation is unchanged.
   The native dialog sits outside the sticky header and in the browser top layer,
   so header blur / transforms cannot trap or make the overlay translucent. */
.menu-toggle,
.mobile-menu:not([open]) { display:none; }

@media (max-width:980px) {
  .site-v5 .site-header .menu-toggle {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:auto;
    min-width:86px;
    height:44px;
    min-height:44px;
    flex:0 0 auto;
    padding:0 14px;
    border:0;
    border-radius:999px;
    background:rgba(231,235,226,.8);
    color:var(--ink);
    font-size:.8125rem;
    font-weight:650;
    line-height:1;
    -webkit-tap-highlight-color:transparent;
    transition:background-color .16s ease;
  }
  .site-v5 .menu-toggle::before,
  .site-v5 .menu-toggle::after { content:none; }
  .site-v5 .menu-toggle span { width:auto;height:auto;margin:0;background:none; }
  .site-v5 .menu-toggle svg { flex:none; }
  .site-v5 .menu-toggle:hover { background:#DFE6D8; }
  .site-v5 .menu-toggle:active { background:#D5DECC; }

  .site-v5 .mobile-menu {
    --menu-gutter:22px;
    position:fixed;
    inset:0;
    width:100%;
    max-width:none;
    height:100vh;
    height:100dvh;
    max-height:none;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    box-shadow:none;
    background:#FAF8F5;
    color:#0F1F1A;
    overflow:hidden;
    overscroll-behavior:none;
    isolation:isolate;
    -webkit-tap-highlight-color:transparent;
  }
  .site-v5 .mobile-menu[open] {
    display:flex;
    flex-direction:column;
    animation:tandem-menu-in .2s cubic-bezier(.16,1,.3,1) both;
  }
  .site-v5 .mobile-menu::backdrop { background:rgba(15,31,26,.35);backdrop-filter:blur(3px); }
  .site-v5 .mobile-menu:focus { outline:none; }
  .site-v5 .mobile-menu :focus-visible { outline:2px solid #475A3A;outline-offset:3px; }
  .site-v5 .mobile-menu a,
  .site-v5 .mobile-menu button { touch-action:manipulation; }
  .site-v5 .mobile-menu svg { display:block;flex:none; }

  .site-v5 .mobile-menu-header {
    width:100%;
    min-height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex-shrink:0;
    padding:calc(12px + env(safe-area-inset-top,0px)) max(var(--menu-gutter),env(safe-area-inset-right,0px)) 12px max(var(--menu-gutter),env(safe-area-inset-left,0px));
  }
  .site-v5 .mobile-menu-brand { display:flex;align-items:center;min-height:44px;padding:0; }
  .site-v5 .mobile-menu-brand img { width:112px;height:auto; }
  .site-v5 .mobile-menu-close {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-width:88px;
    min-height:44px;
    padding:0 14px;
    border:0;
    border-radius:999px;
    background:#E8ECE3;
    color:#0F1F1A;
    font-size:.8125rem;
    font-weight:650;
    line-height:1.2;
    cursor:pointer;
  }
  .site-v5 .mobile-menu-close:hover { background:#DEE5D6; }
  .site-v5 .mobile-menu-scroll {
    flex:1 1 auto;
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior-y:contain;
    scrollbar-width:thin;
    scrollbar-color:#AEBDA5 transparent;
    -webkit-overflow-scrolling:touch;
    padding:10px max(var(--menu-gutter),env(safe-area-inset-right,0px)) 20px max(var(--menu-gutter),env(safe-area-inset-left,0px));
    scroll-padding-block:12px;
  }
  .site-v5 .mobile-menu-scroll:focus { outline:none; }
  .site-v5 .mobile-menu-content { width:100%; }
  .site-v5 .mobile-menu-label {
    margin:0 0 12px;
    font-family:"Manrope",ui-sans-serif,system-ui,sans-serif;
    font-size:.625rem;
    font-weight:700;
    line-height:1.5;
    letter-spacing:.13em;
    text-transform:uppercase;
    color:#59664F;
  }
  .site-v5 .mobile-overview {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:74px;
    padding:15px 16px;
    border-radius:14px;
    background:#E8EEDD;
    transition:background-color .16s ease;
  }
  .site-v5 .mobile-overview>span { min-width:0; }
  .site-v5 .mobile-overview strong {
    display:block;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:1.1875rem;
    font-weight:600;
    line-height:1.25;
    letter-spacing:-.025em;
  }
  .site-v5 .mobile-overview small { display:block;margin-top:4px;font-size:.71875rem;line-height:1.5;color:#536147; }
  .site-v5 .mobile-overview:hover { background:#DDE7CD; }
  .site-v5 .mobile-arrow { color:currentColor; }

  .site-v5 .mobile-products { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px; }
  .site-v5 .mobile-module {
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    min-height:68px;
    padding:12px 11px;
    border:0;
    border-radius:12px;
    background:#FFF;
    transition:background-color .16s ease;
  }
  .site-v5 .mobile-module-icon { display:flex;align-items:center;justify-content:center;width:23px;flex:0 0 23px;color:#536A43; }
  .site-v5 .mobile-module-copy { min-width:0; }
  .site-v5 .mobile-module strong { display:block;font-size:.875rem;font-weight:650;line-height:1.3;letter-spacing:-.02em;overflow-wrap:anywhere; }
  .site-v5 .mobile-module small { display:block;margin-top:4px;font-size:.65625rem;line-height:1.45;font-weight:450;color:#606B64;overflow-wrap:anywhere; }
  .site-v5 .mobile-module:hover { background:#EDF1E8; }

  .site-v5 .mobile-business {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:20px;
    margin-top:18px;
    padding-top:6px;
    border-top:1px solid #E1E2D9;
  }
  .site-v5 .mobile-business a {
    min-width:0;
    min-height:52px;
    padding:6px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    border-radius:0;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:1.1875rem;
    font-weight:600;
    line-height:1.35;
    letter-spacing:-.025em;
  }
  .site-v5 .mobile-business a span { overflow-wrap:anywhere; }
  .site-v5 .mobile-business a:hover { color:#475A3A; }
  .site-v5 .mobile-resources { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px; }
  .site-v5 .mobile-resources a {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    min-width:0;
    min-height:44px;
    padding:8px 0;
    border-radius:0;
    font-size:.78125rem;
    font-weight:550;
    line-height:1.5;
    color:#536147;
  }
  .site-v5 .mobile-resources a span { overflow-wrap:anywhere; }
  .site-v5 .mobile-resources a:hover { color:#0F1F1A; }

  .site-v5 .mobile-menu-footer {
    position:relative;
    z-index:1;
    flex-shrink:0;
    width:100%;
    padding:14px max(var(--menu-gutter),env(safe-area-inset-right,0px)) calc(4px + env(safe-area-inset-bottom,0px)) max(var(--menu-gutter),env(safe-area-inset-left,0px));
    border-top:1px solid #E1E2D9;
    background:#FAF8F5;
  }
  .site-v5 .mobile-assessment {
    min-height:52px;
    padding:14px 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    border:0;
    border-radius:12px;
    background:#0F1F1A;
    color:#FFF;
    font-size:.875rem;
    font-weight:650;
    line-height:1.5;
    transition:background-color .16s ease;
  }
  .site-v5 .mobile-assessment:hover { background:#2B4233;color:#FFF; }
  .site-v5 .mobile-assessment:focus-visible { outline-offset:4px; }
  .site-v5 .mobile-contact {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:44px;
    padding:10px 0;
    border-radius:4px;
    color:#47583E;
    font-size:.75rem;
    font-weight:650;
    line-height:1.5;
  }
  .site-v5 .mobile-contact:hover { color:#0F1F1A; }
  .site-v5 .mobile-menu a[aria-current] { color:#274518; }
  .site-v5 .mobile-module[aria-current],
  .site-v5 .mobile-overview[aria-current] { background:#E2EAD7;box-shadow:inset 0 0 0 1.5px #70865E; }
  .site-v5 .mobile-business a[aria-current] span,
  .site-v5 .mobile-resources a[aria-current] span,
  .site-v5 .mobile-contact[aria-current] { text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px; }
  .site-v5 .mobile-assessment[aria-current] { color:#FFF;box-shadow:inset 0 0 0 2px #AEBDA5; }
  .site-v5 .mobile-menu-brand[aria-current] { box-shadow:none; }

  /* The body is fixed by JS; this also blocks overscroll behind the dialog. */
  html.mobile-navigation-open { overflow:hidden;overscroll-behavior:none; }
  html.mobile-navigation-open body { overscroll-behavior:none; }
}

/* At tablet sizes the same navigation becomes a right-hand sheet. */
@media (min-width:601px) and (max-width:980px) {
  .site-v5 .mobile-menu { width:440px;left:auto;right:0;box-shadow:-16px 0 60px rgba(15,31,26,.1); }
  .site-v5 .mobile-menu[open] { animation-name:tandem-sheet-in; }
}
@media (max-width:359px) {
  .site-v5 .mobile-menu { --menu-gutter:16px; }
  .site-v5 .mobile-module { gap:7px;min-height:60px;padding:12px 10px; }
  .site-v5 .mobile-module-icon { width:19px;flex-basis:19px; }
  .site-v5 .mobile-module-icon svg { width:18px;height:18px; }
  .site-v5 .mobile-module small { display:none; }
  .site-v5 .mobile-module strong { font-size:.84375rem; }
  .site-v5 .mobile-resources { column-gap:14px; }
}
@media (max-width:980px) and (max-height:600px) {
  .site-v5 .mobile-menu-header { min-height:60px;padding-top:calc(6px + env(safe-area-inset-top,0px));padding-bottom:6px; }
  .site-v5 .mobile-menu-scroll { padding-top:8px;padding-bottom:14px; }
  .site-v5 .mobile-menu-footer { padding-top:10px; }
  .site-v5 .mobile-assessment { min-height:48px;padding-block:12px; }
}
@keyframes tandem-menu-in { from { opacity:0;transform:translateY(10px); } to { opacity:1;transform:none; } }
@keyframes tandem-sheet-in { from { opacity:0;transform:translateX(20px); } to { opacity:1;transform:none; } }
@media (prefers-reduced-motion:reduce) {
  .site-v5 .mobile-menu[open],
  .site-v5 .mobile-menu::backdrop { animation:none; }
  .site-v5 .mobile-menu a,
  .site-v5 .mobile-menu button,
  .site-v5 .site-header .menu-toggle { transition:none; }
}

/* Make all principal links fit a compact portrait phone before using scrolling. */
@media (max-width:600px) and (max-height:600px) {
  .site-v5 .mobile-menu-label { margin-bottom:8px; }
  .site-v5 .mobile-overview { min-height:64px;padding-block:10px; }
  .site-v5 .mobile-module { min-height:52px;padding-block:9px; }
  .site-v5 .mobile-products { gap:6px; }
  .site-v5 .mobile-business { margin-top:12px; }
  .site-v5 .mobile-menu-scroll { padding-bottom:10px; }
}
@media (max-width:980px) {
  .site-v5 .mobile-menu.mobile-menu-fallback { width:100%;left:0;right:0;z-index:1000; }
}
.mobile-menu-nojs { display:none; }
@media (max-width:980px) {
  .site-v5 .mobile-menu-nojs { display:block;padding:12px 22px 22px; }
  .site-v5 .mobile-menu-nojs summary { min-height:44px;cursor:pointer;font-weight:700; }
  .site-v5 .mobile-menu-nojs summary::marker { color:#475A3A; }
  .site-v5 .mobile-menu-nojs div { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px; }
  .site-v5 .mobile-menu-nojs a { display:flex;align-items:center;min-height:44px;padding:10px 8px;background:#EFF2EB;border-radius:8px;font-size:.8125rem;font-weight:600; }
}