/* Stiefnu Navigation — defaults. Override from Elementor → Style tab. */
.stf-nav {
  --nav-panel: #ffffff;
  --nav-bar-bg: #ffffff;
  --nav-text: #33312e;
  --nav-muted: #3f3c38;
  --nav-overlay: rgba(28, 27, 25, .45);
  --nav-overlay-blur: 6px;
  --nav-border: rgba(51, 49, 46, .35);
  --nav-border-width: .2px;
  --font-serif: "Libre Caslon Text", "Libre Caslon", Georgia, "Times New Roman", serif;
  --font-sans: "Lato", "Helvetica Neue", Arial, sans-serif;
  --frame-size: 14px;
  --drawer-width: 460px;
  --link-gap: 14px;
  --ease: cubic-bezier(.77, 0, .18, 1);
  --duration: 700ms;
  font-family: var(--font-sans);
  color: var(--nav-text);
  -webkit-font-smoothing: antialiased;
}
.stf-nav, .stf-nav *, .stf-nav *::before, .stf-nav *::after { box-sizing: border-box; }

/* Neutralise theme button / link / list styles */
.stf-nav button {
  background: none !important; border: 0 !important; box-shadow: none !important;
  border-radius: 0 !important; padding: 0 !important; margin: 0;
  color: var(--nav-text) !important; font: inherit; line-height: 1;
  min-height: 0; text-transform: none; letter-spacing: normal; cursor: pointer;
  -webkit-appearance: none; appearance: none;
}
.stf-nav a, .stf-nav a:hover, .stf-nav a:visited, .stf-nav a:focus { color: var(--nav-text); text-decoration: none; box-shadow: none; }
.stf-nav ul { list-style: none; margin: 0; padding: 0; }
.stf-nav li { list-style: none; margin: 0; padding: 0; }
.stf-nav li::before, .stf-nav li::marker { content: none; }

/* ===== Header bar ===== */
.stf-nav__bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 24px; background: var(--nav-bar-bg);
}
.stf-nav .stf-nav__logo { font-family: var(--font-serif); font-size: 22px; letter-spacing: .01em; line-height: 1.2; }
.stf-nav .stf-nav__burger { width: 44px; height: 44px; display: grid; place-content: center; gap: 6px; }
.stf-nav__burger span { display: block; width: 24px; height: 1.5px; background: var(--nav-text); }

/* ===== Overlay menu ===== */
.stf-mnav {
  position: fixed; inset: 0; z-index: 99999;
  padding: var(--frame-size);
  padding-top: calc(var(--frame-size) + env(safe-area-inset-top, 0px));
  padding-bottom: calc(var(--frame-size) + env(safe-area-inset-bottom, 0px));
  visibility: hidden;
  transition: visibility 0s linear var(--duration);
}
.admin-bar .stf-mnav { top: 46px; }
@media (min-width: 783px) { .admin-bar .stf-mnav { top: 32px; } }
.stf-mnav.is-open { visibility: visible; transition: visibility 0s; }

.stf-mnav__overlay {
  position: absolute; inset: 0;
  background: var(--nav-overlay);
  -webkit-backdrop-filter: blur(var(--nav-overlay-blur));
  backdrop-filter: blur(var(--nav-overlay-blur));
  opacity: 0;
  transition: opacity calc(var(--duration) * .8) ease;
}
.stf-mnav.is-open .stf-mnav__overlay { opacity: 1; }

.stf-mnav__panel {
  position: relative; height: 100%;
  background: var(--nav-panel);
  border: var(--nav-border-width) solid var(--nav-border);
  box-shadow: 0 2px 6px rgba(28, 27, 25, .06), 0 18px 40px rgba(28, 27, 25, .14), 0 40px 90px rgba(28, 27, 25, .12);
  display: flex; flex-direction: column;
  padding: 34px 30px 36px;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  opacity: 0;
  transform: translateY(-28px) scale(.97);
  transform-origin: 50% 0;
  transition: transform var(--duration) var(--ease), opacity calc(var(--duration) * .6) ease;
}
.stf-mnav.is-open .stf-mnav__panel { opacity: 1; transform: none; transition-delay: 80ms; }

/* Close X — top right */
.stf-nav .stf-mnav__close {
  width: 40px; height: 40px; margin: -8px -8px 18px 0; flex: none; position: relative;
  align-self: flex-end;
}
.stf-mnav__close::before, .stf-mnav__close::after {
  content: ""; position: absolute; left: 50%; top: 50%;
  width: 22px; height: 2px; background: var(--nav-text);
  transform: translate(-50%, -50%);
  transition: transform 500ms var(--ease) 250ms;
}
.stf-mnav.is-open .stf-mnav__close::before { transform: translate(-50%, -50%) rotate(45deg); }
.stf-mnav.is-open .stf-mnav__close::after  { transform: translate(-50%, -50%) rotate(-45deg); }

