:root {
  --m-pill-clear: 88px;
  --m-edge: 4.5vw;
  --m-min-prose: 14px;
  --m-min-ui: 12px;
  --m-safe-b: env(safe-area-inset-bottom, 0px);
}
:root { background: var(--ink); }
:root .btn > .btn-wave { display: none; }
:root .btn[data-cta] > .btn-t:not(.is-lit) .dot::after { animation: none; opacity: 0; }
:root .surface-dark .btn:not(.btn-small):not(.menu-cta):not(.s12-cta) {
  --btn-fill-bg: var(--accent);
  --btn-fill-fg: var(--ink);
  background: var(--ink);
  color: var(--paper);
  box-shadow: inset 0 0 0 1px rgba(238, 240, 243, 0.28);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
:root .hero {
  --m-top: 80px;
  --m-wcol: 16vw;
  --m-hd-y: calc(var(--nav-top-m) + var(--nav-h) / 2);
  --m-logo-w: 76px;
  --m-hd-c: 30px;
  display: grid;
  grid-template-columns: [full-start] var(--m-edge) [wl-start] var(--m-wcol) [mid-start] minmax(0, 1fr) [mid-end] var(--m-wcol) [wr-end] var(--m-edge) [full-end];
  grid-template-rows: [r-top] var(--m-top) [r-lines] auto [r-name] auto [r-band] var(--m-band, 42vh) [r-cap] auto [r-chips] auto [r-side] auto [r-br] auto [r-end];
  align-content: start;
  min-height: 100vh;
  min-height: 100svh;
  padding-bottom: calc(16px + var(--m-safe-b));
}
:root .hero.is-intro .hero-h1 { mix-blend-mode: difference; }
:root .hero .overlay { display: contents; }
:root .hero-pic {
  position: relative;
  inset: auto;
  grid-column: full-start / full-end;
  grid-row: r-name / r-cap;
  justify-self: center;
  width: min(72vw, var(--m-band, 42vh));
  height: auto;
  margin-top: var(--m-pic-shift, 0px);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 78%, transparent 100%), linear-gradient(180deg, transparent 0, transparent var(--m-fade-a, 42px), #000 var(--m-fade-b, 68px), #000 78%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 78%, transparent 100%), linear-gradient(180deg, transparent 0, transparent var(--m-fade-a, 42px), #000 var(--m-fade-b, 68px), #000 78%, transparent 100%);
  mask-composite: intersect;
}
:root .hero-h1 {
  position: relative;
  inset: auto;
  grid-column: full-start / full-end;
  grid-row: r-lines / r-chips;
  height: auto;
  mix-blend-mode: normal;
}
:root .hero-word {
  font-size: var(--m-word, 11vw);
  line-height: var(--m-word, 11vw);
}
:root .hero-word-brand { left: var(--m-edge); bottom: 0; top: auto; }
:root .hero-word-cycle { top: 0; right: var(--m-edge); bottom: auto; }
:root .hero-corner-tl .hc-name {
  position: absolute;
  top: calc(var(--m-hd-y) - var(--m-logo-w) * 254 / 980 / 2);
  left: var(--m-edge);
  width: var(--m-logo-w);
  height: calc(var(--m-logo-w) * 254 / 980);
  overflow: hidden;
  color: transparent;
  text-shadow: none;
  background: url("../../brand/derzila-wordmark-still.svg") 0 50% / contain no-repeat;
}
:root .hero-corner-br .hc-links {
  position: absolute;
  top: calc(var(--m-hd-y) - var(--m-hd-c) / 2);
  right: var(--m-edge);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  margin: 0;
}
:root:not(.js) .hero-corner-br .hc-links,
:root.js-failed .hero-corner-br .hc-links,
:root.phone-failed .hero-corner-br .hc-links {
  position: static;
  justify-content: center;
  margin-top: 14px;
}
:root .hero-corner-br .hc-links .hero-chip-s {
  height: var(--m-hd-c);
  padding: 0 0.75em;
}
:root .hero-corner-br .hc-links .hero-chip-s[href^="https://t.me/"],
:root .hero-corner-br .hc-links .hero-chip-s[href^="https://max.ru/"] {
  justify-content: center;
  width: var(--m-hd-c);
  padding: 0;
  overflow: visible;
  border-radius: 50%;
  background: var(--ctl-bg) 50% 50% / 15px 15px no-repeat;
  color: transparent;
  font-size: 6px;
  letter-spacing: 0;
}
:root .hero-corner-br .hc-links .hero-chip-s[href^="https://t.me/"]::after,
:root .hero-corner-br .hc-links .hero-chip-s[href^="https://max.ru/"]::after {
  inset: calc((var(--tap-min) - var(--m-hd-c)) / -2);
}
:root .hero-corner-br .hc-links .hero-chip-s[href^="https://t.me/"] {
  background-image: url("../../img/messengers/telegram-mono.svg");
  background-size: 100% 100%;
}
:root .hero-corner-br .hc-links .hero-chip-s[href^="https://max.ru/"] {
  background-image: url("../../img/messengers/max-mono.svg");
  background-size: 17px 17px;
}
@media (max-width: 359px) {
  :root .hero { --m-logo-w: 62px; }
}
:root .hero-corner-tl {
  display: block;
  grid-column: wl-start / mid-end;
  grid-row: r-lines;
  align-self: start;
  justify-self: start;
  margin: 0;
  text-align: left;
  font-size: var(--m-tl, 14px);
}
:root .hero-corner-tl .hc-l1,
:root .hero-corner-tl .hc-l2,
:root .hero-corner-tl .hc-l3 { display: none; }
:root .hero-name {
  position: relative;
  inset: auto;
  grid-column: mid-start / mid-end;
  grid-row: r-name;
  align-self: start;
  margin: 8px 6px 0;
  text-align: center;
  text-wrap: balance;
}
:root .hero-cap {
  position: relative;
  inset: auto;
  transform: none;
  grid-column: mid-start / mid-end;
  grid-row: r-cap;
  width: auto;
  max-width: 340px;
  margin: 8px auto 0;
  padding: 0 6px;
  word-spacing: normal;
  text-wrap: balance;
}
@media (max-height: 660px) {
  :root .hero-cap { display: none; }
}
:root .hero-head {
  position: static;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 8px;
  grid-column: full-start / full-end;
  grid-row: r-chips;
  margin: 14px var(--m-edge) 0;
}
:root .hero-head-col,
:root .hero-head-col > li,
:root .hero-head-one { display: contents; }
:root .hero-head-pill { margin-left: 0; }
:root .hero-head::before { content: ''; order: 1; flex: 0 0 100%; height: 0; }
:root .hero-head::after { content: ''; order: 3; flex: 0 0 100%; height: 0; }
:root .hero-head-col > li:nth-child(n+4) > .hero-chip,
:root .hero-head-one > .hero-chip { order: 2; }
:root .hero-head > .hero-head-pill { order: 4; }
:root .hero .hero-head .hero-chip {
  margin: 7px 0;
  padding: 0.5em 0.8em;
  font-size: var(--m-chip, 14px);
}
:root .hero-chip {
  position: relative;
  font-size: var(--m-min-ui);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
:root .hero-chip::after {
  content: '';
  position: absolute;
  inset: calc((var(--tap-min) - 100%) / -2) -4px;
}
:root .hero-side {
  position: static;
  width: auto;
  grid-column: full-start / full-end;
  grid-row: r-side;
  margin: 22px var(--m-edge) 0;
}
:root .hero-about { display: none; }
:root .hero-cta-row { justify-content: center; margin-top: 0; }
:root .hero-corner-br {
  display: block;
  grid-column: full-start / full-end;
  grid-row: r-br;
  margin: 0 var(--m-edge);
  text-align: center;
}
:root .hero-corner-br .hc-name,
:root .hero-corner-br .hc-l1,
:root .hero-corner-br .hc-l2 { display: none; }
:root:not(.nav-locked) .nav-shell:not(.is-menu-open) { transition: background-color 0.25s linear; }
:root { --pill: rgba(20, 20, 20, 0.7); }
:root .pillbar > .wordmark,
:root .pillbar > .btn,
:root .pillbar > .burger { transition: opacity 0.25s linear, visibility 0s; }
:root.nav-locked .pillbar > .wordmark,
:root.nav-locked .pillbar > .btn,
:root.nav-locked .pillbar > .burger { transition: none; }
:root.m-bare:not(.nav-locked):not(.js-failed):not(.phone-failed) .nav-shell:not(.is-menu-open) {
  background-color: transparent;
  pointer-events: none;
}
:root.m-bare:not(.nav-locked):not(.js-failed):not(.phone-failed) .nav-shell:not(.is-menu-open) .pillbar > .wordmark,
:root.m-bare:not(.nav-locked):not(.js-failed):not(.phone-failed) .nav-shell:not(.is-menu-open) .pillbar > .btn,
:root.m-bare:not(.nav-locked):not(.js-failed):not(.phone-failed) .nav-shell:not(.is-menu-open) .pillbar > .burger {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s linear, visibility 0s 0.25s;
}
:root .btn.cta > .btn-wave { display: none; }
:root .btn.cta[data-cta] > .btn-t .dot::after { animation: none; opacity: 0; }
:root .m-dock {
  position: fixed;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  z-index: calc(var(--z-pill) + 1);
  transition: opacity 0.18s linear, visibility 0s;
}
:root.nav-locked .m-dock,
:root.chooser-open .m-dock,
:root.s9m-open .m-dock {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.18s linear, visibility 0s 0.18s;
}
:root .m-dock > .cta {
  position: absolute;
  margin: 0;
  transform-origin: 50% 50%;
}
:root.m-docked .pillbar > .btn {
  opacity: 0;
  visibility: hidden;
  transition: none;
}
:root .dark-mask { display: block; }
:root .dark-glow { display: none; }
:root .wave {
  align-items: stretch;
  gap: var(--space-lg);
  padding-block: var(--space-xl);
  padding-inline: var(--m-edge);
}
:root .wave-head { text-align: left; }
:root { --m-wave-title: clamp(22px, 6.2vw, 30px); }
:root .wave-label { font-size: var(--m-wave-title); }
:root .wave-cols {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  grid-template-rows: repeat(8, auto);
  grid-auto-flow: column;
  gap: 14px 16px;
}
:root .wave-col { display: contents; }
:root .wave-word {
  width: auto;
  max-width: none;
  white-space: normal;
  font-size: 18px;
  line-height: 1.25;
}
:root .wave-col-r .wave-word { color: var(--muted-on-dark); }
:root { --m-svh: 1vh; }
@supports (height: 1svh) { :root { --m-svh: 1svh; } }
:root.track-m:not(.js-failed):not(.phone-failed) .track { background: var(--surface-dark-bg); }
@supports (contain-intrinsic-block-size: 1px) {
  :root.m-far-off.track-m:not(.js-failed):not(.phone-failed) :is(#method, #steps, #prices, #terms, #founder, #faq, #contact, #footer) { content-visibility: auto; }
}
:root.track-m:not(.js-failed):not(.phone-failed) .track > .sticky {
  position: sticky;
  top: var(--m-stick-top, 0px);
  min-height: 100vh;
  min-height: calc(100 * var(--m-svh));
  overflow: hidden;
}
:root.track-m:not(.js-failed):not(.phone-failed) .dark-mask {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: calc(100vh + var(--m-feather, 32px));
  height: calc(100 * var(--m-svh) + var(--m-feather, 32px));
  z-index: var(--z-mask);
  overflow: hidden;
  transform: translate(0px, calc(100vh + var(--m-feather, 32px)));
  transform: translate(0px, calc(100 * var(--m-svh) + var(--m-feather, 32px)));
  contain: layout paint style;
}
:root.track-m:not(.js-failed):not(.phone-failed) .dark-layer {
  position: absolute;
  left: 0;
  right: 0;
  top: var(--m-feather, 32px);
  bottom: auto;
  height: 100vh;
  height: calc(100 * var(--m-svh));
  min-height: 0;
  transform: translate(0px, calc(-100vh - var(--m-feather, 32px)));
  transform: translate(0px, calc(-100 * var(--m-svh) - var(--m-feather, 32px)));
  contain: layout paint;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave {
  --m-cnt: clamp(26px, 7.7vw, 32px);
  position: absolute;
  inset: 0;
  z-index: 16;
  min-height: 0;
  display: block;
  gap: 0;
  padding: 0;
  pointer-events: none;
  opacity: 0;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-head {
  position: absolute;
  top: calc(var(--m-pill-clear) + 4px);
  left: var(--m-edge);
  right: auto;
  width: auto;
  transform: none;
  z-index: 50;
  text-align: left;
  opacity: 0;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-stage {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: var(--m-edge) minmax(0, 1fr) minmax(0, 1fr) var(--m-edge);
  grid-template-rows: var(--m-pill-clear) auto minmax(0, 1fr) auto;
  padding-bottom: calc(14px + var(--m-safe-b));
  visibility: hidden;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-cols {
  position: relative;
  z-index: 3;
  grid-row: 3;
  grid-column: 2 / 4;
  align-self: center;
  margin-top: var(--m-fpad, 0px);
  display: grid;
  grid-template: auto / minmax(0, 1fr);
  grid-auto-flow: row;
  width: auto;
  gap: 0;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-col {
  grid-area: 1 / 1;
  display: flex;
  flex-direction: column;
  gap: calc(var(--m-ws, 20.8px) * 0.55);
  font-size: var(--m-ws, 20.8px);
  line-height: 1;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-col-l { transform: translateY(calc(-1 * var(--m-off-l, 32svh))); }
:root.track-m:not(.js-failed):not(.phone-failed) .wave-col-r { transform: translateY(var(--m-off-r, 14svh)); }
:root.track-m:not(.js-failed):not(.phone-failed) .wave-word {
  width: max-content;
  max-width: none;
  white-space: nowrap;
  font-size: inherit;
  line-height: inherit;
  color: rgba(255, 255, 255, 0.25);
  transition: color 300ms ease-out;
  will-change: transform;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-word.is-focused { color: #fff; }
:root.track-m:not(.js-failed):not(.phone-failed) .wave-flip {
  display: grid;
  clip-path: inset(-0.25em -9999px);
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-col-r .wave-flip { justify-items: end; }
:root.track-m:not(.js-failed):not(.phone-failed) .wave-a,
:root.track-m:not(.js-failed):not(.phone-failed) .wave-b {
  display: block;
  grid-area: 1 / 1;
  transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-b { transform: translateY(130%); text-transform: none; }
:root.track-m:not(.js-failed):not(.phone-failed) .wave-word.is-focused .wave-a { transform: translateY(-130%); }
:root.track-m:not(.js-failed):not(.phone-failed) .wave-word.is-focused .wave-b { transform: translateY(0); }
:root.track-m:not(.js-failed):not(.phone-failed) .m-cell { display: grid; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-cell > .m-it {
  grid-area: 1 / 1;
  display: block;
  clip-path: inset(-0.25em -0.1em);
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-in { display: block; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-count {
  grid-row: 2;
  grid-column: 2 / 4;
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-top: calc(4px + 1.05 * var(--m-wave-title) + 12px);
  font-family: var(--font-pixel);
  line-height: 1;
  color: var(--surface-dark-fg);
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-num { font-size: var(--m-cnt); }
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-of {
  font-size: max(14px, calc(var(--m-cnt) * 0.5));
  opacity: 0.45;
  white-space: nowrap;
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-bar {
  position: relative;
  flex: 1 1 auto;
  align-self: center;
  min-width: 16px;
  height: 1px;
  margin-left: 10px;
  background: rgba(238, 240, 243, 0.22);
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-fill {
  position: absolute;
  inset: 0;
  background: var(--surface-dark-fg);
  transform-origin: 0 50%;
  transform: scaleX(0.125);
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-thumbs {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  width: auto;
  grid-row: 3;
  grid-column: 1 / -1;
  z-index: 1;
  min-height: 0;
  padding-top: var(--m-fpad, 0px);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-thumbs::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: rgba(238, 240, 243, 0.1);
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-line {
  flex: 1 1 0;
  height: 1px;
  background: rgba(255, 255, 255, 0.14);
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-slot {
  position: relative;
  flex: 0 0 auto;
  display: block;
  width: var(--m-fw, 60vw);
  height: var(--m-fh, 40vh);
  max-width: none;
  aspect-ratio: auto;
  outline: 1px solid rgba(255, 255, 255, 0.18);
  outline-offset: -1px;
  background-image:
    linear-gradient(to right, rgba(238, 240, 243, 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(238, 240, 243, 0.06) 1px, transparent 1px);
  background-size: calc(var(--m-fw, 60vw) / 12) calc(var(--m-fw, 60vw) / 12);
  background-position: center;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-slot::before,
:root.track-m:not(.js-failed):not(.phone-failed) .wave-slot::after {
  content: '';
  position: absolute;
  top: 36%;
  width: 60.7%;
  height: 28%;
  border: 1px solid rgba(238, 240, 243, 0.12);
  border-radius: 50%;
  pointer-events: none;
}
:root.track-m:not(.js-failed):not(.phone-failed) .wave-slot::before { left: -10.7%; }
:root.track-m:not(.js-failed):not(.phone-failed) .wave-slot::after { left: 50%; }
:root.track-m:not(.js-failed):not(.phone-failed) .dots-canvas {
  position: absolute;
  left: -55%;
  top: -44%;
  width: 210%;
  height: 188%;
  max-width: none;
  display: block;
  pointer-events: none;
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-pv {
  grid-row: 4;
  margin-top: 12px;
  font-family: var(--font-text);
  color: var(--muted-on-dark);
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-prev { grid-column: 2; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-next { grid-column: 3; text-align: right; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-pv > .m-it { align-self: start; justify-self: stretch; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-pv-top { display: flex; align-items: center; gap: 10px; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-next .m-pv-top { justify-content: flex-end; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-pv-n {
  font-family: var(--font-pixel);
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-pv-k { color: var(--surface-dark-fg); }
:root.track-m:not(.js-failed):not(.phone-failed) .m-pv-of { opacity: 0.6; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-pv-line {
  flex: 1 1 auto;
  min-width: 12px;
  max-width: 72px;
  height: 1px;
  background: currentColor;
  opacity: 0.5;
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-pv-name {
  display: block;
  margin-top: 8px;
  font-size: max(var(--m-min-ui), var(--text-xs));
  line-height: 1.35;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-prev .m-pv-name { padding-right: 8px; }
:root.track-m:not(.js-failed):not(.phone-failed) .m-wv-next .m-pv-name { padding-left: 8px; }
:root.track-m:not(.js-failed):not(.phone-failed) .dark-overlay {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 9;
  background: var(--surface-dark-bg);
  opacity: 0;
  pointer-events: none;
}
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-group {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  height: 100svh;
  z-index: 15;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  padding: 0 0 calc(7 * var(--m-svh));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  overflow: visible;
}
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-reveal { width: 100%; overflow: hidden; }
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-outer { overflow: hidden; width: 100%; }
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  row-gap: 0;
  transform: translateZ(0);
}
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-set { display: flex; align-items: center; flex-shrink: 0; }
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-set + .marquee-set { display: flex; }
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-item { font-size: 18vw; }
:root.track-m:not(.js-failed):not(.phone-failed) .marquee-label { margin-inline: 2.5vw 6vw; }
:root.track-m:not(.js-failed):not(.phone-failed) .scene-wrapper {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 20;
  pointer-events: none;
}
:root.track-m:not(.js-failed):not(.phone-failed) .scene {
  --scene-size: var(--scene-base);
  --scene-depth: calc(var(--scene-base) / 2);
  width: var(--scene-size);
  height: var(--scene-size);
  perspective: calc(var(--scene-size) * 5);
}
:root.track-m:not(.js-failed):not(.phone-failed) .cube {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  transform: rotateX(0deg) rotateY(-45deg);
}
:root.track-m:not(.js-failed):not(.phone-failed) .face {
  position: absolute;
  width: var(--scene-size);
  height: var(--scene-size);
  background-color: var(--face-ground);
  border: 1px solid rgba(255, 255, 255, 0.05);
  overflow: hidden;
  user-select: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
:root.track-m:not(.js-failed):not(.phone-failed) .face img { width: 100%; height: 100%; object-fit: cover; display: block; }
:root.track-m:not(.js-failed):not(.phone-failed) .face::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 24px rgba(0, 0, 0, 1);
}
:root.track-m:not(.js-failed):not(.phone-failed) .face-ask { display: flex; align-items: center; justify-content: center; padding: 0 10%; }
:root.track-m:not(.js-failed):not(.phone-failed) .face-ask-t {
  position: relative;
  z-index: 2;
  margin: 0;
  font-family: var(--font-display);
  font-size: calc(var(--scene-size) * 0.1);
  font-weight: 700;
  line-height: 1.12;
  text-align: center;
  color: #fff;
}
:root.track-m:not(.js-failed):not(.phone-failed) .face-front { transform: rotateY(0deg) translateZ(var(--scene-depth)); }
:root.track-m:not(.js-failed):not(.phone-failed) .face-back { transform: rotateY(180deg) translateZ(var(--scene-depth)); }
:root.track-m:not(.js-failed):not(.phone-failed) .face-right { transform: rotateY(90deg) translateZ(var(--scene-depth)); }
:root.track-m:not(.js-failed):not(.phone-failed) .face-left { transform: rotateY(-90deg) translateZ(var(--scene-depth)); }
:root.track-m:not(.js-failed):not(.phone-failed) .cube-note {
  display: grid;
  position: absolute;
  top: calc(var(--nav-top-m) + var(--nav-h) + 16px);
  left: var(--m-edge, 4.5vw);
  right: var(--m-edge, 4.5vw);
  z-index: 21;
  margin: 0;
  overflow: hidden;
  padding: calc(0.14 * 19px) 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
:root.track-m:not(.js-failed):not(.phone-failed) .cube-note-i {
  grid-area: 1 / 1;
  margin: 0;
  font-family: var(--font-text);
  font-size: 19px;
  line-height: 1.3;
  text-align: center;
  color: var(--surface-dark-fg);
  transform: translate3d(0, 115%, 0);
  visibility: hidden;
}
:root.track-m:not(.js-failed):not(.phone-failed) .cube-cta {
  display: inline-flex;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 22;
  width: max-content;
  margin: 0 auto;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: background-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out), scale var(--dur-quick) var(--ease-out);
}
:root.track-m:not(.js-failed):not(.phone-failed) .stm {
  display: block;
  position: relative;
  height: calc(var(--m-range, 720) * var(--m-svh));
  overflow: hidden;
  overflow: clip;
  z-index: var(--z-track-content);
  pointer-events: none;
}
:root.track-m:not(.js-failed):not(.phone-failed) .stm::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 40vh;
  background: linear-gradient(to bottom, transparent 0%, var(--surface-dark-bg) 100%);
  pointer-events: none;
  z-index: 0;
}
:root.track-m:not(.js-failed):not(.phone-failed) .stm-content {
  position: relative;
  z-index: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: calc(var(--m-stm-skip, 309.2) * var(--m-svh)) var(--m-edge) calc(10 * var(--m-svh));
  overflow: hidden;
  overflow: clip;
  contain: layout paint;
}
:root.track-m:not(.js-failed):not(.phone-failed) .stm-group { display: flex; flex-direction: column; margin-bottom: 0; }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-el {
  white-space: nowrap;
  text-transform: uppercase;
  opacity: 0.6;
  font-family: var(--font-text);
  font-size: 13px;
  line-height: 1.3;
  color: #fff;
}
:root.track-m:not(.js-failed):not(.phone-failed) .stm-el--xl {
  font-size: min(15vw, calc(9 * var(--m-svh)));
  line-height: 1.1;
  opacity: 1;
  font-family: var(--font-pixel);
  font-weight: 400;
}
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-2 { margin-left: 22vw; }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-3,
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-4 { margin-left: auto; }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-5 { margin-top: calc(22 * var(--m-svh)); opacity: 1; }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-6 { margin-left: auto; margin-top: calc(22 * var(--m-svh)); opacity: 1; }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-7 { margin-top: calc(22 * var(--m-svh)); opacity: 1; filter: blur(1.2px); }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-8 { margin-left: 22vw; margin-top: calc(5.5 * var(--m-svh)); opacity: 1; filter: blur(2px); }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-9 { margin-left: 22vw; margin-top: calc(28 * var(--m-svh)); }
:root.track-m:not(.js-failed):not(.phone-failed) .stm-pos-10 { margin-left: auto; margin-top: calc(40 * var(--m-svh)); }
:root { --m-ring: 1; }
:root .ring,
:root .ring-stage {
  height: 100vh;
  height: 100svh;
}
:root .ring-stage { -webkit-tap-highlight-color: transparent; }
:root .ring:not(.m-ring-failed) .ring-canvas { bottom: calc(-1 * var(--m-pill-clear)); }
:root .ring-stage::before { height: var(--m-pill-clear); }
:root .ring-stage::after { height: 12px; }
:root .ring-side { width: 8px; }
:root .ring:not(.m-ring-failed) .ring-dom { padding: var(--m-pill-clear) 20px 0; }
:root .ring-main {
  min-height: 0;
  padding: 0;
}
:root .ring-title {
  margin-top: 0;
  font-size: min(10vw, 7svh);
}
:root .ring-sub {
  margin: 8px 0 4px;
  font-size: max(var(--m-min-prose), var(--text-sm));
}
:root .ring-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 16px;
  margin: 8px 0 0;
  padding: 6px 0;
  font-size: max(var(--m-min-ui), var(--text-xs));
}
:root .ring-meta-c { display: block; }
:root .ring-meta > div,
:root .ring-tags li { white-space: nowrap; }
:root .ring-media { margin: 8px 0; }
:root .ring-centre {
  gap: 10px;
  margin-bottom: 0;
}
:root .ring-mark {
  width: 64px;
  mix-blend-mode: normal;
}
:root .ring-label { font-size: max(var(--m-min-ui), 0.875rem); }
:root .ring-tags {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin: 0;
  font-size: max(var(--m-min-ui), var(--text-xs));
}
@media (max-height: 600px) {
  :root .ring-mark { width: 48px; }
}
:root .ring:not(.m-ring-failed) .ring-veil {
  top: calc(var(--m-pill-clear) + 8px);
  bottom: 96px;
}
:root .ring-view-cap { font-size: var(--m-min-prose); }
:root { --m-b3: 1; }
:root .s3 .m-br,
:root .s3 .m-s3-foot { display: none; }
:root .s3 .m-s3-in { display: contents; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3:not(.is-flow) {
  --s3-track-h: 330svh;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3:not(.is-flow) .s3-track {
  height: 330vh;
  height: 330svh;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3:not(.is-flow) .s3-stage {
  position: sticky;
  top: 0;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) {
  --m-s3-x: max(16px, 6vw);
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-track {
  transform-origin: 50% calc(100% - 50vh);
  transform-origin: 50% calc(100% - 50svh);
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-stage {
  height: 100vh;
  height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--m-s3-gap, 14px);
  padding: var(--m-pill-clear) var(--m-s3-x) calc(var(--m-safe-b) + 12px);
  overflow: hidden;
  overflow: clip;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-row { display: contents; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-top {
  flex: none;
  flex-wrap: nowrap;
  align-items: flex-start;
  margin: 0;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-label {
  font-size: var(--m-min-ui);
  padding-top: 0.2em;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-meter {
  display: grid;
  justify-items: start;
  row-gap: 8px;
  font-size: max(14px, var(--s3-meter-size));
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-meter-names {
  display: grid;
  justify-items: start;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-meter-name {
  font-size: 14px;
  letter-spacing: 0.1em;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3.m-s3-mrow:not(.is-flow):not(.m-failed) .s3-meter {
  display: flex;
  align-items: center;
  column-gap: 10px;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3.m-s3-mrow:not(.is-flow):not(.m-failed) .s3-meter-names { display: none; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-title {
  flex: none;
  font-size: var(--m-s3-h2, 28px);
  line-height: 1.05;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-title.m-lined .s3-line { white-space: nowrap; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-title.m-lined .m-br { display: inline; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-title.m-measure { width: max-content; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-steps {
  flex: none;
  display: grid;
  gap: 0;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-step {
  grid-area: 1 / 1;
  align-self: end;
  display: block;
  overflow: hidden;
  overflow: clip;
  font-size: var(--m-s3-fs, 14px);
  line-height: 1.45;
  color: var(--muted-on-dark);
  transition: none;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed):not(.m-live) .s3-step + .s3-step,
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed):not(.m-live) .m-s3-it + .m-s3-it,
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed):not(.m-live) .s3-meter { visibility: hidden; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-in { display: block; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-idx {
  display: block;
  font-size: calc(var(--m-s3-idx, 2.3) * 1em);
  line-height: 1;
  padding: 0;
  color: var(--paper);
  transition: none;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-step-body {
  display: flex;
  flex-direction: column;
  margin-top: 0.7em;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-step-bar {
  display: block;
  order: -1;
  position: relative;
  width: 30px;
  height: 2px;
  margin-bottom: 0.8em;
  background: var(--hairline-on-dark);
  overflow: hidden;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-step-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--paper);
  transform: scaleX(var(--p, 0));
  transform-origin: 0 50%;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-lead {
  display: block;
  color: var(--paper);
  font-weight: 500;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3.m-s3-noidx:not(.is-flow):not(.m-failed) .s3-idx,
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3.m-s3-noidx:not(.is-flow):not(.m-failed) .s3-step-bar { display: none; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3.m-s3-noidx:not(.is-flow):not(.m-failed) .s3-step-body { margin-top: 0; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .s3-art {
  flex: none;
  order: 0;
  aspect-ratio: auto;
  width: var(--m-s3-art-w, calc(100% - 18px));
  height: var(--m-s3-art-h, 180px);
  margin: 9px auto;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-foot {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  min-height: var(--tap-min, 44px);
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3.m-s3-nofoot:not(.is-flow):not(.m-failed) .m-s3-foot { display: none; }
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-pv {
  display: grid;
  min-width: 0;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-it {
  grid-area: 1 / 1;
  align-self: center;
  justify-self: end;
  display: block;
  overflow: hidden;
  overflow: clip;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-pin {
  display: flex;
  align-items: center;
  gap: 14px;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-pv-n {
  font-family: var(--font-pixel);
  font-size: 32px;
  line-height: 1;
  color: var(--muted-on-dark);
  font-variant-numeric: tabular-nums;
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-pv-name {
  font-family: var(--font-pixel);
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: left;
  color: var(--muted-on-dark);
}
:root.m-steps:not(.js-failed):not(.phone-failed) .s3.m-b3:not(.is-flow):not(.m-failed) .m-s3-pv-l {
  display: block;
  white-space: nowrap;
}
@font-face {
  font-family: 'Onest';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('../../fonts/onest-400-latin.woff2') format('woff2');
  unicode-range: U+0030-0039;
}
:root { --m-b4: 1; }
:root .s4 {
  --m-s4-name: clamp(14px, 4.2vw, 17px);
}
:root .s4.m-s4-free .s4-head {
  position: relative;
  top: auto;
}
:root .s4.m-s4-free .s4-head::before { content: none; }
:root .s4 .s4-label {
  font-size: 12px;
  margin-bottom: 12px;
}
:root .s4 .s4-sub {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.45;
}
:root .s4 .s4-track { padding-bottom: 32px; }
:root .s4 .s4-stage {
  position: relative;
  margin-top: 28px;
}
:root .s4 .s4-stage::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  margin-left: -0.5px;
  background: var(--surface-dark-fg);
  opacity: 0.22;
}
:root .s4 .s4-units {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
  row-gap: 32px;
  column-gap: 0;
  margin: 0;
  padding: 0;
}
:root .s4 .s4-unit {
  min-width: 0;
  width: auto;
  margin: 0;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}
:root .s4 .s4-unit:nth-child(odd) { grid-column: 1; }
:root .s4 .s4-unit:nth-child(even) { grid-column: 3; }
:root .s4 .s4-unit:nth-child(1), :root .s4 .s4-unit:nth-child(2) { grid-row: 1; }
:root .s4 .s4-unit:nth-child(3), :root .s4 .s4-unit:nth-child(4) { grid-row: 2; }
:root .s4 .s4-unit:nth-child(5), :root .s4 .s4-unit:nth-child(6) { grid-row: 3; }
:root .s4 .s4-idx {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  margin-bottom: 10px;
  font-family: var(--font-text);
  font-weight: 200;
  font-size: calc(var(--m-s4-name) * 2);
  line-height: 1;
  color: var(--surface-dark-fg);
}
:root .s4 .s4-idx::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: currentColor;
  opacity: 0.35;
}
:root .s4 .s4-name {
  font-size: var(--m-s4-name);
  line-height: 1.2;
  margin: 0 0 6px;
  text-wrap: balance;
}
:root .s4 .s4-text {
  font-size: 14px;
  line-height: 1.45;
}
:root .s4.m-b4 .s4-unit {
  opacity: 0.36;
  transition: opacity 0.5s ease;
}
:root .s4.m-b4 .s4-unit.is-lit { opacity: 1; }
:root .s4.m-b4 .m-s4-count {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: baseline;
  font-family: var(--font-pixel);
  font-size: 14px;
  line-height: 1;
  color: var(--surface-dark-fg);
  white-space: nowrap;
}
:root .s4.m-b4 .m-s4-cn {
  display: inline-grid;
  overflow: hidden;
  overflow: clip;
}
:root .s4.m-b4 .m-s4-cn > span { grid-area: 1 / 1; }
:root .s4.m-b4 .m-s4-of { opacity: 0.45; }
:root .s4.m-b4 .m-s4-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 13px;
  margin-left: -6.5px;
  pointer-events: none;
}
:root .s4.m-b4 .m-s4-lit {
  position: absolute;
  top: 0;
  left: 6px;
  width: 1px;
  height: 1px;
  background: var(--surface-dark-fg);
  opacity: 0.8;
  transform-origin: 50% 0;
  transform: scaleY(0);
}
:root .s4.m-b4 .m-s4-tick {
  position: absolute;
  left: 2px;
  width: 9px;
  height: 9px;
  margin-top: -4.5px;
  opacity: 0.45;
}
:root .s4.m-b4 .m-s4-tick::before,
:root .s4.m-b4 .m-s4-tick::after {
  content: "";
  position: absolute;
  background: var(--surface-dark-fg);
}
:root .s4.m-b4 .m-s4-tick::before { left: 4px; top: 0; width: 1px; height: 9px; }
:root .s4.m-b4 .m-s4-tick::after { left: 0; top: 4px; width: 9px; height: 1px; }
:root .s4.m-b4 .m-s4-st {
  position: absolute;
  left: 4.5px;
  width: 4px;
  height: 4px;
  margin-top: -2px;
  border-radius: 50%;
  background: var(--surface-dark-fg);
  opacity: 0.4;
}
:root .s4.m-b4 .m-s4-dot {
  position: absolute;
  top: 0;
  left: 2.5px;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 10px 1px color-mix(in srgb, var(--accent) 55%, transparent);
  will-change: transform;
}
:root .s12-top { padding: 32px var(--pad-x) calc(40px + var(--s12-bridge-size) / 2); }
:root .s12-info {
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  margin: 0 0 32px;
  padding-top: 22px;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.12em;
  color: var(--muted-on-dark);
}
:root .s12-info .s12-clip { padding-block: 0; margin-block: 0; }
:root .s12-desc { max-width: 34em; margin-bottom: 32px; }
:root .s12-desc br { display: none; }
:root .s12-lead {
  display: block;
  font-size: clamp(19px, 5.4vw, 24px);
  line-height: 1.3;
  color: var(--paper);
  text-wrap: balance;
}
:root .s12-legal {
  display: block;
  margin-top: 14px;
  font-size: var(--m-min-prose);
  line-height: 1.55;
  color: var(--muted-on-dark);
}
:root .s12-nw { white-space: nowrap; }
:root .s12-cta-row { margin-bottom: 12px; }
:root .s12 .btn.s12-cta { display: flex; width: 100%; }
:root .s12-contacts { display: flex; flex-direction: column; gap: 12px; }
:root .s12-c { padding-block: 2px; margin-block: -2px; }
:root .s12-left { min-width: 0; }
:root .s12-c-in { display: flex; width: 100%; gap: 12px; line-height: 1; }
:root .s12-c .s12-sep { display: none; }
:root .s12-k {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
:root .s12-c a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55em;
  height: 52px;
  min-width: 0;
  overflow: hidden;
  padding: 0 1.2em;
  border: 1px solid color-mix(in oklab, var(--paper) 30%, transparent);
  border-radius: 999px;
  background: color-mix(in oklab, var(--paper) 4%, transparent);
  font-family: var(--font-pixel);
  font-size: clamp(16px, 4.4vw, 18px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--paper);
  -webkit-tap-highlight-color: transparent;
  transition: color 350ms ease, border-color 350ms ease, background-color 350ms ease;
}
:root .s12-c1 a,
:root .s12-c2 a[href^="tel:"] { flex: 1 1 auto; }
:root .s12-c2 a[href^="https://max.ru/"] { flex: none; }
:root .s12-c a[href^="https://t.me/"]::before,
:root .s12-c a[href^="https://max.ru/"]::before {
  content: '';
  flex: none;
  background: 50% 50% / contain no-repeat;
}
:root .s12-c a[href^="https://t.me/"]::before {
  width: 1.9em;
  height: 1.9em;
  margin: 0 -0.49em 0 -0.36em;
  background-image: url("../../img/messengers/telegram-mono.svg");
}
:root .s12-c a[href^="https://max.ru/"]::before {
  width: 1.05em;
  height: 1.05em;
  background-image: url("../../img/messengers/max-mono.svg");
}
:root .s12-c a:focus-visible,
:root .s12-c a:active {
  opacity: 1;
  border-color: color-mix(in oklab, var(--accent) 70%, transparent);
  background: color-mix(in oklab, var(--paper) 8%, transparent);
}
@media (hover: hover) {
  :root .s12-c a:hover {
    opacity: 1;
    border-color: color-mix(in oklab, var(--accent) 70%, transparent);
    background: color-mix(in oklab, var(--paper) 8%, transparent);
  }
}
:root .s12-right { justify-self: stretch; }
:root .s12-pages {
  display: grid;
  grid-template-columns: 1fr 1fr;
  row-gap: 0;
  column-gap: clamp(8px, 2.5vw, 20px);
  align-items: stretch;
  max-width: none;
  margin: 0;
  font-size: clamp(13px, 3.9vw, 15px);
  line-height: 1.2;
  letter-spacing: 1px;
}
:root .s12-pages .s12-sep { display: none; }
:root .s12-pages a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  min-width: 0;
  min-height: 52px;
  border-bottom: 1px solid var(--hairline-on-dark);
  white-space: nowrap;
  color: var(--paper);
  -webkit-tap-highlight-color: transparent;
  transition: color 350ms ease;
}
:root .s12-pages a:nth-of-type(-n+2) { border-top: 1px solid var(--hairline-on-dark); }
:root .s12-pages a::after {
  content: '';
  flex: none;
  width: 14px;
  height: 14px;
  background: var(--muted-on-dark);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E") 50% 50% / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E") 50% 50% / contain no-repeat;
  transition: background-color 350ms ease;
}
:root .s12-pages a:focus-visible { outline-offset: -2px; border-radius: 0; }
:root .s12-pages a:focus-visible,
:root .s12-pages a:active { opacity: 1; color: var(--accent); }
:root .s12-pages a:focus-visible::after,
:root .s12-pages a:active::after { background: var(--accent); }
@media (hover: hover) {
  :root .s12-pages a:hover { opacity: 1; color: var(--accent); }
  :root .s12-pages a:hover::after { background: var(--accent); }
}
:root .s12-c a:active,
:root .s12-pages a:active,
:root .s12-pages a:active::after { transition-duration: 0s; }
