/* ══════════════════════════════════════════════════════════════════════
   R² Advisors — Global navigation menu
   Weights (Architecture v1.5 §10.3): condensed labels, navigation and controls at 400;
   Sofia Pro descriptions at 300.
   Implements: the global navigation of Website Architecture v1.5 §5 (labels, groups,
   mobile behaviour). Labels, destinations and availability: r2-site-navigation.json.
   GLOBAL. Ships in the r2-site stylesheet with the header and footer. It is
   the ONLY place menu styling lives: no Elementor widget-level CSS, no page
   stylesheet, no later override. Replaces, and requires deleting:
     · the "Menu" block and every .menu-* rule in global-base.css
       (already removed from the global-base.css delivered with this file)
     · global-menu-mobile.css in its entirety

   Two presentations from one markup:
     Desktop / tablet  four columns (two at ≤1024px), every group expanded,
                       a three-block foot: Headquarters · Contact · action.
     Mobile sheet      ≤760px wide, or a short coarse-pointer screen
                       (landscape phones): the four commercial paths always
                       visible, three exclusive disclosures, then the action.
                       No introduction, no Headquarters, no Our reach.

   The sheet query is declared once as the custom media below, written out in
   full where used (custom media is not yet supported by browsers):
     --r2-menu-sheet: (max-width: 760px), (max-height: 520px) and (pointer: coarse)
   GIR-04 (UD-8, 2026-10-19): compact breakpoint 640 → 760px; What we do heading kept;
   15px descriptions; 100dvh and safe-area insets.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Overlay ───────────────────────────────────────────────────────── */