/* Links */
.stf-mnav__item { overflow: hidden; }
.stf-mnav__row {
  display: inline-flex; align-items: center; gap: 10px;
  transform: translateY(110%);
  transition: transform 650ms var(--ease);
}
.stf-mnav.is-open .stf-mnav__row { transform: none; transition-delay: calc(260ms + var(--i, 0) * 50ms); }
.stf-mnav__item { --i: 0; }
.stf-nav .stf-mnav__link {
  display: inline-block;
  font-family: var(--font-serif); font-size: 26px; line-height: 1.25; font-weight: 400;
  padding: calc(var(--link-gap) / 2) 0;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0 1px; background-repeat: no-repeat; background-position: 0 88%;
  transition: background-size 350ms ease;
}
.stf-nav .stf-mnav__link:hover, .stf-nav .stf-mnav__link:focus-visible,
.stf-nav .stf-mnav__link[aria-current="page"] { background-size: 100% 1px; }

/* Dropdown */
.stf-nav .stf-mnav__toggle { width: 32px; height: 32px; display: grid; place-items: center; }
.stf-mnav__toggle svg { width: 14px; height: 14px; transition: transform 450ms var(--ease); }
.stf-mnav__item.is-expanded .stf-mnav__toggle svg { transform: rotate(180deg); }

.stf-mnav__sub-wrap { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 500ms var(--ease); }
.stf-mnav__item.is-expanded .stf-mnav__sub-wrap { grid-template-rows: 1fr; }
.stf-nav .stf-mnav__sub {
  overflow: hidden; min-height: 0;
  padding: 0 0 0 18px;
  border-left: 1px solid var(--nav-border);
}
.stf-nav .stf-mnav__sub--nested { overflow: visible; margin-top: 2px; }
.stf-mnav__sub li { opacity: 0; transform: translateY(-6px); transition: opacity 300ms ease, transform 400ms var(--ease); }
.stf-mnav__item.is-expanded .stf-mnav__sub li { opacity: 1; transform: none; transition-delay: calc(80ms + var(--i, 0) * 50ms); }
.stf-nav .stf-mnav__sub-wrap > .stf-mnav__sub > li:first-child { padding-top: 4px; }
.stf-nav .stf-mnav__sub-wrap > .stf-mnav__sub > li:last-child { padding-bottom: 10px; }
.stf-nav .stf-mnav__sub a {
  display: inline-block; padding: 5px 0;
  font-family: var(--font-serif); font-size: 19px; line-height: 1.3;
  color: var(--nav-muted);
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0 1px; background-repeat: no-repeat; background-position: 0 90%;
  transition: background-size 350ms ease;
}
.stf-nav .stf-mnav__sub a:hover, .stf-nav .stf-mnav__sub a:focus-visible,
.stf-nav .stf-mnav__sub a[aria-current="page"] { background-size: 100% 1px; }

.stf-mnav__empty { font-family: var(--font-serif); font-size: 17px; opacity: .6; }

/* Footer */
.stf-mnav__footer {
  margin-top: auto; padding-top: 48px;
  opacity: 0; transform: translateY(12px);
  transition: opacity 500ms ease, transform 500ms var(--ease);
}
.stf-mnav.is-open .stf-mnav__footer { opacity: 1; transform: none; transition-delay: 620ms; }
.stf-nav .stf-mnav__heading {
  font-family: var(--font-serif); font-size: 18px; font-weight: 400; line-height: 1.3;
  margin: 0 0 12px; color: var(--nav-text); text-transform: none; letter-spacing: normal;
}
.stf-mnav__address { font-size: 17px; line-height: 1.55; color: var(--nav-muted); margin: 0 0 28px; }
.stf-mnav__address p { margin: 0; }
.stf-mnav__address p + p { margin-top: .6em; }
.stf-nav .stf-mnav__address a { color: inherit; }
.stf-mnav__lang { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 17px; }
.stf-nav .stf-mnav__lang a { padding-bottom: 3px; border-bottom: 1px solid transparent; }
.stf-nav .stf-mnav__lang a[aria-current="true"] { border-bottom-color: var(--nav-text); }
.stf-mnav__lang span { font-size: 9px; }

.stf-nav button:focus-visible, .stf-nav a:focus-visible { outline: 2px solid var(--nav-text); outline-offset: 3px; }
html.stf-nav-locked, html.stf-nav-locked body { overflow: hidden; }

/* Tablet & desktop: right-hand drawer */
@media (min-width: 768px) {
  .stf-nav__bar { padding: 26px 40px; }
  .stf-mnav__panel {
    width: 100%; max-width: var(--drawer-width);
    margin-left: auto;
    padding: 40px 44px 44px;
    transform: translateX(36px);
    transform-origin: 100% 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .stf-mnav, .stf-mnav *, .stf-mnav *::before, .stf-mnav *::after { transition-duration: 1ms !important; transition-delay: 0ms !important; }
}
