@property --civius-nav-action-stroke-start {
  syntax: "<color>";
  inherits: false;
  initial-value: #dedede;
}

@property --civius-nav-action-stroke-end {
  syntax: "<color>";
  inherits: false;
  initial-value: #fbfbfb;
}

.civius-glass-nav {
  --civius-copy-font: "Onest", Arial, sans-serif;
  --civius-heading-font: "Montserrat Alternates", "Onest", Arial, sans-serif;
  --civius-blue: #1778ff;
  --blue: var(--civius-blue);
  --r13-stroke: linear-gradient(180deg, #dedede 0%, #fbfbfb 100%);
  --r13-border-width: 2px;
  --r13-active-pill-stroke: linear-gradient(
    180deg,
    rgba(172, 172, 172, 0.78) 0%,
    rgba(216, 216, 216, 0.66) 42%,
    rgba(255, 255, 255, 0.98) 100%
  );
  --r13-displacement-scale: 62;
  --r13-map-inset: 0.145;
  --r13-control-neutral-opacity: 0.93;
  --r13-control-neutral-blur: 11;
  --r13-control-map-inset: 0.135;
  --r13-pill-neutral-opacity: 0.93;
  --r13-pill-neutral-blur: 11;
  --r13-pill-map-inset: 0.13;
  --r13-blur: 4px;
  --r13-control-blur: 3.8px;
  --r13-active-pill-blur: 5.2px;
  --r13-saturation: 1.12;
  --r13-contrast: 1.045;
  --r13-brightness: 1.1;
  --r13-control-saturation: 1.06;
  --r13-control-contrast: 1.025;
  --r13-control-brightness: 1.035;
  --r13-pill-saturation: 1.055;
  --r13-pill-contrast: 1.02;
  --r13-pill-brightness: 1.025;
  --r13-shimmer-opacity: 0.2;
  --r13-small-glint-opacity: 0.16;
  --r13-filter: none;
  --r13-surface-fill: rgba(235, 235, 235, 0.07);
  --r13-control-fill: rgba(235, 235, 235, 0.07);
  --r13-active-pill-fill: rgba(235, 235, 235, 0.14);
  --r13-surface-shadow:
    0 0 3.2px 0.9px light-dark(color-mix(in oklch, canvasText, #0000 87%), color-mix(in oklch, canvasText, #0000 74%)) inset,
    0 0 15px 3px light-dark(color-mix(in oklch, canvasText, #0000 91%), color-mix(in oklch, canvasText, #0000 86%)) inset,
    0 3px 13px rgba(17, 17, 26, 0.032) inset,
    0 12px 54px rgba(17, 17, 26, 0.055),
    0 24px 96px rgba(17, 17, 26, 0.04);
  --r13-control-shadow:
    0 0 2.2px 0.55px light-dark(color-mix(in oklch, canvasText, #0000 91%), color-mix(in oklch, canvasText, #0000 80%)) inset,
    0 0 9px 1.8px light-dark(color-mix(in oklch, canvasText, #0000 95%), color-mix(in oklch, canvasText, #0000 90%)) inset,
    0 2px 9px rgba(17, 17, 26, 0.035) inset,
    0 4px 21px rgba(17, 17, 26, 0.065),
    5px 6px 24px rgba(17, 17, 26, 0.055),
    -5px -6px 24px rgba(255, 255, 255, 0.68),
    -1px -1px 9px rgba(255, 255, 255, 0.62);
  --r13-capsule-shadow:
    0 0 2.6px 0.7px light-dark(color-mix(in oklch, canvasText, #0000 88%), color-mix(in oklch, canvasText, #0000 76%)) inset,
    0 0 11px 2.2px light-dark(color-mix(in oklch, canvasText, #0000 93%), color-mix(in oklch, canvasText, #0000 88%)) inset,
    0 2px 10px rgba(17, 17, 26, 0.05) inset,
    0 4px 21px rgba(17, 17, 26, 0.065),
    5px 6px 24px rgba(17, 17, 26, 0.055),
    -5px -6px 24px rgba(255, 255, 255, 0.68),
    -1px -1px 9px rgba(255, 255, 255, 0.62);
  --r13-menu-button-shadow:
    0 0 2.5px 0.65px light-dark(color-mix(in oklch, canvasText, #0000 88%), color-mix(in oklch, canvasText, #0000 76%)) inset,
    0 0 10px 2px light-dark(color-mix(in oklch, canvasText, #0000 93%), color-mix(in oklch, canvasText, #0000 88%)) inset,
    0 2px 9px rgba(17, 17, 26, 0.05) inset,
    0 4px 21px rgba(17, 17, 26, 0.065),
    5px 6px 24px rgba(17, 17, 26, 0.055),
    -5px -6px 24px rgba(255, 255, 255, 0.68),
    -1px -1px 9px rgba(255, 255, 255, 0.62);
  --r13-active-shadow:
    0 0 2px 0.5px light-dark(color-mix(in oklch, canvasText, #0000 90%), color-mix(in oklch, canvasText, #0000 80%)) inset,
    0 0 8px 1.5px light-dark(color-mix(in oklch, canvasText, #0000 94%), color-mix(in oklch, canvasText, #0000 90%)) inset,
    0 3px 15px rgba(17, 17, 26, 0.058),
    4px 5px 18px rgba(17, 17, 26, 0.05),
    -4px -5px 18px rgba(255, 255, 255, 0.65);
  --glass-surface-fill: var(--r13-surface-fill);
  --glass-control-fill: var(--r13-control-fill);
  --glass-stroke: var(--r13-stroke);
}

/* First-paint skin: the final R13 runtime is attached after parsing, but the
   navigation must already have its border, fill and shadows on the first
   rendered frame. The runtime replaces this static skin without changing
   geometry or the final glass effect. */
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__surface {
  background: var(--r13-surface-fill);
  box-shadow: var(--r13-surface-shadow);
  -webkit-backdrop-filter: blur(var(--r13-blur)) saturate(var(--r13-saturation));
  backdrop-filter: blur(var(--r13-blur)) saturate(var(--r13-saturation));
}

.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__search-field,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__links,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__action {
  background: var(--r13-control-fill);
  box-shadow: var(--r13-control-shadow);
  -webkit-backdrop-filter: blur(var(--r13-control-blur)) saturate(var(--r13-control-saturation));
  backdrop-filter: blur(var(--r13-control-blur)) saturate(var(--r13-control-saturation));
}

.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__search-field {
  position: relative;
}

.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__links {
  box-shadow: var(--r13-capsule-shadow);
}

.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__surface,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__surface-layer,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__search-field,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__links,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__active-pill,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__action,
.civius-glass-nav:not(.civius-r13-ready) .civius-nav-badge,
.civius-glass-nav:not(.civius-nav-state-ready) .civius-glass-nav__action,
.civius-glass-nav:not(.civius-nav-state-ready) .civius-nav-badge {
  transition: none;
}

.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__surface::before,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__search-field::before,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__links::before,
.civius-glass-nav:not(.civius-r13-ready) .civius-glass-nav__action::before {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  box-sizing: border-box;
  padding: var(--r13-border-width);
  border-radius: inherit;
  background: var(--r13-stroke);
  content: "";
  pointer-events: none;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  mask-composite: exclude;
}

.civius-r13-filter {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* buttons.css positions direct SVG children relatively; the R13 SVG is a
   rendering surface, not a flex item. Keep it out of the action layout. */
.civius-glass-nav__action > .civius-r13-filter {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__surface {
  border: 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__surface-layer,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__links,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__active-pill,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__mobile-menu {
  position: relative;
  overflow: hidden;
  border: 0;
  background: var(--r13-control-fill);
  box-shadow: var(--r13-control-shadow);
  isolation: isolate;
  -webkit-backdrop-filter:
    var(--r13-filter)
    blur(var(--r13-element-blur, var(--r13-blur)))
    saturate(var(--r13-element-saturation, var(--r13-saturation)))
    contrast(var(--r13-element-contrast, var(--r13-contrast)))
    brightness(var(--r13-element-brightness, var(--r13-brightness)));
  backdrop-filter:
    var(--r13-filter)
    blur(var(--r13-element-blur, var(--r13-blur)))
    saturate(var(--r13-element-saturation, var(--r13-saturation)))
    contrast(var(--r13-element-contrast, var(--r13-contrast)))
    brightness(var(--r13-element-brightness, var(--r13-brightness)));
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__surface-layer,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__mobile-menu {
  --r13-element-blur: var(--r13-blur);
  background: var(--r13-surface-fill);
  box-shadow: var(--r13-surface-shadow);
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__links,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action {
  --r13-element-blur: var(--r13-control-blur);
  --r13-element-saturation: var(--r13-control-saturation);
  --r13-element-contrast: var(--r13-control-contrast);
  --r13-element-brightness: var(--r13-control-brightness);
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__links {
  box-shadow: var(--r13-capsule-shadow);
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__action--menu {
  box-shadow: var(--r13-menu-button-shadow);
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__surface-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
}

.civius-glass-nav.civius-r13-ready.civius-nav-ios .civius-glass-nav__surface {
  isolation: auto;
  background: rgba(255, 255, 255, 0.24);
  box-shadow: var(--r13-surface-shadow);
  -webkit-backdrop-filter: blur(20px) saturate(1.85) contrast(1.08) brightness(1.06);
  backdrop-filter: blur(20px) saturate(1.85) contrast(1.08) brightness(1.06);
}

.civius-glass-nav.civius-r13-ready.civius-nav-ios .civius-glass-nav__surface-layer {
  isolation: auto;
  background: rgba(255, 255, 255, 0.12);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.76),
    inset 0 -1px 0 rgba(255, 255, 255, 0.24);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.civius-glass-nav.civius-r13-ready.civius-nav-ios .civius-glass-nav__search-field,
.civius-glass-nav.civius-r13-ready.civius-nav-ios .civius-glass-nav__links,
.civius-glass-nav.civius-r13-ready.civius-nav-ios .civius-glass-nav__action,
.civius-glass-nav.civius-r13-ready.civius-nav-ios .civius-glass-nav__mobile-menu {
  isolation: auto;
  background: rgba(255, 255, 255, 0.30);
  -webkit-backdrop-filter: blur(14px) saturate(1.74) contrast(1.07) brightness(1.06);
  backdrop-filter: blur(14px) saturate(1.74) contrast(1.07) brightness(1.06);
}

.civius-glass-nav.civius-r13-ready.civius-nav-ios .civius-glass-nav__active-pill {
  isolation: auto;
  background: rgba(255, 255, 255, 0.36);
  -webkit-backdrop-filter: blur(11px) saturate(1.72) contrast(1.06) brightness(1.05);
  backdrop-filter: blur(11px) saturate(1.72) contrast(1.06) brightness(1.05);
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__brand,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__search,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__links,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__actions {
  position: relative;
  z-index: 3;
}

.civius-glass-nav {
  position: fixed;
  top: 12px;
  z-index: 80;
  background: transparent;
  color: #000;
  font-family: var(--civius-copy-font, "Onest", Arial, sans-serif);
  pointer-events: none;
}

.civius-glass-nav__surface {
  position: relative;
  display: grid;
  overflow: visible;
  margin: 0 auto;
  border-radius: 30px;
  isolation: isolate;
  pointer-events: auto;
}

.civius-glass-nav__brand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.civius-glass-nav__brand img,
.civius-glass-nav__brand svg {
  display: block;
}

.civius-glass-nav__search {
  min-width: 0;
  z-index: 4;
}

.civius-glass-nav__search-form {
  width: 100%;
}

.civius-glass-nav__search-field {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-height: 52px;
  border-radius: 18px;
  transform-origin: left center;
  will-change: width;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__surface-layer::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__links::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__active-pill::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__mobile-menu::before {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  padding: var(--r13-border-width);
  border-radius: inherit;
  background: var(--r13-stroke);
  content: "";
  pointer-events: none;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  mask-composite: exclude;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__active-pill::before {
  background: var(--r13-active-pill-stroke);
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__links::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__mobile-menu::before {
  background: var(--r13-stroke);
  filter: none;
  animation: none;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__action.is-page-active::before {
  background: var(--glass-stroke);
}

/* Ховер-анимация границы у действий навбара (стекло сохраняем): кромка
   перекрашивается в фирменный сине-циановый градиент при наведении/нажатии. */
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action::before {
  --civius-nav-action-stroke-start: #dedede;
  --civius-nav-action-stroke-end: #fbfbfb;
  background: linear-gradient(
    180deg,
    var(--civius-nav-action-stroke-start) 0%,
    var(--civius-nav-action-stroke-end) 100%
  );
  transition:
    --civius-nav-action-stroke-start var(--civius-border-highlight-duration, 200ms) ease,
    --civius-nav-action-stroke-end var(--civius-border-highlight-duration, 200ms) ease;
}
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action:hover::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action:focus-visible::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action.is-hovering::before,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action.is-pressing::before {
  --civius-nav-action-stroke-start: #0177ff;
  --civius-nav-action-stroke-end: #00d4ff;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__surface-layer::after {
  position: absolute;
  top: -42%;
  left: -34%;
  z-index: 1;
  width: 34%;
  height: 184%;
  border-radius: 999px;
  background: linear-gradient(
    105deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.08) 42%,
    rgba(255, 255, 255, var(--r13-shimmer-opacity)) 50%,
    rgba(255, 255, 255, 0.08) 58%,
    rgba(255, 255, 255, 0) 100%
  );
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-120%, 0, 0) skewX(-16deg);
  animation: civiusR13SurfaceShimmer 3.8s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  mix-blend-mode: screen;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field::after,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__links::after,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__active-pill::after,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__action::after {
  position: absolute;
  top: -46%;
  left: -40%;
  z-index: 1;
  display: block;
  width: 32%;
  height: 192%;
  border-radius: 999px;
  background: linear-gradient(
    103deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.045) 39%,
    rgba(255, 255, 255, var(--r13-small-glint-opacity)) 50%,
    rgba(255, 255, 255, 0.045) 61%,
    rgba(255, 255, 255, 0) 100%
  );
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-125%, 0, 0) skewX(-15deg);
  animation:
    civiusR13ControlGlint
    var(--r13-small-glint-duration, 5.4s)
    cubic-bezier(0.16, 1, 0.3, 1)
    var(--r13-small-glint-delay, 0s)
    infinite;
  mix-blend-mode: screen;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field {
  --r13-small-glint-delay: 0.35s;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__action {
  overflow: visible;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__links {
  --r13-small-glint-delay: 1.05s;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__action {
  --r13-small-glint-delay: 0.72s;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__active-pill {
  --r13-element-saturation: var(--r13-pill-saturation);
  --r13-element-contrast: var(--r13-pill-contrast);
  --r13-element-brightness: var(--r13-pill-brightness);
  --r13-small-glint-delay: 1.45s;
  --r13-small-glint-opacity: 0.18;
  position: absolute;
  top: 6px;
  bottom: 6px;
  left: 0;
  z-index: 0;
  width: var(--active-pill-w);
  height: auto;
  border-radius: 14px;
  background: var(--r13-active-pill-fill);
  box-shadow: var(--r13-active-shadow);
  opacity: 0;
  contain: layout paint;
  pointer-events: none;
  transform: translateX(var(--active-pill-x)) scale(var(--active-pill-scale));
  transform-origin: left center;
  will-change: transform, opacity;
  transition:
    opacity 180ms ease,
    transform 245ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.1s ease;
  -webkit-backdrop-filter:
    var(--r13-filter)
    blur(var(--r13-active-pill-blur))
    saturate(var(--r13-pill-saturation))
    contrast(var(--r13-pill-contrast))
    brightness(var(--r13-pill-brightness));
  backdrop-filter:
    var(--r13-filter)
    blur(var(--r13-active-pill-blur))
    saturate(var(--r13-pill-saturation))
    contrast(var(--r13-pill-contrast))
    brightness(var(--r13-pill-brightness));
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__links.civius-nav-pill-ready:not(.civius-nav-pill-hidden) > .civius-glass-nav__active-pill {
  opacity: 1;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__links.civius-nav-pill-instant > .civius-glass-nav__active-pill,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__links.civius-nav-pill-priming > .civius-glass-nav__active-pill {
  transition: none;
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__links:has(a:active) > .civius-glass-nav__active-pill {
  box-shadow:
    inset 4px 6px 16px rgba(0, 0, 0, 0.15),
    inset -2px -3px 12px rgba(255, 255, 255, 0.18);
}

.civius-glass-nav.civius-r13-ready .civius-glass-nav__links a,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__search-icon,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field input,
.civius-glass-nav.civius-r13-ready .civius-glass-nav__icon {
  position: relative;
  z-index: 3;
}

.civius-glass-nav__search-icon,
.civius-glass-nav__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #000;
  line-height: 0;
}

.civius-glass-nav__search-icon {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
}

.civius-glass-nav__search-icon svg,
.civius-glass-nav__icon svg {
  display: block;
  width: 20px;
  height: 20px;
}

.civius-glass-nav__search-icon svg {
  width: 24px;
  height: 24px;
}

.civius-glass-nav__search-icon .civius-search-morph__viewport,
.civius-glass-nav__search-icon .civius-search-morph__svg {
  width: 24px;
  height: 24px;
}

/* First frame: the morphing search SVG is attached after parsing. Render the
   same magnifier in the empty host so the menu never waits for JavaScript to
   show its icon. */
.civius-glass-nav__search-icon[data-civius-search-icon]:empty {
  position: relative;
  display: inline-block;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
}

.civius-glass-nav__search-icon[data-civius-search-icon]:empty::before {
  position: absolute;
  inset: 0;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 0;
  background: center / 24px 24px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='14 14 32 32'%3E%3Cpath d='M33.2 33.2A10.2 10.2 0 1 1 18.8 18.8A10.2 10.2 0 1 1 33.2 33.2L40.9 40.9' fill='none' stroke='%23111' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  content: "";
}

.civius-glass-nav__search-icon[data-civius-search-icon]:empty::after {
  content: none;
}

.civius-glass-nav__search-icon svg circle,
.civius-glass-nav__search-icon svg path,
.civius-glass-nav__icon svg circle,
.civius-glass-nav__icon svg path {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.civius-glass-nav__search-icon svg circle,
.civius-glass-nav__search-icon svg path {
  stroke-width: 0.75;
}

.civius-glass-nav__icon svg circle,
.civius-glass-nav__icon svg path {
  stroke-width: 0.9;
}

.civius-glass-nav__search-field input {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: #111;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -0.035em;
}

.civius-glass-nav__search-field input::placeholder {
  color: #757575;
  opacity: 1;
}

.civius-glass-nav__links {
  position: relative;
  border-radius: 18px;
  font-family: var(--civius-heading-font, "Montserrat Alternates", "Onest", Arial, sans-serif);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.045em;
  --active-pill-x: 18px;
  --active-pill-w: 76px;
  --active-pill-scale: 1;
}

.civius-glass-nav__links a {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  min-height: 52px;
  padding: 0;
  color: inherit;
  text-decoration: none;
}

.civius-glass-nav__actions {
  display: flex;
  align-items: center;
}

.civius-glass-nav__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  --civius-nav-press-scale: 0.88;
  color: #000;
  text-decoration: none;
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: center;
  transition:
    border-radius 320ms cubic-bezier(0.33, 0, 0.18, 1),
    transform 720ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 420ms cubic-bezier(0.16, 1, 0.3, 1),
    color 240ms ease;
}

.civius-glass-nav__action--mobile-extra {
  display: none;
}

.civius-glass-nav__mobile-menu {
  display: none;
  position: absolute;
  top: auto;
  bottom: calc(100% - 1px);
  z-index: 4;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.civius-glass-nav__search-results {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 60;
  display: grid;
  width: 360px;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(17, 30, 53, 0.08);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.12);
}

.civius-glass-nav__search-results[hidden] {
  display: none;
}

@keyframes civiusR13SurfaceShimmer {
  0%, 62% {
    opacity: 0;
    transform: translate3d(-120%, 0, 0) skewX(-16deg);
  }

  72% {
    opacity: 0.68;
  }

  100% {
    opacity: 0;
    transform: translate3d(320%, 0, 0) skewX(-16deg);
  }
}

@keyframes civiusR13ControlGlint {
  0%, 58% {
    opacity: 0;
    transform: translate3d(-125%, 0, 0) skewX(-15deg);
  }

  64% {
    opacity: 0.46;
  }

  82%, 100% {
    opacity: 0;
    transform: translate3d(410%, 0, 0) skewX(-15deg);
  }
}

@keyframes civiusNavBadgeRipple {
  0% {
    opacity: 0.6;
    transform: scale(0.62);
  }

  100% {
    opacity: 0;
    transform: scale(2);
  }
}

.civius-glass-nav,
.civius-glass-nav__surface,
.civius-glass-nav__actions,
.civius-glass-nav__action {
  overflow: visible;
}

.civius-glass-nav__action {
  position: relative;
}

.civius-glass-nav__action.is-page-active {
  --civius-nav-action-radius: 50%;
  --glass-stroke: linear-gradient(135deg, #0f6df0 0%, #42a5ff 58%, #6fc5ff 100%);
  border: 0;
  background: var(--glass-control-fill);
  color: #1778ff;
  box-shadow: var(--r13-control-shadow);
}

.civius-glass-nav__action.is-page-active::before {
  display: block;
  padding: 2px;
  --civius-nav-action-stroke-start: #0177ff;
  --civius-nav-action-stroke-end: #00d4ff;
}

.civius-glass-nav__action.is-page-active::after {
  display: none;
}

.civius-glass-nav__action.is-page-active .civius-glass-nav__icon {
  color: #1778ff;
  filter: drop-shadow(0 6px 12px rgba(23, 120, 255, 0.24));
}

.civius-nav-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  min-width: 18px;
  height: 18px;
  padding: 0;
  border-radius: 999px;
  background: #1778ff;
  color: #fff;
  font: 900 10.5px/18px "Onest", Arial, sans-serif;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
  text-align: center;
  box-shadow: 0 0 18px rgba(23, 120, 255, 0.56);
  transform: scale(1);
  transform-origin: 70% 30%;
  transition:
    opacity 160ms ease,
    transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
  isolation: isolate;
}

.civius-nav-badge.is-initializing {
  transition: none;
}

.civius-glass-nav__action > .civius-nav-badge {
  position: absolute;
  z-index: 80;
}

.civius-nav-badge::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  border: 2px solid rgba(59, 130, 246, 0.5);
  pointer-events: none;
  animation: none;
}

.civius-nav-badge[hidden] {
  display: grid;
  opacity: 0;
  transform: scale(1);
  pointer-events: none;
}

.civius-nav-badge[hidden]::after {
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__surface-layer::after,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field::after,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__links::after,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__mobile-menu::after,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__active-pill::after,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action::after {
    animation: none;
  }

  .civius-nav-badge::after {
    animation: none;
  }
}

@media (max-width: 767px) {
  .civius-glass-nav {
    --r13-stroke: linear-gradient(180deg, #dedede 0%, #fbfbfb 100%);
    --r13-border-width: 1px;
    --r13-control-blur: 3.1px;
    --r13-active-pill-blur: 4.2px;
    --r13-control-brightness: 1.015;
    --r13-pill-brightness: 1.012;
    --r13-small-glint-opacity: 0.11;
    --civius-nav-mobile-bottom: max(3px, calc(env(safe-area-inset-bottom) - 4px));
    --civius-nav-mobile-top: max(7px, env(safe-area-inset-top));
    top: auto;
    right: 8px;
    left: 8px;
    bottom: var(--civius-nav-mobile-bottom);
    width: auto;
    max-width: none;
    min-width: 0;
    padding: 0;
    transform: none;
  }

  .civius-glass-nav.civius-r13-ready .civius-glass-nav__surface-layer::before,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__search-field::before,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__links::before,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__active-pill::before,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action::before,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__mobile-menu::before {
    padding: var(--r13-border-width);
  }

  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action::before {
    background: linear-gradient(
      180deg,
      var(--civius-nav-action-stroke-start) 0%,
      var(--civius-nav-action-stroke-end) 100%
    );
  }

  .civius-glass-nav__action.is-page-active {
    --glass-stroke: linear-gradient(180deg, #0f6df0 0%, #42a5ff 58%, #6fc5ff 100%);
  }

  .civius-nav-badge {
    top: -4px;
    right: -2px;
    width: 15px;
    min-width: 15px;
    height: 15px;
    font-size: 9px;
    line-height: 15px;
    box-shadow: 0 0 13px rgba(23, 120, 255, 0.46);
  }

  body.civius-chat-page .civius-glass-nav {
    top: 12px;
    bottom: auto;
  }

  .civius-glass-nav.civius-nav-ios {
    top: var(--civius-nav-mobile-top);
    bottom: auto;
  }

  .civius-glass-nav__mobile-menu,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__mobile-menu {
    position: absolute;
  }

  .civius-glass-nav__links {
    display: none;
  }

  .civius-glass-nav__surface {
    width: 100%;
    max-width: none;
    min-height: 50px;
    grid-template-columns: 28px minmax(0, 1fr) max-content;
    gap: 6px;
    padding: 8px;
    border-radius: 19px;
    box-sizing: border-box;
  }

  .civius-glass-nav__brand,
  .civius-glass-nav__brand img,
  .civius-glass-nav__brand svg {
    width: 28px;
    height: 28px;
  }

  .civius-glass-nav__brand {
    align-self: center;
    justify-self: center;
    transform: translateY(2px);
  }

  .civius-glass-nav__search,
  .civius-glass-nav__search-field,
  .civius-glass-nav__search:hover .civius-glass-nav__search-field,
  .civius-glass-nav__search:focus-within .civius-glass-nav__search-field {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .civius-glass-nav__search {
    overflow: hidden;
  }

  .civius-glass-nav__search-field {
    gap: 5px;
    min-height: 31px;
    padding: 0 9px;
    border-radius: 12px;
    transition:
      border-color 160ms ease,
      background-color 160ms ease,
      box-shadow 160ms ease;
  }

  .civius-glass-nav__search-field input {
    min-width: 0;
    font-size: 12px;
    letter-spacing: 0;
    transition: none;
  }

  .civius-glass-nav__search-icon.civius-search-icon--morph-ready {
    width: 16px;
    height: 16px;
    transform: translateY(1px);
  }

  .civius-glass-nav__search-icon[data-civius-search-icon]:empty {
    flex-basis: 16px;
    width: 16px;
    height: 16px;
    transform: translateY(1px);
  }

  .civius-glass-nav__search-icon[data-civius-search-icon]:empty::before {
    inset: 0;
    width: 16px;
    height: 16px;
    border: 0;
    background-size: 16px 16px;
  }

  .civius-glass-nav__search-icon[data-civius-search-icon]:empty::after {
    content: none;
  }

  .civius-glass-nav__search-icon .civius-search-morph__viewport,
  .civius-glass-nav__search-icon .civius-search-morph__svg {
    width: 16px;
    height: 16px;
  }

  .civius-glass-nav__search-icon .civius-search-morph__path {
    stroke-width: 2.08;
  }

  .civius-glass-nav__search:hover .civius-glass-nav__search-field,
  .civius-glass-nav__search:focus-within .civius-glass-nav__search-field {
    gap: 5px;
    padding-inline: 9px;
  }

  .civius-glass-nav__actions {
    display: flex;
    flex: 0 0 auto;
    position: relative;
    justify-content: flex-end;
    gap: 5px;
  }

  .civius-glass-nav__action,
  .civius-glass-nav__action--mobile-extra,
  .civius-glass-nav__action--menu {
    display: inline-flex;
    width: 31px;
    height: 31px;
    padding: 0;
    border-radius: 12px;
    box-sizing: border-box;
  }

  .civius-glass-nav__search-field {
    border-radius: 12px;
  }

  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra:hover,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra:focus-visible,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra[aria-expanded="true"] {
    background: #1778ff;
    color: #fff;
    box-shadow: 0 12px 26px rgba(23, 120, 255, 0.22);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra::before,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra::after {
    display: none;
  }

  .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra,
  .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra:hover,
  .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra:focus-visible,
  .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra[aria-expanded="true"] {
    border-color: #1778ff;
    background: #1778ff;
    color: #fff;
    box-shadow: 0 12px 26px rgba(23, 120, 255, 0.22);
  }

  .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra::before {
    opacity: 0;
  }

  .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra .civius-glass-nav__icon,
  .civius-glass-nav__action--menu.civius-glass-nav__action--mobile-extra .civius-glass-nav__menu-line {
    color: #fff;
    stroke: #fff;
  }

  .civius-glass-nav__icon--burger-loop {
    transform: translate(-1.4px, 0);
    transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .civius-glass-nav__icon--burger-loop svg {
    display: block;
    width: 22px;
    height: 22px;
    overflow: visible;
    transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .civius-glass-nav__icon--burger-loop .civius-glass-nav__menu-line {
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform: none;
    opacity: 1;
    transition:
      stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
      stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .civius-glass-nav__icon--burger-loop .civius-glass-nav__menu-line--top-bottom {
    stroke-dasharray: 12 63;
  }

  .civius-glass-nav__action--menu[aria-expanded="true"] .civius-glass-nav__icon--burger-loop svg {
    transform: rotate(-45deg);
  }

  .civius-glass-nav__action--menu[aria-expanded="true"] .civius-glass-nav__icon--burger-loop {
    transform: translate(-1.4px, 0.65px);
  }

  .civius-glass-nav__action--menu[aria-expanded="true"] .civius-glass-nav__icon--burger-loop .civius-glass-nav__menu-line--top-bottom {
    stroke-dasharray: 20 300;
    stroke-dashoffset: -32.42;
  }

  .civius-glass-nav__mobile-menu {
    position: absolute;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    right: 0;
    bottom: calc(100% - 1px);
    left: 0;
    width: auto;
    max-width: none;
    gap: 15px;
    padding: 5px;
    border-radius: 19px;
    opacity: 0;
    visibility: hidden;
    clip-path: inset(calc(100% - 1px) 0 0 0 round 19px);
    pointer-events: none;
    transform: translateY(0);
    transform-origin: bottom center;
    transition:
      opacity 150ms ease 170ms,
      visibility 0s linear 360ms,
      clip-path 360ms cubic-bezier(0.4, 0, 0.2, 1),
      transform 360ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .civius-glass-nav__mobile-menu[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
    clip-path: inset(0 0 0 0 round 19px);
    pointer-events: auto;
    transform: translateY(-10px);
  transition:
    opacity var(--civius-border-highlight-duration, 200ms) ease,
      visibility 0s linear,
      clip-path 440ms cubic-bezier(0.2, 0.8, 0.2, 1),
      transform 460ms cubic-bezier(0.18, 1.04, 0.32, 1);
  }

  body.civius-chat-page .civius-glass-nav__mobile-menu,
  .civius-glass-nav.civius-nav-ios .civius-glass-nav__mobile-menu {
    top: calc(100% - 1px);
    bottom: auto;
    clip-path: inset(0 0 calc(100% - 1px) 0 round 19px);
    transform-origin: top center;
  }

  body.civius-chat-page .civius-glass-nav__mobile-menu[aria-hidden="false"],
  .civius-glass-nav.civius-nav-ios .civius-glass-nav__mobile-menu[aria-hidden="false"] {
    clip-path: inset(0 0 0 0 round 19px);
    transform: translateY(10px);
  }

  .civius-glass-nav__mobile-menu a {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 5px;
    border-radius: 13px;
    box-sizing: border-box;
    background: var(--r13-control-fill);
    color: #000;
    font-family: var(--civius-heading-font, "Montserrat Alternates", "Onest", Arial, sans-serif);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.035em;
    text-decoration: none;
    opacity: 0;
    transform: translateY(10px);
    transition:
      opacity 220ms ease 90ms,
      transform 360ms cubic-bezier(0.22, 0.9, 0.24, 1);
    box-shadow: var(--r13-control-shadow);
  }

  .civius-glass-nav__mobile-menu a[href="/services/"] { order: 1; }
  .civius-glass-nav__mobile-menu a[href="/knowledge-base/"] { order: 2; }
  .civius-glass-nav__mobile-menu a[href="/cart/"] { order: 3; }
  .civius-glass-nav__mobile-menu a[href="/favorites/"] { order: 4; }
  .civius-glass-nav__mobile-menu a[href="/tariffs/"] { order: 5; }
  .civius-glass-nav__mobile-menu a[href="/chat/"] { order: 6; }

  .civius-glass-nav__mobile-menu a[href="/account/"] {
    grid-column: 1 / -1;
    order: 7;
  }

  .civius-glass-nav__mobile-menu[aria-hidden="false"] a {
    opacity: 1;
    transform: translateY(0);
    transition:
      opacity 280ms ease,
      transform 420ms cubic-bezier(0.18, 1.08, 0.32, 1);
  }

  .civius-glass-nav__mobile-menu[aria-hidden="false"] a[href="/services/"],
  .civius-glass-nav__mobile-menu[aria-hidden="false"] a[href="/knowledge-base/"] { transition-delay: 20ms; }
  .civius-glass-nav__mobile-menu[aria-hidden="false"] a[href="/cart/"],
  .civius-glass-nav__mobile-menu[aria-hidden="false"] a[href="/favorites/"] { transition-delay: 60ms; }
  .civius-glass-nav__mobile-menu[aria-hidden="false"] a[href="/tariffs/"],
  .civius-glass-nav__mobile-menu[aria-hidden="false"] a[href="/chat/"] { transition-delay: 100ms; }
  .civius-glass-nav__mobile-menu[aria-hidden="false"] a[href="/account/"] { transition-delay: 140ms; }
}

@media (max-width: 390px) {
  .civius-glass-nav {
    right: 8px;
    left: 8px;
    width: auto;
  }

  .civius-glass-nav__surface {
    grid-template-columns: 28px minmax(0, 1fr) max-content;
    gap: 6px;
    padding: 8px;
  }

  .civius-glass-nav__actions {
    gap: 5px;
  }

  .civius-glass-nav__action,
  .civius-glass-nav__action--mobile-extra,
  .civius-glass-nav__action--menu {
    width: 31px;
    height: 31px;
  }

  .civius-glass-nav__search-field input {
    font-size: 12px;
  }
}

@media (min-width: 768px) {
  .civius-glass-nav {
    left: 0;
    right: 0;
    width: 100%;
    padding-inline: 0;
  }

  .civius-glass-nav__surface {
    width: min(1280px, calc(100% - 32px));
    max-width: min(1280px, calc(100% - 32px));
    min-height: 80px;
    --civius-nav-left-nudge: clamp(0px, calc((100vw - 860px) * 0.04), 8px);
    padding-inline: clamp(10px, 1.55vw, 20px);
    grid-template-columns:
      clamp(38px, 3.6vw, 46px)
      minmax(clamp(118px, 15vw, 176px), clamp(176px, 21.72vw, 278px))
      minmax(260px, 1fr)
      auto;
    column-gap: clamp(8px, 1.1vw, 14px);
    align-items: center;
  }

  .civius-glass-nav__brand,
  .civius-glass-nav__brand img {
    width: clamp(38px, 3.6vw, 46px);
    height: clamp(38px, 3.6vw, 46px);
  }

  .civius-glass-nav__brand {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    transform: translateX(var(--civius-nav-left-nudge));
  }

  .civius-glass-nav__search {
    grid-column: 2;
    grid-row: 1;
    justify-self: start;
    --civius-nav-search-expanded-width: 278px;
    width: 100%;
    max-width: 278px;
    margin-left: 0;
    overflow: visible;
    transform: translateX(var(--civius-nav-left-nudge));
  }

  .civius-glass-nav__search-form {
    overflow: visible;
  }

  .civius-glass-nav__search-field {
    width: min(176px, 100%);
    max-width: none;
    padding-inline: 12px;
    transition:
      width 520ms cubic-bezier(0.34, 0.12, 0.24, 0.88),
      box-shadow 180ms ease;
  }

  .civius-glass-nav__search:hover .civius-glass-nav__search-field {
    width: min(176px, 100%);
  }

  .civius-glass-nav__search.is-civius-search-icon-active .civius-glass-nav__search-field,
  .civius-glass-nav__search:has(.civius-glass-nav__search-field:hover) .civius-glass-nav__search-field,
  .civius-glass-nav__search:focus-within .civius-glass-nav__search-field {
    width: 278px;
  }

  .civius-glass-nav.civius-glass-nav--search-compact .civius-glass-nav__search.is-civius-search-icon-active .civius-glass-nav__search-field,
  .civius-glass-nav.civius-glass-nav--search-compact .civius-glass-nav__search:has(.civius-glass-nav__search-field:hover) .civius-glass-nav__search-field,
  .civius-glass-nav.civius-glass-nav--search-compact .civius-glass-nav__search:focus-within .civius-glass-nav__search-field {
    width: min(176px, 100%);
  }

  .civius-glass-nav__links,
  .civius-glass-nav.civius-r13-ready .civius-glass-nav__links {
    position: absolute;
    grid-column: 1 / -1;
    grid-row: 1;
    top: 50%;
    left: 50%;
    justify-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    min-width: 0;
    max-width: 100%;
    gap: clamp(10px, 1.45vw, 30px);
    padding-inline: clamp(14px, 2vw, 30px);
    box-sizing: border-box;
    font-size: clamp(13px, 1.25vw, 16px);
    translate: -50% -50%;
  }

  .civius-glass-nav__links a,
  .civius-glass-nav__links a[href="/services/"],
  .civius-glass-nav__links a[href="/tariffs/"],
  .civius-glass-nav__links a[href="/knowledge-base/"] {
    width: auto;
    min-width: 0;
    max-width: none;
    flex: none;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
  }

  .civius-glass-nav__links a[href="/services/"] {
    order: 1;
    flex-basis: clamp(52px, 5.2vw, 58px);
    width: clamp(52px, 5.2vw, 58px);
  }

  .civius-glass-nav__links a[href="/tariffs/"] {
    order: 3;
    flex-basis: clamp(58px, 5.9vw, 64px);
    width: clamp(58px, 5.9vw, 64px);
  }

  .civius-glass-nav__links a[href="/knowledge-base/"] {
    order: 2;
    flex-basis: clamp(100px, 10.5vw, 112px);
    width: clamp(100px, 10.5vw, 112px);
  }

  .civius-glass-nav__actions {
    grid-column: 4;
    grid-row: 1;
    justify-self: end;
    gap: clamp(6px, 0.9vw, 14px);
  }

  .civius-glass-nav__action {
    width: clamp(46px, 4vw, 52px);
    height: clamp(46px, 4vw, 52px);
    border-radius: var(--civius-nav-action-radius, clamp(15px, 1.35vw, 18px));
  }

  .civius-glass-nav__action:hover,
  .civius-glass-nav__action:focus-visible,
  .civius-glass-nav__action.is-hovering,
  .civius-glass-nav__action.is-pressing {
    --civius-nav-action-radius: 50%;
  }

}

.civius-glass-nav__action.is-pressing {
  transform: translate3d(0, 0, 0) scale(var(--civius-nav-press-scale));
  transition:
    border-radius 320ms cubic-bezier(0.33, 0, 0.18, 1),
    transform 340ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 420ms cubic-bezier(0.16, 1, 0.3, 1),
    color 240ms ease;
}

.civius-glass-nav__action.is-releasing {
  transform: translate3d(0, 0, 0) scale(1);
  transition:
    border-radius 320ms cubic-bezier(0.33, 0, 0.18, 1),
    transform 550ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 420ms cubic-bezier(0.16, 1, 0.3, 1),
    color 240ms ease;
}

@media (min-width: 768px) and (max-width: 1040px) {
  .civius-glass-nav__links {
    gap: clamp(14px, 1.55vw, 18px);
    padding-inline: clamp(12px, 1.7vw, 18px);
    font-size: clamp(12.5px, 1.45vw, 14px);
  }
}

@media (min-width: 768px) and (max-width: 860px) {
  .civius-glass-nav__links {
    gap: 14px;
    padding-inline: 12px;
  }

  .civius-glass-nav__links a[href="/services/"] {
    flex-basis: 50px;
    width: 50px;
  }

  .civius-glass-nav__links a[href="/tariffs/"] {
    flex-basis: 56px;
    width: 56px;
  }

  .civius-glass-nav__links a[href="/knowledge-base/"] {
    flex-basis: 96px;
    width: 96px;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  .civius-glass-nav__search-field {
    gap: 6px;
    padding-inline: 10px;
  }

  .civius-glass-nav__search-icon svg {
    width: 20px;
    height: 20px;
  }

  .civius-glass-nav__search-icon {
    --civius-search-morph-size: 20px;
    --civius-search-morph-stroke: 2.25;
  }

  .civius-glass-nav__search-field input {
    font-size: 14px;
    letter-spacing: 0;
  }
}

@media (min-width: 768px) and (max-width: 820px) {
  .civius-glass-nav__search-field input {
    font-size: 13.5px;
  }
}