.r2-menu:not(#r2gc-isolate) {
  position: fixed; inset: 0; z-index: var(--r2-z-menu, 80);
  height: 100vh; height: 100dvh;   /* dynamic viewport: no gap under mobile browser toolbars */
  overflow-y: auto; overscroll-behavior: contain;
  background: var(--r2-navy, #1C2E45); color: var(--r2-paper, #F6F1EA);
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity 300ms ease, transform 300ms cubic-bezier(.22, .61, .36, 1), visibility 0s linear 300ms;
}
.r2-menu.is-open:not(#r2gc-isolate) {
  opacity: 1; visibility: visible; transform: none;
  transition: opacity 300ms ease, transform 300ms cubic-bezier(.22, .61, .36, 1), visibility 0s;
}
.r2-menu :focus-visible:not(#r2gc-isolate) { outline: 2px solid var(--r2-taupe, #B6A58F); outline-offset: 4px; }

/* ── Header row: wordmark + Close, sticky inside the overlay ───────── */
.r2-menu__top:not(#r2gc-isolate) {
  position: sticky; top: 0; z-index: 2;
  background: var(--r2-navy, #1C2E45); border-bottom: 1px solid rgba(246, 241, 234, .14);
  padding-top: env(safe-area-inset-top, 0px);   /* notch / status bar (needs viewport-fit=cover) */
}
.r2-menu__close:not(#r2gc-isolate) { min-height: 44px; min-width: 44px; justify-content: flex-end; }

/* ── Body ──────────────────────────────────────────────────────────── */
.r2-menu__body:not(#r2gc-isolate) { padding-top: clamp(40px, 7vh, 80px); padding-bottom: clamp(48px, 8vh, 88px); }

.r2-menu__intro:not(#r2gc-isolate) {
  /* A quiet orientation line, not a second hero (board, Oct 2026): capped at
     2.75rem, no measure limit, one line on desktop. Hidden in the mobile sheet. */
  max-width: none; margin: 0 0 30px;
  font-family: var(--r2-font-editorial, "ivypresto-headline", serif);
  font-size: clamp(1.8rem, 2.6vw, 2.75rem); font-style: italic; font-weight: 100;   /* licensed Thin Italic; font-synthesis: none */
  line-height: 1.08; letter-spacing: -.012em; color: var(--r2-paper, #F6F1EA);
}
@media (min-width: 1025px) {
  .r2-menu__intro:not(#r2gc-isolate) { white-space: nowrap; }
}
.r2-menu__intro p:not(#r2gc-isolate) { margin: 0; }

/* ── Grid: four columns sharing one top baseline. Each column is a three-row
      subgrid (heading · gloss · content), so the lists begin level even when
      the glosses differ in length. ── */
.r2-menu__grid:not(#r2gc-isolate) {
  /* Columns weighted by importance: What we do and Operating environments are
     wider than Insights and The firm (board, Oct 2026). Minimums are the board's
     less a margin, so four columns fit from 1025px without overflow. No top
     hairline: the sticky header already draws one. */
  display: grid;
  grid-template-columns: minmax(240px, 1.3fr) minmax(220px, 1.15fr) minmax(160px, .78fr) minmax(160px, .78fr);
  grid-template-rows: auto auto 1fr;
  gap: 0 clamp(30px, 3vw, 52px);
  padding-top: 18px; border-top: 0;
}
.r2-menu__column:not(#r2gc-isolate) { grid-row: span 3; display: grid; grid-template-rows: subgrid; align-content: start; }

.r2-menu__heading:not(#r2gc-isolate) {
  margin: 0 0 10px;
  font-family: var(--r2-font-display, "ivypresto-display", serif); font-weight: 100; font-style: normal;
  font-size: clamp(1.5rem, 2vw, 1.875rem); line-height: 1.12; letter-spacing: -.01em;
  color: var(--r2-paper, #F6F1EA);
}
.r2-menu__heading a:not(#r2gc-isolate) { color: inherit; text-decoration: none; }
.r2-menu__heading a:hover:not(#r2gc-isolate),
.r2-menu__heading a:focus-visible:not(#r2gc-isolate),
.r2-menu__heading a[aria-current="page"]:not(#r2gc-isolate) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }

.r2-menu__gloss:not(#r2gc-isolate) {
  margin: 0 0 18px; max-width: 24rem;
  font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
  font-size: .9375rem; line-height: 1.4; color: rgba(246, 241, 234, .64);
}

/* What-we-do records: title + description, fine dividers. No icons, cards,
   badges or arrows. Hover changes the title only. */
.r2-menu__paths:not(#r2gc-isolate) { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(246, 241, 234, .14); }
.r2-menu__paths li:not(#r2gc-isolate) { border-bottom: 1px solid rgba(246, 241, 234, .14); }
.r2-menu__path:not(#r2gc-isolate) { display: block; padding: 14px 0 15px; color: inherit; text-decoration: none; }
.r2-menu__path-title:not(#r2gc-isolate) {
  display: block;
  font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
  font-size: 1.0625rem; line-height: 1.25; color: var(--r2-paper, #F6F1EA);
}
.r2-menu__path-description:not(#r2gc-isolate) {
  display: block; max-width: 25rem; margin-top: 5px;
  font-family: var(--r2-font-body, "sofia-pro", sans-serif); font-weight: var(--r2-weight-body);
  font-size: .9375rem; line-height: 1.45; color: rgba(246, 241, 234, .64);
}
.r2-menu__path:hover .r2-menu__path-title:not(#r2gc-isolate),
.r2-menu__path:focus-visible .r2-menu__path-title:not(#r2gc-isolate) { color: var(--r2-taupe, #B6A58F); }
.r2-menu__path:focus-visible:not(#r2gc-isolate) { outline-offset: 5px; }
/* Current page: a quiet underline on the title, never a colour block. */
.r2-menu__path[aria-current="page"] .r2-menu__path-title:not(#r2gc-isolate) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }

/* Secondary links */
.r2-menu__items:not(#r2gc-isolate) { margin: 0; padding: 0 0 0 16px; list-style: none; border-left: 1px solid rgba(246, 241, 234, .14); }
.r2-menu__items a:not(#r2gc-isolate) {
  display: inline-block; padding: 8px 0;
  font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
  font-size: 1rem; line-height: 1.35; letter-spacing: .01em;
  color: rgba(246, 241, 234, .78); text-decoration: none;
}
.r2-menu__items a:hover:not(#r2gc-isolate),
.r2-menu__items a:focus-visible:not(#r2gc-isolate),
.r2-menu__items a[aria-current="page"]:not(#r2gc-isolate) { color: var(--r2-paper, #F6F1EA); }
.r2-menu__items a[aria-current="page"]:not(#r2gc-isolate) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }

/* Operating environments vs specializations: three environments, then a quiet
   sublabel and the two specializations. The sublabel is structure, not a link. */
.r2-menu__sublabel:not(#r2gc-isolate) {
  margin: 18px 0 6px;
  font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
  font-size: .8125rem; line-height: 1.3; letter-spacing: .04em; color: rgba(246, 241, 234, .64);
}

/* Mobile-only parts are absent above the sheet breakpoint. */
.r2-menu__disclosure:not(#r2gc-isolate),
.r2-menu__overview:not(#r2gc-isolate) { display: none; }

/* Panels are served open (no `hidden` attribute). The global script adds
   `hidden` only while the sheet layout applies, and removes it when the
   layout changes back, so `hidden` and aria-expanded always agree. Spec §7
   shows `hidden` in the served markup; that cannot work here because the
   global reset declares [hidden] { display: none !important }, which would
   hide the desktop columns too. Without JavaScript every link stays reachable. */

/* ── Foot: Headquarters · Contact · action ─────────────────────────── */
.r2-menu__foot:not(#r2gc-isolate) {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px clamp(28px, 3vw, 48px);
  margin-top: clamp(40px, 6vh, 64px); padding-top: 32px; border-top: 1px solid rgba(246, 241, 234, .14);
}
/* GIR-06 (UD-8): the action's supporting sentence (Homepage v15 values). Hidden in the compact layout. */
.r2-menu__action-body:not(#r2gc-isolate) {
  margin: 0 0 18px; max-width: 26rem;
  font-family: var(--r2-font-body, "sofia-pro", sans-serif); font-weight: var(--r2-weight-body); font-style: normal;
  font-size: .9375rem; line-height: 1.5; letter-spacing: .004em; color: rgba(246, 241, 234, .80);
}
.r2-menu__label:not(#r2gc-isolate) {
  margin: 0 0 8px;
  font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
  font-size: .8125rem; line-height: 1.3; letter-spacing: .07em; color: rgba(246, 241, 234, .64);
}
.r2-menu__reference address:not(#r2gc-isolate),
.r2-menu__reference p:not(#r2gc-isolate) {
  margin: 0; font-style: normal;
  font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
  font-size: 1rem; line-height: 1.5; color: rgba(246, 241, 234, .78);
}
.r2-menu__reference a:not(#r2gc-isolate) { color: inherit; text-decoration: none; }
.r2-menu__reference a:hover:not(#r2gc-isolate),
.r2-menu__reference a:focus-visible:not(#r2gc-isolate) { color: var(--r2-paper, #F6F1EA); text-decoration: underline; text-underline-offset: 4px; }

/* ── Tablet ────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .r2-menu__grid:not(#r2gc-isolate) { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; row-gap: 40px; }
  .r2-menu__column:not(#r2gc-isolate) { grid-row: auto; display: block; }
  .r2-menu__foot:not(#r2gc-isolate) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Two columns only while each stays near 320px; below that, one. */
@media (max-width: 760px) {
  .r2-menu__grid:not(#r2gc-isolate),
  .r2-menu__foot:not(#r2gc-isolate) { grid-template-columns: 1fr; }
}

/* ── Touch: 44px targets on any coarse pointer, at every width ─────── */
@media (hover: none), (pointer: coarse) {
  .r2-menu a:not(#r2gc-isolate),
  .r2-menu button:not(#r2gc-isolate) { min-height: 44px; }
  .r2-menu__heading a:not(#r2gc-isolate),
  .r2-menu__reference a:not(#r2gc-isolate) { display: inline-flex; align-items: center; }
  .r2-menu__items a:not(#r2gc-isolate) { display: flex; align-items: center; padding: 4px 0; }
}

/* ══ Mobile sheet ══════════════════════════════════════════════════════
   (max-width: 760px), (max-height: 520px) and (pointer: coarse)
   ═════════════════════════════════════════════════════════════════════ */
@media (max-width: 760px), (max-height: 520px) and (pointer: coarse) {
  .r2-menu__body:not(#r2gc-isolate) { padding-top: 20px; padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)); }
  .r2-menu__intro:not(#r2gc-isolate) { display: none; }

  .r2-menu__grid:not(#r2gc-isolate) { grid-template-columns: 1fr; grid-template-rows: none; gap: 0; padding-top: 0; border-top: 0; }
  .r2-menu__column:not(#r2gc-isolate) { grid-row: auto; display: block; }

  /* Orientation comes from the paths themselves; the What we do heading link stays (UD-8). */
  .r2-menu__heading:not(#r2gc-isolate),
  .r2-menu__gloss:not(#r2gc-isolate) { display: none; }
  .r2-menu__column--solutions .r2-menu__heading:not(#r2gc-isolate) { display: block; margin: 16px 0 6px; }

  .r2-menu__column--solutions:not(#r2gc-isolate) { border-top: 1px solid rgba(246, 241, 234, .14); }
  .r2-menu__paths:not(#r2gc-isolate) { border-top: 0; }
  .r2-menu__path:not(#r2gc-isolate) { min-height: 44px; padding: 12px 0 13px; }
  .r2-menu__path-title:not(#r2gc-isolate) { font-size: 17px; }
  .r2-menu__path-description:not(#r2gc-isolate) { display: block; margin-top: 3px; font-size: 15px; line-height: 1.4; }   /* v1.5 §5.3: descriptions stay visible */

  /* Disclosures: real buttons, 52px, a restrained plus/minus. */
  .r2-menu__secondary:not(#r2gc-isolate) { border-bottom: 1px solid rgba(246, 241, 234, .14); }
  .r2-menu .r2-menu__disclosure:not(#r2gc-isolate) {   /* outranks the 44px coarse-pointer rule */
    display: flex; width: 100%; min-height: 52px; align-items: center; justify-content: space-between; gap: 20px;
    padding: 0; border: 0; background: transparent; cursor: pointer; text-align: left;
    font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
    font-size: 17px; line-height: 1.3; color: var(--r2-paper, #F6F1EA);
  }
  .r2-menu__disclosure-sign:not(#r2gc-isolate) { flex: none; width: 1ch; text-align: center; font-size: 22px; font-weight: var(--r2-weight-body); color: rgba(246, 241, 234, .64); }
  .r2-menu__disclosure-sign:not(#r2gc-isolate)::before { content: "+"; }
  .r2-menu__disclosure[aria-expanded="true"] .r2-menu__disclosure-sign:not(#r2gc-isolate)::before { content: "−"; }
  .r2-menu__disclosure[aria-expanded="true"] .r2-menu__disclosure-sign:not(#r2gc-isolate) { color: var(--r2-taupe, #B6A58F); }

  .r2-menu__panel:not(#r2gc-isolate) { padding: 0 0 12px; }
  .r2-menu__items:not(#r2gc-isolate) { padding: 0; border-left: 0; }
  .r2-menu__overview:not(#r2gc-isolate),
  .r2-menu__items a:not(#r2gc-isolate) {
    display: flex; min-height: 44px; align-items: center; padding: 8px 0;
    font-family: var(--r2-font-functional, "sofia-pro-condensed", sans-serif); font-weight: var(--r2-weight-functional);
    font-size: 16px; line-height: 1.3; color: rgba(246, 241, 234, .78); text-decoration: none;
  }
  .r2-menu__overview:not(#r2gc-isolate) { color: var(--r2-taupe, #B6A58F); }
  .r2-menu__sublabel:not(#r2gc-isolate) { margin: 10px 0 2px; }

  /* Foot: the action only, full width, after the disclosures. */
  .r2-menu__foot:not(#r2gc-isolate) { display: block; margin-top: 22px; padding-top: 0; border-top: 0; }
  .r2-menu__reference:not(#r2gc-isolate) { display: none; }
  .r2-menu__action .r2-menu__label:not(#r2gc-isolate),
  .r2-menu__action-body:not(#r2gc-isolate) { display: none; }   /* GIR-06: v15 compact action = the button only */
  .r2-menu__action .button:not(#r2gc-isolate) { display: flex; width: 100%; min-height: 48px; align-items: center; justify-content: center; }
}

/* Short or landscape phones: tighter top, nothing else reduced. */
@media (max-height: 520px) and (pointer: coarse) {
  .r2-menu__body:not(#r2gc-isolate) { padding-top: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .r2-menu:not(#r2gc-isolate),
  .r2-menu *:not(#r2gc-isolate) { transition: none !important; animation: none !important; }
}
