/* Figma 65:4124: generous symbol, four primary pills and two wider lower pills.
   The six real destinations retain their document order at every breakpoint. */
#navigation.menu-v3 .menu-shell {
  min-height: 650px;
  padding: clamp(32px,6.9vh,62px) var(--gutter) clamp(30px,4.5vh,40px);
  background: linear-gradient(180deg,var(--ink) 12%,var(--panel));
}
.menu-v3 .dialog-top { gap: 28px; flex: none; }
.menu-v3 .menu-brand { width: min(52vw,742px); }
.menu-v3 .dialog-close { width: clamp(62px,5.84vw,84px); height: clamp(62px,5.84vw,84px); }
.menu-v3 .dialog-close img { width: 66%; height: 66%; }
.menu-v3 .menu-centre { min-height: 210px; flex: 1; padding: 24px 0 32px; }
.menu-v3 .menu-centre .symbol { width: clamp(144px,13.06vw,188px); }
.menu-v3 .menu-navigation { position: relative; flex: none; }
.menu-v3 .menu-links { display: flex; flex-direction: column; gap: 24px; }
.menu-v3 .menu-primary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(16px,2.2vw,32px); width: 84%; }
.menu-v3 .menu-secondary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; width: 58%; }
.menu-v3 .menu-links a {
  --morph-radius: 24px;
  display: grid;
  grid-template-columns: 20px minmax(0,1fr) 56px;
  align-items: center;
  gap: 10px;
  min-height: 74px;
  padding: 0 0 0 20px;
  border: 1px solid color-mix(in srgb,var(--paper) 6%,transparent);
  border-radius: 30px;
  overflow: hidden;
  font: 400 clamp(13px,1.12vw,16px)/1.5 var(--mono);
  color: var(--paper);
  background: color-mix(in srgb,var(--surface) 60%,transparent);
}
.menu-v3 .menu-row-index { display: inline; color: var(--muted); font-size: 10px; letter-spacing: .02em; }
.menu-v3 .menu-links i {
  display: grid;
  place-items: center;
  align-self: stretch;
  height: auto;
  min-height: 72px;
  border-radius: 28px;
  font-size: 21px;
  font-style: normal;
  background: color-mix(in srgb,var(--paper) 5%,transparent);
  transition: background .25s ease,color .25s ease;
}
.menu-v3 .menu-links a:is(:hover,:focus-visible) { background: color-mix(in srgb,var(--surface) 88%,transparent); }
.menu-v3 .menu-links a:is(:hover,:focus-visible) i { background: color-mix(in srgb,var(--paper) 13%,transparent); }
.menu-v3 .menu-links a[aria-current="true"] i { background: var(--paper); color: var(--ink); }
.menu-v3 .menu-foot { position: absolute; bottom: 0; right: 0; width: 40%; display: flex; gap: 16px; height: 74px; margin: 0; align-items: stretch; }
.menu-v3 .menu-contact { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 24px; border-radius: 30px; font-size: 14px; line-height: 1.5; }
.menu-v3 .menu-contact span { font-size: 21px; }
.menu-v3 .menu-tools { display: flex; flex: 0 0 112px; align-items: stretch; }
.menu-v3 .menu-tools .motion-toggle { width: 100%; height: 100%; max-width: none; padding: 0 16px; border: 1px solid var(--line); border-radius: 30px; font: 400 11px/1.5 var(--mono); color: var(--muted); }
.menu-v3 :is(.menu-links a,.menu-contact,.motion-toggle):focus-visible { outline: 2px solid var(--paper); outline-offset: 4px; }

@media (max-width: 1150px) and (min-width: 701px) {
  .menu-v3 .menu-primary { width: 100%; gap: 16px; }
  .menu-v3 .menu-links a { grid-template-columns: 16px minmax(0,1fr) 44px; gap: 7px; padding-left: 16px; font-size: 13px; }
  .menu-v3 .menu-contact { padding-inline: 18px; font-size: 12px; }
  .menu-v3 .menu-tools { flex-basis: 94px; }
  .menu-v3 .menu-tools .motion-toggle { padding-inline: 10px; font-size: 10px; }
}
@media (max-width: 700px) {
  #navigation.menu-v3 .menu-shell { min-height: 0; height: 100dvh; padding: 24px 22px; }
  .menu-v3 .dialog-top { gap: 22px; }
  .menu-v3 .menu-brand { width: min(100%,300px); }
  .menu-v3 .dialog-top>a { flex: 1; min-width: 0; }
  .menu-v3 .dialog-close { width: 46px; height: 46px; }
  .menu-v3 .menu-centre { min-height: 130px; padding: 20px 0; }
  .menu-v3 .menu-centre .symbol { width: 96px; }
  .menu-v3 .menu-links { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .menu-v3 .menu-primary,.menu-v3 .menu-secondary { display: contents; }
  .menu-v3 .menu-links a { grid-template-columns: 22px minmax(0,1fr) 52px; gap: 12px; min-height: 54px; padding-left: 20px; border-radius: 23px; font-size: 15px; }
  .menu-v3 .menu-links i { min-height: 52px; border-radius: 22px; font-size: 20px; }
  .menu-v3 .menu-row-index { font-size: 10px; }
  .menu-v3 .menu-foot { position: static; width: 100%; height: 54px; margin-top: 18px; gap: 10px; }
  .menu-v3 .menu-contact { padding-inline: 16px; font-size: 11px; gap: 12px; border-radius: 23px; }
  .menu-v3 .menu-tools { flex-basis: 100px; }
  .menu-v3 .menu-tools .motion-toggle { font-size: 10px; padding-inline: 12px; border-radius: 23px; }
}
@media (max-width: 350px) {
  #navigation.menu-v3 .menu-shell { padding-inline: 18px; }
  .menu-v3 .menu-links a { font-size: 13px; gap: 8px; grid-template-columns: 18px minmax(0,1fr) 46px; padding-left: 16px; }
  .menu-v3 .menu-contact { padding-inline: 14px; font-size: 10px; }
  .menu-v3 .menu-tools { flex-basis: 84px; }
  .menu-v3 .menu-tools .motion-toggle { padding-inline: 8px; font-size: 9px; }
}
@media (max-height: 600px) and (min-width: 701px) {
  #navigation.menu-v3 .menu-shell { min-height: 0; padding-block: 18px; }
  .menu-v3 .dialog-close { width: 46px; height: 46px; }
  .menu-v3 .menu-brand { width: min(48vw,440px); }
  .menu-v3 .menu-centre { min-height: 80px; padding: 8px 0 16px; }
  .menu-v3 .menu-centre .symbol { width: 64px; }
  .menu-v3 .menu-links { gap: 12px; }
  .menu-v3 .menu-links a,.menu-v3 .menu-links i,.menu-v3 .menu-foot { min-height: 52px; height: 52px; }
  .menu-v3 .menu-links a { font-size: 12px; }
}
@media (max-width: 700px) and (max-height: 720px) {
  .menu-v3 .menu-centre { min-height: 90px; padding: 10px 0; }
  .menu-v3 .menu-centre .symbol { width: 76px; }
}