/* ------------------------------------------------------------------
   JF Navigation — all colours, type and spacing come from Webflow
   variables (CSS custom properties cross the Shadow DOM boundary).
   Fallbacks are only for the local harness.
   ------------------------------------------------------------------ */

:host {
  display: block;
  height: 0;
}

/* No reset exists inside the shadow root, so normalise box-sizing here. */
.Ojbqa7bJuWUnXKULa8_I,
.Ojbqa7bJuWUnXKULa8_I *,
.Ojbqa7bJuWUnXKULa8_I *::before,
.Ojbqa7bJuWUnXKULa8_I *::after {
  box-sizing: border-box;
}

.Ojbqa7bJuWUnXKULa8_I {
  --nav-bar-h: 90px;
  --nav-ease: cubic-bezier(0.165, 0.84, 0.44, 1);
  font-family: var(--typography--title, inherit);
  line-height: 1.2;
}

/* ---------- Bar (the only element that hides on scroll) ---------- */

.rkS8iToPj3mOaCLcdyvM {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--nav-z, 1003);
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: var(--nav-bar-h);
  padding: 1.5rem 2rem;
  background-color: transparent;
  transition: background-color 0.25s var(--nav-ease);
  will-change: transform;
}
.Ojbqa7bJuWUnXKULa8_I[data-solid] .rkS8iToPj3mOaCLcdyvM {
  background-color: var(--background--primary, #fff);
}
.Ojbqa7bJuWUnXKULa8_I[data-solid][data-solid-color="black"] .rkS8iToPj3mOaCLcdyvM {
  background-color: var(--background--invert, #1a1a1a);
}
/* Hidden until the first theme/background computation has been committed;
   the intro animation then slides it in already in the right state. */
.Ojbqa7bJuWUnXKULa8_I:not([data-ready]) .rkS8iToPj3mOaCLcdyvM {
  visibility: hidden;
}
/* Applied for one frame when a deferred change is committed off-screen. */
.Ojbqa7bJuWUnXKULa8_I[data-notransition] .rkS8iToPj3mOaCLcdyvM,
.Ojbqa7bJuWUnXKULa8_I[data-notransition] .BbhxQP70tkB8_6iDhqes,
.Ojbqa7bJuWUnXKULa8_I[data-notransition] .nIJgM4LzafYrYnziOdcz,
.Ojbqa7bJuWUnXKULa8_I[data-notransition] .SZOpYZzePxD8aX1wRoge {
  transition: none !important;
}
/* Fallback when GSAP is not on the page */
.SH6QwoBesUNH58KWLA8G {
  transform: translateY(-100%);
  transition: transform 0.75s var(--nav-ease), background-color 0.25s var(--nav-ease);
}

.Zm7boXwhQZIr9hM5lrKe {
  width: 100%;
  max-width: var(--_responsive-numbers---max-width-main, 90rem);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* ---------- Logo ---------- */

.BbhxQP70tkB8_6iDhqes {
  display: flex;
  align-items: center;
  width: 5.5rem;
  height: 2.625rem;
  color: var(--text--primary, #111);
  text-decoration: none;
  transition: color 0.25s;
}
.Ojbqa7bJuWUnXKULa8_I[data-theme="dark"] .BbhxQP70tkB8_6iDhqes {
  color: var(--text--invert, #fff);
}
.Xw4KfzwyU_PNXtWJrk16 {
  display: block;
  width: 100%;
  height: 100%;
}
.nIJgM4LzafYrYnziOdcz {
  color: var(--icon--invert, #fff);
  transition: color 0.25s;
}
.Ojbqa7bJuWUnXKULa8_I[data-theme="dark"] .nIJgM4LzafYrYnziOdcz {
  color: var(--icon--primary, #111);
}
.Yigy_hMMCaTlQ1YJAALE {
  display: none;
  width: 2.5rem;
  height: 2.5rem;
}

/* ---------- Menu button ---------- */

.SZOpYZzePxD8aX1wRoge {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2rem;
  margin: 0;
  padding: 0 0.5rem;
  border: 0;
  cursor: pointer;
  /* Matches the current build: always a white box with dark text, in both themes */
  background-color: var(--background--primary, #fff);
  color: var(--text--secondary, #303030);
  font-family: var(--typography--title, inherit);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  text-transform: uppercase;
}
.SZOpYZzePxD8aX1wRoge:hover {
  text-decoration: underline;
}

.SZOpYZzePxD8aX1wRoge:focus-visible,
.GHHIUYQIO1Rd5hpVz0D2:focus-visible,
.HUg2IVkE9yhKR1vlXfO_:focus-visible,
.OhswCxgyTBYubsY4D4wC:focus-visible,
.v3PqZqOD47emwKbWMYRr:focus-visible,
.BbhxQP70tkB8_6iDhqes:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}
.CjOVRsHgoTo34B54bgtU:focus-visible {
  outline: none;
}
.jfABABW0eQDJmaCCvHxw:focus-within {
  border-color: var(--text--invert, #fff);
}

/* ---------- Panel (sibling of the bar: never inherits its transform) ---------- */

.TOdV9u8EXH1CDXcTJQvU {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: calc(var(--nav-z, 1003) + 1);
  width: 34rem;
  max-width: 100%;
  height: 100dvh;
  display: none;
  flex-direction: column;
  padding-top: var(--sizes--20, 10rem);
  background-color: var(--background--invert, #1a1a1a);
  color: var(--text--invert, #fff);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.MpYVKpCA56ZAmEiU4OWG {
  display: flex;
}

.GHHIUYQIO1Rd5hpVz0D2 {
  position: absolute;
  top: 2.25rem;
  right: 2.5rem;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
}
.GHHIUYQIO1Rd5hpVz0D2 svg {
  width: 100%;
  height: 100%;
}

.ybWpM2_uFDc9uqGGFpwB {
  display: none;
  flex: none;
  width: 100%;
  height: 1px;
  background-color: var(--stroke--invert, #fff);
}

.bFnHHhOtBY2VBfcnJPyu {
  position: relative;
  display: grid;
}
.bFnHHhOtBY2VBfcnJPyu > * {
  grid-area: 1 / 1;
}

/* ---------- Links (slotted from Webflow) ---------- */

.ezotmrySU2YtO8aL2TuN {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--sizes--2, 1rem);
  padding: 0 var(--sizes--5, 2.5rem) var(--sizes--5, 2.5rem);
}
/* Slotted content. Webflow may project the links directly or inside a wrapper
   element, so the wrapper is laid out as a column with the same 1rem gap as the
   current menu, and the type defaults cascade down. Any class the designer
   applies in Webflow wins over these. */
.ezotmrySU2YtO8aL2TuN ::slotted(*) {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--sizes--2, 1rem);
  font-family: var(--typography--title, inherit);
  color: var(--stroke--secondary, #9a9a9a);
  font-size: 3rem;
  line-height: 1.104;
  letter-spacing: 0.84px;
  text-align: right;
  text-decoration: none;
  transition: color 0.2s;
}
.ezotmrySU2YtO8aL2TuN ::slotted(a:hover),
.ezotmrySU2YtO8aL2TuN ::slotted(a[aria-current="page"]) {
  color: var(--stroke--invert, #fff);
}

.HUg2IVkE9yhKR1vlXfO_ {
  display: flex;
  align-items: center;
  gap: var(--sizes--0, 0.35rem);
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
  font-family: var(--typography--title, inherit);
  font-size: var(--sizes--2, 0.875rem);
  font-weight: 600;
  line-height: 1;
  text-transform: uppercase;
  color: var(--stroke--secondary, #9a9a9a);
  transition: color 0.2s;
}
.HUg2IVkE9yhKR1vlXfO_:hover {
  color: var(--stroke--invert, #fff);
}
.HUg2IVkE9yhKR1vlXfO_ svg {
  width: 1.25rem;
  height: 1.25rem;
}

/* ---------- Search view ---------- */

.aR46lopUV3pGeTyfqatt {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1.25rem;
  padding: 0 var(--sizes--5, 2.5rem) var(--sizes--5, 2.5rem);
  margin: 0;
  opacity: 0;
  visibility: hidden;
}
.OhswCxgyTBYubsY4D4wC {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
  font-family: var(--typography--title, inherit);
  font-size: var(--sizes--2, 0.875rem);
  font-weight: 600;
  line-height: 1;
  text-transform: uppercase;
  color: var(--stroke--secondary, #9a9a9a);
  transition: color 0.2s;
}
.OhswCxgyTBYubsY4D4wC:hover {
  color: var(--stroke--invert, #fff);
}
.OhswCxgyTBYubsY4D4wC svg {
  width: 1.1rem;
  height: 1.1rem;
}
.jfABABW0eQDJmaCCvHxw {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid var(--stroke--invert, #fff);
  transition: border-color 0.2s;
}
.CjOVRsHgoTo34B54bgtU {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0.75rem 0.75rem;
  background: transparent;
  border: 0;
  color: var(--text--invert, #fff);
  font-family: var(--typography--body, inherit);
  font-size: 1rem;
  line-height: 1.4;
}
.CjOVRsHgoTo34B54bgtU::placeholder {
  color: var(--text--invert-secondary, #bdbdbd);
}
.CjOVRsHgoTo34B54bgtU::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  width: 0.875rem;
  height: 0.875rem;
  margin-left: 0.5rem;
  cursor: pointer;
  background-color: var(--text--invert, #fff);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27><path d=%27M3 3L13 13M13 3L3 13%27 stroke=%27black%27 stroke-width=%271.25%27 stroke-linecap=%27square%27/></svg>") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27><path d=%27M3 3L13 13M13 3L3 13%27 stroke=%27black%27 stroke-width=%271.25%27 stroke-linecap=%27square%27/></svg>") center / contain no-repeat;
}
.v3PqZqOD47emwKbWMYRr {
  flex: none;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0.75rem;
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
}
.v3PqZqOD47emwKbWMYRr svg {
  width: 2.5rem;
  height: 1rem;
}

/* ---------- Breakpoints (match the live site: 991 / 767 / 479) ---------- */

@media (max-width: 991px) {
  .rkS8iToPj3mOaCLcdyvM {
    min-height: auto;
    padding: 1rem 1.5rem;
  }
  .BbhxQP70tkB8_6iDhqes {
    width: 2.5rem;
    height: 2.5rem;
  }
  .Xw4KfzwyU_PNXtWJrk16 {
    display: none;
  }
  .Yigy_hMMCaTlQ1YJAALE {
    display: block;
  }
  .SZOpYZzePxD8aX1wRoge {
    font-size: 0.875rem;
  }
  .TOdV9u8EXH1CDXcTJQvU {
    left: 0;
    width: 100%;
    padding-top: 0;
    gap: 2rem;
    justify-content: flex-end;
  }
  .GHHIUYQIO1Rd5hpVz0D2 {
    position: static;
    margin: 0 2.5rem -1rem auto;
  }
  .ybWpM2_uFDc9uqGGFpwB {
    display: block;
  }
  .ezotmrySU2YtO8aL2TuN,
  .aR46lopUV3pGeTyfqatt {
    padding: 6rem 2.5rem;
  }
}

@media (max-width: 767px) {
  .rkS8iToPj3mOaCLcdyvM {
    padding: 1rem 1rem;
  }
  .TOdV9u8EXH1CDXcTJQvU {
    gap: 1.5rem;
  }
  .GHHIUYQIO1Rd5hpVz0D2 {
    margin: 2rem 1.25rem 0 auto;
  }
  .ezotmrySU2YtO8aL2TuN,
  .aR46lopUV3pGeTyfqatt {
    padding: 2.5rem 1.25rem;
  }
  .ezotmrySU2YtO8aL2TuN ::slotted(*) {
    font-size: 2.5rem;
    line-height: 1.05;
  }
}

@media only screen and (max-width: 991px) and (orientation: landscape) {
  .ezotmrySU2YtO8aL2TuN,
  .aR46lopUV3pGeTyfqatt {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rkS8iToPj3mOaCLcdyvM,
  .BbhxQP70tkB8_6iDhqes,
  .nIJgM4LzafYrYnziOdcz,
  .SZOpYZzePxD8aX1wRoge,
  .SH6QwoBesUNH58KWLA8G {
    transition: none;
  }
}